《
思考Web站点设计对类以及id的命名方式》文章地址：http://www.tfxk.com/wangyesheji/jianzhanjingyan/0302342052013.htm
Andy Clarke剖析了40份由推重标准化Web设计理念的开发人员所设计的Web站点的源代码。尽管类以及id名称很不同一，然而仍是发现了一些频繁出现的常用名称。这里给出了最常用类/id名称的示例列表：
--> [
网站建设之]思考Web站点设计对类以及id的命名方式
top-panel
horizontal-nav
left-side
center-column
right-col
但问题是这样的名称同页面内容的特定抒发方式相关系。这些命名参考了某种特定页面布局中的页面元素位置，因此在这样的布局之外使用就会显得不适合甚至造成理解混乱。同时，这些命名不波及文档内容的结构,怎样让用户记住你的产品,用设计宣传品牌。因此，下面给出了对CSS类以及ID命名更好的办法。
结构化的标记象征着表白方式/位相信息同内容的完整分别&mdash,怎样精简用户界面;&mdash,怎样用CSS解决英文单词的自动换行的问题;这其中包含出当初标记（markup）中的类跟id名称。
直观命名
Tag：设计理念 id 设计 web 设计理念 id 设计 web
当在设计Web页面以及须要对一个Div进行标识的时候，最天然的主意就是使用可以描写元素所在页面地位的词汇来对其命名。这种方式使得类以及id的名称如下面所示：
一些命名通例
可以依照如下所示的结构化方式来对类以及id名称命名：
branding
main-nav
subnav
main-content
sidebar
这些名字同直观命名方式一样无比易懂，但他们描述了页面元素的作用而非位置。这使得代码更加合乎使用纯洁的结构化标记（structural markup）的初衷，即开发人员可以在不改变标记的情形下对各种各样媒体下的显示格式进行处理。
结构化命名
这些是CSS以及XHTML类和id的有效命名方式。这些词汇简单并且可能使人顾名思义，因此满意了标识页面元素以及相应的CSS款式的需要。
header
content
nav
sidebar
footer
有标记的相干信息都是用来描述文档的结构而不是外观。这样的特色使得咱们可以通过简略的转变CSS的方式来对不同外观格式下的内容（content）以及标志（markup）进行重用。当你懂得这种方式时，很轻易就可以发明采用页面位置来为类以及id命名的方式在处置如音频（audio）等外观格式上显得十分分歧适。因而，应该依据在文档中的使用目标而非涌现位置来对类以及id进行结构化命名。
即便你不盘算在其余的媒体上对Web页面进行格局修正，应用构造化命名方式还能够辅助你在日后的站点进级或从新设计中更为轻松,怎样提高网站转换率？。例如，结构化命名防止了当一个div同id right-column挪动到页面左边后所带来的凌乱。对div sidebar的采取这样的命名方法就显得更加恰当，由于无论它呈现在页面的哪一边，这个名字依然对开发职员来说直观易懂。
这些常见的类以及id名称是否标记着一种尺度的出生或是广泛接收惯例的构成呢？只管这是我所盼望的,怎样将社区类网站头条做出彩，但我并不这么以为。我确实愿望可以看见一整套对我们天天都可以看到的常用页面元素的命名标准。同时，使用标准化的命名方式可以使得寻找页面元素以及对Web站点升级带来便利，尤其当需要在由不同开发人员在不同时光所开发站点中换来换去工作的时候。
Web开发者（也就是你）可以通过创立CSS类及id名称并使用这些名称来对Div以及其他的页面元素、标签进行标识。对开发人员来说，在命名重新定义XHTML标记（tags）的css selectors时，必需保障其与预约义的标记正确匹配，但就类以及id抉择器名称而言，则仁者见仁，智者见智。然而为所欲为的为这些类以及id命名则并不是个好的习惯。
在浏览了由Andy Clarke（of Stuff and Nonsense and All That Malarkey）以及Eric Meyer所撰写的对于css类以及id命名标准的系列文章之后，我开端思考在本人的Web站点设计进程中对类以及ids的命名方式。
(责任编辑：网站建设)
思考Web站点设计对类以及id的命名方式相关文章