學習要點:
1.HTML5 的歷史
2.HTML5 的功能
3.HTML5 的特點
4.課程學習問題
主講教師:李炎恢
HTML5 是繼 HTML4.01 和 XHTML1.0 之后的超文本標記語言的最新版本狱从。 它是由一群自由思想者組成的團隊設計出來卸勺,并最終實現(xiàn)多媒體支持绪励、交互性桩卵、更加智能的表單,以及更好的語義化標記。
HTML5 并不僅僅是 HTML 規(guī)范的最新版本,而是一系列用來制作現(xiàn)代富 Web 內(nèi)容的相關技術的總稱脊髓,其中最重要的三項技術分別為:HTML5 核心規(guī)范(標簽元素)、CSS(層疊樣式表第三代)栅受、和 JavaScript将硝。
一.HTML5 的歷史
1993 年 HTML 首次以因特網(wǎng)草案的形式發(fā)布恭朗, 然后經(jīng)歷了 2.0、 3.2 和 4.0依疼, 直到 1999年的 HTML4.01 版本穩(wěn)定下來痰腮。由于發(fā)展緩慢,逐漸的被更加嚴格的 XHTML 取代律罢。
XHTML 的興衰史
自從 HTML4.01 版本之后膀值,掌握著 HTML 規(guī)范的萬維網(wǎng)聯(lián)盟(W3C)組織沒有再發(fā)布新的標準,而是圍繞著 XHTML1.0 以及之后的 XHTML2.0 展開工作误辑。XHTML 是基于 XML沧踏、致力于實現(xiàn)更加嚴格并且統(tǒng)一的編碼規(guī)范的 HTML 版本,解決之前 HTML4.01 版本時稀余,由于編碼不規(guī)范導致瀏覽器的各種古怪行為悦冀。所以趋翻,Web 開發(fā)者對 XHTML 非常的擁護睛琳。XHTML 極大的好處,就是強迫開發(fā)者養(yǎng)成良好的編碼習慣踏烙,放棄 HTML 的凌亂寫法师骗,最終降低了瀏覽器解析頁面的難度,方便移植到更多平臺讨惩。
可是辟癌,越是想往好的方面發(fā)展,往往可能是帶來的卻是毀滅性的災難荐捻,世間萬物就是如此黍少。XHTML2.0 規(guī)范了更嚴格的錯誤處理規(guī)則,強制要求瀏覽器拒絕無效的 XHTML2 頁面处面,強制 Web 開發(fā)者寫出絕對正確規(guī)范的代碼厂置,同時不得向下兼容,摒棄 HTML 遺留的怪異行為和編碼習慣魂角。按理說昵济,取其精華、舍其糟粕應該是好事野揪。但是访忿,這樣的話,數(shù)億的頁面將無法兼容斯稳,Web 開發(fā)者的難度又被加大海铆,并且制定這個標準又太過久遠,最終被拋棄挣惰。
HTML5 的回歸
2008 年 W3C 發(fā)布了 HTML5 的工作草案卧斟,2009 年停止了 XHTML2 計劃系草。又過去大概一年, HTML5 規(guī)范進一步解決了諸多非常實際的問題唆涝, 各大瀏覽器廠商開始對旗下的產(chǎn)品進行升級找都,以便支持 HTML5。這樣廊酣,得益于瀏覽器的實驗反饋能耻,HTML5 規(guī)范得到了持續(xù)的進步和完善藏研,從而迅速融入到 Web 平臺的實質(zhì)性改進中愚争。
和 XHTML2.0 不同, 制定 HTML5 規(guī)范的一群人并不想挑出以往 HTML 的各種毛病為其改正险领,而是盡可能的補全 Web 開發(fā)者急需的各種功能凡辱。這些功能包括更強大的 CSS3戒职、表單驗證、音頻視頻透乾、本地存儲洪燥、地理定位、繪畫(Canvas)乳乌、Web 通信等等捧韵。
二.HTML5 的功能
HTML5 到底涵蓋了哪些功能?這些功能到底在主流的瀏覽器支持情況如何汉操?
1.HTML5 核心:這部分主要由 W3C 官方的規(guī)范組成再来,涉及新的語義元素、新的增強的Web 表單磷瘤、音頻和視頻芒篷、以及通過 JavaScript 繪圖的 Canvas。這部分大多數(shù)主流瀏覽器均得到很好的支持采缚;
2.曾經(jīng)的 HTML5 標準:這部分主要來自于最初制定的 HTML5 規(guī)范针炉,其中大多數(shù)功能需要 JavaScript 且支持富 Web 應用開發(fā)。比如:本地數(shù)據(jù)存儲仰担、離線應用和消息傳遞糊识;3.非 HTML5 標準:這部分通常指下一代功能,雖然從未進入 HTML5 標準摔蓝,但人們還是會把它認做 HTML5 的一部分赂苗。這些包括最為常見的 CSS3,以及很熱門的地理定位贮尉。
對于最為常用且實用的部分拌滋, 基本上主流的瀏覽器都支持的比較好。 而那些特殊需求的部分猜谚,則需要根據(jù)不同的瀏覽器檢測才能知道是否支持自己想要的功能败砂。
三.HTML5 的特點
在 HTML5 發(fā)展的同時赌渣,XHTML2.0 也在不斷發(fā)展,那么到底是哪些特點導致 HTML5 取得最終的勝利呢昌犹?
1.向下兼容
對于 XHTML2.0 要求遵循規(guī)則坚芜,否則不予顯示的方式,HTML5 卻實行“不破壞 Web” 的原則斜姥。也就是說鸿竖,以往已存在的 Web 頁面,還可以保持正確的顯示铸敏。
當然缚忧,面對開發(fā)者,HTML5 規(guī)范要求摒棄過去那些編碼壞習慣和廢棄的標簽元素杈笔;而面對瀏覽器廠商闪水,要求它們兼容 HTML 遺留的一切,以做到向下兼容蒙具。
2.用戶至上
HTML5 遵循“用戶至上”的原則球榆,在出現(xiàn)具體問題時,會把用戶放在第一位店量,其次是開發(fā)者芜果,然后是瀏覽器廠商,最后才是規(guī)范制定者融师。比如,開發(fā)者在編碼時不嚴謹導致本該出現(xiàn)警告或錯誤時蚁吝,卻正常顯示了頁面旱爆。
3.化繁為簡
HTML5 對比之前的 XHTML,做了大量的簡化工作窘茁。具體如下:
(1).以瀏覽器的原生能力代替復雜的 JavaScript怀伦;
(2).DOCTYPE 被簡化到極致;
(3).字符集聲明被簡化山林;
(4).簡單強大的 API房待。
4.無插件范式
在 HTML5 出現(xiàn)之前,很多功能只能通過插件或 hack(如繪圖 API)來實現(xiàn)驼抹,但 HTML5原生提供了這些支持桑孩。使用插件有很多問題,具體如下:
(1).插件安裝容易失斂蚣健流椒;
(2).插件被瀏覽器或軟件禁用屏蔽(如 Flash 插件);
(3).插件經(jīng)常會被爆出漏洞被利用攻擊明也;
(4).插件不容易與 HTML 文檔其他部分集成(比如整體透明化等)宣虾。?
5.訪問通用性
這個原則分為三個概念:
(1).可訪問性:比如更加利于殘障人士的閱讀方案惯裕;
(2).媒體中立:比如 HTML5 的媒體播放在不同設備或平臺均能正常運行;
(3).支持所有語種:比如新元素<ruby>绣硝。
6.引入語義
HTML5 引入了一些用來區(qū)分不同含義和內(nèi)容的標記元素蜻势。 這種方式極大的提供的編碼人員的可讀性和代碼區(qū)域查詢的便利性。
7.引入原生媒體支持
HTML5 的一次大改進救生衣支持在瀏覽器中直接播放視頻和音頻文件鹉胖, 以前都需要借助插件才能實現(xiàn)此類功能咙边。
8.引入可編程內(nèi)容
HTML5 最大的變化就是引入了需要通過 JavaScript 編程才能完全的各種效果, 而這些很多都是 HTML5 原生的次员。那么現(xiàn)在 HTML5 可以理解為 HTML + CSS + JavaScript 的總稱败许。
四.課程學習問題
學習 HTML5 需要一些測試用的瀏覽器、編碼用的開發(fā)工具淑蔚、以及建議推薦的學習方法市殷。
1.瀏覽器選擇
IE9+
Firefox 3.5+
Chrome 3.0+
Safari 3.0+
Opera 10.5+
這里重點要說明一下 IE 瀏覽器。由于歷史和系統(tǒng)綁定原因刹衫,還有相當一部分電腦殘留IE9 以下版本的瀏覽器醋寝。雖然微軟已經(jīng)開始發(fā)表聲明逐步不再維護 IE8,但這部分群體還占有一定的份額带迟。所以音羞,是否要迎合這部分用戶,取決于個人對市場的判斷和成本的考量仓犬。
2.開發(fā)工具
本課程我們使用 Sublime Text3 作為 HTML5 課程的編碼工具嗅绰。使用了 Soda Dark 3作為軟件界面的主題。
3.學習方式
本課程原則上是零基礎搀继、初學者可學窘面,但如果你已經(jīng)有 XHTML 課程基礎,那么學習起來將非常輕松叽躯。當然财边,雖然我們已經(jīng)錄制了 XHTML 基礎,在錄制 HTML5 課程時点骑,還是將所有學員當作剛接觸的初學者來對待酣难。 再當然, 這里所說的零基礎和初學者也是需要一定經(jīng)驗黑滴,因為長期的教學工作憨募,我們接觸到很多連 QQ 不會用、郵件不會發(fā)送跷跪、迅雷不會下載的學員馋嗜。這些學員是初學者之前的、負基礎的學員吵瞻,所以葛菇,如果是初學者一般問題不大甘磨。