Web入门者必看的HTML代码编写的30条军规(2)

11、使用H1 – H6标签

笔者建议你在网页中使用其中全部六种标记，虽然大部分人只会用到前四个，但使用最多的H会有很多好处，比如设备友好、搜索引擎友好等，不妨把你的P标签都替换成H6。

12、如果是博客，那把H1留给文章标题

今天笔者在Twitter上发起一次讨论：是该把H1定义到LOGO上还是定义到文章标题上，有80%的人选择了后者。

当然具体如何使用要看你的需求，但我建议你在建立博客的时候，将文章题目定为H1，这对搜索引擎优化(seo)是非常有好处的。

13、下载ySlow

在过去几年里，雅虎的团队在前端开发领域做了许多伟大的工作。前不久，它们发布了一个叫ySlow的Firebug扩展，它会分析你的<网页，并返回 一个“成绩单”，上面细致分析了这个网页的方方面面，提出需要改进的地方，虽然它有点苛刻，但它绝对会对你有所帮助，强烈推荐—— ySlow（http://developer.yahoo.com/yslow/）！

14、使用UL列表布局导航菜单

通常网站都会有导航菜单，你可以用这样的方式定义：

<div id="nav"> <a href="#">Home </a> <a href="#">About </a> <a href="#">Contact </a> </div>

如果你想书写优美的代码，那最好不要用这种方式。

为什么要用UL布局导航菜单?——因为UL生来就是为定义列表准备的。

最好这样定义：

<ul id="nav"> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </ul>

15、学会怎样对付IE

IE一直以来都是前端开发人员的噩梦！

如果你的CSS样式表基本定型了，那么可以为IE单独建立一个样式表，然后这样仅对IE生效：

<!--[if lt IE 7]> <link rel="stylesheet" type="text/css" media="screen" href="path/to/ie.css" /> <![endif]-->

这些代码的意思是：如果用户浏览器是IE6及以下，那这段代码才会生效。如果你想把IE7也包含进来，那么就把“[if lt IE 7]”改为“[if lte IE 7]”。

16、使用一个好的代码编辑器

不论你是Windows还是Mac用户，这里都有很多优秀的编辑器供你选择：

Mac 用户：

1、Coda（http://www.panic.com/coda/）

2、Espresso（http://macrabbit.com/espresso/）

3、TextMate（http://macromates.com/）

4、Aptana（http://www.aptana.com/）

5、DreamWeaver CS4（http://www.adobe.com/products/dreamweaver.html）

PC 用户：

1、InType（http://intype.info/home/index.php）

2、E-Text Editor（http://www.e-texteditor.com/）

3、Notepad++（http://notepad-plus.sourceforge.net/uk/site.htm）

4、Aptana（http://www.aptana.com/）

5、DreamWeaver CS4（http://www.adobe.com/products/dreamweaver.html）

17、压缩前端代码！

Javascript 压缩服务：

1、Javascript Compressor（http://javascriptcompressor.com/）

2、JS Compressor（http://www.xmlforasp.net/JSCompressor.aspx）

CSS Compression Services：

1、CSS Optimiser（http://www.cssoptimiser.com/）

2、CSS Compressor（http://www.cssdrive.com/index.php/main/csscompressor/）

3、Clean CSS（http://www.cleancss.com/）

18、缩减，缩减，缩减

回望我们大多数人写的第一个页面，一定会发现严重的 “DIV癖”( divitis )，通常初学者的本能就是把一个段落用DIV包起来，然后为了控制定位而套上更多的DIV。—— 其实这是一种低效而有害的做法。

网页写完后，一定要多次回头检查，尽量的减少元素的数量。能用UL布局的列表就不要用一个个的DIV去布局。

正如写文章的关键是“缩减，缩减，缩减”一样，写页面也要遵循这个标准。

19、为所有的图片加上Alt属性

为图片加上alt属性的好处是不言而喻的 —— 这样可以让禁用图片或者使用特殊设备的用户无障碍得了解你的王爷信息，并且对图像搜索引擎友好。

firefox不支持显示图像Alt属性，可以加入title属性：

<img src="cornImage.jpg" alt="帕兰映像" title="帕兰映像" />

20、学会熬夜

我经常不知不觉的学习工作到凌晨，我认为这是个很好的状况。

我的“啊～哈!”时间( “AH-HA” moments，指柳暗花明或豁然开朗的时刻)通常都发生在深夜，比如我彻底理解JavaScript的“闭包”概念，就是在这样一种情况下。如果你还没有感受过这种奇妙的时刻，那就马上试试吧！

PS：博客搬家了，以后不再 CSDN 更新了，见谅。最新博客地址：http://www.cnblogs.com/yjzhu/