30天精通网页制作

经常会有一些朋友问到，该怎么学“建网站”、学“P图”、学“CSS”、学“编程”等等，显然我不是什么高手，最牛B的经历只是在大学用个人网站忽悠了个很小很小的安慰奖，因此每次总是被问到哑口无言，落荒而逃。

最近开始发现原来这并不关乎面子问题，而是如果我愿意分享自己经验或者说学习轨迹也许可以帮助一些人找到自己的兴趣点或者一份更加好的工作，因此也就有了这篇文章。

没看错，这赤果果是标题党。

1.只能吹我懂的

言归正传，首先我需要限定下“网页”的范围，WEB的定义当然能很广，但它并不是今天的主题，我说的“网页制作”就是你能看到的一个个简单HTML页面，对就是这么简单，它不是像GMAIL一样复杂的WEB应用，不是PHP的模板页面，它就是个简单的网页，你在浏览器中可以保存下来的网页。

2.兄弟，赶紧来些实际的

既然如此，兄弟我只能先掷出秒杀技了，Adobe的Dreamweaver确实人如其名，你可以拖，可以拉，然后就能生成一个网页，各种操作其实很Office Word很类似。

Dreamweaver同时又有两项绝招：

第一 表格

你可以插入表格，然后拖拉表格大小在里面插入各种内容；

第二 DIV+绝对定位

你也可以先插入DIV，在里面放入内容，然后再设这个DIV为绝对定位随意拖啊拉到到你想放到的位置；

当然我们都知道这是不对的，假如你有兴趣接着看下去的话，你就会知道原来自己曾经以为的大招其实在别人看来只是在耍猴拳（就像海贼王里你没见识霸气前，以为恶魔果实就是一切）。

更多Dreamweaver教程在google“Dreamweaver教程”，好吧，其实我不是在说废话，不用搜索引擎的IT民工确实都不是好民工。

3.那些30天都是大忽悠！

罗马不是一天建成的，就算大家都在说“600元做网站”，好吧，他们也是在忽悠你。网页制作虽然容易入门，但它却不是你想学就能学，踏踏实实学习是对自己的一种尊重。

假如不能有这样的觉悟，后面的内容也是没必要的。

4.兄弟，你总该说下怎么学的吧？

第一步：理所当然的，你开始困惑网页到底是个什么，然后被一丢装B的名词挡住去路，再然后，你在书店看到有一本“精通XXX”，再然后你以为自己真得精通了，结果……

图源：http://www.flickr.com/photos/kejun/3114605967/

好吧，撤远了，回到主题，窄义的网页制作涉及的范畴其实很小，HTML/CSS/JavaScript 这3个名词只要你GOOGLE一下都能知道他们是什么。

第二步：有了目标你可以开始比较系统的学习，在这个过程，我的建议是：找那些动物封面的书(HTML & XHTML权威指南,CSS权威指南,JavaScript权威指南)，快速的浏览。

因为看得过程你总是会错觉自己已经懂了，因为真得很简单，所以也没必要纠结，只是要记住，把书放在电脑旁，你以后会经常再翻这些本书！

第三步：看完书，应该会有跃跃欲试的冲动，从哪里开始？当然是个人网站，动手前你可能会发现，这不是坑爹吗！我还不会Photoshop啊！我还不会后台开发开发啊！确实，这也是没法搞的事情，以兄弟我不靠谱的经验，有三个办法，一请朋友帮忙，二找模板改，三自己学，当然前两种方法都是不对的，但还是有好消息：传送门：1.不用photoshop设计互联网产品 2.各种源代码

第四步：好吧，又撤题了，在第四步前，你应该按着书抄了些DEMO，写了些代码，切了些图，然后准备正儿八经的干些事情，但是你发现除了个人网站，好像没什么是可以折腾的。这时候你或者可以上网找些外包，当然前提你必须能接受和民工一样的待遇，或者看着那些大网站，学着copy一份，或者索性给那些XXX建站公司、XXX网络营销公司投简历去。

第五步：其实这更应该是插入到第三和四之间，当你敲了些代码，好像又觉得有什么不对，但又说不出哪里不对，想实现些效果，又不知道怎么做，你可能已经学会用google找到你的答案，但是还是想找些“高手”告诉你什么是正确，什么是错误，最简单直接的方法，你可以加入各种技术交流群，像CSS森林、Web标准交流等等（好吧，我都被这两个群T出来了），带着SB的心态，把你的作品发出来，接受大家热火般的洗礼。

第六步：这里假设你已经写了很多很多代码，你需要开始维护、更新你的或者别人的代码，动手前你可能又会发现，这不是坑爹吗！乱糟糟的代码根本没办法维护，然后有高手就会告诉你，这是因为你不懂“WEB标准”，你开始接受洗脑，果然以前是SB了。

第七步：你的代码越写越多，你开始思考开发模式、设计模式等等等模式，你的目的很简单，让自己变得更懒同时更有效率完成地完成工作，这时候你应该会开始懊悔，从前没好好学设计模式，数据结构真是SB。

4.真得那么简单？

其实说简单也不简单，你可能已经会做网页制作，但是未必能做出好的页面，可能是：

1. 你还没弄懂各种浏览器的脾性（浏览器兼容性）
   
2. 你不知道为什么是”30天精通网页制作”这样的标题党吗? （SEO）
3. 你还没掌握各种兵器（PS/FW/编辑器/抓包/比对/项目级工具等等等等）
4. 你还没有性能优化的意识（雅虎N条、按需加载等等等）
5. 你的代码依旧难以维护（模块化等等等）
6. 你学习的步伐跟不上新技术的发展（HTML5/CSS3/移动/性能优化等等等）
7. 你经常忽略了其他终端用户和不同上网环境（盲人阅读器、低速、禁JS等等等）
8. 你还在重复造轮子，不知道各种库、框架等神器（YUI/JQ/LESS CSS等等等）
9. 你已经会复制粘贴代码，但从来不知道自己复制了什么

5.坑爹呢！

好吧，假设你已经入门了，你可能会疑惑，我总该拿个“微软XXX认证工程师”、“国际X级XX证”，然后到大公司求职，但现实是，这行业没有这玩意儿！！！你的能力只能通过你的作品展示。也许，你真得需要有个衡量自己能力的标准，推荐你看看鬼哥的：你是一个职业的页面重构工作者吗？ 和 再读《你是一个职业的页面重构工作者吗？》 克军的：你真的了解HTML吗 AW的 Web前端工程师技能列表，然后再衡量自己的方向，我是不是已经走上了这条不归路，现在你应该知道你的简历该怎么准备了。

6.我们来讲点现实！

在这个神奇的国度，人们总是喜欢先给你画个大饼，忽悠你学了XX做了XX，以后会怎么怎么地好，但他们都不说这个大饼不是每个人都能吃到，所以不管这个行业有多朝阳、多有钱，一定要记住，保持初学者心态地学，踏踏实实地做，然后才会有机会吃到这个大饼。

而且在学习的过程中，你也要开始有意识的培养自己的特长，例如，你的UI Sense更强你更喜欢做页面重构，你的编程逻辑更强更喜欢做数据处理的前端开发，你在移动终端上的开发经验更丰富，你更喜欢做整站级别的性能优化等等，我只是在打比方，切勿误解了我的意思，这只是你的特长，不是你的全部。

最后一个现实，全宇宙的互联网公司都在招前端开发人才：[招聘]前端开发-腾讯-Qzone 淘宝北京UED招聘-前端开发工程师 土豆网招聘前端开发工程师 人人网招聘 前端架构师、Javascript开发工程师 各种求

真得是最后，文章的内容其实更应该是在去年分享。