HTML（HyperText Markup Language）是一種超文本標記語言，用于創(chuàng)建網(wǎng)頁的標準標記語言艺蝴。它是一種基礎(chǔ)技術(shù)猬腰，常與CSS、JavaScript一起被眾多網(wǎng)站用于設(shè)計令人賞心悅目的網(wǎng)頁猜敢、網(wǎng)頁應(yīng)用程序以及移動應(yīng)用程序的用戶界面姑荷。網(wǎng)頁瀏覽器可以讀取HTML文件盒延，并將其渲染成可視化網(wǎng)頁。
在認識HTML之前鼠冕，先分清楚一下 HTML 添寺、 XML 、XHTML 這三者的區(qū)別供鸠。
HTML畦贸、XML、XHTML 這三者之間有什么區(qū)別楞捂？
- HTML是用于創(chuàng)建Web的標準的標記語言。旨在顯示信息趋厉。
- XML（Extensible Markup Language） 指可擴展標記語言寨闹，它也是一種標記語言，不過它的標簽沒有被預(yù)定義君账，需自定義標簽繁堡，通常用來傳輸和存儲數(shù)據(jù)。（W3C的推薦標準）
- XHTML是根據(jù)HTML 4 和 XML 1.0重組而成乡数，是更嚴格更純凈的 HTML 代碼椭蹄。由于HTML的語法較為松散，對于許多其他設(shè)備的要求較高因此就出現(xiàn)了由DTD定義規(guī)則,語法要求更加嚴格的XHTML净赴。
XHTML與HTML的區(qū)別
- 最大的變化在于所有標簽必須閉合绳矩。
- 所有的標簽必須小寫。
- 元素必須被正確地嵌套玖翅。
- 文檔必須擁有根元素翼馆。
更多內(nèi)容訪問:
XML簡介 - W3School
為什么使用XHTML - W3School
<br />
從一個HTML的頭部開始說起：
文檔聲明（DTD）
文檔聲明 就是寫在最前面的部分，叫做文件類型定義（DTD）金度。且聲明必須在 HTML 文檔的第一行（這并不是一個 HTML 標簽）
聲明的作用為了告訴瀏覽器該文件的類型应媚。讓瀏覽器解析器知道應(yīng)該用哪個規(guī)范來解析文檔。
嚴格模式 又稱標準模式猜极，是指瀏覽器按照 W3C 標準解析代碼中姜；
混雜模式 又稱兼容模式，不加文檔聲明跟伏，允許瀏覽器使用自己的方式來渲染頁面丢胚。
如<!doctype> 就是用來聲明文檔對象模型，用來告訴瀏覽器應(yīng)該使用哪種方式來解析渲染頁面酬姆。而<!doctype html>就是聲明使用HTML5來解析渲染頁面嗜桌。
而常用的DOCTYPE聲明還有許多。
<br />
meta標簽
meta標簽用來提供有關(guān)頁面的元信息辞色，下面是一些常見的meta標簽及其作用骨宠。
<meta name="keywords" content="your tags" />頁面關(guān)鍵詞浮定，每個網(wǎng)頁應(yīng)具有描述該網(wǎng)頁內(nèi)容的一組唯一的關(guān)鍵字，便于搜索引擎搜索层亿。<meta name="description" content="150 words" />頁面描述桦卒，每個網(wǎng)頁都應(yīng)有一個不超過 150 個字符且能準確反映網(wǎng)頁內(nèi)容的描述標簽。<meta http-equiv="refresh" content="0;url=" />頁面重定向和刷新：content內(nèi)的數(shù)字代表多少時間（秒）后自動刷新匿又，如果加url,則會重定向到指定網(wǎng)頁方灾。<meta http-equiv="X-UA-Compatible" content="IE=6" >使用IE6 ,或者使用IE7、8碌更。<meta http-equiv="Cache-Control" content="no-siteapp" />轉(zhuǎn)碼申明：用百度打開網(wǎng)頁可能會對其進行轉(zhuǎn)碼（比如貼廣告）裕偿，這樣可避免轉(zhuǎn)碼。<meta http-equiv="cache-control" content="no-cache" />不緩存該網(wǎng)頁痛单。
<br />
HTML標簽
在學(xué)習(xí)使用HTML的標簽時要注意閉合標簽與一些自閉和標簽的區(qū)別使用嘿棘，并且要知道實現(xiàn)后的效果，可以參考W3cSchool或MDN頁面的內(nèi)容旭绒。而在博客中羅列這些標簽的意義則不是十分大鸟妙，應(yīng)該自主學(xué)習(xí)。
<br />
--- 在使用HTML時要注意HTML 語義化和表現(xiàn)內(nèi)容挥吵、樣式重父、行為分離原則 ---
HTML語義化
語義化的HTML 就是根據(jù)內(nèi)容的結(jié)構(gòu)化（內(nèi)容語義化），選擇合適的標簽（代碼語義化）忽匈，便于開發(fā)者閱讀和寫出更優(yōu)雅的代碼的同時讓瀏覽器的爬蟲和機器很好地解析房午。
語義化的網(wǎng)頁的優(yōu)點：
- 即使在沒有CSS的情況下，頁面也能呈現(xiàn)出較好的內(nèi)容結(jié)構(gòu)脉幢；
- 有利于SEO： 和搜索引擎建立良好溝通歪沃，有助于爬蟲抓取更多的有效信息；
- 語義 Web 技術(shù)有助于利用基于開放標準的技術(shù)嫌松，從數(shù)據(jù)沪曙、文檔內(nèi)容或應(yīng)用代碼中分離出意義。
H5新增了許多語義化標簽萎羔，可以參考該文章 —— HTML 5的革新——語義化標簽
關(guān)于SEO優(yōu)化 液走， 可以參考 搜索引擎優(yōu)化
<br />
表現(xiàn)內(nèi)容、樣式贾陷、行為分離原則
在寫網(wǎng)頁的時候缘眶，我們知道HTML負責(zé)表現(xiàn)內(nèi)容，CSS負責(zé)樣式髓废，而JS就是行為巷懈。
- 寫HTML時，需要盡量的考慮語義化與結(jié)構(gòu)慌洪，使得在沒有樣式的情況下也能表現(xiàn)的清晰良好顶燕。并且盡量不要把樣式寫在HTML中
- 在寫JS時凑保， 盡量不要使用JS去 操作樣式，而是通過添加刪除類來控制樣式的變化涌攻。
這樣的分離欧引，一方面是使得文檔的內(nèi)容顯現(xiàn)的更加清晰，也使得后期的閱讀與維護更加方便恳谎。
<br />
常見瀏覽器及其內(nèi)核
| 瀏覽器名稱 | 內(nèi)核 |
|---|---|
| Safari | WebKit |
| Chrome | Blink（WebKit的分支） |
| Opera | Presto |
| FireFox | Geckos |
| IE | Trident |
<br />
瀏覽器的亂碼問題
常見編碼集有：UTF-8 UTF-16 GBK Unicode
注 ： 更多參考 編碼的發(fā)展 芝此，可以對亂碼產(chǎn)生的原因有更好的理解。
瀏覽器出現(xiàn)亂碼的原因：
- 在制作頁面時使用非英文字符時因痛，保存的編碼格式與瀏覽器解析時的解碼格式不匹配（即與meta中指定的解析格式不一樣）
- 沒有指定meta的charset
solution： 在頁面保存時就在HTML的<head>標簽下添加<meta charset="">來聲明編碼格式婚苹，來告訴瀏覽器應(yīng)該用什么解碼格式來解碼。即指定正確的charset值鸵膏。
例如： 使用UTF-8來編碼的頁面租副，添加<meta charset="UTF-8">`來告訴瀏覽器使用UTF-8格式來解碼，就不會出現(xiàn)亂碼了较性。（并非所有亂碼問題都可以使用UTF-8格式編碼來解決）
