一、html5是什么意思

Html5是Hyper Text Markup Language 5英文首字母的縮寫(xiě)，是構(gòu)建Web內(nèi)容的一種語(yǔ)言描述方式。HTML5是構(gòu)建以及呈現(xiàn)互聯(lián)網(wǎng)內(nèi)容的一種語(yǔ)言方式，被認(rèn)為是互聯(lián)網(wǎng)的核心技術(shù)之一。HTML5 技術(shù)結(jié)合了 HTML4.01 的相關(guān)標(biāo)準(zhǔn)并革新，符合現(xiàn)代網(wǎng)絡(luò)發(fā)展要求，提供更多增強(qiáng)網(wǎng)絡(luò)應(yīng)用的標(biāo)準(zhǔn)。與傳統(tǒng)的技術(shù)相比，HTML5 的語(yǔ)法特征更加明顯，并且結(jié)合了 SVG 的內(nèi)容。這些內(nèi)容在網(wǎng)頁(yè)中使用可以更加便捷地處理多媒體內(nèi)容，而且 HTML5中還結(jié)合了其他元素，對(duì)原有的功能進(jìn)行調(diào)整和修改，進(jìn)行標(biāo)準(zhǔn)化工作。

二、html5新特性

HTML5將Web帶入一個(gè)成熟的應(yīng)用平臺(tái)，在這個(gè)平臺(tái)上，視頻、音頻、圖像、動(dòng)畫(huà)以及與設(shè)備的交互都進(jìn)行了規(guī)范。

1、智能表單

表單是實(shí)現(xiàn)用戶與頁(yè)面后臺(tái)交互主要組成部分，HTML5在表單的設(shè)計(jì)上功能更加強(qiáng)大。input類型和屬性的多樣性大大地增強(qiáng)了HTML可表達(dá)的表單形式，再加上新增加的一些表單標(biāo)簽，使得原本需要Javascript來(lái)實(shí)現(xiàn)的控件，可以直接使用HTML5的表單來(lái)實(shí)現(xiàn)；一些如內(nèi)容提示、焦點(diǎn)處理、數(shù)據(jù)驗(yàn)證等功能，也可以通過(guò)HTML5的智能表單屬性標(biāo)簽來(lái)完成。

2、繪圖畫(huà)布

HTML5的canvas元素可以實(shí)現(xiàn)畫(huà)布功能，該元素通過(guò)自帶的API結(jié)合使用JavaScript腳本語(yǔ)言在網(wǎng)頁(yè)上繪制圖形和處理，擁有實(shí)現(xiàn)繪制線條、弧線以及矩形，用樣式和顏色填充區(qū)域，書(shū)寫(xiě)樣式化文本，以及添加圖像的方法，且使用JavaScript可以控制其每一個(gè)像素。HTML5的canvas元素使得瀏覽器無(wú)需Flash或Silverlight等插件就能直接顯示圖形或動(dòng)畫(huà)圖像。

3、多媒體

HTML5最大特色之一就是支持音頻視頻，在通過(guò)增加了<audio>、<video>兩個(gè)標(biāo)簽來(lái)實(shí)現(xiàn)對(duì)多媒體中的音頻、視頻使用的支持，只要在Web網(wǎng)頁(yè)中嵌入這兩個(gè)標(biāo)簽，而無(wú)需第三方插件（如Flash）就可以實(shí)現(xiàn)音視頻的播放功能。HTML5對(duì)音頻、視頻文件的支持使得瀏覽器擺脫了對(duì)插件的依賴，加快了頁(yè)面的加載速度，擴(kuò)展了互聯(lián)網(wǎng)多媒體技術(shù)的發(fā)展空間。

4、地理定位

現(xiàn)今移動(dòng)網(wǎng)絡(luò)備受青睞，用戶對(duì)實(shí)時(shí)定位的應(yīng)用越來(lái)，要求也越來(lái)越高。HTML5通過(guò)引入Geolocation的API可以通過(guò)GPS或網(wǎng)絡(luò)信息實(shí)現(xiàn)用戶的定位功能，定位更加準(zhǔn)確、靈活。通過(guò)HTML5進(jìn)行定位，除了可以定位自己的位置，還可以在他人對(duì)你開(kāi)放信息的情況下獲得他人的定位信息。

5、數(shù)據(jù)存儲(chǔ)

HTML5較之傳統(tǒng)的數(shù)據(jù)存儲(chǔ)有自已的存儲(chǔ)方式，允許在客戶端實(shí)現(xiàn)較大規(guī)模的數(shù)據(jù)存儲(chǔ)。為了滿足不同的需求，HTML5支持DOM Storage和Web SQL Database 兩種存儲(chǔ)機(jī)制。其中，DOM Storage 適用于具有key/value對(duì)的基本本地存儲(chǔ)；而WebSQLDatabase是適用于關(guān)系型數(shù)據(jù)庫(kù)的存儲(chǔ)方式，開(kāi)發(fā)者可以使用SQL語(yǔ)法對(duì)這些數(shù)據(jù)進(jìn)行查詢、插入等操作。

6、多線程

HTML5利用Web Worker將Web應(yīng)用程序從原來(lái)的單線程業(yè)界中解放出來(lái)，通過(guò)創(chuàng)建一個(gè)Web Worker對(duì)象就可以實(shí)現(xiàn)多線程操作。JavaScript創(chuàng)建的Web程序處理事務(wù)都是在單線程中執(zhí)行，響應(yīng)時(shí)間較長(zhǎng)，而當(dāng)JavaScript過(guò)于復(fù)雜時(shí)，還有可能出現(xiàn)死鎖的局面。HTML5新增加了一個(gè)WebWorkerAPI，用戶可以創(chuàng)建多個(gè)在后臺(tái)的線程，將耗費(fèi)較長(zhǎng)時(shí)間的處理交給后臺(tái)面不影響用戶界面和響應(yīng)速度，這些處理不會(huì)因用戶交互而運(yùn)行中斷。使用后臺(tái)線程不能訪問(wèn)頁(yè)面和窗口對(duì)象，但后臺(tái)線程可以和頁(yè)面之間進(jìn)行數(shù)據(jù)交互。子線程與子線程之間的數(shù)據(jù)交互，大致步驟如下：

①先創(chuàng)建發(fā)送數(shù)據(jù)的子線程；

②執(zhí)行子線程任務(wù)，把要傳遞的數(shù)據(jù)發(fā)送給主線程；

③在主線程接受到子線程傳遞回的消息時(shí)創(chuàng)建接收數(shù)據(jù)的子線程，然后把發(fā)送數(shù)據(jù)的子線程中返回的消息傳遞給接收數(shù)據(jù)的子線程；

④執(zhí)行接收數(shù)據(jù)子線程中的代碼。

三、html5新標(biāo)簽

為了更好地處理今天的互聯(lián)網(wǎng)應(yīng)用，HTML5添加了很多新元素及功能，比如： 圖形的繪制，多媒體內(nèi)容，更好的頁(yè)面結(jié)構(gòu)，更好的形式 處理，和幾個(gè)api拖放元素，定位，包括網(wǎng)頁(yè) 應(yīng)用程序緩存，存儲(chǔ)，網(wǎng)絡(luò)工作者等。

1、canvas

<canvas>：標(biāo)簽定義圖形，比如圖表和其他圖像。該標(biāo)簽基于 JavaScript 的繪圖 API。

2、多媒體

<audio>：定義音頻內(nèi)容

<video>：定義視頻（video 或者 movie）

<source>：定義多媒體資源 <video> 和 <audio>

<embed>：定義嵌入的內(nèi)容，比如插件。

<track>：為諸如 <video> 和 <audio> 元素之類的媒介規(guī)定外部文本軌道。

3、表單

<datalist>：定義選項(xiàng)列表。請(qǐng)與 input 元素配合使用該元素，來(lái)定義 input 可能的值。

<keygen>：規(guī)定用于表單的密鑰對(duì)生成器字段。

<output>：定義不同類型的輸出，比如腳本的輸出。

4、語(yǔ)義和結(jié)構(gòu)

HTML5提供了新的元素來(lái)創(chuàng)建更好的頁(yè)面結(jié)構(gòu)：

<article>：定義頁(yè)面獨(dú)立的內(nèi)容區(qū)域。

<aside>：定義頁(yè)面的側(cè)邊欄內(nèi)容。

<bdi>：允許您設(shè)置一段文本，使其脫離其父元素的文本方向設(shè)置。

<command>：定義命令按鈕，比如單選按鈕、復(fù)選框或按鈕

<details>：用于描述文檔或文檔某個(gè)部分的細(xì)節(jié)

<dialog>：定義對(duì)話框，比如提示框

<summary>：標(biāo)簽包含 details 元素的標(biāo)題

<figure>：規(guī)定獨(dú)立的流內(nèi)容（圖像、圖表、照片、代碼等等）。

<figcaption>：定義 <figure> 元素的標(biāo)題

<footer>：定義 section 或 document 的頁(yè)腳。

<header>：定義了文檔的頭部區(qū)域

<mark>：定義帶有記號(hào)的文本。

<meter>：定義度量衡。僅用于已知最大和最小值的度量。

<nav>：定義導(dǎo)航鏈接的部分。 [11]

<progress>：定義任何類型的任務(wù)的進(jìn)度。

<ruby>：定義 ruby 注釋（中文注音或字符）。

<rt>：定義字符（中文注音或字符）的解釋或發(fā)音。

<rp>：在 ruby 注釋中使用，定義不支持 ruby 元素的瀏覽器所顯示的內(nèi)容。

<section>：定義文檔中的節(jié)（section、區(qū)段）。

<time>：定義日期或時(shí)間。

<wbr>：規(guī)定在文本中的何處適合添加換行符。

5、使用 CSS3

新選擇器

新屬性

動(dòng)畫(huà)

2D/3D 轉(zhuǎn)換

圓角

陰影效果

可下載的字體

6、已移除標(biāo)簽

以下的 HTML 4.01 元素在HTML5中已經(jīng)被刪除：

<acronym>

<applet>

<basefont>

<big>

<center>

<dir>

<font>

<frame>

<frameset>

<noframes>

<strike>

四、html5的優(yōu)點(diǎn)

1、代碼簡(jiǎn)潔

HTML5網(wǎng)頁(yè)的冗余代碼比傳統(tǒng)網(wǎng)頁(yè)要少很多，極大方便了程序員和用戶。

2、全新的標(biāo)簽，網(wǎng)站定義更豐富

相對(duì)于舊版本的HTML，HTML5新增了很多語(yǔ)義標(biāo)簽，網(wǎng)站定義起來(lái)更為細(xì)致。

3、網(wǎng)站優(yōu)化更簡(jiǎn)單

HTML5的全新標(biāo)簽對(duì)搜索引擎友好，對(duì)網(wǎng)站優(yōu)化來(lái)說(shuō)更為方便。

4、用戶體驗(yàn)度好

網(wǎng)站各種酷炫的效果利用HTML5技術(shù)都能實(shí)現(xiàn)，而且HTML5正以前所未有的姿態(tài)顛覆這人們對(duì)網(wǎng)頁(yè)設(shè)計(jì)的想象。

5、拓展用戶瀏覽渠道

HTML5技術(shù)對(duì)用戶是十分友好的，能支持多終端自適應(yīng)，無(wú)論用戶喜歡用手機(jī)平板還是電腦看網(wǎng)站，HTML5網(wǎng)站都能滿足。

6、支持網(wǎng)站多媒體元素

以前的網(wǎng)站，過(guò)多的圖片和視頻不僅拖慢網(wǎng)站加載速度，對(duì)搜索引擎收錄也是很不利的。有了HTML5技術(shù)，大家可以隨意在網(wǎng)站上添加各種多媒體元素，完全不受限制。

7、可移植性好

一套完整的HTML5對(duì)開(kāi)發(fā)者來(lái)說(shuō)可以適用于多個(gè)設(shè)計(jì)，不用重新修改。

8、開(kāi)發(fā)費(fèi)用相對(duì)較低

由于HTML5網(wǎng)站的兼容性好，用戶開(kāi)發(fā)一個(gè)網(wǎng)站后就不用另外開(kāi)發(fā)移動(dòng)站，一定程度上節(jié)省了大筆資金。

五、html5缺點(diǎn)

1、短連接 互動(dòng)難

眾所周知，HTML5頁(yè)面和用戶之間建立的是短連接，這就使得用戶一旦離開(kāi)了HTML5頁(yè)面便再也無(wú)法主動(dòng)觸達(dá)。

2、依賴瀏覽器 資源利用難

現(xiàn)如今，一個(gè)小小的手機(jī)也已經(jīng)十分的強(qiáng)大，擁有大量的資源。而H5想要利用這些資源卻必須要通過(guò)瀏覽器。而瀏覽器的兼容性問(wèn)題一直都是HTML各個(gè)版本的標(biāo)準(zhǔn)的兼容性問(wèn)題。

3、用戶標(biāo)識(shí) 個(gè)性化功能難

不同于APP的用戶標(biāo)識(shí)，H5的用戶標(biāo)識(shí)是站點(diǎn)隨機(jī)分配的一串唯一碼，而這個(gè)唯一碼被存儲(chǔ)在瀏覽器的緩存中，一旦緩存被清除或者瀏覽器被卸載，用戶就會(huì)丟失，即使同一個(gè)用戶來(lái)訪問(wèn)，站點(diǎn)也不會(huì)識(shí)別出，而解決這個(gè)問(wèn)題的唯一辦法就是用戶登錄。

而對(duì)于用戶來(lái)說(shuō)體會(huì)不到個(gè)性化帶來(lái)的好處就不會(huì)登錄，用戶不登錄就沒(méi)有辦法體會(huì)個(gè)性化相關(guān)功能，這就走到了一個(gè)無(wú)限循環(huán)的死胡同。

4、交互有限 運(yùn)行速度難

HTML5產(chǎn)品的設(shè)計(jì)，通常交互都比較簡(jiǎn)單，以點(diǎn)擊、鼠標(biāo)滑動(dòng)為主，動(dòng)畫(huà)都比較少見(jiàn)，這就使得HTML5的交互十分有限。

而HTML5的運(yùn)行速度與瀏覽器的內(nèi)核解析速度有關(guān)。大家都知道，HTML5的運(yùn)行代碼要從網(wǎng)絡(luò)取回來(lái)以后才可能載入瀏覽器的內(nèi)核中運(yùn)行。這樣就使得在沒(méi)有網(wǎng)絡(luò)的情況下，HTML5基本就沒(méi)有什么作用了，這給用戶的體驗(yàn)感覺(jué)也就差了。

六、html5和html的區(qū)別

1、文檔類型聲明區(qū)別

在HTML 5中，Doctype聲明非常簡(jiǎn)單易用，Doctype聲明在HTML中太長(zhǎng)且復(fù)雜。

2、矢量圖形的區(qū)別

HTML5支持SVG，畫(huà)布和其他虛擬矢量圖形，而在HTML中，只有將它與Flash，Silver-light等不同技術(shù)結(jié)合在一起才能使用矢量圖形。

3、音頻和視頻支持的區(qū)別

HTML如果不使用Flash播放器支持，它不支持音頻和視頻。HTML5使用<audio>和<video>標(biāo)簽來(lái)支持音頻和視頻控制。

4、結(jié)構(gòu)語(yǔ)義區(qū)別

html：沒(méi)有體現(xiàn)結(jié)構(gòu)語(yǔ)義化的標(biāo)簽，如：<div id="nav"></div>

html5：添加了許多具有語(yǔ)義化的標(biāo)簽，如：<article>、<aside>、<audio>、<bdi>...

相對(duì)于HTML，HTML5中新增和修改了一些元素。

5、語(yǔ)法的處理

HTML無(wú)法處理不準(zhǔn)確的語(yǔ)法；HTML5能夠處理不準(zhǔn)確的語(yǔ)法。

6、新增表單控件

HTML5新增了新的表單控件，例如：日期和時(shí)間，電子郵件，數(shù)字，范圍，電話，網(wǎng)址，搜索等。

7、新增屬性

charset，async和ping的屬性是HTML 5的一部分，HTML中不存在charset，async和ping等屬性

8、新增應(yīng)用程序支持

增強(qiáng)了對(duì)Web應(yīng)用程序功能的支持：在HTML5允許瀏覽器作為應(yīng)用程序平臺(tái)運(yùn)行不需要使用任何基于JS或Flash的方法，因?yàn)镠TML5中固有的元素提供了所有功能。

9、新增互動(dòng)元素

新增加的<menu>和<menuitem>元素是互動(dòng)元素規(guī)格的成分，但不經(jīng)常使用或開(kāi)發(fā)者社區(qū)津津樂(lè)道。但是，這兩個(gè)項(xiàng)目可用于確保增強(qiáng)的Web交互<menu>性。為簡(jiǎn)單起見(jiàn)，標(biāo)簽用于表示移動(dòng)和桌面應(yīng)用程序中的菜單命令。

七、html5的意義

1、對(duì)于互聯(lián)網(wǎng)領(lǐng)域來(lái)說(shuō)，HTML5不再只是一種標(biāo)記語(yǔ)言，它為下一代Web提供了全新的框架和平臺(tái)，包括提供免插件的視頻、圖像動(dòng)畫(huà)、本體存儲(chǔ)以及更多酷炫而且重要的功能，并使這些應(yīng)用標(biāo)準(zhǔn)化，從而使Web能夠輕松實(shí)現(xiàn)類似桌面的應(yīng)用體驗(yàn)。

2、對(duì)于編程人員來(lái)說(shuō)，HTML5的特點(diǎn)是具有革命性的，特別是其豐富的標(biāo)簽體系，類似于內(nèi)置了很多快捷鍵，將取代那些完成比較簡(jiǎn)單任務(wù)的插件，可以降低應(yīng)用開(kāi)發(fā)的技術(shù)門(mén)檻;

3、對(duì)于SEO來(lái)說(shuō)，HTML5有利于搜索引擎抓取和索引網(wǎng)站內(nèi)容，能夠提供更多的功能和更好的用戶體驗(yàn)，有助于提高網(wǎng)站的可用性和互動(dòng)性;

4、對(duì)于企業(yè)來(lái)說(shuō)，HTML5能夠改變企業(yè)網(wǎng)絡(luò)廣告的模式與分布，助力傳統(tǒng)企業(yè)IT應(yīng)用移動(dòng)化，幫助企業(yè)構(gòu)建應(yīng)用平臺(tái)。

八、html5常見(jiàn)問(wèn)題

1、如果我不輸入<!DOCTYPE HTML>，HTML 5能工作嗎？

No，瀏覽器將無(wú)法識(shí)別HTML文件，并且HTML 5標(biāo)簽將無(wú)法正常工作。

2、哪些瀏覽器支持HTML 5？

幾乎所有的瀏覽器都支持HTML 5，例如Safari，Chrome，火狐，Opera，IE等。

3、SVG是什么？

SVG表示（scalable vector graphics）可縮放矢量圖形。這是一個(gè)基于文本的圖形語(yǔ)言，它可以繪制使用文本、線、點(diǎn)等的圖形，因此可以輕巧又快速地渲染。

4、HTML 5中的本地存儲(chǔ)概念？

很多時(shí)候，我們想在本地計(jì)算機(jī)存儲(chǔ)有關(guān)用戶的信息。例如，假設(shè)用戶已經(jīng)填滿了一半的長(zhǎng)表單，互聯(lián)網(wǎng)卻突然連接中斷。此時(shí)，用戶希望能在本地存儲(chǔ)這些信息，然后當(dāng)重新連接到互聯(lián)網(wǎng)的時(shí)候，獲取這些信息，并將其發(fā)送到服務(wù)器進(jìn)行存儲(chǔ)。

現(xiàn)代的瀏覽器存儲(chǔ)稱為"本地存儲(chǔ)"，可以讓你存儲(chǔ)這些信息。

5、HTML5表單對(duì)數(shù)字字段有任何限制嗎？

是，HTML5表單存在一些限制。 如果位數(shù)大于picture子句中指定的計(jì)數(shù)，則數(shù)字不會(huì)本地化，并以英語(yǔ)區(qū)域設(shè)置顯示。

最后總結(jié)

優(yōu)化猩SEO：HTML5是構(gòu)建以及呈現(xiàn)互聯(lián)網(wǎng)內(nèi)容的一種語(yǔ)言方式，它是web中核心語(yǔ)言HTML的規(guī)范，HTML5賦予網(wǎng)頁(yè)更好的意義和結(jié)構(gòu)。

參考鏈接：

HTML5_百度百科

https://baike.baidu.com/item/HTML5/4234903

html5網(wǎng)站的優(yōu)點(diǎn)和缺點(diǎn)有哪些-前端問(wèn)答-PHP中文網(wǎng)

https://m.php.cn/article/488111.html

html和html5有什么區(qū)別-html教程-PHP中文網(wǎng)

https://m.php.cn/article/483607.html

修改于2023-09-04