零基础如何迅速学习HTML(或HTML5)?

时间:2021-10-13 14:56:49

关键词:`零基础`,`迅速`,`HTML`

现在在移动端流行“高大上”的HTML5。作为代码零基础,该如何迅速学习HTML(或HTML5)?

既然是零基础,就先学学基础, 基础学习推荐菜鸟教程

前端的基础知识无外乎就是html,css,js三大类,html控制结构和内容,css修饰结构和内容,js控制动效集合交互,由于要求迅速,所以时间应按安排的合理。

1.html、html5标签可以快速的过一遍,大概2~3天,不用全部记住,要会灵活运用,什么情况下用什么标签要了解,不过用的多了自然就熟练了。

2.css、css3:也是先整体过一遍,大概3~4天,主要关注选择器的语法和优先级算法,各种样式也是写多了熟练就好了,写好高效简洁 的css还是看选择器的写法。

3.了解各种各样的布局,web页面的主要元素。有很多不同的方法去组织它们,所有的web页面都用一个container,主要是为了同一个目的:去包含一些页面元素,然而这个方法实现各有不同。例如,body标签或者是最常用的div。甚至于过去常用的table(不要使用table作为你的container,这是一个破方法)。多去各种类型的网站逛逛,了解布局类型,以及布局类型的实现方法。

4.模仿几个PC、移动端网站:一周左右,学编程主要还是靠练习,必须得多写多想,练习的不是看细节要多好,主要是了解html结构,css的各种属性。

css样式怎么组织起来的,css和html怎么结合,多想想一些网站的布局为什么要这么做,这地方能不能精简,网站都不是很复杂的,优化空间都是有的;

通过上面的学习,基本上可以进行静态的网页布局了,如果有不错 的布局意识,良好的 色感,那是大大的加分的啦。

下面就是JS

js是可以同时控制html和css的,所以js在前端的地位是很重要的,但是都要有html和css的基础上去学习的:

1.基础语法:还是可以在菜鸟教程菜鸟教程,学的不仅仅是技术,更是梦想上去学习,可以去一些网上找视频看看,过一遍也相当快,但是理解能力要够好的。

2.重点:事件、DOM操作,这都是js最原始的东西,主要是用来做交互 的。

3. 组织代码:了解函数,了解对象,主要是为了以更好的方式组织你的代码。不然你一行一行写下去也行,但完全没有条理,日后也无法改动。写代码要养成一个好习惯,除了考虑怎么实现,还要考虑怎么去组织代码,把你的代码弄得条理分明。

进阶

通过以上基础学习后,基本上都能满足产品大人的常规需求了。下面就要往炫酷、屌炸天的方向去努力了:

1. 调试工具:极度推荐chrome!抱歉,其实应该在最开始推荐的。在写CSS的时候,你还是写一下保存然后打开浏览器看效果?用用chrome开发者工具吧,CSS实时调整,爽!js各种调试,爽![chrom使用教程](Chrome开发者工具不完全指南(一、基础功能篇) )

2. 性能意识:之前的基础学习都是为了做出一个东西,而现在你应该要想着做出一个高性能的东西。性能主要有两方面:加载速度以及页面执行效率(多指动画),直观点说就是卡不卡。这里可以看看腾讯前端项目组的总结:[移动H5 前端性能优化指南](移动H5前端性能优化指南 )

3. 代码规范:基础部分的代码组织没有着重强调,是因为那个时候了解太少,以实现为目的。现在进阶阶段就要考虑使用面向对象的方式来组织代码了,而且还要有模块化工程化的意识。可以从js看起[阮一峰的模块化教程](Javascript模块化编程(一):模块的写法 ),主要是理解这么个思路,日后语言层就会支持。

4. 了解一下服务器开发,做前端总是要跟服务器配合的,你要是完全不懂后端,那就简直无法交流了呀。

最后说一点:时刻紧跟技术风向!