当前位置: 首页 > 图文教程 > 网站运营 > 建站经验 > Web 设计实现干净代码的12条定律(多图)

建站经验
建站参考:15种网站最差的用户体验
参考:网站制作过程中把握的几点
控制搜索引擎访问和索引你的网站
站长访谈:访中国最大Web开发社群站长—蓝色
1个月行业主关键词到首页SEO实战(Yahoo和Google篇)
总结参考:有利于用户体验和SEO的TAG写法
大型社区网站提高用户体验的10个细节
针对CMO来说,互联网内容的十宗罪
探讨行业网站应该具备的一些基本指标
WordPress对搜索引擎更为友好的技巧和方法
网站编辑:怎样将seo融入到编辑的日常工作中?
复杂网站重新设计的简单方法
详细讲解网站制作中关于链接的制作方法
认识网络营销,中小企业开展网络营销的建议
SEO搜索引擎优化给程序留下什么?
影响网站的搜索引擎排名的几个因素
全世界的专家给网站开发人员的一些建议
浅谈商业网站和个人网站的区别
个人站长:网商和博客是中小站长头上的两把利刃
搜索优化:使用Google工具条有助于网站收录

建站经验 中的 Web 设计实现干净代码的12条定律(多图)


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-17   浏览: 106 ::
收藏到网摘: n/a

本文讲述了12个实现干净 Web 设计代码的定律,适合于任何从事 Web 设计的人。

1. Strict DOCTYPE

 

要做就做对的。不管是 HTML 4.01 还是 XHTML 1.0,它们都提供 Strict 模式,使用 Strict 模式可以保证我们的代码不隐藏任何错误。

2. 字符集声明,特殊字符进行编码处理

 

字符集声明应当放在 hea 部分的最前面,以便让浏览器知道如何显示网页中的所有内容,包括标题。另外,一些特殊字符,如 & 最好用 & 代替,这是一种最安全的方法。

3. 恰当的缩进

 

缩进不会影响网页的渲染,但会明显改善阅读源代码时的体验。缩进没有特定的规则,但始终保持一致是个好习惯。

4. 将 CSS 和 JavaScript 放在外部文件中

 

将 CSS 和 JavaScript 放在外部文件中引用,不仅减低单个网页的尺寸,而且意味着其它网页也可以共用这些代码,另外,浏览器的缓存机制可以很好地降低对相同代码的重复下载。

5. 正确地嵌套 Tag 标签

 

如下图,第一行代码中, h1 标签嵌套在 a 标签中,尽管多数浏览器会正确渲染,但这不是好的习惯, 标签是 block 对象,而 是 inline 对象,inline 对象不应该容纳 block 对象。

6. 消除不必要的 div

 

div 常被滥用(尤其在我们现在所处的 DIV+CSS 神话中 - 译者),人们希望把任何东西都放在 div 中以便为它们分配 CSS 式样,这种滥用会导致的臃肿。

7. 使用更好的命名规则

 

如下图,Cat 的 CSS 类被命名为 red italic,暗示着 Cat 使用红色斜体,如果你想将 Cat 改成兰色的粗体呢?

8. 尽量使用 CSS 控制文字的排版

 

如下图所示,不要直接使用大写,用 CSS 对这些文字排版方面的格式进行控制,这样会更灵活。

9. 为 body 分配独立的 class/id

 

为 body Tag 分配一个独立的 class/id,可以很好地定位页面中任何对象,因为页面中所有对象都位于 body 中。

10. 验证

 

无需多言,你应当尽可能对网页的代码进行验证,尽管有些代码错误浏览器能自动更正,但有些错误是会带来不好的后果的,尤其当你位于 Strict 模式下。即使什么都不为,看到那个绿色的 W3C 验证标志至少可以让自己舒服一些。

W3C 验证是否通过并不一定要什么拘泥,Web 设计中存在更多的考量,只拘泥 W3C 验证结果,可能影响一些更重要的因素,比如,IE6 在 W3C 标准方面存在不少 BUG,如果你为了100%通过 W3C 验证而宣布自己的网站不支持 IE6,至少在国内会得不偿失的 - 译者

11. 合理的结构次序

 

将网页结构保持一个合乎逻辑的次序。

12. 尽你所能

 

如果你从零开始写,保持以上的原则当然要容易的多,如果要修改旧的代码,将会很痛苦,一些 CMS 系统拙劣的编码会让你陷入泥沼,或者你的网站规模宏大要改动的东西太多,不管怎样,始终保持良好的习惯非常重要。