在緊隨 <!DOCTYPE html> 之後,我們通常會看到 <html> 標籤,並且帶有一個 lang 屬性。這行<html lang="zh-TW">代碼就像是在告訴全世界:「這是一個台灣繁體中文的網頁」。
一、 它是什麼?
<html> 是 HTML 文件的「根元素」(Root Element),所有的網頁內容(除了 DOCTYPE 宣告)都必須包裹在它裡面。而 lang 屬性則是 Language(語言) 的縮寫。
<html lang="zh-TW"> 時,我們是在定義整個網頁的「預設語言」。代碼拆解:
- zh:代表語言類別為 Chinese(中文)。
- TW:代表區域碼為 Taiwan(台灣)。
- zh-TW:合起來就是「台灣繁體中文」。
二、 為什麼這行代碼如此重要?
很多人以為不寫 lang 屬性,網頁看起來也一樣。但在專業的網頁開發中,這行屬性有四大核心功用:
1. 協助無障礙工具(Screen Readers)
這對視障朋友至關重要。螢幕閱讀器軟體會根據 lang 屬性來決定使用哪種語言的口音、語調和語速來朗讀。如果網頁內容是中文,卻沒寫 lang 或寫錯成 en,語音合成系統可能會用「英文腔」來唸中文字,聽起來會非常混亂。
2. 精準的搜尋引擎優化(SEO)
搜尋引擎(如 Google)會利用這個屬性來判斷網頁的目標受眾。這有助於將你的網頁優先呈現給在台灣地區使用繁體中文搜尋的使用者。
3. 自動翻譯功能的判斷
你是否曾遇過打開網頁時,瀏覽器彈出「要翻譯此網頁嗎?」的提示?瀏覽器(如 Chrome)就是透過 lang 屬性來判斷網頁語言。如果你的網頁沒設好 lang,即便內容是中文,瀏覽器也可能誤判而跳出不必要的翻譯建議。
4. 正確的字體與標點符號渲染
中、日、韓文(CJK)中有些漢字形體雖然相似,但在不同語系的排版規則中,筆畫特徵或標點符號位置有所不同。標明 lang="zh-TW" 能引導瀏覽器正確地調用繁體中文的系統字體進行渲染。
三、 常見的語言代碼與區分
在開發時,必須根據想要的語言選擇正確的代碼:

四、 撰寫時的專業建議
- 永遠要寫 lang 屬性:這是一個良好的 HTML 撰寫習慣,也是無障礙網頁規範(WCAG)的基本要求。
- 局部切換:如果你的網頁主體是中文,但中間有一段很長的法文引用,你可以單獨給那個段落加上標籤:
<p lang="fr">...</p>,這樣瀏覽器就能針對該段落進行特殊處理。 - 遵循 BCP 47 標準:目前的語言代碼是遵循 BCP 47 規範,建議使用標準的標籤格式。
五、 總結
<html lang="zh-TW"> 雖然位於網頁的最頂端且不直接顯示在畫面上,但它卻是網頁與瀏覽器、搜尋引擎以及輔助設備之間最重要的溝通橋樑。
這行代碼體現了開發者的專業度與對無障礙環境的重視。下次開始寫網頁時,別忘了幫你的 <html> 標籤掛上正確的語言地標!

