分享

零基础的网站开发初学者如何系统的学习?

 pgl147258 2014-10-30

前端对于熟悉PS,AI,Flash等图行工具很重要,可是我看了这么多教程,就是找不到学习的窃门,只能对图片进行一些简单处理,Flash更是难点重重,我就一直想不明白,用鼠标键盘怎么画出那么好看的动画。。。。。。

【张帅的回答(176票)】:

网站开发开发大概分为前台和后端,前台又可以分为美工,交互设计,js编程。后端了解不多,前端的话,可以按如下思路学习系统学习:

基础知识

1. html + css 这部分建议在 w3school 在线教程 上学习,边学边练,每章后还有小测试。 之后可以模仿一些网站做些页面。在实践中积累了一些经验后,可以系统的读一两本书,推荐《head first html 与 css 中文版》,这本书讲的太细了,我没能拿出耐心细读。你可以根据情况斟酌。

2. javascript 要学的内容实在很多,如果没有其他编程语言的基础的话,学起来可能要费些力,还是建议先在 w3school上学习。之后建议马上看《javascript语言精粹》,js是一门很混乱的语言,这本书能够帮助你区分哪些是语言的精华,哪些是糟粕,对于语言精华,应该深入学习。糟粕部分能看懂别人写的代码就行,自己就不用尝试了。

进阶

有了以上基础,就可以进行一般的静态网页设计,不过对于复杂的页面还学进一步学习。

1. css。必看《精通css》,看完这本书你应该对:盒子模型,流动,block,inline,层叠,样式优先级,等概念非常了解了。作为练习可以看下《css艺门之匠》这本书,它对标题,背景,圆角,导航条,table,表单等主题都有详细的介绍。

2. javascript。上面提到内容还不足以让你胜任js编程。在有了基础之后,进一步学习内容包括:

a) 框架。推荐jQuery,简单易用,我的第一web项目就是在w3school简单学习后,直接上手jQuery完成的,真的很难简单,很好用。jQuery适用环境有限,对于那些对性能要求很高的页面无法胜任。推荐了解一下 YUI 或百度的 tangram ,都很好用,学习方法也很简单,照着产品文档做几个页面就行了,不用面面俱到,以后遇到问题查文档就行了。框架可以帮你屏蔽浏览器的差异性,让你能更专注与web开发学习的精髓部分。补充: 可以使用 codecademy 学习 javascript,jQuery,用户体验真的很好(感谢 TonyOuyang )。

b) javascript 语言范式 。这个名字可能并不恰当,只是我找不到可以描述“面向对象”,“函数式”这个两个概念的概念。javascript不完全是一个面向对象的语言,它的很多设计理念都有函数编程语言的影子,甚至说如果你不用面向对象,完全可以把它理解成一门函数式编程语言。javascript的很多语言特性,都是因为他具有函数是语言的特点才存在的。这部分推荐先学习面向对象的基本理论,对封装,继承,多态等概念要理解,维基百科,百度百科会是你的帮手,另外推荐《object oriented javascript》,应该有中文版。对与函数式编程我了解的也不系统,不好多说,可以自己百度一下。

c) javascript 语言内部机制。必须弄清如下概念:js中变量的作用域,变量传递方式,函数的定义环境与执行环境,闭包,函数的四种调用方式(一般函数,对象的方法,apply,call),以及四种调用方式下,‘this'指向的是谁。这部分内容你会在《javascript语言精粹》中详细了解。另外,你必须理解json。

d) dom编程,这个web前端工程师的核心技能之一。必读《dom编程艺术》,另外《高性能javascript》这本书中关于dom编程的部分讲的也很好。

e) ajax编程,这是另一核心技术。ajax建议在网上查些资料,了解这个概念的来龙去脉,百度百科,维基百科上的内容就足够了。真正编程是很容易的,如今几乎所有框架都对ajax有良好的封装,编程并不复杂。

f) 了解浏览器差异性。这部分包括css和js两部分,浏览器差异内容很多,建议在实践中多多积累。另外对于浏览器的渲染模式,DOCTYPE等内容应该系统学习。

再进一阶

有了以上知识,对于大多数小型网站,你应该已经可以写出能够工作的代码了。但写出可以运行的代码,只是编程的最初级阶段。更高要求大概还有三方面:1易维护,2可测试,3高性能,如果页面流量有要求,那第四个就是,4低流量。

1. 易维护。对于页面你该理解‘样式’,‘数据’,‘行为’三者分离,对应的当然就是css,html,js。对于js代码,你最好了解设计模式,重构,MVC等内容。

2. 可测性。js代码可测性的主题,我正在研究,欢迎感兴趣的同学联系我,共同学习

3. 高性能。必读《高性能javascript》

4. 低流量。技巧性太强,非一朝一夕之功,不多说

补充

对于前段开发,核心部分基本就这些了,可以根据自己的兴趣爱好选择性学习以下内容。

1. 美工。 大公司都有专业的美工人员,不过如果爱好也可以了解

2. 交互设计。大公司依然有专业人士搞这些,不过如果爱好也可了解。推荐《简约至上》。

3. 后端。应该说前段工程师必须至少了解一门后端语言,不过如果爱好也可深入学习,入手难度比较低的应该是php了。这部分由可分为基于页面,基于框架两种。大型项目都是基于框架开发的,建议至少了解一个MVC框架,php的zend,Home : The Official Microsoft ASP.NET SiteHome : The Official Microsoft ASP.NET Site mvc等等太多了,好还框架的设计思想都大同小异。

4. flash。我并没有吧flash作为前端工程的核心技能之一,因为我不会,不过ActionScript应该和js大同小异,可以根据工作需要学习。不过我的原则是能不用就尽量不用,其实很多效果通过js,css都可以实现,完全不需要flash。而且随着html5的发展flash早晚会淘汰。

5. html5和css3 。html5的标准到现在还没有正式发布,不过目前几乎所有新的浏览器都已经开始支持,手机上就更是如此,建议学习,很好,很强大。

前端开发需要学习的内容,很多很杂,我在最开始学习的前两个月也是一片迷茫。一路走来,发现也走了些弯路。美工,交互设计,flash,js,html+css,后端,随便哪种技能,如果学的特别牛,都可以保证你拥有一个职业。想通吃,没个几年怕是不成。关键是选准自己的爱好,深入学习一项,面要铺开,但深度更重要。以上我这一年学习经验的总结,希望对你有帮助。

知乎用户,#FIXME的回答(135票)】:

首先你已经不是零基础了。

其实这种事情没有什么捷径,亲自动手,一步一步来即可,不能好高骛远。

Step 1: 用 HTML + CSS 模仿几个漂亮的静态页面。当你看到现在大部分的网页都觉得能大概猜到怎样做,并且花时间真的能做出来的时候,即可进入下一步。注意,这个时候请你不要管浏览器兼容性或者太过注意代码的优雅结构,因为没必要。做到能兼容现代浏览器,内容和样式基本完全分离即可。这大概需要半个月到一个月的学习时间。

Step 2: 用 HTML + CSS + JS 写几个有交互的页面。例如,你可以写一个漂亮的注册页面,它能够验证各种输入是否符合条件并且有一个用原生 JS 实现的日期选择器(Date Picker)。或者,写一个漂亮的,有动画的相册。注意,这个阶段请使用原生 JavaScript。同样的,兼容现代浏览器即可。这大概需要半个月的学习时间。

Step 3: 入门一门后端语言。按照你的情况,就 php 吧。有了上面的经验,php 入门之后,相信你能够做一个漂亮的无用户留言版了。请把数据存贮在文件中,因为你还没有学习 SQL 嘛。这大概需要半个月的时间,如果你学习能力强,一个星期也不是没有可能。

Step 4: 入门一个关系数据库。比如说 MySQL。DDL 和 CRUD ,请一定要熟练。恩,这个阶段不要谈什么优化,那是扯淡。现在,你大概可以做一个多用户的博客程序了。这大概需要半个月的时间。

你看,两个半月不到你就可以成为一个初级的 Web 开发者了。博客做好之后,你可以尝试造更多的轮子。比如:带简单的用户权限的论坛程序、简单的记账工具,等等,做你喜欢做的任何小程序都行。在这个过程中,你会变成一个熟练的初级程序员,或者,你为了偷懒,会学会 jQuery,Smarty 等框架。

有一天,你发现你靠写小程序提高不了水平了。接下来就要学习真正的干货了。

  • 学习 C 语言。别问我为什么,我就是觉得一个程序员应该要学过 C 语言,牛逼不牛逼是另外一会事儿,况且很多书都是用的 C 语言描述。别光学语法,弄清编译是什么,链接是什么,指针是又怎么一会事儿。

  • 学习数据结构和简单的算法。你看,你学完 C 语言就能学数据结构和算法了,我难以想象用 php 来描述数据结构和算法会有多么地奇怪。如果你觉得学了之后还是不知道数据结构究竟是什么,有什么用,那证明你还没有真的学到。

  • 学习一门面向对象的静态编程语言。推荐 Java。学得有多好,就看你花了多少时间了。请务必仔细阅读各类相关书籍,深刻领会面向对象的重要编程思想(不过,切忌迷信面向对象编程)。

  • 学习操作系统和计算机网络。至少一些基本的概念需要弄清楚,具体的细节,没有必要过于纠结。
Okay...以上都可划为「不求甚解」的阶段,接下来就可以选一个方向(前端,或者后端)「求甚解」了。在「求甚解」的阶段里,我这里就不细说了,也没法儿细说,并且你到了这个阶段,一般是不需要别人告诉你需要学什么了。所以,我只说在进入这个阶段之前,或者刚刚进入这个阶段时,最好去做的一些事情:

  • 看书或文档抛弃中文译本,借助各种工具阅读英文原版。

  • 学习使用 Unix-like 系统。

  • 学会提问[1]。

  • 订阅科技博客,了解业界正在发生什么事情。
Happy hacking!

[1] 提问的智慧:http://www.wapm.cn/smart-questions/smart-questions-zh.html

【Gino的回答(3票)】:

@张帅兄回答的很认真,必须要赞一个!我针对你说的下面的这段话说一下吧:

前端对于熟悉PS,AI,Flash等图行工具很重要,可是我看了这么多教程,就是找不到学习的窃门,只能对图片进行一些简单处理,Flash更是难点重重,我就一直想不明白,用鼠标键盘怎么画出那么好看的动画。。。。。。
PS,AI,Flash等图形工具是网站美工的基本功,除非你自己一个人要做全站,不然的话,这些软件了解一下就行了(比如会改个字,隐藏个图层啥的),没不要达到熟悉的程度。ps教程推荐李涛老师的:http://www.verycd.com/topics/2719750/

对于flash,我不知道你说的“那么好看的动画”是指动画交互效果还是画面漂亮,如果你指的是交互效果,那需要你去了解一下交互设计的知识,如果你指的是画面漂亮,那我可以告诉你,那很可能是美工人员用绘图板绘制的,非键盘和鼠标。

【罗奇的回答(1票)】:

张帅的回答令我明确了很多东西,写了一篇文章总结了盒子模型,流动,block,inline,层叠,样式优先级,等概念

有兴趣的同学欢迎阅读指正

http://my.oschina.net/proloki/blog/99457

【TonyOuyang的回答(4票)】:

http://codecademy.com 挺适合你的

【何華明的回答(0票)】:

我来说说我的观点吧。虽然我不是牛人。

首先是HTML+CSS,不用说,我想你也知道其重要性。也是最基础的知识点。虽然你说看起来很简单,但是在运用的过程中把握的不是很好。这说明:

①:你的知识掌握的不够,不仅是数量上的,还有质量上的。

②:你实践的太少。这需要多练习,在不断地实践中才能发现问题进步。

然后就是JS,js我不是很擅长,所以就不给你什么建议了。

再者就是php+mysql.,其实任何语言都是想通的。只要掌握了一门语言,然后再学其他的就很简单了。还是那句话,不断地实践不断地发现问题不足不断的学习进步。

美工的话,多看多总结吧。我的美工也不是很好。用我常说的一句话来说就是:浑身上下细胞无数,叫艺术的没两个。

以上属于个人观点。不对之处,还希望见谅。共同进步。

【赖广盈的回答(0票)】:

这里有一个技术教程的网站建议大家看看http://www.caopeng.org/

【thobian的回答(0票)】:

没人带的孩子伤不起。

我只想说想学的太多,但很多时候都是今天兴趣来了干这个,明天突然对其他的感兴趣,又跑去干其他的了。

找到方向后,我觉得还是要逼自己一个知识点一个知识点来,所以的一起来真的像LZ说的:知识太混乱了,不能很好地贯通起来。。。

现在,重整MySql中,整完这个就往web服务器(当然是Apache、nginx,或者再加点lighthttpd什么的),然后再然后...

【NeMeQuittePas的回答(0票)】:

首先要专注的话,网站的开发也是包含了很多的部分,美工跟后台,前端基本都是有设计基础的,要达到一定的水平也不是看基本css的书就可以做到的,因为前端设计是都是起先做出图再去写出来的,后台的话php神马的也是需要很多专业的知识,先了解好专注方向再去努力比较好

【Bungder的回答(0票)】:

这个问题我觉得是分为两部分的,一是你觉得自己的学习方向不明确想问清楚,二是你看了很多东西但是没法形成一个知识系统。

第一部分我看到已经有很多有经验的人作出了解答,同为web开发的入门生的我也学到了不少,而且我对问题的第一部分也补充不了什么。

第二部分是个学习方法的问题。

1 发现知识之间的联系

我个人认为这个世界上的知识的结构都是树状的,在学习的时候要想清楚哪里出现了什么样的知识点,这个知识点是怎样引出来的,在这个知识点下又有哪些知识点?弄清楚知识结构的树状图,我认为你对这门知识大概就形成了一个系统了。如果在短期内要接受大量的知识而你又对自己的记忆没有太大信心的话,建议做笔记。

另外,编程这个东西,出于各种考虑,在设计一种语言的时候会添加很多特性到其中,一门语言可以做很多事情,但是初学的话一般都只是学到了一部分,而且这一部分当中你经常用到的又还只是这一部分中的一部分。不常用的那部分会生疏,时间一长,你可能会连很简单的东西都记不起怎么写,所以在一开始学习的时候就要记笔记,到了你记不起但又需要用的时候你就可以直接去看你当时写的笔记。但是你心中必须要对这门语言的知识结构有个大概的印象,这样你查起来的效率才高。

平时遇到问题最好搞清楚问题的成因是什么,要知其所以然,这样对你理解这门语言有很大的帮助,碰到问题,把它记下来,解决后,又把解决方案记下来,因为你以后还有很大可能会碰到相同或类似的问题,除非你有信心记下这么多不成系统的信息。

其实,关于学习方法,我个人认为关键在于发现知识之间的联系,因为人是通过联想来记忆的。我在上面关于学习方法的话都是围绕这一点说的。

2 保持学习时思维的连贯性

除了发现知识间的联系,我认为还有一点很重要,就是学习时候思维的连贯性,就是说学习的过程中最好保持一段时间不被其他事打断你的思维。一般人只能在一个时间里关注一件事(我想没多少人能像钱学森那样同时心算两条方程的),如果你在思考一个问题的途中被另一件事打断了,那么你必须把和那件事相关的信息装进你的大脑,然后对这些信息进行处理,处理完之后,你还得把你之前正在思考的那个问题的有关信息重新装进大脑,然后继续处理。这一点和CPU中断差不多。这个信息换入换出的过程是会大大降低你的效率的。再进一步,假设你是一个不太容易集中注意力的人(没有不敬的意思,只是为了说明问题而作假设而已),你好不容易集中注意力了,然后注意力被转移后你又要花很长时间才能进入状态继续处理之前的问题,效率降得更多了。若再进一步,假设你之前在处理原来的问题的时候还没有进入状态,正在努力中,那么......

所以,要降低被打断的概率,不要被自己的各种不良习惯分散注意力,也不要被他人干扰。关于这一点,你可以查查“番茄工作法”。

最后,我想起一句话,“独学而无友,则孤陋而寡闻”,希望你能找到学习的伙伴,可以去论坛啊之类的地方交流交流。

祝你愿望成真~~~

【朱勃的回答(0票)】:

对于你说的 “图片等素材是很是欠缺的。”我觉得这个不是阻碍。

不必去精通PS,现在的网页除了那种设计感强的宣传页,其实对图片的要求并不高,需要的时候用用PS就OK了,要求高的可以交给专业美工。

但是对于设计理论,配色排版知识等还是有必要去深入学习,多看看国外优秀设计,上上花瓣之类的网站。所以希望你不要闭门造车,还是去牵一根网线吧。

框架了解即可,只要你熟悉了js,框架什么的上手还不简单?框架屏蔽简化了很多东西,比如ajax的实现原理,建议去深入下,这部分涉及到的东西比较重要。学习还是要把基础打好。我就见过很多用jQuery的人,基本原理都搞不清楚,脱离框架连选择元素都不会,这样自然是不可取的。

面向对象这一块,对于没有面向对象语言实战基础的人来说是不知道怎么去学。这个就可以去学别人的库,看别人是怎么使用面向对象的,了解这样的好处,然后自己模仿模仿。

一定要善用开发者工具。firefox的firebug和Chrome的F12都是很好的选择,用好了这个必会发现他带给你的帮助比看一本书更多。你把firebug摸透了你还担心对DOM理解不够?

考虑到未来,html5和css3是必须学习的。

【张淑洲的回答(0票)】:

学的东西太多,一定要学精。另外学的多了工资也不高,IT人伤不起啊

【王立亚的回答(0票)】:

同学 你牛 我很佩服你的学习能力,我虽然已经工作两年了,我做了一年程序员ASP和http://dot.net都会,虽然也做了不少站了,但是还是不敢说自己会了,现在我是做UI ,html+css+JS我都会,但是这些东西都有学习过,越深的地方,越觉得其实我一直还在起点,网站包括: 产品模型,交互师,视觉表达,美工,前端(HTML+css+js),程序员,这是基本岗位,他们每个行业都有大量的东西需要学习,当然如果如果做一个垃圾网站,我也能一个下午就能搞定,但是我相信从你学这么多东西来看,你是想好好搞的,所以我建议你盯着其中一项,深入学习。

【zhang krui的回答(0票)】:

我也是自学的DIV+CSS,自己做了一个自己喜欢的网站,代码全是自己写的,目前在学习PHP,但是有很多不了解,也在尝试使用一些开源的建站系统。希望能找到学友,一起学习探讨

【叶枫的回答(0票)】:

学html和css最好是在w3cshool里面把基础打好,然后再看其他的提高篇的书

【谢天保的回答(0票)】:

我也是自学建设网站,先是html+css, 再后来是js,php+mysql.还有网站的架构。有一点不同的就是,我己经把计算机的课程都给自学了。如计算机网络、linux系统(鸟哥的材料),操作系统、C语言、数据结构与算法、数据库理论。不过,我发现从些网站建设还是很是吃力。

最大的问题是,上面建网站的技术每一门都有自己的学问,要所有技术都精通,然后再建网站,好像几乎不可能(只是很难而己,世上没有什么不可能的话^_^)。一个大的、好的网站是个大工程、大项目,应该是由一个团队来完成的。但我相信精通一项上必须的(只有这样才可以加入到团队中来),了解其它技术也是必须的(只有了解只它技术,才可评估项目,更好地与别人合作)。

只是个人的见解,本人比较缺乏实践,但希望这些见解对你有用^_^

【周漂浪的回答(0票)】:

这个网站不错~~http://www.w3school.com.cn/html/index.asp

【匿名用户的回答(0票)】:

你到底想学什么?

看下谢天保童鞋的回答吧

原文地址:知乎

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多