一：html规范： 文件以<!doctype>首行顶格开始，声明charset
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>NEC：更好的CSS方案</title>
<meta name="keywords" content=""/>
<meta name="description" content=""/>
<meta name="viewport" content="width=device-width"/>
<link rel="stylesheet" href="css/style.css"/>
<link rel="shortcut icon" href="img/favicon.ico"/>
<link rel="apple-touch-icon" href="img/touchicon.png"/>
</head>
<body>
</body>
</html>
结构顺序与视觉设计保持一致，如果便于搜索引擎抓取可将重要内容在html结构顺序上提前，除了表现具有明显表格形式的数据，不选table布局 结构，表现，行为三者分离，避免内联，使用link引入css,放在head中 使用script引入js文件，放在底部。 保持良好的树形结构
<body>
<!-- 侧栏内容区 -->
<div class="m-side">
<div class="side">
<div class="sidein">
<!-- 热门标签 -->
<div class="sideblk">
<div class="m-hd3"><h3 class="tit">热门标签</h3> </div>
...
</div>
<!-- 最热TOP5 -->
<div class="sideblk">
<div class="m-hd3"><h3 class="tit">最热TOP5</h3> <a href="#" class="s-fc02 f-fr">更多»</a></div>
...
</div>
</div>
</div>
</div>
<!-- /侧栏内容区 -->
</body>
在大的模块之间用空行隔开，使模块更清晰。每一个块级元素都另起一行，每一行都使用Tab缩进对齐（head和body的子元素不需要缩进）。删除冗余的行尾的空格。 减少标签的嵌套，类名越少越好， 结构多时要有 开始注释：（文案两头空格）。 和结束注释：（文案前加“/”符号，类似标签的闭合）。 严格的嵌套 尽可能以最严格的xhtml strict标准来嵌套，比如内联元素不能包含块级元素等等。 正确闭合标签且必须闭合。 严格的属性 属性和值全部小写，每个属性都必须有一个值，每个值必须加双引号。 没有值的属性必须使用自己的名称做为值（checked、disabled、readonly、selected）。 可以省略style标签和script标签的type属性。 标签 语义 嵌套常见错误 常用属性（加粗的为不可缺少的或建议的） 常用的标签:
<a></a> 超链接/锚 a不可嵌套a href,name,title,rel,target
<br /> 换行
<button></button> 按钮 不可嵌套表单元素 type,disabled
<dd></dd> 定义列表中的定义（描述内容） 只能以dl为父容器，对应一个dt
<del></del> 文本删除
<div></div> 块级容器
<dl></dl> 定义列表 只能嵌套dt和dd
<dt></dt> 定义列表中的定义术语 只能以dl为父容器，对应多个dd
<em></em> 强调文本
<form></form> 表单 action,target,method,name
<h1></h1> 标题 从h1到h6，不可嵌套块级元素
<iframe></iframe> 内嵌一个网页 frameborder,width,height,src,scrolling,name
<img /> 图像 alt,src,width,height
<input /> 各种表单控件 type,name,value,checked,disabled,maxlength,readonly,accesskey
<label></label> 标签为input元素定义标注 for
<li></li> 列表项 只能以ul或ol为父容器
<link /> 引用样式或icon 不可嵌套任何元素 type,rel,href
<meta /> 文档信息 只用于head content,http-equiv,name
<ol></ol> 有序列表 只能嵌套li
<option></option> select中的一个选项 仅用于select value,selected,disabled
<p></p> 段落 不能嵌套块级元素
<script></script> 引用脚本 不可嵌套任何元素 type,src
<select></select> 列表框或下拉框 只能嵌套option或optgroup name,disabled,multiple
<span></span> 内联容器
<strong></strong> 强调文本
<style></style> 引用样式 不可嵌套任何元素 type,media
<sub></sub> 下标
<sup></sup> 上标
<table></table> 表格 只可嵌套表格元素 width,align,background,cellpadding,cellspacing,summary,border
<tbody></tbody> 表格主体 只用于table
<td></td> 表格中的单元格 只用于tr colspan,rowspan
<textarea></textarea> 多行文本输入控件 name,accesskey,disabled,readonly,rows,cols
<tfoot></tfoot> 表格表尾 只用于table
<th></th> 表格中的标题单元格 只用于tr colspan,rowspan
<thead></thead> 表格表头 只用于table
<title></title> 文档标题 只用于head
<tr></tr> 表格行 嵌套于table或thead、tbody、tfoot
<ul></ul> 无序列表 只能嵌套li
html应该使内容语义化： 内容类型决定使用的语义标签， 加强“资源型”内容的可访问性和可用性 在资源型的内容上加入描述文案，比如给img添加alt属性，在audio内加入文案和链接。 加强“不可见”内容的可访问性 背景图上的文字应该同时写在html中，并使用css使其不可见，有利于搜索引擎抓取你的内容，也可以在css失效的情况下看到内容。 使用实体： 常用HTML字符实体（建议使用实体）： 字符 名称 实体名 实体数
" 双引号 " "
& &符 & &
< 左尖括号（小于号） < <
> 右尖括号（大于号） > >
空格  
  中文全角空格 　
常用特殊字符实体（不建议使用实体）：
字符 名称 实体名 实体数
¥ 元 ¥ ¥
¦ 断竖线 ¦ ¦
© 版权 © ©
® 注册商标R ® ®
™ 商标TM ™ ™
· 间隔符 · ·
« 左双尖括号 « «
» 右双尖括号 » »
° 度 ° °
× 乘 × ×
÷ 除 ÷ ÷
‰ 千分比 ‰ ‰
避免css冲突或被覆盖，使用行内样式
<div style="width:100px;height:100px;"></div>
避免盒模型错误，doctype的不确定性，doctype影响最大的就是盒模型的解析，将盒模型拆分开来写，我们将原本要定义在某个div上的height和padding分别写到这个div和他的父元素或子元素上，
<div style="height:100px;padding:20px 0;"></div>
<div style="padding:20px 0;"><div style="height:100px;"></div></div>
<!DOCTYPE html>
这个文档生命是一个html5的文件，这个文件的标签是符合html5规范的， 前端优化：1：静态资源，制作雪碧图，减少请求返回的数据量，压缩HTML，CSS，JS文件，小图标用iconfont代替。 2页面渲染速度优化：css放在顶端，优先渲染，js放在底部避免阻塞，服务端如果用node的话，使用compress可开启压缩， var express = require('express'); var compress = require('compression'); var app = express(); app.use(compress()); vue框架特点：1：mvvm:双向数据绑定，2：组件化：在vue中所有的都是组件化，3模块化：。 应用：可以用在webapp，spa(单页面应用) 面试：h5新特性：语义化更好的内容元素，article,footer,header,nav,section,,表单控件：calendar,date,time,email,url,search,video,audio, 数据存储：本地离线存储数据localstorage长期存储数据，浏览器关闭后不丢失，sessionStorage:存储的数据，浏览器关闭后自动删除 7,8号 vue组件的封装，组件懒加载，打包优化 https:是浏览器和服务器建立的加密通道，处理网络中的应用层， 组件懒加载原理：配置webpack,按需引入 模块化将复杂系统分解成单一可管理，解耦成可替换模块，模块之间互不影响，可维护性高 require与import的区别 require是amd规范，import是nodejs规范
