晚上一直在看一个网站的页面布局、结构，样式等内容，觉得还是很有收获的，顺便记录下。

1、目录结构。在访问量很大的情况下，目录越深读取文件的时间就越长，页面的访问速度就会受到影响，对于一些网速慢的用户尤为如此。所以在架构网站页面的始初，就应该规划好整个文件的目录结构，这样也便于后期维护。我日常工作的目录结构为：首页等一级页面文件放在根目录，相应的根目录下还有images、comom和temp这几个目录。images下存放图片，因为图片的读取时间是最长处的，所以这个目录建在根目录下；common下再建css文件夹和js文件夹分别存放作为外调的css和js文件；如果css文件比较多，最多可再分一级；temp作为临时性文件的存放目录。

2、标签嵌套结构可以更优化，减少不必要的嵌套。由于每个人有不同的书写方法，造成页面冗余代码较多，且部分标签中各属性值被人为手动换行，这样也不利于搜索引擎的抓取。举个例子，table标签的使用，尽量使用css来控制样式，而不是在页面中写满自带的那些垃圾属性。

3、对web标准的执行力。web标准对（x）html标签的使用做了很明确的规范，尤其是在xhtml 1.0下，须严格按照标准执行。经常容易被忽视的包括：标签和属性名称没有大写、属性值必须用“”括起来、图片alt属性的描述等。

4、标签语义化。相信作为一名前端工作者，标签语义化的好处应该很了解，但往往在实际工作过程中却很难彻底贯彻执行。比如<p></p>的使用，我见过有好多表单结构用P来格式化，很难理解，这怎么讲也不能是个段落吧？还有一个之前我改过的结构，其实很简单，就是一个表，如图：

他写的结构：

很无语，这标签使用率还真高！其实，我觉得一个table就搞定了，不用搞得那么复杂吧。。。

5、最后说下关于css样式的命名问题。随着对web标准的理解和应用，现在，越来越觉得页面制作过程中，css样式的命名是最耗费时间去想的，特别在团队合作中，尤为重要。之前，自己也总结过关于这方面的东西，总的原则是要语义化，避免结构化。在有些很大的页面中，大的框架，语义化命名没有问题，像wrapper、header、logo、nav、footer等都很好理解。但随着结构的细化，一些小的东西往往是很难明确地用语言表达明白，就像标签中也存在没有任何意义的div和span一样，给这些结构来定义就需要很费劲，因为你想使整个页面都保持良好的结构和可读性。随手拿来一个小效果，文字、背景和修饰图标。如果文字个数不固定，背景是不能写死的，需要两层结构来嵌套；作为修饰用的小图标不能写在背景中需单独定义，现在就给他的样式命个名吧。blue_arrow？bottom_arrow?center_arrow?还是只用arrow?个人觉得都不好，也许我已经陷入到这里面去了，你觉得用什么好呢？或许干脆指定标签得了。。。
举这个小例只是想说明问题，因为在两个（或以上）的成员一起写页面的时候，最后是要整合的，如果命名没有规律，想到什么就用什么？那最后整合起来的页面一定得返工。我在页面中见过<div class="l"></div>。当时楞了3秒钟，脑子里第一个念头是样式命名什么时候能用数字了？再仔细看，原来是字母“L”，很头大，真佩服他能想出来。。。

胡乱写了一大堆，将脑子里一些不成形的东西先晒出来，还需要时间来梳理。很多事情，其实就是一个从简单到复杂再回归简单的过程。至于这个过程如何把握，关键就看你自己了。。。