什麼是HTML?HTML5是什麼?HTML5有那些優勢和特性?

来源:https://www.cnblogs.com/shsxt/archive/2018/06/07/9152938.html
-Advertisement-
Play Games

一、什麼是HTML 在瞭解html5之前,首先要說一下html語言,儘管是更新後的5,但很多的地方還是保留了html的優勢。 HTML是HyperText Markup Language超級文本標記語言的縮寫,是標準通用標記語言下的一個應用,也是一種規範,一種標準,它通過標記符號來標記要顯示的網頁中 ...


一、什麼是HTML


在瞭解html5之前,首先要說一下html語言,儘管是更新後的5,但很多的地方還是保留了html的優勢。
 

HTML是HyperText Markup Language超級文本標記語言的縮寫,是標準通用標記語言下的一個應用,也是一種規範,一種標準,它通過標記符號來標記要顯示的網頁中的各個部分。從第一版的出現到現在,html已經經歷了5次的改版,從HTML 2.0到HTML 5,html用自身的優勢證明瞭其在網站中的優勢,以至於替代了古老的C語言編程來架構部分網站。  

HTML有以下特點 :

1、簡易性:超級文本標記語言版本升級採用超集方式,從而更加靈活方便。
2、可擴展性:超級文本標記語言的廣泛應用帶來了加強功能,增加標識符等要求,超級文本標記語言採取子類元素的方式,為系統擴展帶來保證。  3、平臺無關性:雖然個人電腦大行其道,但使用MAC等其他機器的大有人在,超級文本標記語言可以使用在廣泛的平臺上,這也是萬維網(WWW)盛行的另一個原因。  4、通用性:另外,HTML是網路的通用語言,一種簡單、通用的全置標記語言。它允許網頁製作人建立文本與圖片相結合的複雜頁面,這些頁面可以被網上任何其他人瀏覽到,無論使用的是什麼類型的電腦或瀏覽器。 

二、什麼是HTML5

HTML5是HTML(超文本標記語言)的第五次更新的產品,這是一種解釋型的語言,文件的擴展名的尾碼為.htm或者.html的形式,這是眾多廠商聯合開發出來的產品,據說W3C將會在2022年推出標準版。雖然現在仍處於不斷的完善中,但新增的新特性,新功能,不僅能節約Web開發者的時間和周期,還能提升用戶的體驗,更好的為開發者服務。

  在HTML的時代,滿屏的都是div元素,結構混亂,不易閱讀,代碼臃腫。在HTML5中,新增了許多語義化的佈局標簽,比如nav,header,footer,article等,使佈局的網頁結構清晰明瞭。還新增了音頻,視頻,圖像,繪圖,動畫等功能,在以前,這些都是要用flash才能完成的。使用HTML5新增的功能能做出許多酷炫的效果。



三、HTML5特性

 

1、語義特性(Class:Semantic)

  HTML5賦予網頁更好的意義和結構。更加豐富的標簽將隨著對RDFa的,微數據與微格式等方面的支持,構建對程式、對用戶都更有價值的數據驅動的Web。  

2、本地存儲特性(Class: OFFLINE & STORAGE)

  基於HTML5開發的網頁APP擁有更短的啟動時間,更快的聯網速度,這些全得益於HTML5 APP Cache,以及本地存儲功能。Indexed DB(html5本地存儲最重要的技術之一)和API說明文檔。  

3、設備相容特性 (Class: DEVICE ACCESS)

  從Geolocation功能的API文檔公開以來,HTML5為網頁應用開發者們提供了更多功能上的優化選擇,帶來了更多體驗功能的優勢。HTML5提供了前所未有的數據與應用接入開放介面。使外部應用可以直接與瀏覽器內部的數據直接相連,例如視頻影音可直接與microphones及攝像頭相聯。  

4、連接特性(Class: CONNECTIVITY)

  更有效的連接工作效率,使得基於頁面的實時聊天,更快速的網頁游戲體驗,更優化的線上交流得到了實現。HTML5擁有更有效的伺服器推送技術,Server-Sent Event和WebSockets就是其中的兩個特性,這兩個特性能夠幫助我們實現伺服器將數據“推送”到客戶端的功能。  

5、網頁多媒體特性(Class: MULTIMEDIA)

  支持網頁端的Audio、Video等多媒體功能, 與網站自帶的APPS,攝像頭,影音功能相得益彰。  

6、三維、圖形及特效特性(Class: 3D, Graphics & Effects)

  基於SVG、Canvas、WebGL及CSS3的3D功能,用戶會驚嘆於在瀏覽器中,所呈現的驚人視覺效果。  

7、性能與集成特性(Class: Performance & Integration)

  沒有用戶會永遠等待你的Loading——HTML5會通過XMLHttpRequest2等技術,解決以前的跨域等問題,幫助您的Web應用和網站在多樣化的環境中更快速的工作。  

8、CSS3特性(Class: CSS3)

  在不犧牲性能和語義結構的前提下,CSS3中提供了更多的風格和更強的效果。此外,較之以前的Web排版,Web的開放字體格式(WOFF)也提供了更高的靈活性和控制性。

 

四、HTML5的優勢有哪些?

 

1,跨平臺性

    在HTML5到來之前,由於平臺的多樣性,導致每開發一套產品,就要針對不同的平臺開發多套版本,耗費大量的時間和精力,而且還增加了大量的開發成本,而HTML5技術的出現卻能很好的解決這個問題,開發者只要使用一套程式,就能夠很容易的實現多個平臺的展現功能,降低了開發難度,節約了開發時間和成本的投入。  

2,即時更新


之前原生應用上線Appstore,都需要等待很長的審核時間,一旦出現問題需要更新,則還要重新審核,無形中浪費了大量的時間。而HTML5是通過瀏覽器進行載入的,所以不存在這樣的問題,如果出現什麼問題,可以及時的更新上線,不需要等待審核時間。  

3,離線緩存功能

HTML5中最酷的特性就是離線緩存。通過JavaScript提供了數種不同的離線儲存功能,相對於傳統的Cookie而言有更好的彈性以及架構,並且可以儲存更多的內容。它擁有更好的安全和性能,即使瀏覽器關閉後也可以保存。  

4,視頻和音頻的支持

  之前在實現播放媒體功能時,一直是開發者比較痛苦的事情,需要讓你的視頻和音頻通過HTML5標簽和來訪問資源。並且為了它們能正確播放必須賦予一大堆的參數。這樣你就要不斷的重覆標簽,你的代碼也會變得十分繁瑣。現在,這一切都將變的非常簡單。  

5,清晰的代碼

  HTML5可以讓你寫出簡單清晰的代碼。使用HTML5你可以通過使用語義學的HTML header標簽描述內容來最後解決你的div及其class定義問題。讓你的代碼更加清晰易於理解。  

6、現在就用HTML5
 

截至目前而言,主流的網頁瀏覽器Firefox5、Chrome 12和Safari 5都已經支援了許多的HTML5標準,而且目前最新版的IE也支援了許多HTML5標準,隨著使用者陸續升級到新版的瀏覽器,開發者應該在現在就可以招收開發!相容性問題會隨著時間的推移而越來越少。但對於不得不照顧低版本用戶的網站,網上也有大量的相關解決方案。
上海前端培訓編輯整理,更多前端文章推薦:
【上海前端培訓】使用html+css+js實現日曆與定時器》;
Html5前端如何實現文字邊框陰影》;
實現HTML5 移動頁面自適應手機屏幕的4種方法

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 網頁的固定格式 編寫網頁和寫信一樣都有一套規範和要求,這套規範和要求中規定了寫信的固定格式 寫信基本結構 親愛的xx: 你好! 我。。。。。。。。。。。。。。。。。。 。。。。。。 此致 敬禮! xxx 2018年x月x日 編寫網頁的步驟: 一定不用用中文命名文件,要用英文或者拼音 基本結構 ... ...
  • 簡介 在codepen上看到一個Canvas做的下雨效果動畫,感覺蠻有意思的。就研究了下,這裡來分享下,實現技巧。效果可以見下麵的鏈接。 霓虹雨: http://codepen.io/natewiley/full/NNgqVJ/ 效果截圖: Canvas動畫基礎 大家都知道,Canvas其實只是一個 ...
  • 這個圖片里的時間不用都記住,只需要記住一些特殊的,1993年,1995年(在W3C接手以後,才有了真正意義上的標準),1999年這幾個時間 WHATWG的目的是推廣HTML的標準,HTML5是瀏覽器廠商搞得 IETF簡介:IETF是英文Internet Engineering Task Force ...
  • 昨天練習寫了這個小demo,個人覺得通過設置定位元素left和top的值,來實現換行的功能,這種方法很巧妙~ 另外,如下代碼中的隨機顏色的獲取,還請各位前輩多多指教:需要改進的地方;或者有沒有更好的方法。 ...
  • 解決antd-mobile和css module衝突,css module的使用方式 ...
  • 對於前端的學習網上已經有許多教學和建議,但老話說的好:適合自己的才是最好的。所以本人也在此特地整理一下前端方向的學習資料。 搜索引擎 Google 谷歌 Bing 必應 Sougou 搜狗 Baidu 百度 高質量的問答社區 stackoverflow 知乎 前端Web開發資源整理 前端Web開發資 ...
  • 1. 什麼是媒體查詢 媒體查詢可以根據當前顯示設備的特性(如: 視口寬度, 屏幕比例,設備顯示方向)為其添加css樣式, 使用媒體查詢可以在不改變頁面內容的情況下為特定的設備顯示特定的樣式。如果沒有媒體查詢就不能。媒體查詢能夠幫助我們更方便的判斷當前設備特性(視口寬度等),更方便的針對視口設置合適的 ...
  • 有一個一個裝逼的同事,寫了一段代碼 function a(){} a.__proto__.__proto__.__proto__ 然後問我,下麵這個玩意a.__proto__.__proto__.__proto__是啥,然後我一臉懵逼,prototype還知道一點,這個__proto__,還來三個, ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...