1. 前端的SEO(搜索引擎优化)
- 尽量使用语义化标签,语义化HTML结构代码,利于搜索引擎理解页面
- 非装饰性< img />标签必须加上"alt"属性加以说明,alt属性与title属性区别:title鼠标移入图片会显示,不管是否显示图片;alt在图片无法正常加载时显示 搜索引擎会重点分析
- 重要的HTMl代码放在最前;搜索引擎抓取HTML结构代码顺序是从上往下的,保证重要内容一定会被抓取
- < title>标题内容,保证每个页面title内容不一样
- < meta description>描述标签把页面内容高度概括,核心概括一下
- < meta keywords>列举页面重要关键字即可,尽量不要过分列举
- 核心内容不要用JS输出,因为爬虫不认识
- 少用iframe,理由同上
2.H5新特性
- 新增语义化标签:
<header></header> <footer></footer>
<main></main> <nav></nav>
<article></article> <section></section>
<aside></aside> <dialog></dialog>
2.本地离线存储:
- localStorage:本地存储,没有过期时间,可以设置时间段
- sessionStorage:会话级存储
- indexedDB: 浏览器数据库,存储空间大,一般不少于250MB,甚至没有上限,如果要本地存储的数据很大可以考虑indexedDB
3.音频功能:视频媒介元素video,播放器元素audio
4.图形绘画 canvas
5.表单新增功能:
- placeholder属性、autofocus属性、required属性、min和max属性、pattern属性(描述一个正则表达式用于验证input元素的值)
- type属性值为email、number等
- 以往表单中等input中的name和value要随着form表单一起提交,form表单必须包裹着input,而现在可以单单在input上绑定一个form属性就可以提交了
6.WebSocket:
WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。在WebSocket API中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求,连接建立以后,客户端和服务器端就可以通过 TCP 连接直接交换数据。当你获取 Web Socket 连接后,你可以通过 send() 方法来向服务器发送数据,并通过 onmessage 事件来接收服务器返回的数据。
7.拖放API