個好的Web前端工程師在知識體系上既要有廣度，又要有深度，所以很多大公司即使出高薪也很難招聘到理想的前端開發工程師。那么如何系統的學習企業實用的Web前端技術呢？小白學習HTML5的思路是什么呢？下面和千鋒廣州小編一起來看看吧！

在此之前，我從未接觸過div+css，甚至連dreamwear、photoshop的工具也都是很少接觸，我的學習思路是這樣的：

一、先寫HTML還是先寫CSS?

對于一個新手而言，在有了一點html知識之后，對于CSS、DIV都感覺特別的疑惑，不知道這其中到底是什么聯系?為什么用了CSS的網頁不能像其它代碼一樣直觀?html和css哪個先寫?其實這些問題在我看完教程，但還沒真正上手實踐時的疑惑!等真正上手自己做時，我才發現應該是兩者同時寫!

二、把站點建好，目錄建好，比如建好文件夾css，images這兩個是最其本的，然后新建一個.html空文件，一個.css空樣式表，把.css外部樣式表連接到.html這個文件上，鏈接寫在中。

三、寫HTML中的最基本的布局部分，都是用DIV，然后直接在DIV里加入ID或CLASS，這些布局部分包括外套部分，頭部分，中間部分，左，中，右，版權部分等。

四、到樣式表中寫各個布局層的樣式。

五、寫一段代碼后就進行瀏覽器的測試，同時用IE6與FF一起測試。在瀏覽器中調試，調試時發現許多之前沒有預料的問題，如瀏覽器的兼容問題、浮動的問題等。

六、不斷的找出問題、理解怎么出錯的，不斷的再測試!

這樣的學習和研究過程，讓我體驗到了付出與回報的樂趣，如：

要邊看邊做學習筆記，我有隨時寫筆記的習慣，電子稿或手寫稿均可。把自己認為是重點的部分寫上，便于以后查閱;再者，把覺得有疑問的部分記下，帶著疑問看下去，如果沒有答案，上網查詢或是問老師，解疑是提高知識最快的一種方式。

心態很重要，一定得靜下心，要樹立信心，堅持再堅持下去。系統的將教程學完，一遍不行兩遍，持之以恒。當你到達終點時你回發現一切都是順理成章的事。因為你努力了，努力了就會有回報，有結果。

學習永遠沒有終點，隨著學習，知識不斷提高，所接觸的技術領域也隨之擴大。堅持看書，堅持以任何一種方式學習，都將受益無窮，也都是一件十分快樂的事情。

識HTML5和HTML4在架構上有很大的不同，但是基本的標記語法并沒有很大的改變，下面我們來了解一下HTML5和HTML4的差異。

1. 廣義的HTML5除了本身的HTMl5標記外，還包含CSS3與javascript。為配合css語法，HTML5在架構與網頁排版美化方面的標記做了很大的更改，但是基本的標記語法并沒有大的改變。下面列出幾項HTML4和HTML5的較大差異，請參考！

   語法簡化

   1.HTML，XHTML的DOCTYPE，html，meta，script等標記，在HTML中有大幅度的簡化。

   統一的網頁內嵌影音的語法

   以前播放影音時，需要使用ActiveX或Plug-in的方式來完成，例如 YOU Tube影音需要安裝Flash Player，蘋果網站的影音則需要安裝QuickTimeplayer。HTML5之后使用<video>或<audio>標記播放影音，不需要安裝額外的外掛了。

   新增<header>,<footer>,<section>,<article>等語義標記

   為了讓網頁的可讀性更高，HTML5 增加了<header>,<footer>,<section>,<article>等標記，明確了網頁的結構，這樣搜索引擎就能輕易的抓到網頁的重點，對于SEO有很大的幫助。

   全新的表單設計

   對于網頁的程序設計者來說，表單是最常見的功能，在這方面HTML5做了很大更改不但新增幾項新的標記，原來的<form>標簽也增加了許多屬性。

   利用<canvas>標簽繪制圖形

   HTML5新增了繪圖功能<canvas>,利用它可以搭配JavaScript語法在網頁上畫出線條和圖形

   提供API開發網頁應用程序

   HTML5提供了多種API供設計使用，例如Web SQL Database，讓設計者可以脫機訪問客戶端的數據庫，當然，要使用這些API，就得熟悉JavaScript語法。

   創建HTMl文件

   學習html不需要昂貴的硬件與軟件設備，只要準備好兩個基本工具就好

   1.瀏覽器，IE，Google Chrome或者火狐瀏覽器

2. 純文本編輯軟件

   HTMl是標準的文件格式，任何一種純文本編輯軟件都可以編輯HTMl文件，例如記事本

眼來學習HTML5已經一個多月了，就在一個多星期前，我們結束了第一階段的學習和階段檢測。教導我們第一階段的老師很好，不僅技術很牛，而且還很有趣，有時會和我們嘮嘮嗑，給我們緊張的學習中帶來許多樂趣。

沒來之前，我也是各種糾結，沒有辦法拿定注意，不知道前景怎么樣，不知道能學習到什么程度。

初中時的學習很辛苦，高中時的學習很緊張，這里的學習和高考前的狀態，會感覺到有些像，但卻又有滿滿的充實感。既然已經決定了走上這條路，我一定會全力以赴，堅持到最后。

經過自己的努力真的掌握了很多HTML5編程的知識，像HTML的常用標簽和css的常用樣式，現在自己在不翻看筆記的情況下，都能夠熟練寫出來。并且也能快速熟練地寫出一個web端和移動端的頁面出來。感覺網頁布局，常用的就是div盒模型，彈性盒子，怪異盒子，響應式布局，和后臺常用的自適應兩欄布局等等。

此外IE瀏覽器的兼容性問題也很重要，例如：IE6默認最小高度，類似于谷歌最小顯示12px，此時可通過overflow-hidden解決。當子元素的高度或者寬度超過父元素給的寬度時，會直接誠達父元素;IE6雙邊距問題可通過添加：display：inline解決等等。

現在的階段我們開始學習JavaScript，更多的是需要一定的邏輯思維。老師一直強調學習要有方法，課后要復習，要總結，課前需要預習新知識。我相信經過自己的努力一定能學好HTML5編程，找到一份滿意的工作。