·您现在的位置: 云翼网络 >> 文章中心 >> 网站建设 >> 网站建设问答 >> 走向专业之路:网页新手30进阶秘技(下)

走向专业之路:网页新手30进阶秘技(下)

作者:佚名      网站建设问答编辑:admin      更新时间:2022-07-23

许许多多的网页新手正徘徊在专业编码的门槛前,而网上的教程参差不齐,鱼龙混杂,很容易让新手迷茫。这里总结了30条网页编码的“秘技”,只要在编码过程中牢记它们,灵活运用,你一定会写出一手漂亮的代码,早日迈入专业开发者的行列。参看《网页新手30条进阶秘技(上) 》

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

choose a great code editor

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

Mac 用户

  • Coda
  • Espresso
  • TextMate
  • Aptana
  • DreamWeaver CS4
  • PC 用户

  • InType
  • E-Text Editor
  • Notepad++
  • Aptana
  • Dreamweaver CS4
  • 17. 压缩前端代码! 

    Compress

     通过压缩CSS和JavaScript代码,通常可以减小25%以上的文件体积,在某种情况下,这会大大减轻你的带宽压力,提高加载速度。

    Javascript 压缩服务

  • Javascript Compressor
  • JS Compressor
  • JS代码在线压缩( 中文 )
  • CSS Compression Services

  • CSS Optimiser
  • CSS Compressor
  • Clean CSS
  • CSS代码在线压缩( 中文 )
  • 18. 缩减,缩减,缩减

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

    网页写完后,一定要多次回头检查,尽量的减少元素的数量。

    能用UL布局的列表就不要用一个个的DIV去布局。

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

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

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

    Firefox不支持显示图像Alt属性,可以加入title属性:

    <img src="cornImage.jpg" alt="图片标题" title="图片标题" /> 

    20. 学会熬夜

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

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

    21. 查看源代码 

    view source

     没有什么比模仿你的偶像能让你更快的学习HTML。起初,我们都要甘做复印机,然后慢慢得发展自己的风格。研究你喜欢的网站页面代码,看看他们是怎么实现的。这是高手的必经之路,你一定要试一下。注意:只是学习和模仿他们的编码风格,而不是抄袭和照搬!

    留意网络上各种炫酷的JavaScript效果,如果看上去是使用了插件,那根据它源码中head标签内的文件名,就可以找到这个插件名称,然后就可以学习它据为己用。

    22. 为所有的元素定义样式

    这一条在你制作其他公司企业网站时尤为必要。你自己不使用blockquote标记?那用户可能会用,你自己不使用OL?用户也可能会。花时间做一个页面,显示出ul, ol, p, h1-h6, blockquotes, 等等元素的样式,检查一下是否有遗漏。

    23. 使用第三方服务

    译者注:英文原文标题为“使用Twitter”

    现在互联网上流行着许多可以免费加在网页中的API,这些工具非常强大。它可以帮你实现许多巧妙的功能,更重要的是可以帮你宣传网站。 

    Twitter Snippet

     24. 学习Photoshop 

    Learn Photoshop

     Photoshop是前端工程师的一个重要工具,如果你已经熟练掌握HTML和CSS,那不妨多学习一下Photshop。

    1. Psdtuts+上有许多英文的饰品教程:Videos section
    2. Lynda.com 也有大量教程,不过要支付$25美元
    3. "You Suck at Photoshop" 系列教程
    4. 花费几个小时的时间学习Photoshop的快捷键操作