最近有人问我,如何开始学习Web开发?在此,我想对自己学习Web开发的历程作一个回顾。
网页制作 vs Web开发
实际上,很多人提出的问题并不是“如何开始学习Web开发”,而是:
- 怎么做网站?
- 网页制作的方法
- 建立网页的流程
- 我会PHP和Dreamweaver,还要学什么?
- 寻网页制作程序编程高手
现在,我坚持使用Web开发这个词,而不是网页制作、网站建设这些说法。我认为,“网站”只是Web开发的一部分;学习了这么多开发技能,仅仅用于制作“网站”或“网页”,就是大大的浪费。
我的学习时间表
2000~2001 初识HTML
早在2000年,我通过Word 97的“另存为网页”功能,第一次接触了HTML格式。当我看到我的Word文档出现于IE 4.0的窗口中,而且点击链接还能转到另一个文档时,惊讶不已。因为,我终于有资格作出像“上海热线”一样的、能出现在IE窗口中的文档了!
2001年,我开始使用FrontPage 98制作网页。FrontPage支持MARQUEE标签,能让文字在页面上动起来,这又使我欣喜不已。
这个阶段,我对“网页”并没有明确的概念,只是对“IE窗口中的文档”有浓厚的兴趣。
2002 手写HTML,初识JavaScript
2002年,我开始较为系统的学习网页制作。我阅读了HTML 4.01 Specification,并开始用记事本写出(能在IE窗口中显示的)HTML文档。
我也对网站上那些动态效果十分感兴趣。通过阅读源代码,我看到了“JavaScript”这个词。我在新华书店购买了一本《JavaScript示例导学》,结合NetScape网站上的Client-Side JavaScript Reference v1.3,学习了(NetScape的)JavaScript。以现在的眼光看,当时的JavaScript只是DOM Level 0,现在JavaScript能做到更多“不可思议”的事情;不过,我至今仍认为Client-Side JavaScript Reference v1.3是一份很好的材料,因为现代浏览器都可以支持那份文档上的几乎所有特性。
我还学习了Flash 5.0,根据书上的教程,制作了一些简单的动画。
当时我没有条件发布自己的网站,因此我的作品只能通过电子邮件在少数拥有电脑的亲友之间传阅。我也自定义folder.htt,让Windows 98的文件夹显示为我的网页,自己欣赏这些作品。
2003~2004 接触ASP、PHP
2003年,我加入了学校的网站制作社团。此时,我第一次拥有了能对外发布的网站空间。这个空间没有独立的域名,仅有1MB的容量,但我已经很满足了。这个空间支持“ASP”;不肯放过任何新事物的我,也就跟随社团提供的教程,开始学习ASP技术。
在随后的几年内,我用ASP完成了许多作品,包括简单的论坛、文章发布系统等。我也使用过许多款ASP脚本木马、ASP注入工具,对服务端脚本的安全性有了初步的认识。
2004年,我也了解了PHP。但是,当时我并不知道MySQL的存在,因此总觉得PHP不如ASP+Access强大,而暂时没有深入下去。
2005~2006 学会切图,迎来ASP.NET
2005年底,我参加了一次网站开发讲座。在这次1小时的讲座上,我观摩了用Photoshop切图并用Dreamweaver制作表格式网页的流程,并听说了ASP.NET服务端技术。
“切图”是将美术设计人员提供的设计图稿精确转化为网页的过程。我自己不擅长美工,而专业设计人员又不懂得HTML;通过“切图”,我就可以在网页上展现一个漂亮的设计。学会用Photoshop和Dreamweaver切图,就能够与专业美工合作,建立更为美观的网站。不过,现在我不赞成过多使用切图技术,因为表格式网页并不实用,它只是一个美术作品。
ASP.NET当时发布的版本是2.0。它能在服务端捕获客户端的点击、修改等事件,深深吸引了困于ASP表单提交、参数处理中的我。2006年初,我花了一个月的时间,跟着QuickStart学习ASP.NET 2.0,并用Visual Studio 2005完成了基于Web Forms的一套文章发布系统;这套文章发布系统具有板块管理、可视化样式编辑、自定义列表等功能,但是性能方面差强人意。
2006年,我注册了我的第一个域名:yoursunny.com,并用ASP和ASP.NET制作了我的个人网站。
2006 理解XHTML+CSS,重拾PHP
2006年9月,我在宿舍拥有了持续的网络接入,不再需要价格昂贵的拨号上网、也不再需要深夜去图书馆接入无线网络。宿舍网络使我能接触更多的技术资料,与技术高手一同讨论,进行更加深入的学习。
在优化个人网站的过程中,我对XHTML+CSS有了充分的理解。我认识到,table并不是网页排版的工具,而应该用CSS来制作网页的样式。不过,我仍然用着Dreamweaver,因此也仍然制作表格式网页。
出于性能的考虑,我在制作一个大型投票系统时重新开始使用PHP。当然,这次是与MySQL结合应用。但是,由于技术上的生疏,只有投票部分用PHP制作,其它部分还是使用了(对我来说比较保守的)ASP.NET。
2007 了解XML+XSLT,学会AJAX
2007年,我在.Net Framework的System.Xml中看到了XML的优势,并在图书馆了解了XML、XSLT、XPath等相关技术,并尝试给网站加入Atom、RSS聚合源。在又一次开发投票系统时,我在内容发布部分应用了XSLT技术。我还写过一个纯XML+XSLT的发布系统,不过糟糕的浏览器兼容性和搜索引擎收录效果使它没有办法大规模应用。
开发另一个管理信息系统时,我开始使用AJAX。一个个XMLHttpRequest对象,搞得我晕头转向;写出的那800行JavaScript代码、一个又一个函数调用,别人(或多年后的自己)想要完全看懂简直是不可能的任务。 就在这个管理信息系统开发完毕之后不久,我才看到了Prototype.js。看了这个JS框架,我对JavaScript的认识就从Client-Side JavaScript Reference v1.3有了一个飞跃:原来,JavaScript也能支持面向对象编程!
2008 市场,Web2.0,云计算,网站运营
到了2008年,我对网站制作的基本技术都已经有所了解:XHTML、CSS、JavaScript、AJAX、PHP、ASP.NET……但是,我的网站访问量还是少得可怜。寒假中的一个想法,带来了阳光GPA计算器——这是我网站上访问人数最多的页面。在推广GPA计算器的过程中,我也对社会化网络SNS的Web2.0平台有了一定的了解。
我还用上了Google App Engine这个云计算平台,作为对虚拟主机空间的补充。
在我实习的公司里,我对网站运营和Web应用的性能有了更多的知识和经验。
你是否该走我的路?
路是自己走出来的。你沿着我的路走,可能并不是最好的选择。
不过,我可以给你一条(我现在认为正确的)学习之路:
- 学习HTML:
HTML 4.01 Specification,并了解XHTML(2012-08-07更新) HTML Living Standard - 学习CSS:
CSS2 Specification(2012-08-07更新) CSS 2.1 Specification - 学习PHP:PHP 手册
- 学习JavaScript、DOM
- 前面4项都学完了,你会很清楚你还需要学什么
学习资料
你可能已经注意到,我给出的资料链接,有不少是英文的。在你学习后还会发现,根据标准制作的Web页面,不一定能够在所有的浏览器中完美显示。不过,这没有关系。我推荐学习资料的依据如下:
- 尽可能推荐官方文档:官方文档是最权威的,比任何教程都好
- 避免推荐厂商特定的文档:MSDN中关于HTML、DOM的讲解,对IE浏览器有偏向;MDC则偏向Firefox浏览器。IE与Firefox都不是标准。Web开发首先应该依据标准,然后才是根据厂商作出小的修补。这样,“支持Firefox”或“IE8兼容性”就不是难以逾越的鸿沟了。
- 避免推荐翻译的过时文档:许多纸质图书,国外出版时已经比技术晚了1年,翻译后又晚了1年。看这些书来学习,你就比最新技术落伍了2年。
如果你真的需要一些浅显一点的教程,我推荐W3Schools Online Web Tuturials,以及其中文版w3school (2012-08-07更新) 请参考这些资源。不过,看完了教程,我仍然建议你阅读一遍官方文档。