13.下载ySlow
在过去几年里,雅虎的团队在前端开发领域做了许多伟大的工作。前不久,它们发布了一个叫ySlow的Firebug扩展,它会分析你的网页,并返回 一个“成绩单”,上面细致分析了这个网页的方方面面,提出需要改进的地方,虽然它有点苛刻,但它绝对会对你有所帮助,强烈推荐—— ySlow!
14.使用无序列表(UL)包裹导航菜单
通常网站都会有导航菜单,你可以用这样的方式定义: <div id="nav"> <a href="#">Home </a> <a href="#">About </a> <a href="#">Contact </a> </div> 如果你想书写优美的代码,那最好不要用这种方式。
最好这样定义: <ul id="nav"> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </ul> 15.学习如何应对IEIE一直以来都是前端开发人员的噩梦! 如果你的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.选择合适的IDE
不论你是Windows还是Mac用户,这里都有很多优秀的编辑器供你选择: Mac 用户 PC 用户17.上线前,压缩代码
通过压缩您的CSS和Javascript文件,您可以减少总大小的25%左右,但在开发过程中不必压缩,然而,一旦网站完成后,利用一些网络压缩程序或多或少节省一些带宽。下面列出一些工具。 Javascript 压缩服务CSS Compression Services18.精简,精简,在精简回望我们大多数人写的第一个页面,一定会发现严重的 “DIV癖”( divitis ),通常初学者的本能就是把一个段落用DIV包起来,然后为了控制定位而套上更多的DIV。—— 其实这是一种低效而有害的做法。
正如写文章的关键是“缩减,缩减,缩减”一样,写页面也要遵循这个标准。 19.给所有图片加上“alt”属性为图片加上alt属性的好处是不言而喻的 —— 这样可以让禁用图片或者使用特殊设备的用户无障碍得了解你的王爷信息,并且对图像搜索引擎友好。 糟糕的做法 <IMG SRC="cornImage.jpg" /> 更好的做法 <img src="cornImage.jpg" alt="A corn field I visited." /> 20.通宵达旦我经常不知不觉的学习工作到凌晨,我认为这是个很好的状况。 我的“啊~哈!”时间( “AH-HA” moments,指柳暗花明或豁然开朗的时刻)通常都发生在深夜,比如我彻底理解JavaScript的“闭包”概念,就是在这样一种情况下。如果你还没有感受过这种奇妙的时刻,那就马上试试吧! 21.查看源代码
没有什么比模仿你的偶像能让你更快的学习HTML。起初,我们都要甘做复印机,然后慢慢得发展自己的风格。研究你喜欢的网站页面代码,看看他们是怎么实现的。这是高手的必经之路,你一定要试一下。注意:只是学习和模仿他们的编码风格,而不是抄袭和照搬! 留意网络上各种炫酷的JavaScript效果,如果看上去是使用了插件,那根据它源码中head标签内的文件名,就可以找到这个插件名称,然后就可以学习它据为己用。 22.为所有的元素定义样式这一条在你制作其他公司企业网站时尤为必要。你自己不使用blockquote标记?那用户可能会用,你自己不使用OL?用户也可能会。花时间做一个页面,显示出ul, ol, p, h1-h6, blockquotes, 等等元素的样式,检查一下是否有遗漏。 23.使用第三方服务现在互联网上流行着许多可以免费加在网页中的API,这些工具非常强大。它可以帮你实现许多巧妙的功能,更重要的是可以帮你宣传网站。 |