精华内容
下载资源
问答
  • 什么是终端web开发

    千次阅读 2019-03-30 20:14:01
    一句话概括:其实Web原本并非终端,但应用场景多了,就变成了”终端“。 既然说是Web,我就把范围划定在互联网相关的技术栈内。 任何基于TCP/IP模型应用层协议的Web应用的请求方,都可视为“Web终端”,与此...

    一句话概括:其实Web原本并非跨终端,但应用场景多了,就变成了”跨终端“。

    既然说是Web,我就把范围划定在互联网相关的技术栈内。

    任何基于TCP/IP模型应用层协议的Web应用的请求方,都可视为“Web终端”,与此相对的就是Web Service。终端的核心价值是Web Service的表现形式与交互形式。

    来讨论终端,就暂且不说Web Service的事情了。
    所以这里就涉及硬件、软件和网络协议三个部分。

    硬件

    这个非常好理解,就是我们日常使用的各种智能设备,包括电脑、平板、智能手机等传统设备。但仅仅是这样还不够,电视盒子、智能手环、智能灯饰等智能家居都在“Web终端”的范围内。

    为什么这么说?

    传统设备自不必多说。新兴的物联网智能设备,我可以总结为:通过用户操作,使用传统的或较新的网络传输技术(包括WLAN、蓝牙、红外、RFID等),向对应的Web Service发出请求,等待请求应答,并根据应答内容向用户反馈信息。

    是不是有点物联网的意思?

    软件

    这是大家印象最深刻的部分,尤其是在移动设备带动响应式交互大行其道的今天。做Web开发的程序员,尤其是前端,需要同时考虑页面在多种浏览器和多种设备的兼容性,因此响应式布局确实是跨终端Web的一个体现。

    但我认为这还不够,因为对于互联网而言,Web的终端不只有浏览器,还有其他应用程序。最简单的,比如一个Web Service同时提供Web站点和iOS App两种服务,再比如魔兽世界网游,我的账号数据被同时提供给游戏客户端和Web版的英雄榜,这里面的区别就是软件终端的不同。

    网络协议

    让事情变得简单一点,先考虑TCP/IP模型中应用层的协议。考虑这些是因为,这些协议支撑起来的应用都遵循”客户-服务器“范式。

    这些协议的存在让同一个Web Service支持不同软件终端成为可能,比如HTTP协议支持浏览器直接访问服务,也支持App中调用API向服务端申请服务,比如DHCP协议支持给不同操作系统的PC、平板、智能手机、电视盒子、其他智能家居提供IP地址,SNMP协议的跨系统、跨设备的支持更不用说,等等。

    从应用层再深入思考,比如运输层、网络层的协议,是与硬件平台和传输信道紧密相关的。

    跨终端Web

    回到最开始,”跨终端Web“,我觉得这真的不是单一一门技术就能做完的事情。

    根据实际需求,终端分硬件和软件两个层次,每个层次包含多种类型,每种类型用到的技术又各不相同,所以”终端“的差异是不可避免、无法消除的。

    但我们开发者也是人,也想尽可能的省事,于是就有了跨终端的Web:

    以通信协议为基础,以Web服务的最终表现形式与交互形式为核心的,基于各类操作系统的软件技术集。

     

    展开全文
  • Html5 Web App 手机平台开发

    千次阅读 2013-12-20 16:31:35
    虽 说Android 平台开发或者Mac os X 平台开发以及Windows Phone 7平台开发。...而Html5 Mobile Web App就是其中一种平台方法。下面是相关知识的介绍 1.背景 1.背景 1.背景 1.背景 1.背景 1.

    虽 说Android 平台开发或者Mac os X 平台开发以及Windows Phone 7平台开发。开发的程序都只能在各自手机系统上运行,如果实现开发出一种程序,能再以上任何系统上运行,那是多么美好的事情。而Html5 Mobile Web App就是其中一种跨平台方法。下面是相关知识的介绍

    1.背景
    1.背景
    1.背景
    1.背景
    1.背景
    1.背景
    1.背景
    1.背景
    1.背景

           HTML5是HTML的最新标准,HTML5的草案已经于2008年发布,目前W 3 C(万维网联盟)正在对此进行进一步完善。对许多人来说,早该进行这种改进了。十多年来,HTML一直没有进行真正的升级,上一次正式获得W3C推荐(即Web标准制定过程的最终阶段)的标准语言还是2001年的XHTML1.1。此后的这些年,Web开发人员要求升级的呼声越来越高。因为HTML和XHTML标准已力不从心,它们以文档为中心的理念无法有效地满足现代Web应用的需要。

    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5

    2.1什么是HTML?

    HTML(Hypertext Markup Language)是超文本标记语言的英文缩写,这是一种标记语言,不需要进行编译,直接由浏览器执行。HTML文件是一个文本文件,包含了一些HTML元素、标签等。目前HTML语言的标准是由 W3C(World Wide Web Consortium)负责制定的。依照规则,无论是何种浏览器,对于相同的HTML代码,应当展现给用户相同的效果。

    2.2什么是HTML5?

    HTML5是下一代Web语言,HTML5是在现在的HTML基础上提出了许多新的特性,例如嵌入音频、视频和图片的函数、客户端存 储数据、交互式文档等,通过制定如何处理所有HTML元素以及如何从错误中恢复的精确规则,HTML5进一步增强了互动性,并有效减少了开发成本,并将引领下一个web实现类似的桌面应用体验。它的出现消除internet程序对flash,Sliverlight,javaFX等一类浏览器插件的依赖。

    从感性的角度来看,HTML5技术的渲染过程主要是由浏览器、内嵌HTML5解 析器的应用程序 (如PhoneGap)、支持书签打开方式的应用程序又或者是移动手机产品(iPhone和iPad)进行的。这种技术的好处就是能重用现有的网页设计。

    从理性的角度来看,HTML5 技术就是使用JavaScript引擎直接控制本地功能,改变移动设备上的浏览器组件。而HTML5应用上的表现问题更多是由HTML/CSS渲染技术控 制的,而不是由JavaScript解析生成的。如果使用正确,HTML5技术无疑可以给予你大量新增的表现效果

     

    2.3HTML5前景

    如图,在2012年,将会由W3C发布候选推荐版,这个版本的发布就代表着HTML5的规范编写已经完成了。而2022年推出的计划推荐版,则意味着至少会有两个浏览器会完全的支持HTML5的所有特性。2022年听起来似乎很遥远,但通过观察现阶段chrome, firefox , safari,IE等浏览器对HTML5的支持程度,可以看出各大浏览器厂商都非常积极。应该不需要到2022年就会有至少两个浏览器支持HTML5。因此现在关注和讨论HTML5,了解HTML5的新特性,为以后的产品规划并非毫无意义。

    2.4HTML5的产品与应用

    Google的GMail邮箱

    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App

    3.1移动Web App

           手机上网已经成为最重要的上网方式之一,手机网民已达3亿。移动互联网时代已经开启,发展势头迅猛,成为互联网行业的新战场。 而且手机上网在用户生活中所占的比例越来越多。

           Android和iOS手机的兴起,加速了HTML5在移动设备的普及。与桌面浏览器不同的是,移动操作系统和浏览器随着手机的换代而不断升级。移动浏览器的不断升级,给HTML5在移动Web方向的发展提供源源不断的动力。也随着设备性能的不断提高,移动Web应用的能力也渐渐逼近客户端应用。

           随着苹果宣布不支持Flash,支持Html5,以及微软下一代系统全面支持Html5,以及刚刚得到消息office15 将支持Html5/JavaScript开发,我们可以预见Html5将带来一场革命风暴,而它的地位是显而易见的。

    可以从上面调查中可以看到,多个手机操作系统同时存在,而且这个数据是2010年,现在估计未来购买的话,Android还是占主导,苹果和Windows Phone 7应该是未来三大主导。这个趋势应该是一个长期的过程,所以开发出的应用程序能跨越平台也是越来越重要了。

    那么通过浏览器指定通用的规则,只要支持这个规则的浏览器都可以使用,这个就是Html5 Web App.只要手机浏览器支持Html5浏览器,那么Web App就可以运行了。

    3.2开发HTML5 Web App

           目前,可以知道HTML5在PC上的应用才刚刚开始兴起,可以说在移动中的应用更是开始起步,国内外在这方面开发与应用都是非常少的,可以用稀少来形容。而HTML5 Web App开发这方面资源也少的可怜,现在开发一般使用两种框架PhoneGap与Sencha Touch。

           PhoneGap是一款开源的手机应用开发平台,它仅仅只用HTML和JavaScript语言就可以制作出能在多个移动设备上运行的应用。PhoneGap将移动设备本身提供的复杂的API进行了抽象和简化,提供了一系列丰富的API供开发者调用,只要你会HTML和Javascript或者Java语言,就可以利用PhoneGap提供的API去调用各种功能,PhoneGap就能让你可以制作出在各种手机平台上运行的应用。PhoneGap已实现对iPhone/ipad、Android、Symbian,Palm、黑莓各版本绝大部分功能的支持。

           Sencha Touch框架是世界上第一个基于HTML5的Mobile App框架。Sencha是目前为止所发现的最强大的应用于移动平台的框架。相信随着Sencha的出现,移动平台的Web App用户体验设计会得到提升,同时也会对HTML5和CSS3在移动平台上的普及推广产生很大的促进作用。可以预见,随着HTML5愈加强大的功能,未 来的移动应用将会逐渐步入Web App时代,Native App会逐渐走向终结。


    4.总结
    4.总结
    4.总结
    4.总结
    4.总结
    4.总结
    4.总结
    4.总结
    4.总结

           可以确信两点:Html5的未来是光明的,它势必将引领IT届的一场变革。随着移动应用在人类生活文明中的地位越来越高预计将超过PC机,跨平台的Html5 Web App势必将是领头军。现在才是一个启蒙阶段,我们有必要在这方面做好相关的准备与研究。

    虽 说Android 平台开发或者Mac os X 平台开发以及Windows Phone 7平台开发。开发的程序都只能在各自手机系统上运行,如果实现开发出一种程序,能再以上任何系统上运行,那是多么美好的事情。而Html5 Mobile Web App就是其中一种跨平台方法。下面是相关知识的介绍

    1.背景
    1.背景
    1.背景
    1.背景
    1.背景
    1.背景
    1.背景
    1.背景
    1.背景

           HTML5是HTML的最新标准,HTML5的草案已经于2008年发布,目前W 3 C(万维网联盟)正在对此进行进一步完善。对许多人来说,早该进行这种改进了。十多年来,HTML一直没有进行真正的升级,上一次正式获得W3C推荐(即Web标准制定过程的最终阶段)的标准语言还是2001年的XHTML1.1。此后的这些年,Web开发人员要求升级的呼声越来越高。因为HTML和XHTML标准已力不从心,它们以文档为中心的理念无法有效地满足现代Web应用的需要。

     

    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5
    2.HTML5

    2.1什么是HTML?

    HTML(Hypertext Markup Language)是超文本标记语言的英文缩写,这是一种标记语言,不需要进行编译,直接由浏览器执行。HTML文件是一个文本文件,包含了一些HTML元素、标签等。目前HTML语言的标准是由 W3C(World Wide Web Consortium)负责制定的。依照规则,无论是何种浏览器,对于相同的HTML代码,应当展现给用户相同的效果。

    2.2什么是HTML5?

    HTML5是下一代Web语言,HTML5是在现在的HTML基础上提出了许多新的特性,例如嵌入音频、视频和图片的函数、客户端存 储数据、交互式文档等,通过制定如何处理所有HTML元素以及如何从错误中恢复的精确规则,HTML5进一步增强了互动性,并有效减少了开发成本,并将引领下一个web实现类似的桌面应用体验。它的出现消除internet程序对flash,Sliverlight,javaFX等一类浏览器插件的依赖。

    从感性的角度来看,HTML5技术的渲染过程主要是由浏览器、内嵌HTML5解 析器的应用程序 (如PhoneGap)、支持书签打开方式的应用程序又或者是移动手机产品(iPhone和iPad)进行的。这种技术的好处就是能重用现有的网页设计。

    从理性的角度来看,HTML5 技术就是使用JavaScript引擎直接控制本地功能,改变移动设备上的浏览器组件。而HTML5应用上的表现问题更多是由HTML/CSS渲染技术控 制的,而不是由JavaScript解析生成的。如果使用正确,HTML5技术无疑可以给予你大量新增的表现效果

     

     

    2.3HTML5前景

    如图,在2012年,将会由W3C发布候选推荐版,这个版本的发布就代表着HTML5的规范编写已经完成了。而2022年推出的计划推荐版,则意味着至少会有两个浏览器会完全的支持HTML5的所有特性。2022年听起来似乎很遥远,但通过观察现阶段chrome, firefox , safari,IE等浏览器对HTML5的支持程度,可以看出各大浏览器厂商都非常积极。应该不需要到2022年就会有至少两个浏览器支持HTML5。因此现在关注和讨论HTML5,了解HTML5的新特性,为以后的产品规划并非毫无意义。

    2.4HTML5的产品与应用

    Google的GMail邮箱

    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App
    3. 移动Html5 Web App

    3.1移动Web App

           手机上网已经成为最重要的上网方式之一,手机网民已达3亿。移动互联网时代已经开启,发展势头迅猛,成为互联网行业的新战场。 而且手机上网在用户生活中所占的比例越来越多。

     

           Android和iOS手机的兴起,加速了HTML5在移动设备的普及。与桌面浏览器不同的是,移动操作系统和浏览器随着手机的换代而不断升级。移动浏览器的不断升级,给HTML5在移动Web方向的发展提供源源不断的动力。也随着设备性能的不断提高,移动Web应用的能力也渐渐逼近客户端应用。

           随着苹果宣布不支持Flash,支持Html5,以及微软下一代系统全面支持Html5,以及刚刚得到消息office15 将支持Html5/JavaScript开发,我们可以预见Html5将带来一场革命风暴,而它的地位是显而易见的。

    可以从上面调查中可以看到,多个手机操作系统同时存在,而且这个数据是2010年,现在估计未来购买的话,Android还是占主导,苹果和Windows Phone 7应该是未来三大主导。这个趋势应该是一个长期的过程,所以开发出的应用程序能跨越平台也是越来越重要了。

    那么通过浏览器指定通用的规则,只要支持这个规则的浏览器都可以使用,这个就是Html5 Web App.只要手机浏览器支持Html5浏览器,那么Web App就可以运行了。

    3.2开发HTML5 Web App

           目前,可以知道HTML5在PC上的应用才刚刚开始兴起,可以说在移动中的应用更是开始起步,国内外在这方面开发与应用都是非常少的,可以用稀少来形容。而HTML5 Web App开发这方面资源也少的可怜,现在开发一般使用两种框架PhoneGap与Sencha Touch。

           PhoneGap是一款开源的手机应用开发平台,它仅仅只用HTML和JavaScript语言就可以制作出能在多个移动设备上运行的应用。PhoneGap将移动设备本身提供的复杂的API进行了抽象和简化,提供了一系列丰富的API供开发者调用,只要你会HTML和Javascript或者Java语言,就可以利用PhoneGap提供的API去调用各种功能,PhoneGap就能让你可以制作出在各种手机平台上运行的应用。PhoneGap已实现对iPhone/ipad、Android、Symbian,Palm、黑莓各版本绝大部分功能的支持。

           Sencha Touch框架是世界上第一个基于HTML5的Mobile App框架。Sencha是目前为止所发现的最强大的应用于移动平台的框架。相信随着Sencha的出现,移动平台的Web App用户体验设计会得到提升,同时也会对HTML5和CSS3在移动平台上的普及推广产生很大的促进作用。可以预见,随着HTML5愈加强大的功能,未 来的移动应用将会逐渐步入Web App时代,Native App会逐渐走向终结。

     

    4.总结
    4.总结
    4.总结
    4.总结
    4.总结
    4.总结
    4.总结
    4.总结
    4.总结

           可以确信两点:Html5的未来是光明的,它势必将引领IT届的一场变革。随着移动应用在人类生活文明中的地位越来越高预计将超过PC机,跨平台的Html5 Web App势必将是领头军。现在才是一个启蒙阶段,我们有必要在这方面做好相关的准备与研究。


    转载于:Html5 Web App 手机跨平台开发

    展开全文
  • Web开发秘方

    2014-03-13 10:47:08
    本书包含42种Web开发技巧,从UI效果制作到数据分析处理,从测试方法到主机配置,不一而足,案例详实,细节清晰。 这本书是我目前读过的最棒的Web开发工具书。进入这一行的新手如果单凭自己摸索,往往要花很长时间...
  • Web开发

    千次阅读 2016-07-08 15:15:32
    Web开发和设计人员必备手册,透彻讲解SVG的技术细节 用 《SVG精髓(第2版)》 学习简单的SVG应用,如绘制线条,然后逐步探索复杂的特性,比如滤镜、变换、渐变和图案等。 这是第2版,第2版扩展了动画、交互...

    1、CSS揭秘

    这里写图片描述

    作者:Lea Verou
    译者:CSS魔法

    ★ 豆瓣评分8.1分
    ★ CSS一姐Lea Verou作品,CSS魔法执笔翻译
    ★ Eric Meyer、Jeremy Keith等前端大佬推荐

    《CSS揭秘》注重实践,揭示了47个鲜为人知的CSS技巧,主要内容包括背景与边框、形状、视觉效果、字体排印、用户体验、结构与布局、过渡与动画等。

    “如果你想深入探寻CSS的美妙之处、创意之处与智慧之处,那就别犹豫了——赶快翻开这本书吧。它让我爱不释手!”

    ——Eric A. Meyer,《CSS权威指南》作者

    “Lea Verou那渊博的学识是无法复制的,但她在这本书中倾囊相授,令我们都有机会一窥CSS的强大威力与神奇魔力。即使你认为自己对CSS已经了如指掌,我保证这本书仍然会让你大开眼界。”

    ——Jeremy Keith,《JavaScript DOM编程艺术》作者

    2、React Native入门与实战

    这里写图片描述

    作者:王利华,魏晓军,冯诚祺

    ★ 国内第一本React Native原创图书,携程框架团队倾力打造
    ★ 详尽基础 + 大量案例,帮助零基础读者实现跨终端App开发
    ★ 移动首选解决方案,前端终极开发利器,一本书玩转React Native

    《React Native入门与实战》分为4部分,首先简要介绍React Native的开发基础知识,然后介绍React Native的API、组件以及Native扩展和组件的封装,接着介绍App的动态更新和上架过程,最后通过3个案例介绍如何使用React Native开发原生App。

    3、React Native开发指南

    这里写图片描述

    作者:Bonnie Eisenmen
    译者:黄为伟

    ★ React Native核心贡献者Brent Vatne强烈推荐
    ★ Twitter公司软件工程师Bonnie Eisenmen撰写
    ★ 应用开发、调试、部署一网打尽
    ★ 图文并茂、讲解详尽,学习起来更轻松
    ★ 一本不容错过的跨平台应用开发实践指南

    《React Native开发指南》介绍了React Native这款JavaScript框架。在React Native中利用现有的JavaScript和React知识,就可以开发和部署功能完备的、真正原生的移动应用,同时支持iOS与Android平台。除了框架本身的概念讲解之外,还讨论了如何使用第三方库,以及如何编写自己的Java或Objective-C的React Native扩展。

    4、JavaScript程序设计

    这里写图片描述

    作者:John David Dionisio,Ray Toal
    译者:贾洪峰 李松峰

    ★ 逐步介绍JavaScript编程所需的全部知识
    ★ 提供大量精心选择的练习,让读者可以即刻测试和运用所学知识

    《JavaScript程序设计》是专门为计算机编程入门课程设计的,旨在通过从零开始介绍JavaScript编程让读者理解计算机科学的基本思想和原理。主要内容有:计算的相关知识、编程的基本概念、数据、语句、函数、事件、软件架构、分布式计算、图形与动画,此外还探讨了正则表达式、递归、缓存等高级主题。

    5、精通JavaScript开发

    这里写图片描述

    作者:Den Odell
    译者:邝健威,厉海洋

    ★ JavaScript实战指南

    《精通JavaScript开发》主要内容包括:JavaScript性能、可靠性、稳定性和代码管理分析,面向对象代码的使用,测试和错误处理机制的构建,用AMD和RequireJS管理代码依赖,移动端、游戏和实时通信的JavaScript开发,等等。

    6、学习JavaScript数据结构与算法

    这里写图片描述

    作者:Loiane Groner
    译者:孙晓博,邓刚,吴双,陈迪,袁源

    你将从本书中学到:
    在数组、栈和队列中声明、初始化、添加和删除元素;
    创建和使用最复杂的数据结构——图,以及DFS和BFS算法;
    链表、双向链表和循环链表的作用;
    用散列表、字典和集合存储不重复的元素;
    二叉树和二叉搜索树的应用;
    使用冒泡排序、选择排序、插入排序、归并排序和快速排序算法,对数据结构排序;
    使用顺序搜索和二分搜索,搜索数据结构中的元素;
    理解大O表示法、动态规划和贪婪算法的重要性。

    《学习JavaScript数据结构与算法》首先介绍了JavaScript语言的基础知识,接下来讨论了数组、栈、队列、链表、集合、字典、散列表、树、图等数据结构,之后探讨了各种排序和搜索算法,包括冒泡排序、选择排序、插入排序、归并排序、快速排序、顺序搜索、二分搜索,最后还介绍了动态规划和贪心算法等常用的高级算法及相关知识。

    7、JavaScript网页动画设计

    这里写图片描述

    作者:Julian Shapiro
    译者:王沛

    ★ 业界最先进的动画库Velocity.js作者作品
    ★ 揭秘开发人员如何用动画轻松提升用户体验
    ★ 实现视觉上效果震撼、技术上易于维护的动画效果

    《JavaScript网页动画设计》共8章,以作者开发的动画库Velocity.js为工具,探讨了JavaScript动画的特点和工作流方面的优势,涵盖文本动画、SVG、动画性能等问题。

    8、JavaScript Web应用开发

    这里写图片描述

    作者:Nicolas Bevacqua
    译者:安道

    ★ 构建先行、设计干净、可测试、结构良好的JavaScript应用
    ★ 介绍用于提升应用质量和改进开发流程的技术

    《JavaScript Web应用开发》首先会教你如何制定能优化产品质量的过程,制定好过程后,每次修改代码后都会执行一些任务,每次提交后都会运行测试,还能自动部署。还会集中介绍如何设计模块化的组件,以及如何使用这些组件构建健壮的应用。主要分两大块,首先是以构建为目标实现JavaScript 驱动开发,其次介绍如何管理应用设计过程中的复杂度,包括模块化、MVC、异步代码流、测试以及API 设计原则。

    9、全端Web开发:使用JavaScript与Java

    这里写图片描述

    作者:Casimir Saternos
    译者:王群锋,杜欢

    ★ 前后端程序员必备指南,全面讲解最新的C/S应用开发范式

    《全端Web开发:使用JavaScript与Java》以Java和JavaScript这两种最流行的服务器与客户端开发环境为例,全面讲解最新的C/S应用开发范式。还通过各种实例进一步强化认知。

    10、MEAN Web开发

    这里写图片描述

    作者:Amos Q. Haviv
    译者:陈世帝

    ★ 利用MEAN实现JavaScript全栈开发。全栈工程师的必读之书

    《MEAN Web开发》从MEAN 的核心框架开始,详细阐述每一种框架的关键概念,如何正确地设置它们,以及如何用流行的模块把它们连接在一起。通过实例练习,搭建出自己的MEAN 应用架构,通过添加认证层,开发MVC 架构支持自己的项目开发。最后,学会使用不同的工具和框架加快你的日常开发进程。

    11、学习响应式设计

    这里写图片描述

    作者:Clarissa Peterson
    译者:文巍

    ★ 了解最新最全面的响应式设计原理、技术、策略与流程

    《学习响应式设计》分为四部分,第一部分介绍响应式设计及其与其他网页设计方法的区别。第二部分概述构建响应式站点的基础知识、必备的HTML和CSS知识、图像处理,以及响应式设计的核心:媒体查询。第三部分带大家全面了解响应式设计的工作流程,从用户体验的角度探讨响应式设计,确保网站在各种设备上的适应性和功能完备性。第四部分深入探讨需特别考虑的设计元素,包括文字排版、响应式导航和页头,以及响应式设计的一大问题:性能。

    12、HTML5与WebGL编程

    这里写图片描述

    作者:Tony Parisi
    译者:潘征

    ★ Web 3D标准先驱作品;循序渐进上手产品级3D应用开发

    《HTML5与WebGL编程》主要讲解如何运用HTML5及CSS3、WebGL等相关技术,开发出具有极强视觉冲击力的、高性能的3D Web应用。讲解如何使用工具、框架和库,在桌面和移动浏览器中创建出3D模型和动画、令人惊叹的视觉效果以及出色的用户交互。

    13、SVG精髓(第2版)

    这里写图片描述

    作者:J. David Eisenberg,Amelia Bellamy-Royds
    译者:易郑超,何鹏飞

    ★ Web开发和设计人员必备手册,透彻讲解SVG的技术细节

    《SVG精髓(第2版)》学习简单的SVG应用,如绘制线条,然后逐步探索复杂的特性,比如滤镜、变换、渐变和图案等。

    这是第2版,第2版扩展了动画、交互式图形以及SVG编程等内容。交互式的在线示例让人很容易在Web浏览器中实验SVG的特性。还为经验丰富的设计师准备了6个附录,解释了XML标记和CSS样式等基本概念,因此即使没有网页设计的经验,也可以开始学习SVG。

    展开全文
  • 该论文分享了一个涉及平台在移动设备上运行的学生服务Web应用程序的项目经验。本文首先介绍了项目的背景,目标用户以及解决方案。然后,重点介绍开发流程,并提供所使用的书面代码和技术说明。目的是让读者了解...

    摘要:随着移动设备的普及,应用程序的需求变得必不可少。开发一个应用程序有多困难,尤其是跨平台的应用程序?该论文分享了一个涉及跨平台在移动设备上运行的学生服务Web应用程序的项目经验。本文首先介绍了项目的背景,目标用户以及解决方案。然后,重点介绍开发流程,并提供所使用的书面代码和技术说明。目的是让读者了解如何开发适合在移动设备上使用的Web应用程序。本文总结了教学的意义,并提出了进一步发展的思路。

    关键词:Web应用程序,移动体验友好的Web应用程序,开源软件,Web数据库,跨平台的应用程序,HTML5,PHP,CSS,JavaScript。

    介绍

             随着用户越来越多地转向使用移动设备和平板电脑来代替台式电脑,人们也越来越需要能够在移动设备上运行良好的应用程序。Pew研究中心最近的研究指出:18-34岁是迄今为止在技术上拥有最大优势的用户群体,拥有手机的人数占比高达95%。教育工作者不仅需要使用移动设备来以新的方式向这些年轻一代传达知识,而且需要提供对应的应用程序来满足这些精通技术的学生需求。对于许多参与教学或开发移动应用程序的人来说,面临着两个挑战:一个是提供一个优秀的应用程序,尤其是教育相关的应用程序。另一个挑战是没有建立统一的移动设备平台。

            每个移动设备平台都会提供自己的开发工具,而且每个平台的开发工具都是不一样的。例如,苹果的iOS的开发工具不能在谷歌的安卓系统上使用,反之亦然。因此,要想在不同的平台上运行必须分别为每个平台编写应用程序。对于那些没有时间和能力的教育工作者来说,掌握多种工具几乎是不切实际的,况且掌握一种开发工具已经十分困难了,更别提学习多种开发工具了。

            在本文中,我们想分享我们开发跨平台应用程序的经验。这是一个简单的应用程序,但开发这个应用程序的方法是对教学是非常有用的。此外,这里介绍的知识也可以用于开发更复杂的应用程序。因此,本文的主要目的是描述我们的应用程序的开发过程,说明我们的代码,分享我们在这个项目中的经验以及我们的工作愿景。我们希望我们分享的内容有助于降低移动应用程序开发过程中的阻碍,并减少那些对移动应用程序开发教学感兴趣的人的学习成本。本文的重点是我们的项目-即设计和开发学生服务应用程序。它的主要功能是显示我们校园的学生服务信息。具体来说,我们的论文结构如下:首先描述项目的背景,目标用户和解决方案。然后,逐步描述发展过程,并展示了所使用的书面代码和技术。接下来是介绍学生服务Web应用程序的工作原理。最后,总结实践意义和未来的发展工作。

    项目背景

    确定软件的需求

            起初,我们的兴趣是研究和学习使用不同的方式来开发一个移动应用程序供学生使用。我们希望应用程序对学生有用。我们为潜在的应用程序提出了一些想法,但最终我们决定把重点放在学生服务上。这个应用程序的主要目的是为学生提供有关我们校园服务的信息。我们猜想,这样的应用程序不仅对现在的学生有用,而且对新生和校园的其他访问者也有用。

            基于这个需求,我们着手收集所有与学生有关的服务信息。 我们确定了大多数校园里20多种典型的服务。包括财务,学术以及技术支持。有了这些信息,我们打算设计和开发一个应用程序,允许学生搜索特定的服务,并从他们的移动设备上检索有关该特定服务的基本信息。更重要的是,我们希望应用能够在iPhone,Android和Window等设备上运行,实现跨平台的需求。

    了解移动应用开发的三大选择

            基于与行业专业人士的讨论,移动应用程序的开发基本上有三个主要方式。第一种是使用平台特定的开发工具来开发特定平台的应用程序。第二种是使用HTML / JQuery和CSS创建Web应用程序。最后是使用诸如Sencha和RhoMobile等RAD工具来创建平台中立的基于Web的应用程序。

            对于第一种,使用特定的平台开发工具,结果就是开发出原生应用程序。原生应用程序通常是使用特定的平台开发工具和由硬件/设备提供商(如Google和Apple)提供的应用程序接口(API)编写的应用程序,专门针对特定的平台(如Google Android,Apple iOS,Microsoft Windows(Lutes ,2012)。本地应用程序通常使用编译的编程语言(如Java,Objective C, C#)进行编码。原生应用程序通常是功能更为健全的,因为他们可以访问设备提供的特定功能(Lutes,2012)。所有原生应用程序都是通过应用程序商店(如Apple App Store,Google Play商店)获取的。本地应用程序直接安装到设备上,在本地上可以直接使用,因此可以在没有连接到网络的情况下也可以运行。

            对于使用HTML / JQuery和CSS的第二个种方式,使用它作为开发工具的结果是开发出移动Web应用程序。移动Web应用程序的功能基本上与使用针对移动设备优化的网站功能相同它不依赖于设备,因为它通常使用基于标准的Web浏览器技术编码,如HTML,CSS,JavaScript,PHP,而不是编译的程序语言。尽管它像本地应用程序一样工作,但不需要下载或安装。移动设备上的网络浏览器通过指定的URL调用它。因此必须需要互联网连接来运行它。

            对于第三种方式,使用平台中立的基于web的应用程序创建的混合应用程序。这种应用程序结合了原生应用程序和移动Web应用程序的特点。像移动网络应用程序一样,它是使用HTML,CSS,JavaScript或PHP编写的,但是它被编译为原生应用程序,通过供应商软件商店进行分发。从用户的角度来看,原生应用程序和混合应用程序之间几乎没有区别。只要设备具有网络浏览器,混合应用程序就可以像本地应用程序一样运行。从开发人员的角度来看,混合应用程序是真正跨平台的:相同的HTML代码可以在不同的平台上运行。这种方式是可能的,因为几乎所有的操作系统都支持运行HTML5,CSS和JavaScript代码的移动浏览器,并且可以使用本地设备存储。而且相关的开源库和工具提供了一个公用的框架,主要的用户界面是一个单一的Web浏览器小部件。这个小部件处理了HTML5,CSS和JavaScript代码,并将它们打包成一个本地应用程序(Lutes,2012)。

    在原生应用与Web应用程序/混合应用程序做出选择

            多年来,关于原生应用程序与Web应用程序/混合应用程序有很多讨论。例如,Hinchly(2014)在他的博客中描述了“金融时报”如何在Web上与原生应用的辩论。博客指出了开发应用程序的两种方式的优点和缺点。随着变化越来越快,很难知道哪一个会占上风。在不久的将来,两者之间的界线可能变得更加模糊,因为两者之间不再有区别。由于本文的重点不在于探索哪个开发方案是更好,我们对适合于我们项目的方法更有兴趣分享。因此,在本文中,我们将更详细地讨论在现有的资源和知识的基础上如何使用所选方法来设计,开发应用程序。

    开发流程

    第1步:概念设计,基本需求和开发工具选择

            我们做的第一件事情是抽象化我们的应用程序。我们确定了基本的要求,然后选择了开发所需的工具。

    第2步:为Web应用程序设计数据库

            在我们确定并收集了我们校园内学生服务数据后,我们将信息保存在Excel电子表格中。接下来,我们开始将信息从Excel电子表格传输到在线MySQL数据库中。

    第3步:使用PHP进行编码,并从jQuery和jQueryMobile集成JavaScript库

            在应用的编码过程中,我们使用PHP创建了几个重要的文件。下表描述了这些PHP文件的主要功能。对于那些有兴趣采用和使用这个网络应用程序来进行教学或者为了进一步开发这个应用程序来适应他/她自己的情况,这些解释可能是有用的。

    文件名

    描述

    index.php

    该文件在用户启动时加载。它根据检测到的设备来显示相对应的视图。

    home.php

    程序的主页。包括数据库和一些界面布局。

    Info.php

    根据用户选择的服务加载与该服务相对应的一些特定的信息

    Map.php

    使用谷歌Map API开发的地图界面

    Phone.php

    专门移动设备(手机)开发的界面

     

    第4步:探索通过不同的方式来帮助学生注意到到并访问学生服务Web应用程序

    要想使用原生应用程序,用户只需前往各自的应用程序商店即可下载。例如,如果用户想查找iPhone应用程序,他/她将点击AppStore,然后通过关键字搜索应用程序。这是一个原生应用程序的优势。然而,要找到一个Web应用程序,用户必须明白自己正在寻找什么。一个网络应用程序基本上是一个互动网站,所以可以通过以下渠道找到,包括搜索引擎,其他网站上的链接,社交媒体上的分享,口碑和/或广告。因此,对于我们来说,这意味着我们需要让学生注意到我们的Web应用程序,以便他们可以使用以上任何一个渠道访问和下载它。此外,我们想出了一个额外的方式,来使访问Web应用程序变得轻松方便,那就是使用二维码来访问我们的Web应用程序。

    了解学生服务Web应用程序的工作原理

    以下是学生在访问应用程序时的情况的描述。用户输入应用程序的URL后,将加载“index.php”文件。 随之后台会发生一系列事件。 首先,“index.php”中的代码获取数据库中所有服务的列表以及与特定服务关联的对应ID(主键)。当用户输入字母时,应用程序将显示与输入字母匹配的学生服务列表。例如,当输入字母“p”时,将显示包含字母“p”的所有服务的列表。这是可以实现的,因为我们编写了代码来过滤包含被键入的字母的服务名称,并显示匹配字母的服务名称。继续上面的输入字母“p”的例子,如果“警察局(police)”是与之匹配的服务,那么用户可以点击它以获得更多的信息。这个活动将打开一个新的页面,显示警察部门所需的信息。

    讨论

            从事信息技术,信息系统开发和编程的教学人员,他们已经了解了应对快速发展的技术变革的挑战。七年前,全球有近四十亿的人口没有接入互联网,因此手机行业得到了巨大的发展机会和提供了大量的就业市场。到现在,移动设备的数量相对七年前已经增加了两倍。技术的进步已经淘汰了许多传统(非智能)手机。随着功能的增加,这些移动设备迅速得到普及。因此,应用程序一直都有巨大的需求量。

    结论

            意识到在教授移动应用程序开发方面的挑战,我们希望在本文中做的是分享我们自己在移动Web应用程序实际开发中的经验。根据我们的经验,我们可以提供一些实际的指导经验来降低开发难度。在前面的章节中,我们描述了开发流程以及我们创建的学生服务Web应用程序的功能。到目前为止,我们成功地开发和提供了一个功能性的Web应用程序。回顾整个开发流程,我们意识到开发移动应用程序需要精心策划。要想取得成功,每一个环节都要做好,最终形成一个统一的项目。就像我们的一样,我们的项目是从一个想法开始,接下来我们选择了适合项目的方法。对于我们来说,这个方法是使用HTML / JQuery和CSS的web应用程序选项。之后,我们进行了规划,程序设计,编码,测试,并最终部署应用程序在跨平台的移动设备上运行。然而,最重要的部分是选择正确的方式。我们选择遵循Web应用程序路径来创建和提供可支持跨平台的内容。我们的Web应用程序是用HTML,CSS和JavaScript实现的。这与Lutes提出的使用网络开发技术的建议相吻合。我们依靠浏览器来提供运行时环境,并利用多平台的浏览器支持。因此,我们能够实现应用程序在各种移动设备上运行。这种方式考虑了不同的屏幕尺寸和移动设备。虽然移动设备的构建方式不同,但是它们的浏览器是相似的,因为这些浏览器基于通用技术,具有开放和成熟的标准和协议。我们的学生服务网络应用程序也不需要高级编程知识。因此,我们的应用程序的开发流程可以做为一个模型,它可以轻松地移植到其他跨平台。

    未来的开发计划

            我们的学生服务网络应用程序功能齐全。目前,它旨在我们自己的服务器上运行,并提供主要的学生服务信息。在开发的下一阶段,我们计划修改当前代码,并扩展我们的设计概念,以创建更灵活,可共享和易于复用的源代码。其目标是让其他人能够轻松快速地开发更多专门涉及在线访问数据库的Web应用程序。 另外,我们还会增加更多功能,包括以下功能:

        •允许用户在数据库中指定自己的内容

        •支持灵活的数据字段和多种数据类型

        •显示位置和方向的地图

        •支持视频和音频以及允许更多的搜索字段,

        •简化输入过程,如允许用户直接输入数据到服务器上,

        •支持国际字符/字体

    局限

            由于本文主要关注我们的第一次开发工作,所以是具有一定的限制的。第一个是对我们的学生服务应用程序的有效性和可用性缺乏深入思考,缺少用户反馈机制。因此,在下一个阶段,我们计划增加收集用户反馈的方法。当我们将这种体验转化为一个课堂项目时,我们可以进行实际的研究并收集数据来衡量学生是如何评估应用程序并从中学到了多少。我们没有注意到的第二个因素是应用程序开发本身的质量和维护方面的问题。例如,本文没有涉及到与度量,代码质量和长期维护相关的要点。这些都是整个系统开发以及跨平台移动应用程序开发的重要考虑因素,特别是考虑到移动设备技术正在以惊人的速度发生着变化。

            尽管有上述限制,但我们希望通过阅读本文,读者不仅可以了解我们的学生服务Web应用程序如何工作以及如何开发的,而且可以将这些代码和想法用于教学或者一些其他的方面。

    原文地址:http://www.jite.org/documents/Vol14/JITEv14IIPp145-169Huynh1842.pdf

    (对原文有所删改,本人并非web程序开发人员,若文中翻译有不恰当的地方还请再评论中指出)


    展开全文
  • 这篇文章只是我深入了解移动领域开发过程...1:移动web开发 这部分跟web前端开发差别不大,使用的技术都是html+css+js。区别为手机浏览器是webkit的天下,pc端是三足鼎立IEfirefox chorme。手机网页可以理解成pc
  • 从零开始学习移动端Web开发

    万次阅读 多人点赞 2017-05-11 13:19:57
    从传统的安卓、IOS原生手机系统应用开发,转向了移动端Web开发或者是混合开发,既然有需求,那就让我们一起来学习移动端Web开发吧。本文旨在让读者以最快的时间了解移动Web开发基础以及介绍一些常见问题。基础准备...
  • 1、QT简介:Qt是Trolltech公司的产品,Trolltech是挪威的一家软件公司,主要开发两种产品:一种是平台应用程序界面框架;另外一种就是提供给做嵌入式Linux开发的应用程序平台,能够应用到PDA和各种移动设备,...
  • Delphi(C++ Builder)一直致力于快速的应用程序开发环境已有25年以上的历史,并且仍在继续增长。如果您知道如何使用Delphi,Delphi会帮助您迅速并且能够创建任何应用程序APP及WEB网站应用! 当前,使用Delphi,您...
  • 终端Web之Hybrid App开发对比

    千次阅读 2016-05-13 18:05:27
    Native App(以下简称Native)和Mobile Web(以下简称Web)二者混合开发的产物被称为Hybrid App(以下简称Hybrid)。Hybrid并不是什么新概念,最早可以追溯到Symbian时代,直到iOS和Android出现之后才充分展现出价值...
  • 终端Web之HybridApp

    2021-03-03 15:11:32
    Hybrid既利用了NativeApp丰富的设备API(DeviceAPI),又能拥有MobileWeb平台、高效开发、快速发布的能力,对于相当庞大的应用场景而言都是适用的。平台Web内容可以做到开发一次,所有平台生效,诸多产品需要...
  • 常用移动web开发框架

    千次阅读 2019-05-01 17:13:12
    纯粹的总结一下移动web开发框架,移动web开发框架有jQuery Mobile 、Sencha Touch等等,他们都来源于web开发,是成熟的框架,jQuery Mobile出自于jQuery家族,Sencha Touch来自于ExtJS。jQuery Mobile 和Sencha Touch...
  • HTML5移动Web开发指南

    千次阅读 2012-05-28 16:23:15
    HTML5移动Web开发指南 唐俊开 著 ISBN978-7-121-16083-7 2012年3月出版 定价:59.00元 16开 384页 宣传语 绝无仅有的HTML5移动Web开发专著 jQuery Mobile、Sencha Touch、PhoneGap入门首选 HTML5研究小组...
  • 10大移动Web开发框架

    千次阅读 2011-11-15 21:55:55
    开发者在创建web程序和Web移动开发时应该不断的挑战自我,开发新技术。如今,触屏时代了终结了鼠标,大多数便携式应用改变了传统的台式机产品。为了帮助您快速的构建平台...移动Web开发框架给移动设备平台提供标准的
  • 移动端web开发笔记(一)

    万次阅读 多人点赞 2018-07-15 20:33:43
    先搞清楚两个概念,移动端web开发,web app开发1、 移动web开发(pc端的页面用手机浏览器打开)这部分跟web前端开发差别不大,使用的技术都是html+css+js。区别为手机浏览器是webkit的天下,pc端是IE的天 下。手机...
  • 移动web开发框架研究

    千次阅读 2016-02-11 21:33:53
     纯粹的总结一下移动web开发框架,移动web开发框架有jQuery Mobile 、Sencha Touch等等,他们都来源于web开发,是成熟的框架,jQuery Mobile出自于jQuery家族,Sencha Touch来自于ExtJS。jQuery M
  • web开发框架技术有哪些?

    万次阅读 2018-11-07 16:07:30
    如果你是做Web开发的,Web框架一定会很熟悉,框架是Web架构开发中必不可少的工具,不仅可以提高开发效率,还能让开发项目更成熟,并且可以提升代码的可再用性,Web框架开发离不开相应的开发语言,以下是常用的Web...
  • 移动端Web开发 基础知识

    千次阅读 多人点赞 2021-09-26 16:07:15
    文章目录移动端Web开发移动端基础浏览器视口样式编写分辨率和设备像素比二倍图SVG矢量图 移动端Web开发 移动Web开发的两种主流方案,一种是单独制作移动端页面,另一种是制作响应式页面 移动端页面: 单独制作移动端...
  • Web开发必备书籍

    万次阅读 2015-05-25 14:21:01
    你看,或者不看我, 我就在那里, 不悲不喜;...在大家马不停蹄的奋斗的时候,小编插空给大家推荐web开发必备良品,从入门到精通,应有尽有,不容错过~1、HTML5篇——《HTML5与CSS3基础教程(第8版)》
  • 终端 Web

    千次阅读 2014-07-18 16:20:01
    终端 Web(移动优先|响应式|HTML5|Hybrid|桌面+移动应用|一线前端负责人联袂推荐) 徐凯 著  ISBN 978-7-121-23345-6 2014年6月出版 定价:55.00元 240页 16开 编辑推荐 √聚焦开创性话题,完整呈现与...
  • 移动开发之我见 ——移动WEB

    千次阅读 2012-06-19 21:52:43
    无论是桌面还是移动开发,从云计算的起兴至今。...而,我们现在也可以使用网站开发的方法来开发移动应用。   一、平台的解决方案 无论是iPhone或者Android的开发上,我们都可以选用不同的方案来
  • 移动端开发Web App开发

    千次阅读 2018-06-26 20:12:19
    写在前面:本人刚刚接触移动端开发,希望自己的见解能够帮助到他人,不足之处还望提醒。1 移动端开发分类1.1 Native App 原生App开发优点:(1)用户体验好(2)性能稳定(3)操作速度快(4)能够访问本地资源...
  • JS UI框架支持纯JavaScript、JavaScript和Java混合语言开发。本文 鸿蒙真的是套壳吗?HarmonyOS应用开发初体验,Java原生和JavaScript的mvvm开发 鸿蒙 OS:使用 JavaScript 开发 Todo App UI 界面 鸿蒙系统中的...
  • 这是 Mashable 搜集的最新 Web 开发工具箱,包括拖放式 Web 程序创建工具,代码库,项目管理,测试程序,以及支持各种编程语言的框架,从 Ajax 到 Ruby 到 Python。这是第二部分。 参考与资料 COfundOS - 一个讨论...
  • web开发工具

    万次阅读 2018-01-10 14:13:56
    软件 火狐: ...Chrome: ...Teem V iewer: ...Opera Dragonfly 是Opera浏览器的跨设备,跨平台调试环境—调试 JavaScript, 检查编辑CSS和DOM, 并且查看移动设备或计算机上的错误 22.IE Web Developer  ...
  • 市面上有许多前端开发工具可以加速 Web 开发工作。本文是对一些顶级 Web 开发工具的一次精选汇总,分别介绍了每款工具的关键特性,并已附上下载链接。 1. Novi Builder Novi Builder 是一个拖放式构建器,它对于...
  • 10个Web移动开发JavaScript框架

    千次阅读 2019-05-20 09:53:51
    这些轻量级框架使用HTML5和CSS3标准来帮助您快速开发跨平台的Web移动应用和网站。 1. jQuery Mobile jQuery Mobile这个框架能够帮助你快速开发出支持多种移动设备的Mobile应用用户界面。它是当前最流行的移动开发...
  • Web开发技术的历史发展简介

    千次阅读 2012-07-21 10:56:55
    Web开发技术的历史发展简介 分类: 站在巨人的肩膀上 技术文档 精品 2006-04-26 16:53 952人阅读 评论(0) 收藏 举报  Web开发技术的历史发展简介 讨论Web开发技术的历史,当然要先说说Web...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 78,110
精华内容 31,244
关键字:

web开发可以跨设备