标签语义化
09月 5th, 2008 — Dreamer前两天参加了公司组织的一个WD培训，有一节课讲了标签语义化，听了之后感觉特别有用，更正了我以前对 HTML 和 CSS 的错误看法。
首先说明的一点是，人可以通过视觉的划分判断内容的语义,搜索引擎看到的只是代码。搜索引擎只能通过标签来判断内容的语义。 以前我真的没有怎么重视过搜索引擎，现在开始比较在意了，因为页面的很大一部分流量是来自搜索引擎的，要使页面尽可能地对搜索引擎友好，所以就要尽可能地使标签语义化。
以前以我对web开发的粗浅理解，觉得写一个好的符合标准的页面只需要把结构和表现分离，然后不要使用table，font等标签就行了，至于通篇都是div我也不会觉得有什么问题，因为CSS很强大。但是，所有的标签都是有自己的语义的，下面给出一部分标签的语义：
div 语义：Division（分隔）
span 语义：Span（范围）
ol 语义：Ordered List（排序列表）
ul 语义：Unordered List（不排序列表）
li 语义：List Item（列表项目）
…………
如果无视标签语义和默认样式，所有标签都用div，其实也是可以写出来视觉效果很好的页面，只要你灵活运用CSS。但是那样的话虽然视觉上达到了要求，但是整个页面一点语义都没有，搜索引擎还是看不懂。所以，要记住：
结构(html)才是重点，样式(css)是用来修饰结构的。所以，要先确定html，确定标签，再来选用合适的css。
一般来说，所有的标签都会有一个默认的样式，所以一个简单的判断网页标签语义是否良好的方法就是：去掉样式，看网页结构是否组织良好有序，是否仍然有很好的可读性。
另外，值得重点提及的是h标签，h标签的语意是标题，搜索引擎对这个标签比较敏感，特别是h1,和h2。一个语义良好的页面，h标签应该是完整有序没有断层的。也就是说，要h1,h2,h3,h4这样推下来，不要h1,h3,h4，漏掉h2。一个结构良好的网页，h标签可以组织起一个网页的大纲。
以上这些东西都是WD的工程师阿当讲的，我受益匪浅，加深了对html的理解。HTML 虽然很简单，但是要用好也是很不容易的。
本文链接: http://www.zhuoqun.net/html/y2008/1096.html 转载请注明出处，谢谢。
TrackBack引用地址：http://www.zhuoqun.net/html/y2008/1096.html/trackback
其实当html和css早期刚出来时，就已经明确了目的，html是内容，css是样子。
但不知为什么，早期的web开发，特别是由于dreamweaver的应用过多，html就成了布局结构的代名词，css也没有了原先的意义，只是以html标签的属性style体现它微弱的意义，但更恶劣的是到处充斥着table布局，使代码极其难懂，更可怕的是，一但确定写完，后期是很难更改的，更不用说换皮了。
后来人们为了方便改变样貌，而使数据和样式尽量分分，即div布局+css.这也是目前所提倡的方式。但又出现了极端的情况就是，一个页面很难再找到div之外的标签。
所以现在又提出了回归html的本来意义，每个标签都有自己的语义。并不是只有div可以接受样式。一个合格的web前端应该是一个结构清晰的html文件加上一个结构清晰的Css文件。
但在中国有点可悲，大多数web开发人员，或者称为做着web开发这部分的人，在这方面是有所不足的，更可悲的是还有部分人对此不屑一顾（他们更愿意做java的增删改查）。孰不知要掌握好css，html，这三方面不是很容易，但他们还认为掌握好了，也行是因为入门简单了，只要看一下就能写点东西。
如果对css有了了解，可以看看这个网站http://www.csszengarden.com/,禅意花园。简单来说这是一个推广正确使用css的组织，它提供了一个简单的语义丰富的html文档，这个文档是不允许修改的，你可以针对这个文档编写css，让它呈现出不同的风格。你可以向他提供你的作品（必须原创），现在大概收录了两百多幅作品，我曾经一口气把这些作品看完，当然只是简单看了一下，帮助还是不小的。他们还出了一本《禅意花园》的书，我看过，没有太多技术内容，大多是讲设计理念的，如果有兴趣，也可以看一下，全彩的。
最后，再说一句，羡慕！还有这样的讲座，可以少走很多弯路！所以一个好的环境是可以帮助一个人更好的成长的！但现在大多数的公司（中小型）的开发人员都是自己的在摸索，更可悲的是有些公司的开发人员根本没时间，只是一天到头的加班！（注：有些公司的老板是不能看到自己的员工在公司学习的）
我也是好不容易盼到了一次比较正规的培训，有培训一般我都是会积极参与的 ：）
我认为培训是很好的，特别是公司自己的培训。现在学习知识无非是书本和网上，但书本上的总慢了一拍，网上的太杂，要淘。很难系统化。而公司自己同事的经验，往往就是最前战线的经验，很实用，应该说都是精华！
浏览器也是一个用户，只是它通过不同的角度去查看我们的网页，不过它可比一般的用户细致多了。 我最近也准备总结一下所有语意化的html标签。
能不能教教我!每次看你的文章都收益匪浅。
[...] 文章来自：http://www.zhuoqun.net/html/y2008/1096.html 人可以通过视觉的划分判断内容的语义,搜索引擎看到的只是代码。搜索引擎只能通过标签来判断内容的语义。 [...]