天津web前端基础培训学校
【所属机构：天津先锋科教培训】
H5是指第5代HTML，也指用H5语言制作的一切数字产品。所谓HTML是“超文本标记语言”的英文缩写。我们上网所看到网页，多数都是由HTML写成的。“超文本”是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。而“标记”指的是这些超文本必须由包含属性的开头与结尾标志来标记。浏览器通过解码HTML，就可以把网页内容显示出来，它也构成了互联网兴起的基础。
01 什么是html与css？
- 什么是html与css？
html是一种超文本标记语言，所谓超文本，即页面中不仅包含文字，还有图片、视频等诸多元素，一个网页结构类似人体，有头(Head)，身体(Body)，脚(Footer)，才构成完整的页面。
css是一种样式表，用来表现修饰页面的各种元素，类似人的外貌和衣着。 - 什么是html5与css3？
html5是html语言的第五次重大修改，加入了很多新的标签和特性。同样，css3是css的最新升级版本，在很多样式方面有了新的特性，现在html5+css3再配合js脚本语言，可以制作出不属于Flash的漂亮页面动画效果，并且在版式的布局设计上也更加便利。
02 网页H5开发课程大纲
网页基础课程 - H5前端设计课程
- 网页高级特效与框架开发
网页基础课程 节点学习内容 最终学习目标描述 节点1认识网站：学习网站相关知识；掌握DW界面和其功能HTML是网页制作必备技能，主要介绍HTML概念、语法及常用基础标签 节点2
代码入门：HTML代码基础及CSS层叠样式表概述
css的盒子模型，更好的排版，进行页面布局。 介绍CSS语法、选择器、继承、层叠及优先级基础内容。 节点3知识进阶：表单制作、JavaScript、html5+css3表单标签的编写规范、嵌套规范以及相关属性的用法讲解；了解JavaScript语言，掌握它的语法、数据类型、基本算数和逻辑运算操作，方便我们开发中直接调用，进而实现更多功能 常见的html5标签；讲解css3的圆角、阴影、旋转、缩放、以及速率等属性值 节点4实战应用：入门网站制作；进阶网站制作；多平台网站设计战略搭建一个网页HTML结构，并掌握网布局相应知识与技巧。针对CSS中的基础布局以及经典的布局展开详细的讲解。对前面知识的综合应用，通过项目实战，更加熟练掌握基础知识，在实践中复习、巩固知识，提高综合能力。 本模块完成后学员具备完成简单静态页面能力，可以从事网页前台制作的工作，但是因为更深入的技术缺乏，无法胜任更高级的设计与开发工作，属于网页设计底层的工作能力要求程度 H5前端设计课程 节点学习内容 最终学习目标描述 节点1H5前端开发环境介绍：传统网站知识布局总结前端开发环境介绍：DreamWeaver、 Notepad++、HBuilder；HTML基础，CSS基础，CSS核心属性；CSS样式层叠继承，盒模型 节点2HTML5基础及案例练习HTML5提供了新的元素来创建更好的页面结构，告别传统代码不能更好语义化说明及页面新功能增加。新增标签介绍：<article>、<aside>、<figure>、<header>、<mark>、<nav>、<section> ... ...
移除标签介绍： <acronym>、<basefont>、<frame>、<strike> ... ...
节点3CSS3基础及案例练习CSS3基础属性介绍，做到用代码大量替换PS作图的工作，符合市场需求。边框属性：box-shadow、border-image；圆角：border-radius；背景：background-size、background-origin、background-clip；渐变：线性渐变、径向渐变；文本效果：text-shadow、box-shadow、text-overflow、word-wrap、word-break；字体：@font-face；... ... 节点4定位布局及CSS3特效应用：动画特效交互事件；响应式设计CSS3的特效使用，制作交互动画，让网站活起来。2D/3D转换：translate()、rotate()；过渡/动画属性：transition、animation；... ...三种定位布局方式，定位在交互上的应用。响应式设计： 就是我们日常说的手机网站或三屏合一网站。通过使用的设备环境（系统平台、屏幕尺寸、屏幕定向等）进行相对应的布局。最终达到网站的不同尺寸布局。 本模块会深入系统的学习H5+CSS3，学员完成后可以独立制作响应式网页设计，已经具备应对H5前端设计相应的工作，毕业后可以从事任何网页设计相关的工作 网页高级特效与框架开发 节点学习内容 最终学习目标描述 节点1
HTML5新标签：⽂档头和编码声明；基础标签；文本类标签；列表标签；语义化标签的应⽤；字符实体‘’表格标签；HTML5标签的兼容处理；HTML5标签SEO的作⽤；HTML5表单新特性；多媒体标签掌握HTML代码的规范编写，掌握HTML5新标签的特性，掌握多媒体在⻚⾯中的应⽤ 节点2
CSS3新特性：CSS的定义；CSS引⼊；CSS选择器；CSS3与CSS2的区别；长度单位；颜⾊单位；常用属性；CSS3属性；尺⼨；边框；背景；内补⽩；外补⽩；布局；定位；字体； 文本； 列表；表格；用户界⾯；多栏；2D变换；过渡动画；CSS3：圆⻆边框、边框九宫格特效、多图背景、动画、渐变和倒影、多列属性布局、服务器端字体，可以实现基础网页布局，⻚⾯样式定义及CSS，样式特效节点3
W3C盒子模型；div+css⽹页布局；弹性盒⼦HTML5兼容性处理；使⽤ HTML5布局元素的布局；Media Query响应式布局；
百分比⽹⻚布局；
掌握使⽤媒体查询技术及百分比布局，实现响应式页⾯，自动适应多种分辨率设备 节点4
PS切图；精灵图；CSS重制样式表reset；CSS、Normalize.css；CSS命名规范，CSS常用名；C掌握和设计人员对接，把一张PSD图⽚切成自⼰需要的图片样式，按照效果图实现网站 节点5JS的DOM操作；DOM 节点；DOM 方法；DOM 属性；DOM 访问；DOM 修改；DOM 内容；DOM 元素；DOM 事件；JS的BOM操作；Window；Screen；Location；History；Navigator；PopupAlert；Timing；Cookies；AJAX掌握JS操作⻚面及浏览器元素，培养动⼿制作特效、表单验证的能⼒，掌握AJAX⽹⻚异步交互 节点6JQuery简介；JQuery 安装jQuery CSS 操作；jQuery 选择器；jQuery 筛选；jQuery HTML文档处理；jQuery 事件；jQuery效果；jQuery Ajax；jQuery 其他操作；jQuery 插件；掌握jQuery实现⻚面特效，表单验证，及AJAX异步交互 节点7项目实训：PS切图；CSS重置样式表；⽹页规范兼容性；SASS；Compass 精灵图代码压缩；常⻅网站效果；rem相对⼤小布局；能够独⽴完成网⻚布局，页面效果，表单验证的一整套网⻚制作 本模块会深入学习html5+css布局和特效制作，掌握jquery使用和常用特效制作，掌握流行js框架开发项目流程，并能使⽤原⽣JS开发网站常见各类特效，熟练掌握Ajax 技术
03 高效的教学方法
先锋科教的教学方法
- 自编教学用书 01
- 02课程内容与岗位无缝对接
- 全程项目实战教学 03
- 04行业精英师资团队
- 严格的学习考核体系 05
- 06分阶式的教学方法
04 强大的设计师资团队
01
18位设计师
18位设计师，8种热门设计行业，2000+课时面授同步视频，网络直播课程，花更少的钱同步享受线下面授服务
02
18+位师资带队
18+位师资带队，8+年平均设计经验，3000+小时职业培训经验积累，6+个月设计课程学习
