淺析HTML5的優(yōu)勢及對于SEO的影響

什么是 HTML5

HTML5 是繼 HTML4.01, XHTML 1.0 和 DOM 2 HTML 后的又一個(gè)重要版本，旨在消除富 Internet 程序（RIA）對 Flash， Silverlight， JavaFX 一類瀏覽器插件的依賴。

HTML5 概要

HTML5 帶來很多新功能，以及 HTML 代碼上的改變，你需要使用一些特定的 API 腳本，如：

DOM
實(shí)現(xiàn) 2D 繪圖的 Canvas 對象
可控媒體播放
離線存儲
文檔編輯
拖放
跨文檔消息
瀏覽器歷史管理
MIME 類型和協(xié)議注冊

HTML5可以提供：

在用戶的可用性和友好體驗(yàn)上帶來一些改進(jìn)；
新的標(biāo)簽，這將有助于開發(fā)人員定義重要的內(nèi)容；
可以給站點(diǎn)帶來更多的多媒體元素(視頻和音頻)；
可以很好的替代FLASH和Silverlight；
當(dāng)涉及到網(wǎng)站的抓取和索引的時(shí)候，對于SEO很友好；
將被大量用戶移動應(yīng)用程序和游戲。

那些支持 HTML5 的瀏覽器在處理 HTML 代碼錯(cuò)誤的時(shí)候必須更靈活，而那些不支持 HTML5 的瀏覽器將忽略 HTML5 代碼。

HTML 語法的變化

HTML5 引入了新的 HTML 元素和屬性，有的是傳統(tǒng)通用元素的語義化版本，如取代  div 元素的 nav, footer 等元素，也有一些全新的元素，如 audio, video。一些在 HTML4 中不被推薦使用的元素，如 font 和 center 將被棄用。HTML5 引入的新 HTML 元素包括：

article：文章
aside：內(nèi)容旁邊的側(cè)邊欄內(nèi)容
audio：音頻
canvas：2D 繪圖
command：命令按鈕
datalist：下拉選擇框
details：對象的細(xì)節(jié)
dialog：對話框
embed：外部插件或?qū)ο?br style="box-sizing: border-box;"/>figure：一組媒體對象以及標(biāo)簽文字
footer：頁腳
header：頁首
hgroup：文檔某一部分的信息
keygen：表單生成的 Key
mark：標(biāo)注的文字
meter：預(yù)先定義的范圍內(nèi)的度量
nav：導(dǎo)航條
output：輸出
progress：進(jìn)度條
rp：標(biāo)識 rubby 內(nèi)容
rt：rubby 內(nèi)容的解釋
ruby：rubby 內(nèi)容
section：定義一個(gè)部分
source：媒體的資源
time：日期時(shí)間
video：視頻

這些新標(biāo)簽，可以讓你的 HTML 文檔更容易加載，且更容易被搜索引擎抓取其中的有用信息。比如，搜索引擎可以直接抓取它最關(guān)心的 article 標(biāo)簽里面的內(nèi)容。

HTML5 同那些流行的技術(shù)如何共存

如今的 Web 世界已經(jīng)習(xí)慣了各種插件和 API，HTML5 為 Web 開發(fā)與設(shè)計(jì)者帶來了方便與不便，HTML5 將如何同現(xiàn)在的這些流行技術(shù)共存？

HTML5 與 Flash

這個(gè)爭論由來已久，F(xiàn)lash 被某些開發(fā)設(shè)計(jì)者濫用導(dǎo)致一些網(wǎng)頁加載緩慢，而 HTML5 為之帶來一線曙光。拿仍在襁褓中的 HTML5 和已經(jīng)有10年歷史的 Flash 進(jìn)行比較也許有失公允，但這是人人都關(guān)心的一個(gè)問題。相對 Windows 用戶來說，Mac 用戶可能會從 HTML5 獲得更多好處，因?yàn)樘O果一直不愿支持 Flash。下面是 Mike Chambers 針對 Mac 和 Windows 平臺瀏覽器的 CPU 負(fù)載而做的一部分測試：

測試顯示，Mac 平臺的 Flash 表現(xiàn)要差于  Windows 平臺，這還取決于你使用的瀏覽器?，F(xiàn)在看來，就視頻游戲而言，F(xiàn)lash 是更好的選擇，但取決于你的瀏覽器，如果你的視頻不是很復(fù)雜，HTML5 是更好的選擇。Web開發(fā)與設(shè)計(jì)者從這些爭論中應(yīng)該吸取的東西是，F(xiàn)lash 之外還有別的選擇，但 Flash 有牢固的地盤，在為客戶提供開發(fā)設(shè)計(jì)的時(shí)候，需要對他們的目標(biāo)客戶做一些研究。

HTML5 與 Ajax

現(xiàn)在的 HTML 語言的一個(gè)問題是，它是一種輕量級的應(yīng)用界面，那些喜歡使用 Ajax 實(shí)現(xiàn)在線應(yīng)用的開發(fā)者會發(fā)現(xiàn) HTML 非常不好用。Ajaxwith.com 認(rèn)為，HTML 適合用來加載界面，JavaScript 用來執(zhí)行命令，雖然 HTML 在作為界面語言方面并不好用，但鑒于多數(shù)開發(fā)者對它的熟悉程度，HTML 還是不可缺少。

一個(gè)好消息就是，HTML5 會讓 Ajax 應(yīng)用的實(shí)現(xiàn)變得更容易。

HTML5 with CSS

你需對你的 CSS 代碼就行整理以支持 HTML5，因?yàn)?h1, h2 之類的標(biāo)簽將不再使用，為了實(shí)現(xiàn)同 HTML5 的兼容，最好的方式是使用 CSS reset，將那些常見的 HTML 標(biāo)簽的 CSS 屬性清零，woork 認(rèn)為，最好的 CSS Reset 是 Eric Meyers CSS reset。

HTML5和Google

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

HTML5與SEO

一、使搜索引擎更加容易抓去和索引

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

二、提供更多的功能，提高用戶的友好體驗(yàn)

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

三、可用性的提高，提高用戶的友好體驗(yàn)

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

可以肯定的是，越來越多的SEOer開始研究對于HTML5站點(diǎn)的優(yōu)化，對于搜索引擎來說，他們也會不斷的更新算法來適應(yīng)HTML5的發(fā)展。

HTML5 可能對移動 Web 帶來更多好處，原因是，現(xiàn)在的移動 Web，iPhone 占主導(dǎo)地位，而 iPHone 是不支持 Flash 的。HTML5 還會讓其它平臺的移動瀏覽器有更快的網(wǎng)頁加載速度。另一個(gè)好處是 SEO，Google 4月9號宣布，將頁面加載速度作為搜索排名的一個(gè)因素，因此，基于 HTML5 的頁面也會因加載速度更快而受益。