初學者必修篇

第四篇
認識 HTML 語法基本架構及組成

適合程度： 初學者 一般程度 進階者 以上均宜
壹、初探神秘的HTML語法：
HTML 英文原譯：HyperText Markup Language，中譯：超文字(件)標記(籤)語言(法)。
HTML 在 1989 年時由 Tim Berners-Lee 所發展出來的，在 1990 年被 WWW 開始採用，並於 1991 年提出 HTML 語法的基本草稿。
由於全世界的人都在使用 HTML 來設計網頁 (WebPage) 構建網站，所以 HTML 的語法必須統一。
因此 W3C (The World Wide Web Consortium) 在 1993 年推出 HTML1.0 版，到了 1995 年 2 月推出 HTML2.0 版。
在同年的 10 月 HTML3.0 版也出爐了，1997 年 10 月已發展到 HTML4.0 版本。
HTML 其實很簡單，它是由兩個部份所組成：一個是內文，另一個是標籤。
內文：凡是在 WebPage 上所看到文字，或影音、圖檔，都是內文。
例如：想要在 WebPage 上出現《這是我第一個家》這幾個字，那就直接在 HTML 文件中打入這些個字便可。
標籤 (Tag)：就是命令，均由簡單的英文語意組成。
例如：我們用鍵盤打出來的字大小都一樣，要讓它在網頁上產生不同變化，就要在 HTML 文件中加上標籤(命令)。
結論：瀏覽器只接受 HTML 標籤(命令)，並按照標籤的指示來產生變化，所以 HTML 標籤是提供瀏覽器解讀用的。
本報相關參考資料：認識網際網路連線前往查看。

貳、進一步瞭解 HTML 標籤：
HTML 標籤很難嗎？其實他非常簡單，因為他們都是由一些最常見的英文字母所組成，像 body、head、center、color 等等。
如果您認得這些英文，您就應該會使用這些標籤了，不用去懂的甚麼是 If...else。
用甚麼撰寫 HTML？從您自己的 PC 中，找到由 Windows 提供的 Notepad 或 WordPad，就可以作為編輯器了。
HTML 標籤長的模樣？HTML 標籤是由大於 < 及小於 > 的符號包覆住，標籤使用英文指令，且不分大小寫。
HTML 特色？他未經編譯很容易取得，屬於結構性的標記語言，可藉由檢視得知原始碼，所以易於學習及使用。
他可跨平台操作，不會因電腦不同而無法使用，更不用設定複雜的變數或呼叫副程式等邏輯觀念。
不像 C++、Basic 程式語言，那麼艱澀難懂。
HTML 如何運作？
瀏覽器在解讀 HTML 語法時，它只看得懂 HTML 語法內的控制標籤，其餘的部份瀏覽器只是負責將他們顯示出來而已。
所以我們要學習如何設計 WebPage，首先就必須要能了解 HTML 有提供那些控制標籤。
HTML 到底是甚麼？
其實 HTML 就是簡單的文字檔 (ASCII) 而已。
不信？
請隨便找個文字檔 (*.txt)，將他另存新檔的方式，存為副檔名為 .htm 或 .html，然後用左鍵連按兩下，便可用瀏覽器打開來看了。
結論：由於 HTML 具有以上特色，所以他並不難懂，只要略懂簡單的英文的人，都可以學會。
詳細標籤解說連線前往查看。
本報相關參考資料：認識 HTML連線前往查看。

參、為何要學 HTML，而不用強大功能的編輯 (FrontPage & Dreamweaver) 軟體呢？
這裡五個主要理由：
因為 HTML 只是純文字檔，用最簡單的 Win9x 以上作業系統內的記事本 (NotePad) 編輯器就可撰寫。
HTML 並不多、也不難，真正常用的只有數十個；用久了自然就會，看的懂最重要。
HTML 已發展到極限 4.0 版，應該不會再有更新的出現，所以您不必擔心要天天追著他跑。
再好的編輯器，也不能完成您心中所想要的模式；因為他是針對方便模式來設計，永遠有新版出來。
學會 HTML 語法，所有的網頁及編輯器都難不倒您；沒有他，您休想將其他程式或語言運用在網頁上。
結論：只有用記事本來寫網頁！您才學的會 HTML 語法，如果只會用 ForntPage 等編輯器，那您永遠也不懂 HTML。
本報相關參考資料：為何要學習 HTML 連線前往查看。

肆、認識 HTML 語法基本架構：
<HTML>
<HEAD>
<TITLE>我第一個家</TITLE>
</HEAD>
<BODY>
<CENTER>
這是顯示圖文、影音的主(本)體位置
</CENTER>
</BODY>
</HTML>
結論：(您一定要很瞭解這個架構，網頁所有的變化就是由此無限展開)
這組【基本架構】的標籤功能介紹 連線前往查看。

伍、從這組 HTML 基本架構中，您發現了甚麼差異？
請先想一想，逐一的記下來，然後再看我的答案 連線前往查看。

陸、控制標籤的格式解說：
標籤《Tags》，簡單說就是命令；標籤一定是英文而且是被大於 < 與小於 > 包裹起來的。
文件內容本身不會任意變化，要讓文件內容有所改變，就得使用各種不同標籤。
語法：<HTML>、<HEAD>......
標籤名稱：各種不同的標籤名稱代表者不同的控制功能。
實例：帽子、衣服、褲子、鞋子.....
語法：<HTML>、<HEAD>、<TITLE>、<BR>、<CENTER >.....
屬性《Attributes》：有些控制標籤須要屬性來加強他的功能。
實例：帽子、衣服的《屬性》便是顏色、廠牌、尺寸....等。
語法：<IMG SRC="xxxxx">、<HR SIZE="N" WIDTH="xx%">、<BODY BGCOLOR="xxxxx">.....
屬性值《Value》：光有屬性描述可能無法獲得完整的目的，所以會再給他更明確的設定值。
實例：白色衣服、三槍牌衣服、XL尺寸衣服，更明確的說明屬性值，也就是上例中的 "xxxxx"。
所以 HTML 語法(標籤)，就是由標籤名稱 (Tags Name)、屬性 (Attributes)、屬性值 (Value) 組成。
控制標籤有對稱型及非對稱型兩種：
對稱型指引是指兩個相同標籤相互對應，如 <TITLE>.....</TITLE>。
後面那個控制標籤的前頭，要記得加上由右往左的斜線 /，這是表示此標籤的作用已結束。
非對稱型指引是指只有單獨一個，便可獨立產生作用：如<BR>。

柒、網頁 (WebPage) 的組成 ：
網頁如果用人的外型來做比喻，他剛好也是由頭 (Head) 及身體 (Body) 所組成。
瀏覽器 (Browser) 內看到的大部份資料、元件等，大都是放在身體 <Body>...</Body> 內。
這裡我要告訴您的是：只要與網路或網頁有關的東西，都是架構在HTML標籤之下課程相關問題協助。
當然，你不寫頭，腳或甚至身體你的網頁依然會讀得懂，但是可能會需要比較多的時間去執行。
本報相關參考資料：認識網頁與需求連線前往查看。

捌、有關撰寫 HTML 文件的基本注意事項：
命令中的大小寫都一樣可以接受，例如 <html> 可以寫成 <HTML> 或 <hTmL>等等。
為配合 ISP 站 UNIX 虛擬主機系統，建議各式檔案含附檔名，均採小寫為宜。
您在 HTML 中打入的多個《連續空白》，在 WebPage 的顯示上會被瀏覽器簡化為一個空白。
例如您在 HTML 中輸入《這空白點是空白點我空白點的空白點家》，會顯示成《這是我的家》。
您在寫 HTML 時，按下 Enter 鍵所做的換下一行，在網頁的顯示上會失效，瀏覽器會視版面安排自動幫您換行。
若您想要自己換行，必須用 <br> 的標籤(命令)。
同一份 HTML 文件，在不同瀏覽器所顯示的 HomePage 畫面可能會有小差異，但不至於影響觀看內容。
要注意的是，有些命令在不同瀏覽器上會失效，例如：閃爍文字可在 Netscape 中顯現效果，但 IE & Mosaic 則不行。
標籤具有層次的相互對稱特性，所以避免重複或不規則安排標籤。
錯誤用法：<tag1><tag2><tag3>文字或元件</tag1></tag2></tag3>。
正確用法：<tag1><tag2><tag3>文字或元件</tag3></tag2></tag1>。
請不要將各式標籤放在超鏈結的標籤內。
錯誤用法：<H4>Welcome To <A Href="URL">My Home</H4></A>。
正確用法：<H4>Welcome To <A Href="URL">My Home</A></H4>。
目錄或檔名盡可能使用英文小寫字母，不要用中文或全形字體。
錯誤用法：圖檔/圖片.gif、免費.htm、ｈｏｍｅ.ｈｔｍ。
正確用法：image/pics.gif、free.htm、home.htm。
妥善處理雙引號，以免產生顯示錯誤。
錯誤用法：<H4 Align=center">標題字</H4>、<H4 Align="center>標題字</H4>。
正確用法：<H4 Align="center">標題字</H4>、<H4 Align=center>標題字</H4>。
完成一份 HTML 文件後，記得把資料格式，儲存 為*.htm 或 *.html副檔名。
UNIX 工作站上的分隔路徑符號和 PC 不同，UNIX 是 "/"，而且大小寫也有差別；PC 是 "\"。
以全形方式表現空白，才能真正在網頁文件中表現空白連線前往查看。

玖、常用 HTML 語法速查表：
我花了大概2天時間，才完成這個【常用 HTML 語法速查表】連線前往查看，請有空就拿出來看。
如果您是初學者，請將他列印出來，隨時查看；您不必去死背他，但最好能熟悉這些標籤。
如何隨時呼叫這個好用的【常用HTML語法速查表】做為您的網頁協助工具？
建立【我的最愛】：我的最愛指引加到我的最愛指引新資料夾指引填寫【網頁工具】指引確定指引再確定。
滑鼠指向 IE Browser 指引按一下Ctrl + N 指引他會開一個新網頁，然後：
呼叫【我的最愛】：我的最愛指引找到【網頁工具】資料夾指引選取您想打開的網頁檔案。
如果您想完整取得電子報內所有檔案資料，我們提供燒錄光碟片給您 Go 。
凡加入教學或教材會員者，均可獲得以下乙份完整的資料光碟。
詳細內容：語法教學、第一電子報、第二電子報、第三期電子報、網頁圖窟。

拾、結論與建議：
本站所有報導資料，歡迎網友加入鏈結或轉載內容，惟請保留文章完整，並註明此 引用來源 ，謝謝您的支持與配合。
本報每篇報導都花上 8 小時以上搜集、整理及撰稿，絕對值得初學者或想徹底學會 HTML 語法網友永久保存。
強烈建議您 學會 HTML 語法 ，她真的簡單易學，懂了她您就能駕馭她，讓您使用所見即所得軟體更得心應手。
本報導屬於完全免費性質， 索取教材資料 屬個人自由意願，而回饋給您的光碟片，則是我們的誠意而已。
一篇保證前所未見的 HTML 教學課程，絕對是您學習 HTML 的好教材，強烈建議您進入實際體驗一下。
本電子報報導資料，未來將繼續每隔 30 日發表一次，以嘉惠更多想學會 HTML 網友，歡迎 繼續訂閱 。
本報導內容或資料，因限人力、時間，非教學會員，不接受任何疑惑解答，敬請見諒。