2010/11/04 3644 Views
简单说,所谓语义化就是在CSS中不会使一个HTML元素看起来像另一个HTML元素,比如用<div>来代替<p>标记段落,或者用
来代替。
语义和默认样式的区别:所谓默认样式是浏览器设定的常用tag的表现形式,比如看到<strong>就知道是强调,<hx>看起来就是标题。
语义化的好处:最主要的就是对搜索引擎的友好,有了良好的结构和语义你的网页内容自然容易被搜索引擎抓取,你网站的推广便可以省下不少的功夫。
所有的标签都是有自己的语义的,比如下面标签的语义:
div 语义:Division(分隔)
span 语义:Span(范围)
ol 语义:Ordered List(排序列表)
ul 语义:Unordered List(不排序列表)
li 语义:List Item(列表项目)
结构(html)才是重点,样式(css)是用来修饰结构的。所以,要先确定html,确定标签,再来选用合适的css。
一般来说,所有的标签都会有一个默认的样式,所以一个简单的判断网页标签语义是否良好的方法就是:去掉样式,看网页结构是否组织良好有序,是否仍然有很好的可读性。
另外,值得重点提及的是hx标签,hx标签的语意是标题,搜索引擎对这个标签比较敏感,特别是h1,和h2。一个语义良好的页面,h标签应该是完整有序没有断层的。也就是说,要h1,h2,h3,h4这样推下来,不要h1,h3,h4,漏掉h2。一个结构良好的网页,h标签可以组织起一个网页的大纲。
还有一点要提的就是语义化容易被有视觉障碍用户使用的屏幕阅读器识别。。搜索引擎跟屏幕阅读器差不多。。同时,使用语义化HTML标记网页,你就可以制作更好的、针对残疾人和搜索引擎的可访问性的网页。好的语义标记有助于搜索引擎判断网页的话题,如果结构也好的话,你的网站就会排在前面啦!
语义和默认样式的区别:所谓默认样式是浏览器设定的常用tag的表现形式,比如看到<strong>就知道是强调,<hx>看起来就是标题。
语义化的好处:最主要的就是对搜索引擎的友好,有了良好的结构和语义你的网页内容自然容易被搜索引擎抓取,你网站的推广便可以省下不少的功夫。
所有的标签都是有自己的语义的,比如下面标签的语义:
div 语义:Division(分隔)
span 语义:Span(范围)
ol 语义:Ordered List(排序列表)
ul 语义:Unordered List(不排序列表)
li 语义:List Item(列表项目)
结构(html)才是重点,样式(css)是用来修饰结构的。所以,要先确定html,确定标签,再来选用合适的css。
一般来说,所有的标签都会有一个默认的样式,所以一个简单的判断网页标签语义是否良好的方法就是:去掉样式,看网页结构是否组织良好有序,是否仍然有很好的可读性。
另外,值得重点提及的是hx标签,hx标签的语意是标题,搜索引擎对这个标签比较敏感,特别是h1,和h2。一个语义良好的页面,h标签应该是完整有序没有断层的。也就是说,要h1,h2,h3,h4这样推下来,不要h1,h3,h4,漏掉h2。一个结构良好的网页,h标签可以组织起一个网页的大纲。
还有一点要提的就是语义化容易被有视觉障碍用户使用的屏幕阅读器识别。。搜索引擎跟屏幕阅读器差不多。。同时,使用语义化HTML标记网页,你就可以制作更好的、针对残疾人和搜索引擎的可访问性的网页。好的语义标记有助于搜索引擎判断网页的话题,如果结构也好的话,你的网站就会排在前面啦!
Leave a comment