一、什么是语义化
语义化，顾名思义，就是HTML结构，是用相对应的有一定语义的标签表示的，因为HTML本身就是标记语言。不仅对自己来说，容易阅读，书写。别人看你的代码和结构也容易理解，甚至对一些不是做网页开发的人来说，也容易阅读。那么，我们以后再开发的过程中，一定要注意了，尽量使用官方的有语义的标签，不要再使用一堆无意义的标签去堆你的结构。
怎么知道，自己的页面结构是否语义化，那就要看你的HTML结构，在去掉CSS样式表之后，是否，依然能很好的呈现内容的结构，代码结构。也就是说，脱掉css的外衣，依然头是头，脚是脚。赤裸裸的完整的一篇文档。这也就是，语义化之后文档的效果。
二、为什么要语义化
1、方便其他设备解析，以有意义的方式来渲染网页。
2、在没有CSS的情况下，页面也能呈现出很好的内容结构、代码结构。
3、有利于SEO和搜索引擎建立良好的沟通，有助于爬虫抓取更多的有效信息。
4、便于团队的开发和维护，语义化更具可读性，可以减少差异化。
5、有利于提高用户体验。
三、对京东注册页面的HTML语义化案例分析
如图可以将注册页面分为三个部分：头部区域、注册区域、尾部区域。
头部区域：就是一个div盒子，设置一个底边框，然后盒子里面再给一个div放置logo图片链接。
注册区域：
1、首先是注册区域的大的div盒子，设置盒子的高度和外边框。
2、其次最上面是一个h3标签，设置它的高度，底边框，背景颜色，内边距，行高和字体大小，头部的最右边是一个em标签，里面包含一个a标签，设置向右浮动和字体大小。
3、中间区域是一个表单，表单中是ul>li结构，每一行文字即被一个li标签包含，每一个li标签中包含一个label标签，用来放置“手机号：”“短信验证码：”“登录密码”“确认密码”等字段，一个input输入框，有的li还设置一个span标签，用来存放对用户的操作提示。其中的“安全程度”一行，也是一个小li，弱、中、强被3个em标签包裹，设置li的左间距，设置弱、中、强三个em的内间距的值撑开em标签，然后分别给em设置背景颜色即可。同意协议那一行，设置checkbox和a的样式即可。最后一行是一个提交按钮，设置宽度高度、背景颜色等。
尾部区域：设置两个p标签包裹文字，设置居中，行高，换行等即可。
