1.HTML文檔的後綴名: .hmtl和.htm都可以使用。
2.< img src=”/images/logo.png” width=”258” height=”39” />中如果width和height不設置，瀏覽器就不會給圖像預留位置，然後再檢查每一個圖像文件，然後他們的屏幕空間，會給文檔帶來非常大的延遲，如果設置了width和height就會給圖片預留位置。加速文檔顯示。
3.< meta http-equiv=”refresh” content=”30”> 每30秒鐘刷新當前頁面
4.
5.HTMl5新增表單標籤：datalist，keygen，output
6.iframe這個框架並不主流了。它的優缺點如下：
優點：
1.能原封不動的吧嵌入的網頁展現出來。
2.如果一個網站中很多頁面有公共的頭部和尾部。那麼可以使用iframe，只需要修改iframe中的內容，便可以維護所有的頭部和尾部，增加了代碼的重用。
3.如果遇到加載緩慢的的第三方內容和圖標，可以由iframe來解決。
缺點：
1.會產生很多頁面，不容易管理。
2.不容易打印。
3.瀏覽器的後退按鈕無效。
4.搜索引擎的爬蟲無法很好的處理iframe中的內容，iframe不利於搜索引擎的優化。
5.多數小型移動設備，無法完全顯示框架，設備的兼容性差。
6.多框架的頁面會增加服務器的http請求，對應大型網站是不可取的。
目前框架的所有優點可以使用Ajax實現，因此已經沒必要使用框架了。
7.關於html的加載順序問題
首先順序加載，到head中的時候如果引用了外部文件，開始運行的時候就會下載這些被引用的文件，當遇到script標籤的時候，瀏覽器停止解析，並不停止下載，然後把控制權交給javascript引擎，如果script中也引用了外部腳本，那麼也一起下載，否則就立即執行。執行完畢後吧控制權交給瀏覽器渲染引擎。
head中的代碼解析完畢，會開始解析body中的代碼，如果head中引用的外部文件沒有下載完畢，就會繼續下載。和head的順序一樣如果遇到body中有script標籤，同樣要把控制權交給javascript引擎。script完事之後，如果有img標籤，瀏覽器會想服務器清求圖片，然後瀏覽器會接着向下執行，圖片清求完畢之後，如果img中設置有width和height的值，瀏覽器會直接放入預留好的位置之中，如果沒有width和height，則瀏覽器沒有給img標籤預留位置，那麼瀏覽器就會重新渲染這部分代碼。
注意：
1.如果js是外部文件，那麼可以在script中添加defer=“true”，這樣會使js和DOM並行加載，待頁面加載完畢之後在執行js文件，這樣就不存在阻塞的問題了。
2.如果js是外部文件，那麼可以在script中添加async = “true”,這個屬性告訴瀏覽器該js文件是異步加載執行的，也就是不依賴其他js和css，但是無法保證js文件的加載順序，但是同樣與DOM有並行加載的效果。
3.同時使用defer和async屬性，defer屬性會失效。
8.http超文本傳輸協議，https安全超文本傳輸協議，ftp文件傳輸協議，file自己計算機上的文件。
9.HTML5中新定義的8個語義元素
header
section
footer
aside
nav
main
article
figure
10.HTML5各大主流瀏覽器都支持，ie瀏覽器在ie9也會支持HTML5，要想讓ie9之前的版本兼容HTML5，就要使用shiv包來解決這個問題。
我們可以使用 Sjoerd Visscher 創建的 “HTML5 Enabling JavaScript”, ” shiv” 來解決該問題。
在< head>中加入如下代碼：
< !–[if lt IE 9]>
< script
src=”http://cdn.static.runoob.com/libs/html5shiv/3.7/html5shiv.min.js”>< /script>
< ![endif]–>
11.HTML5大頭：Canvas
Canvas標籤只是一個簡單的容器，一個可以讓你在上面畫畫的容器，其實叫做畫布來的更爲妥當一些，，好比一個div，但是canvas可不是塊級元素，可以設置大小，如果不設置的時候，筆者在谷歌和搜狗瀏覽器上的測試的都是300*150的默認寬高，默認情況下canvas沒有邊框和元素，你可以使用style = “border:1px soild #000000” 來給你的canvas畫布指定一個邊框。
canvas本身是沒有繪圖能力的，所有的繪製工作必須在javascript內部完成。
HTML:
< canvas id=’myCanvas’ width = ‘200’ height=’100’>< /canvas>
Javascript:
var c = document.getElementById(‘myCanvas’);
var ctx = c.getContext(‘2d’);
ctx就是你的繪畫的畫筆，你要問我爲什麼這樣寫，emmmmm，我也不知道，看教程上都這麼寫的。
解析是這樣的：
javascript代碼的第一句：找到canvas元素
第二句：創建context對象
emmmmm，就這麼多，雲裏霧裏的。
需要注意一點的是：
當然canvas中有很多的方法和使用文檔，傳送門走起：
菜鳥教程：canvas
ps：別理解錯了，這個網站教程就是叫菜鳥教程。。。。。別說，寫的還挺好。哈哈
12.HTML5:內聯SVG
什麼是SVG呢？SVG是指可伸縮矢量圖形（Scalable Vector Graphics）最重要的一點是SVG圖像在放大或者改變尺寸的情況下圖形質量不會有損失。並且SVG還是萬維網的標準。
他和Canvas一樣有自己的一套教程。
13.HTML5：拖放（Drag和drop）
在HTML5中任何元素都可以拖放，首先要設置這個元素的draggable = “true”；
在拖動的元素上添加ondragstart()和setData();
放到何處：
在放置拖動元素的元素上設置ondragover和ondrap；
傳送門走起：菜鳥教程：HTML5拖放
14.HTML5地理定位
HTML5的地理定位Geolocation API用於獲取用戶的地理位置，鑑於該特性可能會侵犯用戶的隱私，所以除非用戶同意，否則用戶的地理位置信息是不可用的。
可以使用navigator.geolocation.getCurrentPosition(showPosition);
全局方法，直接用就可以，參數爲一個函數，這個函數有一個參數，如下：
showPosition（position）
position就是全局方法給showPostition的一個對象，position對象中使用
position.coords.latitude 獲取緯度信息。
position.coords.longitude 獲取經度信息。
其實經度和緯度對我們來說其實並不太關心，因爲我們對經度和緯度，也沒有什麼概念，我們更關心的是我在哪個省份？，我在那個城市？
其實百度和谷歌這兩家公司早就給我們定好了地圖的API直接調用就行，利用ajax傳遞經緯地信息，百度和谷歌的API會返回給我們省份和城市。
15.HTML5：視頻（video）
直到現在，仍不存在一項在網頁上顯示視頻的標準。
視頻大多是通過插件（例如：Flash）來顯示的，然而，並非所有的瀏覽器都擁有同樣的插件，HTML5規定了一中通過video元素來包含視頻的標準方法。
先上代碼：
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
您的瀏覽器不支持Video標籤。
</video>< video>是HTML5的新標籤聲明一個視頻組件，width和height不用說了，定義寬高，controls是給這個視頻一套默認的控制檯，比如開始播放，拖放進度條，調大調小音量等。如果不寫controls，就沒有這個默認的控制檯。< video>
中可以寫很多< source>瀏覽器將使用第一個可識別的格式進行播放。
還有< video>中的文字是爲了在瀏覽器不兼容HTML5的時候給用戶的提醒文字。
注意：
當前video只支三個格式：MP4 WebM 和Ogg。
一臉蒙逼，難道不應該是，MP4,Rmvb，avi之類的麼，這後面的是什麼東西？我的想法和你一樣。
16.HTML5:音頻
唉！求csdn的markdown編輯器上線實時保存功能，剛寫的一部分的video和所有的音頻audio在我不小心點擊了關閉按鈕之後，東西全都沒了。
頭疼
傳送門：HTML5：音頻
17.HTML5:新的Input類型
擁有多個新的表單輸入類型，新的輸入類型是爲了更好的輸入控制和驗證。
當然並不是所有的瀏覽器都支持新的Input類型，但是你仍然可以使用他們，在瀏覽器不支持的時候，新的input類型將會顯示爲常規文本。
有很多我就不一一列舉了
傳送門走起：HTML5:新的Input框
18.HTML5：表單新元素
HTML5的表單新元素有三個，分別是：
datalist：蘋果瀏覽器不支持，其他均可，但是筆者測試，搜狗瀏覽器不好使
keygen：ie不支持。其他均可
output：ie不支持，其他均可
19.HTML5:表單新屬性
A：atuocomplete屬性（form和input中都有這個屬性）
簡單來說就是填寫記錄，你填寫過的東西都會記錄下來，等下一次填寫的時候會出現你以前填寫過的東西，但是筆者剛纔試了很久，沒成功。。。
B：novalidate屬性（form）
如果在表單中添加了novalidate屬性，那麼表單提交時，不會驗證你輸入的是否正確的，均可提交。
C：autofocus屬性（input）
這個屬性規定，在頁面加載時，那個input會自動獲得焦點。
D：form屬性（input）
當你的input框在form表單之外時，設置form屬性=“form表單的id”，在這個表單提交時，仍然可以把form表單之外的這個input框一同提交。
E：formaction屬性（input type=‘submit’）
這個屬性用於描述表單提交的URL地址。
個人感覺很雞肋的屬性，這個屬性用在type = ‘submit’或者type=‘image’（？？？）
當用在submit上的時候，這個屬性會覆蓋from表單中的action屬性。
話說我直接在action屬性中更改不行麼？
F：formenctype屬性（input type=‘submit’）
這個屬性描述了表單提交到服務器的數據編碼（只對form表單中method=‘post’表單）覆蓋了form元素中的enctype屬性。
G：formmethod屬性（input type=‘submit’）
又是個覆蓋的，這次覆蓋的是form元素的method屬性。
H：formnovalidate屬性（input）
這個屬性控制的是input框在提交的時候是否驗證，有的話就不驗證。這個驗證不是自己的js代碼驗證，而是input中的type所自帶的驗證，比如type = ‘email’
I：formtarget屬性（input type=‘submit’）
又是一個覆蓋的，這次覆蓋的是form中的target。
J:required屬性（input）
這個屬性規定必須在提交之前填寫輸入域。
K：pattern屬性
可以在input中嵌入正則表達式
傳送門：form表單新屬性
20.HTML5語義元素
語義元素也就是有意義的元素。一個語義元素能夠清楚的描述其意義給瀏覽器和開發者。
像div，或者span這種事無語義的元素，無需考慮內容。
HTML5中新增加了很多語義元素，如下：
header
nav
section
aritcle
aside
figcaption
figure
footer
常用的語義元素的作用如下：
其中有兩個不常見的figure和figcaptioin
< figure>標籤規定獨立的流內容（圖像、圖表、照片、代碼等等）。
< figure> 元素的內容應該與主內容相關，但如果被刪除，則不應對文檔流產生影響。
< figcaption> 標籤定義 < figure> 元素的標題.
< figcaption>元素應該被置於 “figure” 元素的第一個或最後一個子元素的位置。
注意：除了figcaption，其他均爲塊級元素。
兼容ie8或者更早版本的ie版本，仍然要引用HTML5 Shiv javascript腳本來解決ie的兼容問題。
21.HTML5 Web存儲
簡單的介紹：HTML5 web存儲，一個比cookie更好的本地存儲方式。
兼容性問題：e7以及更早的版本不支持web存儲。
大小：5M
cookie：4k
客戶端存儲數據的兩個對象爲：
localStorage 和sessionStorage。
localStorage–用於長久的保存整個網站的數據，保存的數據沒有過期時間，知
道手動去除。
sessionStorage–用於臨時保存同一窗口（或標籤頁）的數據，在關閉窗口或標籤頁之後，將會刪除這些數據。
在使用時遷應該檢查一下瀏覽器是否支持webStorage
if(Storage == 'undefined'){
//支持localStorage sessionStorage對象
}else{
//不支持web存儲
}localStorage對象的存儲沒有時間限制，不管多久，只要沒有手動刪除，數據依然可用。常用的一些函數如下：
不管是localStorage或者是sessionStorage可使用的API都是一樣的：
保存數據：localStorage.setItem(key,value);
讀取數據：localStorage.getItem(key);
刪除單個數據：localStorage.removeItem(key);
刪除所有數據：localStorage.clear();
得到某個索引的key：localStorage.key(index);
22.HTML5:應用程序緩存
筆者並沒有實踐這個功能，也只是瞭解了一下，傳送門讓你們能更好的理解：
HTML5：應用程序緩存
23.HTML5:Web Workers
簡單介紹：web worker是運行在後臺的javascript，不會影響頁面性能。
也就是異步，關於同步，異步，還有javascript的運行機制。
我推薦阮一峯老師的“JavaScript運行機制：再談Event Loop”
avaScript 運行機制詳解：再談Event Loop
不得不說，阮一峯老師寫的教程是真的好，清晰易懂，很是敬佩。
如果是我們寫的話。
首先我們要檢測瀏覽器是否支持webwork，和地理定位一樣直接if
if(typeof(Worker)=='undefined'){//注意一定要大寫
//你的瀏覽器支持web worker
}else{
//你的瀏覽器不支持web worker
}然後創建一個web worker的文件，後綴名爲.js，也就是我們最熟悉的javascript文件。在這個文件中寫代碼，就像在HTML頁面中的< script>標籤中寫代碼一樣。
在HTML頁面中，我們創建一個web worker對象。
if(typeof(Worker)=='undefined'){
w = new Worker('demo.js');
}else{
}
然後關於兩個頁面的信息交流，包括HTML到.js文件，或者.js文件到HTML。
傳送門：web worker 詳解
23.HTML5:WebSocket
WebSocket是HTML5開始提供的一種在單個 TCP 連接上進行全雙工通訊的協議。在WebSocket API中，瀏覽器和服務器只需要做一個握手的動作，然後，瀏覽器和服務器之間就形成了一條快速通道。兩者之間就直接可以數據互相傳送。瀏覽器通過 JavaScript 向服務器發出建立 WebSocket 連接的請求，連接建立以後，客戶端和服務器端就可以通過 TCP 連接直接交換數據。當你獲取 Web Socket 連接後，你可以通過 send() 方法來向服務器發送數據，並通過 onmessage 事件來接收服務器返回的數據。
這裏有詳細的websocket教程：阮一峯老師：websocket教程
最近看了很多阮一峯老師寫的文章，任何東西不會了，先去網站上把不會的東西打上，然後在後面加一個阮一峯，如果阮老師寫了教程，我會感覺到一絲絲的安心，也許是真的喜歡這個人的文章吧。
在這也推薦一下阮一峯老師的個人博客：阮一峯的個人網站