前言
目前,HTML5和CSS3已成为Web应用开发中的热门技术。HTML5和CSS3不仅是两项新的Web技术标准,更代表了下一代HTML和CSS技术,是Web开发世界的一次重大的改变。虽然HTML5的标准规范还没有正式发布,但是未来的发展前景已经可以预见,那就是HTML5必将被越来越多的Web开发人员所使用,各大主流浏览器厂家已经积极更新自己的产品,以更好地支持HTML5。
HTML5具有更多的描述性标签、良好的多媒体支持、强大的Web应用、先进的选择器、精美的视觉效果、方便的操作、跨文档消息通信、客户端存储等诸多优势。应用HTML5的优点主要在于,这个技术可以进行跨平台的使用。例如开发一款HTML5的游戏,可以很轻易地移植到UC的开放平台、Opera的游戏中心、Facebook应用平台,甚至可以通过封装的技术发送到App Store或Google Play上,所以它的跨平台能力非常强大,也是大多数Web应用开发者对HTML5有兴趣的主要原因。
本书具有以下特色和创新。
(1)充分调研HTML5、CSS3新技术的实际应用情况,精心优选教学案例。本书开发前期对HTML5、CSS3新技术的实际应用情况做了大量细致的调研工作,先后分析了手机搜狐网、新华网手机版等5个新闻类网站的手机版,携程旅行、同程旅游等7个旅游类网站的触屏版,苏宁易购、京东商城等8个购物类网站的触屏版,艺龙无线、去哪儿网等15个网站的注册登录和留言网页,俄罗斯方块、连连看等18款网页游戏,16个常用的音乐视频网页播放器,40多个网页图形,80多个复杂样式和网页特效。经过4次筛选、优化和简化,最终形成了56个典型教学案例,并将这些教学案例分为8种类型,这些教学案例全都来自于真实网站或项目,代表了移动Web应用开发实际需求和最新水平。
(2)合理选取教学内容,科学设置教学单元。从跨平台的移动Web开发实际应用的角度理解HTML5和CSS3的新元素和新功能,而不是从HTML5和CSS3理论知识本身取舍教学内容。遵循学习者的认知规律和技能的形成规律,将基于HTML5+CSS3的移动Web应用开发分为8类:跨平台的网站首页设计、文本新闻浏览网页设计、旅游景点推荐网页设计、商品信息展示网页设计、注册登录与留言网页设计、音乐视频网页播放设计、网页图形绘制与游戏设计、复杂样式与网页特效设计。对应这8种类型的Web应用开发,本书设置了8个教学单元,将HTML5和CSS3的相关知识合理安排到各个教学单元。由于基于HTML5和CSS3的Web开发涉及面广、应用领域多,同时限于本书篇幅的限制,本书重点探析了基于HTML5+CSS3的典型Web应用,对于HTML5地理定位、Web数据存储、应用程序缓存、Web Workers等高级应用以附录的方式进行了简单介绍,让学习者都有一个初步认识。
(3)充分考虑教学实施的需求,每个教学单元面向教学全过程设置“教学导航→实例探析→知识疏理→引导训练→同步训练→拓展训练→单元小结”7个教学环节。每个教学单元相关的理论知识相对独立,以问题解答的方式进行组织,形成了系统性强、条理性强、循序渐进的理论知识体系。每个教学单元根据学习知识和训练技能的需要合理设置移动Web开发任务,形成“实例探析-引导训练-同步训练-拓展训练”4个训练层次。
(4)围绕56个移动Web开发任务,采用“任务驱动、精讲多练、理论实践一体化”的教学方法,全方向促进基于HTML5+CSS3移动Web开发能力的提升。引导学习者在完成各个设计任务的过程中,逐步理解HTML5和CSS3的新功能和新特点,循序渐进地学会HTML5和CSS3的应用,从而熟练掌握形式多样的移动Web应用设计方法。
(5)改进和优化教学内容的组织方法和程序代码的分析方法,HTML5和CSS3的理论知识以“必需够用”为度,并将够用的理论知识与必备的技能训练合理分离。每一个教学单元独立设置了“知识疏理”环节,主要分析与归纳各单元必要的理论知识要点,使学习者较系统地掌握必备的理论知识。学习HTML5和CSS的主要目的是为了应用所学知识分析设计各类移动Web应用,在分析设计移动Web应用的过程中,在实际需求的驱动下学习知识和领悟知识,最终熟练掌握知识,固化为能力。HTML5和CSS的应用灵活多样,学习移动Web应用开发课程的重点不是记住了多少理论知识,而是通过梯阶训练学会HTML5和CSS的实际应用,利用其优势解决实际的移动应用开发问题。本书重点关注的触屏版网页设计、音乐视频网页播放、网页图形绘制、游戏设计、复杂样式设计、网页特效设计等方面都是HTML5+CSS3的典型应用,这些应用所涉及的HTML代码、CSS代码和JavaScript代码都或多或少地应用了相似或相同的标签、属性、方法或事件,如果各个任务的代码逐一进行说明,则会造成大量重复解释,同时也会缺乏系统性,基于这一原因,在各个任务的实施过程中并没有对代码进行详细解释说明(部分解释说明以注释方式写在代码中),而是将HTML5和CSS3的相关标签、属性、方法或事件在附录中以表格方式进行集中介绍,方便在分析代码中进行查找。
(6)本书配套教学资源丰富,包括教学单元设计、教学流程设计、移动Web开发任务设计、教学案例、电子教案、授课计划等教学资源,力求做到想师生之所想,急师生之所急。
本书由陈承欢教授著,广东科学技术职业学院的陈华政,南通理工学院的陈莉莉,商丘工学院的张俊鹏,长沙环境保护职业技术学院的杨茜,湖南铁道职业技术学院的颜珍平、肖素华、林保康、王欢燕、潘玫玫、郭外萍,日照职业技术学院的费琳琳,四川工业科技学院的唐小玲、吕莉,湖南工业职业技术学院的刘曼春,安徽水利水电职业技术学院的方跃胜等多位老师参与了教学案例的设计、优化和部分章节的编写、校对和整理工作。
由于编者水平有限,书中难免存在疏漏之处,敬请各位专家和读者批评指正,作者的QQ为1574819688,感谢您使用本书,期待本书能成为您的良师益友。
2014年9月