時間在2016 年底，Microsoft、Apple、Adobe、Google聯合發佈了OpenType 1.8 可變式字體Variable Font。

一個可變式字體檔案可以包含傳統靜態字體家族中的每一個字體。如果使用者端在字體有使用到兩個字重以上的情境，基於可變式字體技術的特性，字體的檔案資料量是可變式字體的一個優勢，我們以文鼎UD晶熙黑體G30字體為例，如果設計案件需要使用5個字重、4個字寬這樣龐大的字體家族，那麼總共20個字體檔案約有160MB，但若採用可變式字體，則僅需20MB，足足減少了87.5%的檔案資料量。

更好的是，設計師和工程師還可以幾乎不受限制的使用可變式字體中的變化。例如字重與字寬的變化，使用者可以在Medium、Heavy或與長體Condensed間透過變數軸或參數的調整自由穿插的使用字體。隨著可變式字體的推出與應用軟體的支援，我們可以預測到可變式字體使用上的好處：為網頁/UI工程師在多字重字體資料量提供更好的壓縮，為設計師在作品上提供更細膩的呈現，以及為讀者提供更精緻的閱讀體驗。

可變式字體在2016/11月發佈後，最早支援可變式字體的主要設計軟體是 Adobe Photoshop、Illustrator 和 InDesign。如今，這些軟體內建了多款英文可變式字體，因此，現在數百萬使用 Creative Cloud 的設計師都可以體驗到可變式字體這種新的排版潛力。

使用情境如果移轉到Web呢？我們先來體驗一下吧！將滑鼠經過下方文字，看看會有怎樣的效果～

這個效果都是可變式字體透過CSS的設定所設計出來的互動呈現，我們分解成5個步驟：

1. 設定Web Font

於網頁內嵌入Web Font JS

2. 準備好小篇幅文章，設定於網頁內

例如文字為『文鼎晶熙黑』，將文字用<span>分別組合起來並放入網頁內<span>今</span> <span>晚</span> <span>我</span> <span>想</span> <span>來</span><span>點</span>

3. 設定字型名稱\

span {

    font-family:'文鼎VF甜妞體_Wr';

}

4. 設定動畫呈現

預設文字字重為 300

span {

    font-variation-settings: 'wght' 300;

}

當滑鼠移到文字上時，將字重設定為 600

span:hover {

    font-variation-settings: 'wght' 600;

}

5. 加入一些進場、退場效果

設定3秒回到原始字重300

span {

    font-variation-settings: 'wght' 300;

    transition: 3s;

}

設定0.1秒字重設定到600

span:hover {

    font-variation-settings: 'wght' 600;

    transition: .1s;

}

透過以上五個步驟及CSS的設計，就可在網頁上以文字輕鬆、快速的呈現出動態效果來。在現在的桌機和移動設備上主要的瀏覽器大都已支援可變式字體的顯示，支援的瀏覽器版本整理如下表，因此，我們可以期待，透過更多可變式字體產品的推出，網頁的面貌將在互動設計師與網頁工程師攜手下，帶來許多的視覺觀感體驗。

如果對於可變字體在網頁CSS動態效果的設定有興趣的話，下方網址有更多中文可變式字體套用Web CSS設定的使用範例。

https://ifontcloud.com/index/variablefont_demo.jsp

文鼎網頁字型方案

https://ifontcloud.com/index/plan.jsp

在10年前，我們應該很難想到現在字體的使用，也會像聽音樂一樣，線上訂購、跨裝置、隨買隨用，目前，這樣的字體訂閱服務機制，可以讓使用者使用到大量的字體，而在選用字體的時後，各家服務機制都有提供簡易的篩選功能，使用者依據自身的需要，從上千套字體中快速的找到符合需求的字體造型來做使用。

在應用上，我們以幾個例子來演示字體加粗/粗體的使用建議。在Windows的使用環境中，文書處理的首選絕大多數想到應該是Microsoft Office系列的軟體，繪圖設計則是illustrator，這對於大多數的文書處理使用者、設計師來說，這絕對是一時之選。

但是，我們認為在這兩個軟體中，字體加粗的使用情境有一個可以增加字體閱讀舒視度的小方法，即是多字重、多橫筆粗度的字體應用彈性。下圖方框中的部分是Microsoft Word字體加粗的機制，一般來說，這是透過程式演算的機制產生出來的，對於中文漢字顯示效果的支援較差，在筆畫相對複雜的字元上，就會出現筆畫因空間過於接近而產生沾黏的現象，即便是專業的繪圖軟體illustrator，透過外框的機制也是呈現出不佳的視覺效果。

現在大部分的字體在開發設計時，多會以朝多字重的方向做規劃，這個情境下，就可發揮多字重字體的使用彈性了，以文鼎UD晶熙黑體為例，如果我們以Medium這個字重當作內文排版使用，那我們會建義需要做加粗的部分，可以往上跨一個粗度，即使用Bold作為加粗後字體呈現的選擇，以此類推，這是我們對於文鼎UD晶熙黑體在加粗屬性的建議，可以作為排版的使用參考。

另外，在明/宋體的造型上，我們以文鼎書苑宋Display字體家族做演示，字重相同為Heavy，文鼎書苑宋DisplayH16 Heavy的有著輕盈的視覺感受，如果我們需要一個加粗的效果，在Word使用Blod屬性或illustrator外框加粗，得到的都是一個暴力加粗的結果，如果我們嘗試選擇文鼎書苑宋DisplayH62 Heavy，我們依然得到一個加粗的效果，但與程式暴力加粗的效果對比，字體結構不至於變形，視覺感受也相對來的優雅起來。

多字重、多橫筆粗度字體家族的設計，能夠帶給設計師排版上的選用彈性，透過細膩的選用技巧，可以讓字體排版時不再受限於軟體的限制。

如果字體有味道，會是什麼滋味 ?

文鼎字型 X 森澤聯手打造的「字體廚房フォントキッチン」即將開張！

    在這個創意空間裡，文字為食材，設計即廚藝，共譜視覺的盛宴。

活動簡介

這場會員專屬的講座邀請到重量級主廚：來自日本的下山以及台灣的忠宜與婉君。
三位頂尖設計師將從自身案例出發，分享其作品背後的故事，從中闡述獨到的選字觀點，為您呈現中文與日文等不同語言的字體應用思維，透過他們豐富的經驗，我們將一同探索字體與設計之間的深層脈絡，開啟多元文化視角。
一同加入我們，步入這個充滿可能性的字體廚房，細細品嚐字體百味。

活動時間與地點

時間：2024/11/1 (五) 14:00 - 17:00，13:30開放報到

地點：台北文創A廳( 台北市信義區菸廠路88號6樓 )

交通：建議搭乘捷運前往（捷運國父紀念館站5號出口，步行約350M）

活動講師

活動報名辦法

講座分為 線上直播 與 實體活動

1. 線上直播：YouTube 非公開直播，連結將於活動前1天寄送，請留意報名時輸入的信箱是否正確。
    
2. 實體活動：提供文鼎字型與森澤專屬文宣品與「字體廚房」活動限定禮物，並開放與講師交流時間。

注意事項

• 線上直播與實體活動請擇一報名。
• 若重複發送報名表單，且選擇不同形式的講座，系統將會判定為參加線上直播活動。
• 填寫完報名表單後，我們將於3個工作日內寄送活動通知信件，並於活動前2天以電子郵件方式寄發「報到通知」至您的電子信箱，請再次留意收件信箱。
• 報名實體活動後若因故無法參加，最晚請於活動3日前取消報名，釋放名額給想參加的朋友。