查看: 295|回复: 0

[HTML代码] 关于自学Web前端开发(供自己使用)

发表于 2018-1-2 08:00:00

别人的警告:大多数初学者学习网页制作所用的集成开发环境(IDE)大多是Dreamweaver(我现在用的就是DW cc),这种所见即所得的“吊炸天”IDE为我们带来了极大的方便。But:虽然它入门快,见效快,很容易让初学者爱上,,聪明的IDE也成全了我们的惰性。

正确的方向胜过无谓的努力:也不知道它对不对,没有大神指导的铝孩纸也是没办法了:

第一阶段--HTML学习:超文本标记语言(HyperText Mark-up Language)是网页的骨架,无论是静态网页还是**页,最终返回到浏览器端的都是html代码,浏览器将HTML代码解释渲染后呈现给用户。

HTML的学习是一个记忆和理解的过程,学习中,可以借助DW的拆分“视图辅助学习”,在“设计”视图中看效果,在“代码”里学习本质,这里,只掌握了各种“原材料”的制作方法。

第二阶段--CSS学习:层叠样式表(Cascading Style Sheets),真正做到网页表现与内容分离的一种样式设计语言,极大提高了开发速度,降低了维护成本。

css中的盒子模型,相对布局,绝对布局等能够实现对网页中各对象的位置排版进行像素级的精确控制。

第三个阶段--JavaScript:它是一种在客户端广泛使用的脚本语言,提供了一些内置函数,对象和DOM操作,借助这些可以实现一些客户端的特效,验证,交互等,使页面看起来不那么呆板。

关于兼容性:很让人头痛。

第四个阶段--jQUery:是一个免费,开源的轻量级的JavaScript库,并且兼容各种浏览器(jQuery2.0以及后续版本放弃了对IE6/7/8浏览器的支持),现在有很多基于jQuery的插件可供选择,这样在实现一些丰富的动态效果时更方便快捷,大大节省了开发时间,提高了开发速度,这也充分体现了其write less , do more的核心宗旨

Bootstrap:是Twriter推出的一个开源的用于前端开发的工具包,是一个css/HTML框架,并且支持响应式布局,一直是GitHub上的热门开源项目。

在项目开发过程中,可以借助Bootstrap提供的CSS样式、组件、JavaScript插件等快速完成页面布局和样式设置,然后再有针对性的微调样式,这样基于框架进行开发大大缩短了开发周期。

别人的建议:很多初学者缺乏对页面布局进行整体分析,不能宏观上对页面中盒子间的嵌套关系进行把握,就急于动手去做,导致页面中各元素间的关系很紊乱,容易出现盒子在浮动时错位等情况。建议采用“自顶向下,逐步细化”的思想,先用几个盒子将页面从整体上划分,然后逐步在盒子中继续嵌套盒子。

还要多浏览优秀的网站,善于分析借鉴设计思路和布局方法,见多识广,进而融会贯通,取他人之长为我所用。

同时还要善于使用Firebug这个利器,一方面可以再学习过程中帮助我们调试自己的页面,另一方面可以使用Firebug方便查看,分析别人网站的源代码。



回复

使用道具 举报