DIV用于布局，Table用于显示数据，这是现在最基本的设计原则。

 

　　1.1 Table 布局

 

　　缺点：

 

　　1、 Table主要呈现数据和处理数据，如果用于布局，使SEO优化（搜索引擎优化）较差；

 

　　2、 不利于网站维护；

 

　　3、 标签嵌套层级较多，代码冗余量较大。

 

　　优点：

 

　　1、 容易上手；

 

　　2、 table在不同浏览器中都得到了很好的兼容；

 

　　3、 可以形成复杂的变化，简单快速。

 

　　1.2 DIV+CSS 布局

 

　　优点：

 

　　1、 有利于SEO优化，提高搜索引擎对网页的搜索效率；

 

　　2、 有利于网站维护和改版；

 

　　3、 符合W3C标准，代码结构清晰，结构、样式和行为分离；

 

　　4、 用只含结构化内容的 HTML代替嵌套的标签，嵌套层级较少，代码量少，加快页面的加载速度。

 

　　缺点：

 

　　1、 不容易上手，操作比较复杂；

 

　　2、 兼容性较差；

 

　　1.3 区别

 

　　DIV+CSS：布局简洁明了，使用方便，相对于表格来说更容易搜索的到，不易出现错误或者不可控，样式繁多，易控易修改。

 

　　Table：表格布局不建议使用，布局不容易调整和规划，容易失控，大部分都不能使用太多样式，也许你会因为边框而烦恼。

 

　　狭义

 

　　1) HTML4.0的升级版本 2) HTML5+CSS3+ 新增JS API接口 3) W3C制定的关于HTML技术约定的新规范

 

　　广义

 

　　1) HTML5的代名词 2) 行业的技术标准 3) 当前新技术的代名词

 

　　主要分类

 

　　从HTML5技术的角度来说，我们将 HTML5技术分为五大类，分别是：

 

　　1) 新增标签以及属性；

 

　　2) CSS3 的新特性；

 

　　3) Canvas 绘图；

 

　　4) JavaScript 的新增API；例如—>input获取手机相册，手机定位获取经纬度，摇一摇查看是会否晃动

 

　　5) 移动端。

 

　　3.1 网站的基本组成

 

　　HTML + CSS + JavaScript(JS)

 

　　结构 + 样式 + 行为（动作）

 

　　3.2 网站开发职位

 

　　前端开发工程师——HTML+CSS+JS+切图

 

　　网页开发工程师——同上

 

　　HTML5开发工程师——HTML+CSS+JS+切图，会更多接触到H5的新增特性和功能

 

　　页面重构师——主要是HTML+CSS，少量的JS。

 

　　JS开发工程师——主要书写JS，稍微接触HTML和CSS。

 

　　网站首页的命名为：index.html；

 

　　4.1 文件目录结构规范

 

　　uxd（根目录）—>index.html（首页）、css（存放css文件）、js（存放js脚本）、images（存放图片）、cn（其它子页面）

 

　　4.2 命名规则：(详见前端开发规范)

 

　　例如：广告——banner

 

　　4.3 文档类型

 

　　html4.0中文档类型声明3种：严格型、过渡型、框架型;

 

　　HTML5的文档类型声明1种：html。

 

　　4.4 meta——元信息

 

　　http-equiv content

 

　　charset声明，要放在title上面，以免title出现乱码;

 

　　4.5 网页基本组成

 

　　网页基本组成