HTML4.01、XHTML1.0文件類型定義

在HTML4以前HTML的檔頭並不用特殊宣告
但在HTML4.01及XHTML1.0中為了使瀏覽器能更快速且正確地顯示
我們會在檔頭的地方加上一些描述使瀏覽器明白我們的寫法是符合何種規範
這也能使網頁在各種顯示器顯示時更加一致!

首先先提供一個驗證的網頁:
The W3C Markup Validation Service
透過這個網頁我們就可以清楚我們所撰寫的頁面是不是符合規範

以下是HTML4.01的格式示範:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
...
</head>
<body>
...
</body>
</html>
紅色部分就是在識別這份html文件所使用的HTML版本
版本共有以下三種:

嚴格標準(Strict)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

過渡標準(Transitional)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

框架標準(Frameset)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">

其中新建立的html文件都建議使用嚴格標準(Strict)來撰寫
這樣在往後轉換到 XHTML1.0 時才不會太痛苦
(其實新建立的頁面已經可以直接使用 XHTML1.0 的標準了,
他們的差異並沒有很多,只要加個一兩行和一些簡單屬性設定好就好)

過渡標準(Transitional)版本支援了所有嚴格標準(Strict)的語法
並且加入 HTML4 之前的語法支援
例如 html 中的字型顏色設定的語法(這在 HTML4.01及XHTML1.0中應交由CSS來設定)
如其名稱 過渡標準(Transitional)
這是用來支援舊有的不再修改的 html 使他們也能在 HTML4.01下運作
故新建立的頁面並不建議使用這個版本

了解了過渡標準(Transitional)版本後框架標準(Frameset)也很直覺了
除了過渡標準(Transitional)的語法外框架標準(Frameset)更支援了框架的支援
同樣地這也是用來支援舊有的檔案

關於更詳細的 HTML4.01 的結構及介紹請看:The global structure of an HTML document
HTML的各種版本演進請見:HTML 4.01 Specification

介紹完了 HTML 的版本,接著我們要看的是 XHTML
關於為何要從 HTML 轉換到 XHTML 和他們之間的比較
請直接看:HTML and XHTML Frequently Answered Questions

要設定XHTML的檔頭和上面很類似
我直接把code貼上來,相信大家可以馬上一目了然
這也分別對應了上面的三個版本,很清楚的。

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

那麼 XHTML 實際上看起來會是什麼樣子呢?
以下就有個實際的例子:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" lang="en">
<head>
<title>Virtual Library</title>
</head>
<body>
<p>Moved to <a href="http://example.org/">example.org</a>.</p>
</body>
</html>
看起來是不是很簡單呢?
要了解更多 XHTML1.0 的話請到:XHTML 1.0 Specification
在設定這些資訊後記得把自己寫好的檔案傳到The W3C Markup Validation Service驗證看看
因為除了檔頭的設定外每個版本都會有些更嚴格的規定

例如 :
HTML4.01 中的 <img> 中現在一定要有 alt 屬性
以及區塊元素和行內元素的擺放位置也更嚴格
XHTML1.0 中因為是結合了 HTML 及 XML
故現在每個元素都必須符合 XML 的型式
因此單一的空元素後面都要加上 / ,如:<br> 必須換成 <br />

以上便是HTML4.01、XHTML1.0文件類型定義的簡短介紹
更深入的內容可以在 W3C 中找到
大家也要記得多使用 The W3C Markup Validation Service 來使自己的網頁符合標準喔

關鍵字:HTML4, XHTML1.0, 檔頭, 格式, 版本, 比較
參考資料:
1. W3C
2. The global structure of an HTML document
3. HTML 4.01 Specification
4. XHTML 1.0 Specification
5. The W3C Markup Validation Service

留言

這個網誌中的熱門文章

【銀行代碼查詢】3碼銀行代碼列表、7碼分行代碼查詢

【房屋稅繳納攻略】2024/113年度信用卡回饋/分期整理!

【博客來折價券】25/50/100/150現領現折+天天簽到換200+OP兩倍換!

【博客來折價券】博客來免費序號e-coupon分享(持續更新)

【Hami Video】免費Hami Video體驗/試用序號分享(隨時更新)!

【牌照稅繳納攻略】2024/113年度信用卡回饋/分期整理!