由平面設計的角度開始去理解HTML的構成
我最早開始做網頁是高中時期，當初還在播接，各校的BBS都還興盛，入口網站是奇摩、蕃薯藤，最大的網路社團是cityfamily。 巴哈姆特還只是個學生做的BBS站。

當年我學會了用右鍵"檢視原始碼" 開始抄寫我分享插畫創作時需要的<img src="">
這是我最早接觸到的HTML。

現在回頭看，HTML其實是一種網頁作者用來和瀏覽器溝通的語言。作者用不同的標籤來告訴瀏覽器這些被輸入的內容應該做什麼樣的呈現。

比如
<a href="">連結文字來表示鍊出網址</a>
<img src="表示圖片">

也就是網頁上面所有構成的元素都是用不同的 tag (標籤)來標示作用讓瀏覽器知道要怎麼呈現。

換句話說，我們人眼看的網頁是瀏覽器看完HTML之後展示出來的結果。
所以常聽到的 IE、firfox、chrome 呈現不一制的問題就是來自於不同瀏覽器對於HTML的解讀有所不同。

在程式底的學習者來說，HTML的理解是以DOM(文件模型)為概念被理解， DOM 樹其實在網頁設計來說可以簡單的理解為... 就是HTML，因為HTML裡面充滿我們標示過的內容，告訴瀏覽器現在應該有什麼行為，網頁在被讀取時會由最上方第一行開始被讀取、解析，就像一根樹由根往上長開枝散葉一樣。
所謂的 DOM 也就是指網頁由 HTML 組成時整個文件本身元素的分佈及組合，而網頁設計的基本就是在一個文件裡不停的增加內容，然後用hTML及其他方式標示用途後交給瀏覽器解析，最後變成我們看到的網頁。

所以在接觸HTML時不用太擔心，就像學語言一樣，只是要知道用什麼詞來表示可以讓瀏覽器知道你現在希望這個內容被怎麼呈現，如此而已。

在實作上，會用到的HTML也沒有想像中多，一開始需要掌握的只有幾個像

<a> 表示錨點
<img> 表示圖片
<div> 表示群組的容器
<table> 表示表格

除了用 tag 能表示該內容的用途之外，每個tag 裡都還可以增加一些參數式的說明來讓瀏覽器理解並做出更多我們需要的行為，比如：

<a href="" title="" alt="" align="">
這段HTML用來表示
a這個錨點 連結到某個地方、標題是什麼、跑不出來時用什麼內容來替代，往哪個方向對齊等等。

所以接觸HTML時只要耐心的去理解每個 tab 的意思及明白他有什麼參數可以指定就可以娛快的運用了，其實HTML的重點就在於，如何正確的告訴瀏覽器我想要的效果，如此而已。

chibc-blog 同步