标签、元素与SEO

一、标签与元素

1）HTML中标签：容器标签与文本标签；CSS中的块级元素与行内元素 行内块元素

　　*  容器标签：简单来说就是能够嵌套其他所有标签

　　*  文本标签:只能包含简单的文本，图片，超链接等

2）CSS中元素：块元素、行内元素、行内块元素

　　*  块元素：与容器标签相对应。特点:独占一行；可以设置宽高（不设置时默认与父元素相同）。

　　*  行内元素：与文本标签相对应。特点：不独占一行；不可以设置宽高，默认由内容撑开。

　　*  行内块元素：特点：既可以设置宽高又不独占一行。　

注意：一般来说块元素都是容器标签，除了h系列，p，dt（不能嵌套块元素）

二、CSS的显示模块与转换

　　display:block inline-block(可以设置宽高，又不会独占一行)  inline

三、H5中的标签语义化

语义化：根据内容的结构选择不同的标签，便于开发中阅读，使其代码更加优雅，也有利于浏览器爬虫和更好的解析

在H4中我们常常使用见名知意的类来定义容器标签，用来构建页面的不同位置。但是在H5中推出了语义化的标签例如：header nav section article footer  aside

语义化优点：

　　1）即使在没有CSS的情况下，也能读出基本的代码结构

　　2）便于后期的维护

　　3）利于浏览器解析（屏幕阅读器等）有意义的方式来渲染页面

　　4）利于SEO（Search Engine Optimization）：就是利用搜索引擎的规则来提高其自然排名

　　　　网络爬虫就是依赖标签来确定上下文的内容及关键字，使用语义化的标签能够更好的与浏览器沟通从而利于SEO、