用Ruby，寫台語。

Bobby Tung

13 min readFeb 11, 2022

使用HTML Ruby標示注音，不僅能用於國語，也讓台語注音得以活化。

2019年底，財團法人中文數位化技術推廣基金會（中推會）受經濟部標準檢驗局補助，制定了一份數位內容產業標準「數位排版中注音調號定位方式」（中文版、英文版）。

這份文件的目的是要提出一套方法，應用OpenType字型技術，來將注音調號在直、橫排不同狀況下，放到正確的位置，而可以在網頁上透過HTML <ruby>標籤配合字型來正確顯示注音；同時也可以套用在其他支援OpenType的應用程式上。

我從2013年6月4日參與W3C工作坊以來，處理中文排版問題的第一個議題就是「注音符號如何使用HTML <ruby>來正確顯示」。而這項文件與範例字體的完成，正好劃下句點。

參考：「從注音字體談資訊設計」

然而，完成的並不僅是國語注音，連台語注音也一併完成了。在這幾年裡，處理的事項也不算少。在這裡做個紀錄。

Unicode標準中的注音

一、ㄧㄨㄩ的「ㄧ」到底該是直線還是橫線？

打從參與W3C工作坊結識了電子書與標準化圈內的人們後，各式各樣和注音有關的問題都來到了我這邊。2014年石井宏治寫了一封信給我，詢問注音符號「ㄧ」該是直線還是橫線？

這個問題似乎已經有一段時間了。根據注音當年的設計，在注音直排（標註於右側）時，應該為橫線；注音橫排（標註於上方）時，應該為直線。

在CNS11643國家標準裡，兩個字符都存在，可是在Unicode編碼中，僅有一個碼點。而現在Unicode已經不接受直排用字符的申請了（例如引號「」有﹁﹂）。

就現在的約定俗成來看，台灣和中國的應用也有很大的差異，台灣無論是電腦字體或者字典，多用橫線；而中國的字體和新華字典，多用直線。國語注音符號手冊的橫排範例上，也是直橫並列。

所以結果來看，橫線較為通用，而直線反而是舊的規定。當年是我第一次接觸到Unicode Consortium組織的詢問，就寫了一封公文詢問教育部，將其回應交給石井先生作為參考資料。後來「 U+3127 ㄧ BOPOMOFO LETTER I」就被修正為橫線了。

但也有附註。當年Ken Lunde博士在Adobe開發思源字體，就使用了一個OpenType功能’hist’作為切換，啟動時就會改為直線。在網頁上可使用CSS：

font-feature-settings: ‘hist’;

來更換，但也需要字體本身支援才行。

二、補上台語注音中的小「ㄍ」和修正寫法

其實處理注音符號在一開始時，我沒有考量到台語。

客觀上來說，注音符號有教育部發行的「國語注音符號手冊」作為權威性參考資料，且我熟悉；台語注音僅有一份「方音符號系統」，而且沒有如何排版的參考資料。

主觀上來說，在做排版標準化上頭，大致上都是拜託公協會申請政府補助，拿著極少的錢來做事，然後和標準化組織提出要求，要花多少時間才能被接受普及，我也不知道。所以心裡想著能做好國語注音已經是萬幸，沒有多餘的力氣來處理台語注音。

然而，後來在萌典松上得知台灣維基協會要將吳守禮教授所編《國臺對照活用辭典》數位化，這套辭典使用台語注音標註，才有了排版參考。

後來在中推會願意協助這專案的前提下，討論時發現當年Unicode編碼編入小「ㄅ」、「ㄉ」、「ㄎ」，其中「ㄎ」是誤植，應該為小「ㄍ」。但按照Unicode標準，為求版本間的相容，不可能將小「ㄎ」改為小「ㄍ」，所以2018年就寫了一份提案，新提出小「ㄍ」的編碼。

同時But Ko指出目前Unicode裡頭台語注音的範例字形不對，所以也提出字型進行更正。

編碼完成並且更正範例字後，台語注音符號編碼充足，就可以往下一步了。

三、注音符號總表與粵語注音

中間也曾收到Ken的聯絡，例如有人找出「注音符號總表」這份文件，為趙元任編，國語統一籌備委員會所出版。希望能夠將裡頭所有符號都收錄到Unicode中。

但這份文件中所列符號，並非所有都受到採用，而比較像是草稿性質。所以當時給Ken的回應就是不需要全部編碼。

後來2019年Ben Yang和陳永聰提案到Unicode Consortium，編入四個粵語注音符號，滿足了應用上的需求。

處理台語注音需要額外考量些什麼？

處理國語注音時，有幾項需要一一思考的事項：

注音符號與調號分別使用哪些Unicode碼點？
這些碼點會以怎麼樣的方式排列？
直排橫排有多少種呈現方式？

在過去幾年，這些事情都有了相當充分的資料，確定以後下一步要決定的事有：

要使用哪些OpenType特性來對應？
要使用GPOS/GSUB哪種方式來處理？
在實際的瀏覽器（Safari / Chrome / Firefox）與OpenType Engine（CoreText / Harfbuzz）上能不能運作？

但處理台語注音時，就要回到前面三個問題來整理資料。這個專案雖然是我在推動，但若沒有But Ko提供整理台語注音的資訊，應該沒有辦法短時間內推行。

首先台語八音的標注方式：

兩個台語注音調號之前已經編碼

˪ U+02EA MODIFIER LETTER YIN DEPARTING TONE MARK
˫ U+02EB MODIFIER LETTER YANG DEPARTING TONE MARK

五個韻尾符號也已經補齊

ㆴU+31B4 BOPOMOFO FINAL LETTER P
ㆵU+31B5 BOPOMOFO FINAL LETTER T
ㆶU+31B6 BOPOMOFO FINAL LETTER K
ㆷU+31B7 BOPOMOFO FINAL LETTER H
ㆻ U+31BB BOPOMOFO FINAL LETTER G（收錄於2020年Unicode v.13，當下多數作業系統內建字體都尚未添加此字）

但有幾個需要判斷的狀況：

閩南語的輕讀與國語輕聲在排版上有些差異。國語的輕聲使用的是˙ U+02D9 DOT ABOVE，那閩南語是否要用同一個碼點？還是用Unicode v.4.1時為閩南語輕聲所編碼的U+0358 COMBINING DOT ABOVE RIGHT呢？
閩南語第八聲（陽入）要在韻尾符號上結合一個點號，又該使用哪一個碼點？該不該用U+0307 ̇COMBINING DOT ABOVE來直接將韻尾與入聲結合呢？
若以上兩個點號都使用相同容易輸入的U+02D9，在排列組合上，會不會產生衝突呢？

最終決定都採用U+02D9，因為易於輸入，並且不會產生衝突。

至於所使用的各種OpenType特性，請見該文件。

該如何用來顯示台語呢？

目前主要支援網頁顯示，採用了HTML的<ruby>與<rt>來將漢字基文與讀音組成一組。

國語注音的三個範例：

<ruby>麻<rt>ㄇㄚˊ</rt></ruby>：二三四聲聲調放後面
<ruby>媽<rt>ㄇㄚ</rt></ruby>：一聲
<ruby>嘛</rt>˙ㄇㄚ</rt></ruby>：輕聲聲調放前面

台語注音的聲調變化較多，範例如下：

<ruby>去<rt>ㄎㄧ˙</rt></ruby>：台語輕讀放後面
<ruby>棟<rt>ㄉㆲ˪</rt></ruby>：三聲（陰去）、七聲（陽去）聲調放後面
<ruby>督<rt>ㄉㆦㄍ</rt></ruby>：四聲（陰入）韻尾也放後面（本範例ㄍ應U+31BB，考量到多數字體尚無法顯示）
<ruby>毒<rt>ㄉㆦㄍ˙</rt></ruby>：八聲（陽入）韻尾符號後再加一個點號。

顯示結果如下：

然而，這是HTML Ruby的資料結構，還需要透過CSS指定字體和開啟一些功能：

宣告字體的CSS為：

@font-face { 
 font-family: BopomofoRuby;
 src: url(BopomofoRuby1909-v1-Regular.ttf);
}

然後所有在<rt>中的注音符號與聲調都指定使用該字體

rt {
  font-family: BopomofoRuby;
}

橫排時注音標於上方，若想將調號移到右上角，則需要開啟OpenType功能`salt`，意義為stylistic alternates，為「另一種形式」。

rt {
  font-variant-east-asian: salt;
  -moz-font-feature-settings: "salt";
  -webkit-font-feature-settings: "salt";
  font-feature-settings: "salt";
}

直排時，為了啟動OpenType功能`vert`，意義為vertical alternates，為「直排形式」。需強制轉正[1]。

rt {
 text-orientation: upright;
}

最後可以適當調整注音符號的大小與排列，例如：

rt {
    font-size: 26%;
    letter-spacing: 0;
    ruby-align: center;
    text-align: center; /* chrome */
}

範例網頁可以見：注音符號調號之數位排版

目前還有哪些障礙與問題？

一、無論國語還是台語，輸入都很麻煩

首先，使用HTML的<ruby>來標注注音所花的時間不少，不僅要輸入HTML標籤，還要在漢字以外、再輸入一次注音。國語注音任何注音輸入法都可以打出注音符號，台語注音則是有編碼但無輸入法對應，更是麻煩。

中推會手上有著一些國語字詞典的資源，所以打造了「注音標註編輯器」可以輸入漢字，自動帶出一字多音審定表中的破音供你選擇，然後輸出標好<Ruby>的HTML碼，配合以上CSS與字體即可使用。

台語注音目前沒有這樣的資源，不過台灣維基協會已經將吳守禮教授所編輯之《國臺對照活用辭典》來建構這樣的資料庫，以便於標註。

二、瀏覽器與字體支援

目前市面上有Google Chrome、微軟Edge、Mozilla Firefox、Apple Safari等瀏覽器，但背後的排版引擎（Render Engine）為Safari所使用的Webkit、以及從Webkit延伸，受到Google Chrome及Edge採用的Blink，以及Firefox的Gecko。

這些引擎處理字體使用的OpenType引擎僅分為兩種，一是應用在各種開放原始碼應用程式的Harfbuzz、應用在Apple系統上的CoreText。還有一款是微軟使用，但未應用在瀏覽器上的DirectWrite。

中推會業界標準「數位排版中注音調號定位方式」這份文件，嘗試了各種OpenType的功能和實作方法組合，並且在多數瀏覽器和應用程式上測試。在Google Chrome、微軟Edge以及Firefox上顯示都沒有問題，Apple Safari處理台語聲調符號有無法位移的Bug，目前已經被Apple修正，預計之後的版本將能正常顯示。