html5的優勢分(fēn)析

2018-10-04 10:44

HTML5技術(shù)相(xiàng)對于flash插件(jiàn)優勢就(jiù)是，更清晰，更流暢，對CPU的占用更低，就(jiù)如(rú)同播放(fàng)本地視頻一樣。

HTML5技術(shù)相(xiàng)對于flash技術(shù)能使用本地播放(fàng)器播放(fàng)網頁視頻（比如(rú)iphone不支持flash，也能播放(fàng)網頁上的視頻）而flash相(xiàng)對于html5十分(fēn)吃(chī)CPU，在電腦上還(hái)好點，在手機(jī)上就(jiù)會顯得(de)特别卡。

即便是雙核的手機(jī)，在播放(fàng)優酷和土(tǔ)豆上的高清720P以上的視頻的時候也會卡，最關鍵的是因爲flash非常依靠CPU所以對CPU的占用很大(dà)，在電腦上表現還(hái)不明顯，在手機(jī)上表現就(jiù)是卡和費電（因爲占用很多CPU資源）。
H5之所以能引發如(rú)此廣泛的效應，根本在于它不再隻是一種标記語言，它爲下一代互聯網提供了全新的框架和平台，包括提供免插件(jiàn)的音視頻、圖像動畫(huà)、本體(tǐ)存儲以及更多酷炫而且重要的功能，并使這些應用标準化和開放(fàng)化，從(cóng)而使互聯網也能夠輕松實現類似桌面的應用體(tǐ)驗。
　　H5的最顯著的優勢在于跨平台性，用H5搭建的站(zhàn)點與應用可(kě)以兼容PC端與移動端、Windows與Linux、安卓與IOS。它可(kě)以輕易地移植到各種不同的開放(fàng)平台、應用平台上，打破各自(zì)爲政的局面。這種強大(dà)的兼容性可(kě)以顯著地降低開發與運營成本，可(kě)以讓企業特别是創業者獲得(de)更多的發展機(jī)遇。
　　此外，H5的本地存儲特性也給使用者帶來(lái)了更多便利。基于H5開發的輕應用比本地APP擁有更短(duǎn)的啓動時間，更快(kuài)的聯網速度，而且無需下載占用存儲空間，特别适合手機(jī)等移動媒體(tǐ)。而H5讓開發者無需依賴第三方浏覽器插件(jiàn)即可(kě)創建高級圖形、版式、動畫(huà)以及過渡效果，這也使得(de)用戶用較少的流量就(jiù)可(kě)以欣賞到炫酷的視覺聽覺效果。
正在使用構建器來(lái)避免使用代碼更深入，但(dàn)是關于HTML5的一些最好的東西是代碼中的新元素。在過去(qù)，HTML已經有“标簽”繞過文字，并告訴你(nǐ)的浏覽器它在看(kàn)什麽。

例如(rú)，一些段落文本将如(rú)下所示：

<p>This is paragraph text!</p>

頂層标題将如(rú)下所示：

<h1>This is a heading!</h1>

對于頁面上的許多元素，特别是分(fēn)隔符，HTML隻有一個符号，标簽<div></div>。因此，包含該網站(zhàn)主要内容的框将如(rú)下所示：

<div>This houses all the main content on the site!</div>

側邊欄看(kàn)起來(lái)像這樣：

<div>This is a sidebar!</div>

标題，頁腳，主要内容中的文章(zhāng)等都(dōu)最終不得(de)不使用标簽<div></div>。您可(kě)以想像，這使得(de)開發人(rén)員(yuán)難以合作(zuò)開發項目，因爲更難以理(lǐ)解使用相(xiàng)同标記引用不同元素的數千行代碼。它還(hái)使搜索引擎更難了解網站(zhàn)上的重要内容。

HTML5引入了具有更準确名稱的新元素。所以現在，您的内容的後端如(rú)下所示：

<header>This is a header!</header>

<main>This houses all the main content on the site!</main>

<footer>This is a footer!</footer>

您可(kě)以想像，這使得(de)開發人(rén)員(yuán)更容易創建更好的網站(zhàn)，開發人(rén)員(yuán)創建網站(zhàn)制作(zuò)商使用的模闆，這對于使用HTML5的網站(zhàn)制作(zuò)工(gōng)具來(lái)說(shuō)是一個好點。HTML5元素的另一大(dà)勝利就(jiù)是輕松訪問(wèn)搜索引擎。由于清晰度，新的語義元素給您的代碼，搜索引擎可(kě)以更容易地了解您的網站(zhàn)，使其更容易索引。這是對SEO的正确方向的另一個推動。

多媒體(tǐ)元素
使用較舊版本的HTML，将視頻和音頻添加到網站(zhàn)可(kě)能是一個複雜的過程。現在就(jiù)像使用新的“<audio> </ audio>”和“<video> </ video>”标簽一樣簡單。如(rú)果要在您的網站(zhàn)上放(fàng)置視頻或音頻剪輯，則使用HTML5的構建器可(kě)以無縫地完成。這也是多少網站(zhàn)爲網頁創建視頻背景。如(rú)果您正在尋找一種快(kuài)速的方法來(lái)使您的網站(zhàn)視覺驚豔，則視頻背景可(kě)能是您最好的選擇。

現場速度優化
HTML5還(hái)優化了站(zhàn)點速度，并更有效地利用了設備的能力。這些創新的幾個例子包括：

Web Workers - 此功能通過在後台委托JavaScript事(shì)件(jiàn)使HTML5加載更快(kuài)。
requestAnimationFrame - 此功能可(kě)優化2D和3D動畫(huà)。
還(hái)有更多的功能會讓您理(lǐ)解（并解釋）複雜，但(dàn)您可(kě)以查看(kàn)Mozilla開發人(rén)員(yuán)網絡HTML5頁面上的完整列表。

HTML5＆Bounce Rate
Google很容易找出您的網站(zhàn)加載速度，但(dàn)您的用戶也可(kě)以看(kàn)清楚。如(rú)果一個頁面正在努力出現，用戶離(lí)開。搜索引擎跟蹤訪問(wèn)者在您的網站(zhàn)上停留的時間，并使用該時間來(lái)确定您的“跳(tiào)出率”。跳(tiào)出率是從(cóng)用戶從(cóng)您的網站(zhàn)彈回到另一個網站(zhàn)的平均時間計(jì)算的。不利的“跳(tiào)出率”告訴搜索引擎，他(tā)們不應該将該網站(zhàn)顯示在結果頁面的頂部。