web语义化

zhaosnow 2015-03-03

web语义化是指能够让机器读懂语言。

我所了解的web语义化包含两个方面:html标签语义化合css类名语义化。

html标签语义化化很明显,就是html的标签代表的含义,比如:

    h语义: header(标题)

     div 语义:Division(分隔)

     span 语义:Span(范围)

     ol 语义:Ordered List(排序列表)

     ul 语义:Unordered List(不排序列表)

     li 语义:List Item(列表项目)

     …………

为什么要强调html的语义化?为了更快地让搜索引擎搜到查找的内容。比如以下代码:

    <div id='title'>我是标题1</div> 

    <h1>我是标题2</h1> 

如果搜索引擎在查找标题,那它就会更快更准确地找到“我是标题2”,因为搜索引擎很容易读懂h标签的含义

css类名语义化

   我们常见的css类名有 left-content   right-bar等通过方位来命名的,如果我想把right-bar的样式用到页面的left,就意味着要改一下类名;这种命名方式是结构化;那如何使用语义化?常见的css语义有:

            头:header

            内容:content

            页脚:footer

            导航:nav

            子导航: subnav

            侧栏:sidebar

            菜单:menu

            ……

    如果把right-bar直接改成sidebar,我就不用纠结这个样式用的位置了 ,sidebar就是css类名的语义化

举了两个很简单的例子,不知道说明问题了没有

推荐文章:  http://studio.ewe.com.cn/?p=455  

                     http://ued.ctrip.com/blog/?p=2735     

相关推荐