H5最全面解讀

php中世界最好的语言原創: 2018-03-08 09:38:082463瀏覽

這次帶給大家H5最全面解讀，深入理解H5,使用H5的注意事項有哪些，下面就是實戰案例，一起來看一下。

官方：HTML5概念

HTML5是用於取代1999年所製定的HTML 4.01 和XHTML 1.0 標準的HTML 標準版本，現在仍處於發展階段，但大部分瀏覽器已經支持某些HTML5 技術。 HTML 5有兩大特色：首先，強化了 Web 網頁的表現效能。其次，追加了本地資料庫等 Web 應用的功能。廣義論及HTML5時，實際指的是包括HTML、CSS和JavaScript在內的一套技術組合。它希望能夠減少瀏覽器對於需要插件的豐富性網路應用服務（plug-in-based rich internet application，RIA)，如Adobe Flash、Microsoft Silverlight，與Oracle JavaFX的需求，並且提供更多能有效增強網路應用的標準。

現狀

現在的網路圈開口閉口就談H5，朋友圈裡被廣泛轉發的是H5，各種招募要求精通H5，隨著市場需求量，出現了H5工程師職位，隨即湧現一大批H5工程師，H5的字眼甚至出現在設計師的履歷中。彷彿手機端的html佈局就叫做H5。

絕大多數人口中的H5到底是什麼？

2015堪稱H5元年，各大企業、品牌都紛紛把目光投向了HTML5，一夜間各式各樣的H5如雨後春筍般冒出，創意、招式層出不窮。然而辛苦做了一年H5，成品很多，真正能火的卻沒有幾個。這不禁讓許多品牌方陷入深思：到底怎樣才能把一個H5玩到極致，達到有效的傳播效果？
實際上，一個成功的H5行銷必須具備三個因素：洞察人性、高可玩性、品牌巧露出。近日，一個刷爆朋友圈的「全球爆猛料」H5遊戲正是完全符合了以上三點，一夜成「網紅」。
如果用五個字形容當今網友的特性，那就是：趣味、炫耀、參與感、好玩、跟風。只有深諳人性，對症下藥，才能做出讓使用者自主願意二次傳播的H5。

所以，綜上所述，人們口中的H5指的不是HTML5，而是**某種在微信****等行動端看上去酷炫能****夠提升公司格調順便亮瞎訪客鈦合金狗眼頓升膜拜之心****就算沒有內容也能被廣泛轉發分享的一種東西。是行銷概念中的H5.

我（前端開發人員）眼裡的H5

目標：

HTML5的目標是為了能夠創建更簡單的Web程序，書寫出更簡潔的HTML程式碼。例如：為了讓Web應用程式的開發變得更加容易，提供了許多的API；為了讓HTMl變得更簡潔，開發出了新的屬性、元素等等。整體來說，為下一代Web平台提供了許許多多的新功能以及新標準。

HTML5深受歡迎的理由

H5被說成是劃時代也好，具有革命性也好，如果不能被業界承認並且大面積的推廣使用，這些都是沒有意義的。事實上，H5已經被世界知名瀏覽器廠商所支援。

1、時代的要求。

現在的時代已經迫切的要求有一個統一的網路通用標準。 H5出現之前的情況是，由於各瀏覽器之間的不同意，光是修改Web瀏覽器之間的兼容性而引起的bug就浪費了大量的時間。而H5得出現使得Web開發進入一個新的時代，在這個平台上，視訊、音訊、圖像、動畫、以及同電腦的互動都被標準化。

2、IE8的支持。

IE對於web開發者的意義，大家都懂的。現在市佔率最高的IE瀏覽器也在針對H他做出積極對應，微軟也對新的網路通用標準表示了贊同和支援。例如：
h5中代替cookie的sessionStorage功能與globalStorage功能在ie8得到了支持，使用ajax時如果點擊返回按鈕也可以真正讓操作返回了。

H5要解決的三個問題

1、web瀏覽器之間的差異和相容性。
2、舊的標準文檔結構不夠明確。
3、web應用程式的功能收到了限制。

H5新標準知識點羅列

1、新增元素/屬性廢除元素/屬性、佈局結構。
2、原生表單驗證
3、canvas繪製圖形（多用於資料視覺化）
4、多媒體相關API（video、audio）
5、History Api歷史記錄（用於前端路由管理）
6、本地儲存（web storage、indexedDb資料庫）
7、離線應用程式（瀏覽器與伺服器互動）
8、檔案API（filelist物件、blob物件、 filereader物件、Base64編碼支援）
9、通訊API（跨文件訊息傳輸、webSockets通訊）
10、WebRtc通訊（瀏覽器偵測、P2P通訊、穿越防火牆、多人通訊等）
11 、拓展的XMLHttpRequest Api（跨域）
12、Web Workers執行緒處理
13、取得地理位置
14、拖放API與通知API
等等

#相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！