網(wǎng)頁(yè)設計HTML5基礎知識和特性

　　HTML5是用于取代1999年所制定的HTML4.01和XHTML1.0標準的HTML標準版本，現在仍處于發(fā)展階段，但大部分瀏覽器已經(jīng)支持某些HTML5技術(shù)。HTML5有兩大特點(diǎn)：首先，強化了Web網(wǎng)頁(yè)的表現性能。其次，追加了本地數據庫等Web應用的功能。廣義論及HTML5時(shí)，實(shí)際指的是包括HTML、CSS和JavaScript在內的一套技術(shù)組合。它希望能夠減少瀏覽器對于需要插件的豐富性網(wǎng)絡(luò )應用服務(wù)（plug-in-basedrichinternetapplication，RIA)，如AdobeFlash、MicrosoftSilverlight，與OracleJavaFX的需求，并且提供更多能有效增強網(wǎng)絡(luò )應用的標準集。

　　Html5特性

　　A.語(yǔ)義特性（Class：Semantic）

　　HTML5賦予網(wǎng)頁(yè)更好的意義和結構。更加豐富的標簽將隨著(zhù)對RDFa的，微數據與微格式等方面的支持，構建對程序、對用戶(hù)都更有價(jià)值的數據驅動(dòng)的Web。

　　B.本地存儲特性（Class:OFFLINE&STORAGE）

　　基于HTML5開(kāi)發(fā)的網(wǎng)頁(yè)APP擁有更短的啟動(dòng)時(shí)間，更快的聯(lián)網(wǎng)速度，這些全得益于HTML5APPCache，以及本地存儲功能。IndexedDB（html5本地存儲最重要的技術(shù)之一）和API說(shuō)明文檔。

　　C.設備兼容特性(Class:DEVICEACCESS)

　　從Geolocation功能的API文檔公開(kāi)以來(lái)，HTML5為網(wǎng)頁(yè)應用開(kāi)發(fā)者們提供了更多功能上的優(yōu)化選擇，帶來(lái)了更多體驗功能的優(yōu)勢。HTML5提供了前所未有的數據與應用接入開(kāi)放接口。使外部應用可以直接與瀏覽器內部的數據直接相連，例如視頻影音可直接與microphones及攝像頭相聯(lián)

　　D.連接特性（Class:CONNECTIVITY）

　　更有效的連接工作效率，使得基于頁(yè)面的實(shí)時(shí)聊天，更快速的網(wǎng)頁(yè)游戲體驗，更優(yōu)化的在線(xiàn)交流得到了實(shí)現。HTML5擁有更有效的服務(wù)器推送技術(shù)，Server-SentEvent和WebSockets就是其中的兩個(gè)特性，這兩個(gè)特性能夠幫助我們實(shí)現服務(wù)器將數據’推送’到客戶(hù)端的功能。

　　E.網(wǎng)頁(yè)多媒體特性(Class:MULTIMEDIA)

　　支持網(wǎng)頁(yè)端的Audio、Video等多媒體功能，與網(wǎng)站自帶的APPS，攝像頭，影音功能相得益彰。

　　F.三維、圖形及特效特性（Class:3D,Graphics&Effects）

　　基于SVG、Canvas、WebGL及CSS3的3D功能，用戶(hù)會(huì )驚嘆于在瀏覽器中，所呈現的驚人視覺(jué)效果。

　　G.性能與集成特性（Class:Performance&Integration）

　　沒(méi)有用戶(hù)會(huì )永遠等待你的Loading——HTML5會(huì )通過(guò)XMLHttpRequest2等技術(shù)，幫助您的Web應用和網(wǎng)站在多樣化的環(huán)境中更快速的工作。

　　H.CSS3特性(Class:CSS3)

　　在不犧牲性能和語(yǔ)義結構的前提下，CSS3(css2手冊-CSS3手冊)中提供了更多的風(fēng)格和更強的效果。此外，較之以前的Web排版，Web的開(kāi)放字體格式（WOFF）也提供了更高的靈活性和控制性。

　　HTML5重要標記

　　程序接口

　　除了原先的DOM接口，HTML5增加了更多API,如：

　　1．用于即時(shí)2D繪圖的Canvas標簽

　　2．定時(shí)媒體回放

　　3．離線(xiàn)數據庫存儲

　　4．文檔編輯

　　5．拖拽控制

　　6．瀏覽歷史管理

　　元素變化

　　新的解析順序新的元素：section,video,progress,nav,meter,time,aside,canvasinput

　　元素的新屬性：日期和時(shí)間，email,url。

　　新的通用屬性：ping,charset,async

　　全域屬性：id,tabindex,repeat。

　　移除元素：center,font,strike。

　　異常處理

　　HTML5(text/html)瀏覽器將在錯誤語(yǔ)法的處理上更加靈活。HTML5在設計時(shí)保證舊的瀏覽器能夠安全的忽略掉新的HTML5代碼。與HTML4.01相比，HTML5給出了解析的詳細規則，力圖讓不同的瀏覽器即使在發(fā)生語(yǔ)法錯誤時(shí)也能返回相同的結果。

　　HTML5可以提供:

　　1.提高可用性和改進(jìn)用戶(hù)的友好體驗;

　　2.有幾個(gè)新的標簽，這將有助于開(kāi)發(fā)人員定義重要的內容；

　　3.可以給站點(diǎn)帶來(lái)更多的多媒體元素(視頻和音頻)；

　　4.可以很好的替代FLASH和Silverlight；

　　5.當涉及到網(wǎng)站的抓取和索引的時(shí)候，對于SEO很友好；

　　6.將被大量應用于移動(dòng)應用程序和游戲。

　　因此，我們可以說(shuō)HTML5有一天將是WEB更加的美好，但是有一天并不是現在。我們不能不提到重要的一點(diǎn)：迄今為止，并沒(méi)有什么流行的瀏覽器可以完全的支持所HTML5規范的所有功能。需要明確的是，今天的主流瀏覽器都將趨于支持HTML5，但是仍存在許多不完全的支持或兼容。

　　谷歌和HTML5

　　2010年5月22日，谷歌創(chuàng )建了一個(gè)涂鴉來(lái)紀念PacMan的視頻游戲。這個(gè)涂鴉是一個(gè)動(dòng)畫(huà)，同時(shí)也是一個(gè)可以玩的PacMan的游戲。這個(gè)涂鴉就是谷歌通過(guò)使用HTML5標準制作的，當然谷歌也提供一個(gè)FLASH版本來(lái)支持不兼容HTML5的瀏覽器。我敢打賭，這是大多數互聯(lián)網(wǎng)網(wǎng)民第一次和HTML5的接觸。對于個(gè)人來(lái)說(shuō)，這是一個(gè)興奮的消息。以我的觀(guān)點(diǎn)，這個(gè)涂鴉提供了一個(gè)機會(huì )可以窺視未來(lái)互聯(lián)網(wǎng)、網(wǎng)頁(yè)、移動(dòng)應用軟件和游戲等發(fā)展趨勢。對于搜索引擎優(yōu)化，他開(kāi)辟了我更多的想象，它讓我思考HTML5在SEO領(lǐng)域的潛力。網(wǎng)站轉移到HTML5標準對于SEO有什么優(yōu)勢?

　　HTML5與SEO

　　一：使搜索引擎更加容易抓取和索引

　　對于一些網(wǎng)站，特別是那些嚴重依賴(lài)于FLASH的網(wǎng)站HTML5是一個(gè)大福音。如果你有一個(gè)都是FLASH的站點(diǎn)，你就一定會(huì )看到切換到HTML5的好處。首先，搜索引擎的蜘蛛將能夠抓去你的站點(diǎn)和索引你的內容。所有嵌入到動(dòng)畫(huà)中的內容將全部可以被搜索引擎讀取。在搜索引擎優(yōu)化的基本理論中，這一方面將會(huì )驅動(dòng)你的網(wǎng)站獲得更多的右擊流量。

　　二：提供更多的功能，提高用戶(hù)的友好體驗

　　使用HTML5的另一個(gè)好處就是它可以增加更多的功能。對于HTML5的功能性問(wèn)題，我們可以從全球幾個(gè)主流站點(diǎn)對它的青睞就可以看出。社交網(wǎng)絡(luò )大亨Facebook已經(jīng)推出他們期待已久的基于HTML5的iPad應用平臺，潘多拉最近也推出他們基于HTML5的音樂(lè )播放器的新版本。游戲平臺Zynga最近也在推出了三款新的在移動(dòng)設備瀏覽器上運行的基于HTML5的游戲等等。每天都有不斷的基于HTML5的網(wǎng)站和HTML5特性的網(wǎng)站被推出。保持站點(diǎn)處于新技術(shù)的前沿，也可以很好的提高用戶(hù)的友好體驗。

　　三：可用性的提高，提高用戶(hù)的友好體驗

　　最后我們可以從可用性的角度上看，HTML5可以更好的促進(jìn)用戶(hù)于網(wǎng)站間的互動(dòng)情況。多媒體網(wǎng)站可以獲得更多的改進(jìn)，特別是在移動(dòng)平臺上的應用，使用HTML5可以提供更多高質(zhì)量的視頻和音頻流。到目前位置，事實(shí)就是iPhone和iPad將不會(huì )支持FLASH，同時(shí)ADOBE公司也在近期公開(kāi)聲明將停止FLASH基于移動(dòng)平臺的開(kāi)發(fā)，現在我們已經(jīng)可以這么說(shuō)移動(dòng)平臺日后視頻音頻是HTML5的天下。