字體產品與應用 2021-09-14

文字風味輪

文鼎是一家字型廠商,近幾年也陸續承接了許多字型配對的案件,主要都由英歐文字的需求開始,做中文、日文、韓文的字體搭配。以我們所處的環境,每天眼睛看到的繁體中文,對我們來說是最熟悉不過的文字,但是,對於文字來說,透過筆畫造型、字體結構等變數因子的設計,會產生許多不同風格的字體產品出來,茫茫字海中有沒有什麼方式可以讓使用者快速的找到所需使用的字體呢?

喜歡喝咖啡或常逛咖啡館的同好如果有注意到的話,應該會知道「咖啡風味輪(Coffee Taster's Flavor Wheel)」,它時常以海報的形式掛在咖啡館中展示,如果沒有看過,有機會的話多走幾間咖啡館,留意一下牆面的海報,就會發現囉!我們參考咖啡風味輪的概念,將其延伸到字體來,以漢字為出發點,從以字型應用的角度,試圖將抽象的感受具體呈現出來,用圖像形式設計出一個具有感性、具有情感的字體分類系統,讓使用者需要以感受來選字時,可以透過文字風味輪找到對應的字體,減少找字體、選字體的時間。

感受這種東西是一種主觀性的認知,為了盡量找出符合大眾想法的感受,在繪製文字風味輪之前,研究團隊做了以下前期研究:

1. 研究咖啡風味輪期發展過程,是否有可借鏡之處?

2. 以人為單位,不同的個體對字體造型是否有共通感受?

3. 字體造型是否受到文化發展的影響

4. 越來越多的跨語系字型Matching,風味輪/個性輪的定義,是否對此有幫助?及智慧顯示的應用?

 

我們認為感受性的事物會因為人、事、時、地、物等因素而有不同,因此我們也藉由公開的投票系統,讓參與者參加文字風味輪分類的統計,讓文字風味輪不僅是一個圖像,而是能呼應外界的變化具有生命力的模型。

 

最後,整合我們所收集到的數據,將這些資料整合到字體的資料庫,讓每個字體都有自己的標籤分類形成文字風味輪。

 

文鼎文字風味輪檔案下載

 

 

字體產品與應用 2021-08-31

如何合法取得文鼎字型

相信現在還是有很多人會在網路上搜尋免費字型下載使用,這些免費字型的提供者也許是抱著好東西要與好朋友分享的心態,把字型放在網站上供人下載。下載方式非常簡單,但是點擊下載的動作已經違法。

 

也許在許多人的認知上字型只是輔佐文件的素材,但是每套字都是字體設計師一筆一畫勾勒出來的心血結晶。以台灣所使用的繁體中文Big5字集為例,一套字的開發,若只投入一個人,可能耗費一年半的時間都沒有辦法完成。有人說一塊錢的製作成本遠遠超乎他的現價,這個理論套用在字型上似乎是相同的。近年來台灣的版權意識越來越高,尊重創作者的心血、使用者付費也是文鼎一直在宣導的。

 

該如何取得正版文鼎字型呢?。除中國地區外,皆可透過文鼎iFontCloud網站選購。在台灣,也可透過文鼎的代理商展碁及其經銷商購買。此外,我們在Momo, PChome, Yahoo, Friday以及博客來等電商平台也有銷售文鼎雲字庫的實體卡。而在中國則可透過邑石網選購,或直接聯絡文鼎上海分公司。除以上通路,文鼎並沒有在任何網站上提供免費字型下載,請務必小心!透過合法的管道取得字型資源,不但能給予字體設計師支持與鼓勵、轉化為繼續設計好字型的動力,字型公司也才能有資源提供更多字體。這樣的正向循環,需要您我共同努力。

字體產品與應用 2021-08-24

如何將可變式字體使用於網頁上

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

 

Web browsers

   

Chrome

62+

Safari

11+ (requires macOS 10.13+)

iOS Safari

11+

Firefox

62+ (requires macOS 10.13+)

Edge

17+

Opera

49+

Samsung Internet

8.2+

 

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

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

 

文鼎網頁字型方案

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

 

字體產品與應用 2021-08-17

如何快速在軟體中找尋文鼎字型?

電腦安裝太多字型,每次都要花很多時間從頭開始,卻還是找不到要使用的字型,令人覺得頭痛,再加上不同軟體讀取字型名稱的方式不同,有時候明明安裝中文字型,但是字型清單顯示的卻是英文字型名稱。

 

以下我們以在台灣使用繁體中文介面的Windows作業系統說明如何在軟體中找到文鼎字型。

文鼎字型的中文名稱大多以「文鼎」這兩個字開頭做顯示,英文則是「AR」,在iFontCloud文鼎雲字庫網頁或iFontCloud字庫管理工具中有提供字型的中文和英文名稱,讓您清楚知道字型的名稱,搜尋字型更容易。

常用的Office 軟體,如:Windows 2013 word、Excel和PowerPoint,在顯示字型的下拉選單中,輸入字型名稱的第一個字「文」或「AR」即可快速到達相同名稱字型的位置,此時點開下拉選單就能更換為其他字型。這裡有一個字型語言及作業系統語言的變數要注意一下,一般來說,繁體中文字型名稱大多為中文顯示,而簡體中文的字型名稱則為英文;如果作業系統是是Windows簡體中文版,則規則相反,繁體中文的字型名稱以英文顯示,簡體中文字型名稱則是中文。

而設計師常用的Adobe系列軟體,在Photoshop、Illustrator中,繁體或簡體字型的字型名稱都是用中文顯示。在字元視窗中,輸入任一字型的名稱關鍵字後,Adobe的字型運算機制即會將該關鍵字相關的字型列出,這樣就加快了使用者找字的效率。倒是要特別題一下,在InDesign裡,若在繁體中文的作業環境,簡體中文字型是以英文的字體名稱做顯示。

從上方簡要的說明,我們可以這樣說,在字型公司的字型工程做業端要兼顧到字型使用的各個環節,確保在任何環境上字型產品都能被正確的顯示與使用到,這確實是一件專業的工作,也是整體造字工藝中重要的一環。

字體產品與應用 2021-08-10

因編碼造成缺漏字的解決方法_造字碼位

在前一篇文章「字符集:Big5與Unicode的差異」提到,我們在個人電腦上無法打出想要的字元或無法正確顯示字元,大多是因為使用的字型所支援的字符集涵蓋範圍的多寡而造成的缺字情況,這是設計師或一般使用者會遇到的缺字原因;還有一種是在公家機關或是企業的資訊系統中會遇到的缺字情況_因字型編碼相容的問題所造成的缺字。

很多公司企業財會單位使用的報表系統還是封閉型的系統環境,追求的是系統的安全性、正確性與穩定性,每一次系統的更新就需要一筆龐大的費用,因此,若無重大使用上的問題,在預算考量上往往會選擇沿用現有系統,而不耗費預算升級到新系統。在這樣的情況下,使用單位/公司有可能會因為報表系統比較老舊,只能支援Big5字集,以至於開發的系統軟體無法使用Unicode字集字型顯示,造成列印、輸出漏字或亂碼的情況,此時就會需要透過Big5造字碼位來進行造字。

什麼是造字碼位,由於現在的Windows系統內碼是使用Unicode編碼,但如果我們使用的應用軟體無法直接支援Unicode編碼,就必須要將Unicode資料轉換成Big5編碼的資料,在Big5編碼的碼區裡有定義四個區域可以用來存放使用者造字,我們可以把Big5字集不包含的Unicode編碼的字,依照我們的需求將其存放在這四個造字區內。如此一來,就可以像古代倉頡造字那樣,為自己的資訊系統環境添加一些造字,解決在Big5編碼範圍內,電腦環境中無法正確顯示Unicode編碼的字之困擾。

 

不過,因為每個機關所使用到造字的時機與難字不全然相同,所以同樣的造字碼位所存放的難字在A機關與B機關通常是不一樣,因此使用造字碼位所存放的資料是無法直接互相交換,需要透過另一個CNS11643資訊交換碼來串接交換,讓資訊在交換的過程中不會缺漏。

 

造字碼位範圍

可造字數

FA40-FEFE

785

8E40-A0FE

2041

8140-8DFE

2983

C6A1-C8FE

408

總計

6217

 

 

 

 

 

微軟雖有提供造字編輯程式,可以供使用者使用,以編輯點陣圖的方式造字,雖然介面較為簡易上手,但需要以畫格子的方式逐一將字元圖像點畫出來,在美感上不是那麼好看也較費時。

文鼎了解機關企業的造字需求,開發了更為便利的造字管理系統,以解決造字編輯美觀、便利性的問題,如此一來,就可以輕鬆解決缺字的問題。資訊交換的問題,文鼎也可以協助您。

字體產品與應用 2021-08-03

認識文鼎字體的命名

文鼎公司成立滿三十年,回顧文鼎字型產品,主要投入在東亞的字型開發,包含繁體中文、簡體中文、日文這三個語言字型;另外,還有其他如泰文、阿拉伯文、印度文及歐文字型。在這些語文當中,又隨著各國資訊處理發展演變及國際標準化規範的潮流,衍生出不同技術規格的產品,如我們熟悉的繁體中文,在字集規格面,可分為Big5、Unicode 2.0、Unicode 3.0…等規格。因此,我們可以理出一個字體命名的大方向:先看語言、字集,再延伸其他字體屬性。

 

 

 

技術規格面主要包含字符集(也常稱為字集, Character set)、字型格式:

字符集以語言為基礎,在繁體中文、簡體中文、日文有以下常用的規格:

繁體中文:Big5、Unicode 2.0、Unicode 3.0

簡體中文:GB2312、GB18030

日文:JIS X 0208、JIS X 0213、A-J1-3

 

字型格式主要分為兩大類:TrueType、OpenType,其中,TrueType又包含了TrueType Collections(TTC),這是一種允許將多個字型合併為一個字型檔案的格式。TrueType格式的字型產品,在產品名稱後面大多加上B5、 HK、U30字符集的縮寫來傳達產品語言的支援情況,但在OpenType格式的字型產品,我們以字元數量的多寡為基礎,分為Std、Pro兩個系列,以繁體中文為例,標準的Big5字符集產品在OpenType格式的字體名稱後會加有Std標示,而Big5+HKSCS(香港增補字符集)則有Pro的標示,如:文鼎UD晶熙黑體 B5Pro。

 

接著,我們就可以來細看一些字體名稱上的代號概述:

表示語言/字符集

G30:簡體中文GB18030字符集,如:文鼎UD晶熙黑体XG30 (若簡體字集沒有標示G30則為GB2312字集)

U30:繁體中文Unicode 3.0字符集,如:(若繁體中文沒有標示U30則為Big5字集) ,如:文鼎UD晶熙黑體U30

HK:字集中含有香港字符集,如:文鼎UD晶熙黑體HK

JP:日文JIS X 0208字符集,如:AR UDJingXiHeiJP

KR:韓文 _KSX1001字符集(Hangul Only) ,如:AR UDJingXiHeiE1KR 

 

表示字型屬性

C:長體(Condensed)字體設計,EM 1000下的字體設計規格,提供C80、C90、C95等3種字寬變化,C80表示字面框的寬度為高度的80%,如文鼎方新書H7C80。

X:EM 1000下的字體設計規格,字體字面寬縮小成95%的版本,形成長型字的字體感受,如:文鼎UD晶熙黑体XG30

E:E (加一碼數字)產品中的英歐文符號為另一中種造型的設計,以文鼎UD晶熙黑體為例,標準產品搭配 AR Dori Sans造型的英歐文,而文鼎UD晶熙黑體E1搭配AR NewHebe Sans造型的英歐文。

 

P(適用於TTC格式):

繁體中文、簡體中文_字型中的常用全角符號為調和設計(Proportional),如:文鼎UD晶熙黑體PHK。若無標示P,則字型中的全角符號為定距設計(Fixed pitch),如文鼎UD晶熙黑體HK:

日文_除全角符號外,日文中的KANA符號也做調和設計(Proportional) ,如:ARマーカー体P。

 

F(適用於TTC格式):中文手寫字體漢字字寬維持定距全角的寬度設計,如:文鼎DC香蕉人體F。

 

Display:標題用字,字型設計特徵符合標題、大字的使用情境,如:文鼎書苑宋DisplayH16。

 

Text:內文用字,字型設計特徵符合內文、長文排版的使用情境,如:文鼎書苑宋TextH32。

 

H16、H32、H46、H62:絕對值,字型設計規格,描述在EM 1000的設計規格下,橫筆的粗度為上述數值單位的呈現,如:文鼎書苑宋TextH32。

H7:比例值,字型設計規格,表示字型設計上,橫向筆畫的粗度為直向筆畫粗度的70%,如文鼎方新書H7。

表示字重

HR: Hair 

TH: Thin

L / LT: Light 

M / MD: Medium 

D / DB: Demi Bold 

B / BD: Bold 

E/ EB: Extra Bold 

H / HV: Heavy 

EH: Extra Heavy 

DBL: Demi-Black 

BL: Black 

UBL: Ultra Black

 

表示產品設計分類

DC:Designer Collection,為文鼎與外部設計師、書法家、插畫家合作開發的字型產品,如:文鼎DC清圓體。

UD:UD Font (Universal Design Font)字型設計,就是延伸自Universal Design,設計精神包含:識別性、易讀性、設計簡潔,如:文鼎UD晶熙黑體。

 

表示可變式字型

Wl, Wr, Wu: 字重(weight)軸的極細段(light), 中間段(regular), 極粗段(ultra)

W: 字寬(width)軸

C: 對比(contrast)軸

G: 中宮(zhong gong)軸

H: 字高(height)軸

O: 光學尺寸視覺調整(optical size)軸(微字型, 標誌用字濃淡度調整)

S: 樣式(style)軸

 

多種字型名稱代號的定義,代表著產品設計因應著外部變化的腳步,讓字型產品輔助使用者,為設計帶來最佳的視覺效果。

 

字體產品與應用 2021-07-26

iFontCloud教育方案與教育資格介紹

一般商用與教育教學、設計學習所需要使用的字體類型不太相同,小學教師需要製作注音和拼音的教材,設計學系學生需要繳交報告與作業,為將來的設計大道鋪路。文鼎以教學和教育學習出發,設計了兩種教育方案,分別是「繁/簡多元學習包」和「美感學習包」。
 

繁/簡多元學習包:包含常用的繁/簡字型、注音拼音字型及英歐文字型。

美感學習包:包含設計學系所最常使用的明、黑、圓的經典字型以及經典的書法字型及英歐文字型 。
 

請先註冊iFontCloud會員,購買教育方案產品需符合資格證明,並提供相關證明文件才能購買,證明文件(需含學年度)包含:

  • 學生證正反面(需蓋上註冊學年章,未蓋章不具證明效力)
  • 學期成績單
  • 學期繳費通知單
  • 教師證明
  • 其他任何內容登載您的姓名、機構名稱及在學日期或學期的教育文件

 

需將上述文件寄到ifontcloud@arphic.com.tw,經過文鼎審核通過後才可購買教育版產品,可購買期限為6個月內。教育方案不提供續約服務,次年如果需要再次購買教育方案,需重新提供文件審核。iFontCloud教育方案是以教育學習或是教學為目的,使用範圍不得以公司營利或銷售為目的使用!

 

iFontCloud教育版租賃字型授權範圍

如需更詳細內容,可參考教育版授權書範本

 

字體產品與應用 2021-07-20

字符集:Big5與Unicode的差異

我們在輸入文字的時候,有時候是不是會遇到字元無法顯示的缺字情形呢?缺字有可能是許多情況造成的,但最常見的情況是缺的這個字,沒有收錄在Big-5字符集裡,這時候,使用支援Unicode 2.0或3.0字符集的字型,大多可以解決缺字的情況。

 

什麼是Big-5

Big-5 又稱為大五碼,是最常使用的繁體中文字符集,共收錄13,060 個漢字,及441 個全角符號。Big-5 普遍使用於台灣、香港與澳門等地區,唯它並非當地的國家標準,只是業界標準,最新版本是Big5-2003。

 

什麼是Unicode

Unicode 是全球通用的字元編碼,收錄了世界上所有國家及地區的文字及符號,在1991 年首次發佈了The Unicode Standard,目前最新的版本為Unicode 13。而繁體中文普遍使用的Unicode 3.0共收錄27,484 個漢字,而2005 年發佈的Unicode 4.1 已收錄超過10萬字。

 

Big-5與Unicode的差異

很多人常常會把兩者相互比較,而到底兩個的差異在哪呢,簡單來說,我們可以用支援字數多、寡來做區隔,用一個比較簡單的方式來比喻,把Unicode想像成裝雞蛋的大籃子,Big-5則是大籃子中的小籃子,而這些字碼則是籃中的雞蛋。前面我們提到,Big5-包含有13,060個漢字,其包含在Unicode的大籃子中,因此,可以解釋成Big-5是Unicode的其中一部分。所以在一般Windows作業系統中常會有打不出來的字,或是出現亂碼,很大的原因是因為Big-5的範圍內沒有支援到Unicode的字,已經做超出小籃子的負荷了。

如果出現這樣的情況,通常選擇使用援Unicode 2.0或3.0字符集的中文字型,大多可以解決缺字的情況。要如何選擇、使用文鼎公司繁體中文有支援Unicode字符集產品呢?最簡易的方式就是在iFontCloud網站字型頁面上輸入「U30」這個關鍵字,就可以看到有支援Unicode 3.0這種大字符集的字型產品,目前共有25個字型檔案可以選擇使用。

 

在產品上,Big-5與Unicode這兩個字符集的產品要如何分別呢?以文鼎UD晶熙黑體為例,在字型名稱上若有看到U30,即表示這個字型產品是支援Unicode 3.0字符集的產品,若沒有看到標示,則為Big-5字符集的產品,如文鼎UD晶熙黑體U30與文鼎UD晶熙黑體U30。

 

字體產品與應用 2021-07-12

微字型

文鼎公司關注到字型產品除了設計上創意的專注外,也考量到應用面用字的需求,如小字號文字閱讀的清晰度、辨識度。

一款字型產品是如何的被決策出來做量產的,首先要評估的是產品會被用在哪裡?決定了使用目的,依情境定義使用字號(font size),有了這些後,才會有後續的設計規格的延伸。回到設計師的字體應用情境,在執行設計案件時,字型對於設計師來說是眾多設計素材之一,但在資訊訊息呈現,字型一定是一個重要的選擇。文鼎公司關注到字型產品除了設計上創意的專注外,也考量到應用面用字的需求,我們看到了字型在設計上被使用在小字號的需要,也看到了閱讀上,小字號文字清晰度、辨識度上的重要性,因此在字體設計與造字工程上進行整合,開發出一系列專屬使用在小字號情境的微字型產品。

在鉛字印刷時代,每個字號鉛字有著固定的物理大小,我們以築地明潮體舉例,可以看到上方的那排是築地明朝初號到六號放大到一致大小的情況,下方是文鼎上海宋實際使用大小的示意圖,透過觀察,用於內文小字的六號字(8pt)與標題大字的二號字(21pt)兩者在筆畫細節處有著設計的差異,以筆尾末端的設計為例,因為二號字呈現的字號較小,因此需要稍微加重筆尾的厚度,使其在顯示時不至於虛掉、灰掉,而用於大字的二號字,是要清楚呈現明體的特徵,因此做較細緻的設計。這是早期鉛字在設計上考量實務用字大小所做的設計因應,但數位字體使用的媒介與情境與以往有很大的不同,特別是向量字可以任意縮放大小的特性,這絕對不是鉛字可以比擬的;然而若是使用在如六號字(8pt)的大小,字體是否還可以清晰地呈現呢?

以文鼎UD晶熙黑為例,雖然晶熙黑在設計之初,已經考量印刷、螢幕顯示的使用,但因漢字筆畫多、寡的對比情況在極小字的使用情境下,仍然會有糊字影響到視覺效果,以下圖左右兩邊的對照來看,右方的微字型與左邊標準版的晶熙黑體,在閱讀視覺上所形成的跳躍,已經明顯的降低。以文鼎UD晶熙黑為例,雖然晶熙黑在設計之初,已經考量印刷、螢幕顯示的使用,但因漢字筆畫多、寡的對比情況在極小字的使用情境下,仍然會有糊字影響到視覺效果,以下圖左右兩邊的對照來看,右方的微字型與左邊標準版的晶熙黑體,在閱讀視覺上所形成的跳躍,已經明顯的降低。

微字型產品是如何達到這樣的效果呢?關鍵是設計師將漢字由筆畫多寡由少至多作排序,透過設計師與工程師的合作,筆畫少的字元,不改變筆畫的粗細,筆畫多的字元,依視覺灰度做筆畫粗細漸進的調整,來達到小字顯示時降低糊字的情形,因此,微字型的產品特別適用在3-8P的環境,相對的,若是標題以上的大字號顯示,則建議選用標準版的產品。微字型產品是如何達到這樣的效果呢?關鍵是設計師將漢字由筆畫多寡由少至多作排序,透過設計師與工程師的合作,筆畫少的字元,不改變筆畫的粗細,筆畫多的字元,依視覺灰度做筆畫粗細漸進的調整,來達到小字顯示時降低糊字的情形,因此,微字型的產品特別適用在3-8P的環境,相對的,若是標題以上的大字號顯示,則建議選用標準版的產品。

下圖是由美可特品牌企劃設計應用文鼎UD晶熙黑體微字型所設計的面膜包裝,我們將重點放在背後的用字上,回到字型選擇應用面的考量,透過畫面,我們可以感受到這些字的使用size是很小的,如何在小字保有清晰的顯示,是這個案件選用微字型產品的要點。

 

目前已經開發完成的微字型產品,造型為經典的黑體與圓體,語言包含繁體中文、簡體中文,其中文鼎UD晶熙黑體微字型產品支援Unicode 3.0 及GB 18030大字集的規格,降低設計師在排版缺字的機率,提升使用感受。繁體中文熙黑體微字型也將長體字型納入,排版上有利於有空間限制的版面容納較多的文字資訊。微字型產品的推出獲得了設計師的肯定,未來也會持續開發將新的微字型產品,想要了解詳細文鼎微字型產品的支援情況,歡迎前往文鼎iFontCloud瀏覽。

 

點我前往>文鼎iFontCloud_微字型

 

 

字體產品與應用 2021-07-05

如何試用文鼎字型?

文鼎提供單套字試用時間為60分鐘,字型試用的步驟如下:

1.請先加入或登入iFontCloud會員

2.在網站中找到需求的字型頁面,點選「試用按鈕」,加入成功會跳出訊息「成功加入試用清單,請至字庫管理工具中安裝字型」

範例:文鼎書苑宋 https://ifontcloud.com/index/font_intro.jsp?family_font_id=1495183086961

3.下載和安裝iFontCloud文鼎雲字庫軟體 https://ifontcloud.com/index/download_tool.jsp

4.開啟iFontCloud文鼎雲字庫軟體並輸入iFontCloud會員帳號密碼登入

   登入完成後,點選「試用字體」頁面

5.在「試用字體」頁面中滑鼠左鍵點選  ↓ 安裝字型,↓ 顯示藍色表示字型安裝成功,安裝成功後開始從60分鐘倒數計時

 

6. 請不要結束iFontCloud文鼎雲字庫軟體,保持啟動狀態並開啟您要用的軟體,查看軟體中是否顯示已安裝的試用字型

 

字體產品與應用 2021-06-29

罕用字

罕用字是指不常見到或不熟悉的漢字,又可稱為生僻字、冷僻字、罕見字等,最早出現在商代的甲骨文,前些日子有一首大家朗朗上口的歌-生僻字,用輕快的旋律唱出一些歌詞乍看之下根本不會念的字詞,沒錯,這些就是罕用字,罕用字通常是一些字典不會收入的字,經常出現在罕見人名、地名、古詩中的押韻。

但這些看似古代字的罕用字,在古代未必不常被使用,因為在古代這些我們現在幾乎用不到的字,以前可能是熱門精選也不一定,罕用字沒有一個標準,至古至今有不少人的姓名中包含罕用字,在古代,由於避諱的傳統,很多人都會使用僻字來避免麻煩他人,不少皇帝的名字包含罕用字就是為了避免擾民。

然而,在這個電腦普及的現今,很多的罕用字並未收入Unicode,而導致電腦無法正常輸入這些漢字,因而造成在辦理銀行業務或護照上的種種麻煩,以前如需要解決這個問題,最根本的方法就是使用常用漢字命名,以避免姓名中罕用字難以處理的情況而引起爭議。

由於罕用字實在不常用到,所以在發音或是查找上有些許困難,在文書處理上有個小小秘訣,以windows 10作業環境為例,可以使用拼音輸入法先將罕用字的部件拆開看,舉例說明,以”垚”為例,是由三個”土”字組成,所以可以用拼音輸入法先打一個”u”後面加上”土”字的拼音三次,這個字將會顯示出來,這個小小的方法可以讓人對罕用字更加有興趣,您也可以試一試。

精選字體 2021-06-21

文鼎方新書

文鼎方新書立於黑體,保留黑體的簡練、穩重,融合明體的舒適、清雅,開發以高規格審視標題用字之識別性、內文用字易讀性,產品跨語言、多字重,字體家族包含長體字設計、可變式型(Variable Font),整合出標題、內文應用情境的全方位字型。

字體產品與應用 2021-05-31

更換電腦, iFontCloud字庫管理工具無法使用,該怎麼辦?

使用iFontCloud字庫管理工具一段時間後,如果也想要在另外一台電腦上使用字體,在新電腦下載安裝iFontCloud字庫管理工具完成後,你可能會遇到啟用訂單時出現告知「無法啟用訂單」或是「授權已滿」的訊息,這時候該怎麼做呢?

 

由於iFontCloud字庫管理工具的授權認定是以認定電腦設備為單位,當更換電腦或是重灌電腦(會視為新的電腦)必須將原本的電腦授權移除才能在新的電腦使用,此時需要到iFontCloud網站的租賃管理頁面移除舊電腦的授權,才能在新電腦的iFontCloud字庫管理工具訂單頁面啟用訂單。

 

iFontCloud字型服務授權移轉操作步驟說明如下:

1. 請至iFontCloud進行會員登入

 

2. 登入完成後,點選圖示,於下拉選單點選「租賃管理」

 

移除授權前

 

 

移除授權後

字體產品與應用 2021-05-25

如何解決在Word使用Adobe Acrobat轉存PDF失敗的問題?

在使用Microsoft Word編輯文件時,為了讓文件維持編輯時的排版樣式,通常我們會採用將檔案轉成PDF的方式做保存。但是,從word透過Adobe Acrobat轉存成PDF時,在存檔是不是有遇過跳出錯誤的log訊息?該怎麼解決?

會出現這樣的log訊息,是因為Acrobat在轉存PDF的過程中,找不到文件中使用的字型。我們以在windows作業系統下,在word文件使用iFontCloud雲端字型服務的情境來做說明,iFontCloud雲端字型服務所使用到的字型,其存放位置並非一般認知的 C:windows/Fonts的目錄中,其與過往將字型安裝在系統上的行為不相同,因此造成Acrobat在轉存PDF時出現找不到字型的情況。

 

我們以Acrobat有提供的方式,為大家解決這個轉檔問題,簡易的操作2個步驟,使用word的Adobe Acrobat存成PDF就能成功囉!

1. 點選「列印」>「印表機內容」

2. 取消勾選「僅依賴系統資型;不使用文件字型」

 

取消勾選使用系統字型之後,word使用雲端字型轉PDF就不會出現錯誤訊息log。

字體產品與應用 2021-05-17

可變式字型variable font在設計上的應用,以明/宋體為例

可變式字型(variable font) 發佈於2016年,發佈至今,我們觀察到許多字型設計公司逐漸地發布自家的可變式字型,經過這幾年的推廣,最近我們從問卷調查上發現國內的設計師對這樣的產品仍然感到陌生,今天,我們藉由幾個演示,再一次讓大家認識可變式字型。

 

可變式字型的特色在於可隨使用者的設定或是依應用程式的自動判斷,變化出將近無限種的字體屬性組合。只需要一個字型檔案,就可以無間段調整該字型提供的字重、字寬或對比等可變屬性,讓設計師用字的創意不再受侷限,同時也減少了龐大字體家族所需要的大量記憶體空間。

 

不知道大家有沒有思考過一個問題,字體設計師都是在60公分距離前的螢幕做字體設計,使用時,有可能近到20公分,遠則超過5公尺以在使用的字體,這樣的應用情境,字體的設計如果都一樣,合理嗎?設計師如果在用字的時後,思考到這樣層次的問題,有沒有產品可以上設計師挑選使用呢?

 

通常在進行字型開發前先會決定使用目的,而在選用字型時,會依情境來選用造型,在使用明/宋體這類的字型時,通常橫向筆畫的粗細是固定的,在可變式字型裡,可以將橫向粗細的變化設計在可變式字型的變化軸上,使用者除了傳統的字重外,還可以使用到橫向筆畫(對比/Contrast)變化軸的調整。下方以文鼎書苑宋體書苑宋作為舉例,因應複雜化的使用情境,書苑宋設計了四個橫筆粗細的產品,為橫筆寬度16(EM Square =1000 ) 到64 的響應式設計,使用者可依據使用配方建議,從內文到標題,從紙本到屏幕,因應不同情境選取適當字型使用。

 

有個多個橫筆粗細對比這樣的產品,我們思考一下,如果在設計這樣的指示標示,怎麼樣可以讓閱讀訊息用的字體在畫面上呈現的更好呢?畫面上『南京三民站』這幾個字分別使用思源宋體(上)與文鼎書苑宋體(下)做展示,我們可以看到這五個字元筆畫數並不算多,但『三』這個字的筆畫相對起來特別少,整體看起來視覺灰度少了一級。

這時候如果我們要對他加粗,通常的作法就是在AI裡轉外框,加筆畫,但這樣一來,字就變成圖,不是字了,會增加後續版本維護的困擾。使用書苑宋可變式字型的微調後的成果,我們來看看調整前後的差別,經過適當的調整後,每個字元的視覺量感變得更平均了。

我們認為,設計師寶貴的時間應該要用在設計思考上,如果字體可以協助設計師解決問題,節省設計師的時間,那就是我們對設計產業的幫助。關於更多可變字型的資訊可參閱下方文鼎iFontCloud雲字庫的展示說明

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

字體產品與應用 2021-05-11

輸入內碼也可以打出你想要的字

能夠代表一個人的稱謂有很多種,有本名、小名、綽號,還有獨一無二的身分證字號,在輸入法中,好比「林」這個字,注音輸入法輸入「ㄌㄧㄣˊ」,倉頡輸入法輸入「木+木」可以找到他,這就好比稱謂一樣,以不同的方式可以叫出不同的字碼,內碼輸入法也是其中一種,而且就是像身分證字號那樣,是一種獨一無二的,在標準字中,一個字碼就代表一個字,如果今天我們得知這個字碼Unicode碼位,但不知道他的念法或倉頡,就可以用這個小技巧。

以「林」這個字為例,開啟電腦的微軟注音或微軟倉頡,輸入「` 」+「U」+「6797」,輸入完字碼點選空白鍵輸出,就可以打出這個字碼所代表的字,這邊需要小提醒,這邊輸入的數字需要點選左邊上排的數字鍵,如果輸入右邊數字鍵盤,是沒有反應的喔~以「林」這個字為例,開啟電腦的微軟注音或微軟倉頡,輸入「` 」+「U」+「6797」,輸入完字碼點選空白鍵輸出,就可以打出這個字碼所代表的字,這邊需要小提醒,這邊輸入的數字需要點選左邊上排的數字鍵,如果輸入右邊數字鍵盤,是沒有反應的喔~

My alt text

 

 

同場加映,如果今天想要知道一個字的字碼怎麼辦,我們只需要開啟Word,在上面鍵入您想知道字碼的字,例如「林」這個字,輸入完後直接點選鍵盤的Alt+X,這個字就會轉換成Unicode的字碼「6797」。

 

字體產品與應用 2021-05-04

如何呈現國字〇

在使用輸入法輸出中文字時,你的零是以怎樣的面貌呈現呢?是寫成國字「零」,還是「〇」、「O」、「○」、「0」或是寫「0」?在windows作業系統的環境裡,「零」、「O」或「0」使用任何輸入法都可以打出來,但是「〇」用一般系統內建的輸入法像是注音、新注音、倉頡是找不到的,如果您有額外安裝的輸入法,如自然輸入法,鍵入零這個字,則可以透過選單找到「〇」。

上面舉例的這些字元造型都長的很相近,每一個字元在Unicode字碼的定義裡都有一組數字來代表自己,這組數字一般通稱為字碼,這幾個字碼及其代表的意思分別如下:

零:U+96F6,中文漢字零。

0:U+FF10,全形數字零。

○:U+25CB,空心圓圈,幾何圖形。

〇:U+3007,國字零,中日韓符號和標點。

0:U+0030,數字零,屬於基本拉丁字母。

O:U+004F,拉丁大寫字母O,屬於基本拉丁字母。

 

這些造型相似的字元在使用上會有怎樣的差異,下圖我們以微軟正黑以及文鼎UD晶熙黑體做舉例,在使用國字顯示西元年時,我們可以看到使用 U+3007「〇」字元有最佳的排版效果,除了U+3007這個字元本身就是為了與國字一起使用外,以晶熙黑體為例,還會因應字體造型、字重做最佳化的設計。

字碼對於大部份人來說很陌生,而且並不是每個軟體都支援字碼輸入,在word使用微軟注音輸入法時,透過輸入鍵盤上左上位置的「`」這個符號,就可以輸入字碼,輸入「~」會產生一個黃色的小視窗,此時輸入「U3007」按空格就可產出「〇」,要特別注意的是數字不能用鍵盤右方的小鍵盤輸入,一定要用英文上方的數字輸入才行。

如果在繪圖軟體,如Adobe illustrator裡,我們可以透過「字符」工具面版來找到「U+3007,〇」這個字元,或者是用前面word輸入的教學方式,在word中將「〇」呼叫出來,再複製到Adobe illustrator中做使用。

 

分享一個可以快速打出「〇」的方法,讓你不用再花時間找方法要怎麼打出這個字。

1. 開啟瀏覽器到google翻譯的頁面:https://translate.google.com/?hl=zh-TW

2. 選擇中文,會看到右下角顯示「注」,點選下拉選單,選擇「簡體中文(中國)-手寫」

3. 選好後就會出現手寫的輸入框,直接用滑鼠在上面寫「〇」

4. 寫好後就會顯示和「〇」相似的字,選擇紅框即會產出「〇」 

這個方法是不是很簡單,快來試試看吧!

字體產品與應用 2021-04-27

文字排版在字體加粗的應用

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

 

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

 

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

 

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

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

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

字體產品與應用 2021-04-19

定距字型與應用

定距字(monospace font)這是字型設計裡重要的設計規格,與其相對的是調和字(proportional font)。定距字是指字元寬度相同的字型,亦稱為等寬字、等寬字型,本文後續以定距字、定距字型稱呼;漢字中的半角字也是定距字的一種,安排後章節做說明。

 

現在大家使用上習以為常的數位字體出現前的時代,字體的呈現是透過鉛字排印的方式傳達出來,而鉛字大多以固定寬度的方式作設計,來符合當時打字機、排印技術上的限制。時代的腳步不斷的前行,電腦硬體環境與排印軟體對於運算字體的機制也不斷的改善,使得排版、閱讀感受上,呈現出比較自然的調和字使用變的普及。

 

我們以AR Silver Sans 這款字簡單來說明定距設計(Monospace)與調和設計(Proportional)在字元呈現的差異。為了要符合每個字元寬度一致的設計規格,我們可以看到AR Silver Sans Monospace在「i」這個符號字元的空間結構上與AR Silver Sans Proportional有明顯的不同,這樣的設計主要是為了在空間佈局上取得較佳的呈現,另外「m」這個符號字元也因為字元空間的不同,而呈現不同的視覺樣貌。

在當代的字型使用趨勢中,大多是以兼顧視覺與造型設計的調和字型使用的較多,但定距字的使用,並沒有因調和字的大量運用而消失,而是以能清楚呈現資訊訊息的功能性使用角度持續存在著,例如微軟在2019年發佈的開源字型Cascadia Code,就是一款具有固定字距(Monospaced)特性的字型,適合用於電腦系統與工程師程式開發等用途上,讓工程師在進行字元閱讀時,達到提升程式碼與介面文字可讀性的效益。

工程師在進行程式設計時,使用固定字距的字型可增進開發效率。

 

最近,我們也看到一些公共建設,如新竹車站資訊面版、桃園機場的班機資訊顯示面版當中的字體也都是選用了固定字距的字型。以新竹車站顯示列車到站的時刻表為例,這是設計師 施博翰使用了定距字設計的AR Silver Sans Monospace,作為新竹車站時刻表的呈現,這定距字的使用,配合設計師排版的專業,增加了時刻表上數字訊息閱讀的可讀性。

設計師 施博翰在新竹車站列車時刻表的排版設計

 

 

桃園機場的班機資訊顯示面版以定距字做為訊息閱讀的文字選擇。

 

 

雖然定距字型出現的時間較調和字型早了很多,但在使用上並沒有因為外在環境硬體的提升而消失,反而以在特定情境下具有高辨視度的功能性繼續存在著,廠商們也持續設計新的定距字,也讓用字多了許多的選擇。

 

 

附註:新竹車站列車時刻表引用自設計師 施博翰在「臺鐵新竹站指示標示系統設計規劃說明」

 

字體產品與應用 2021-04-12

iFontCloud字型租賃授權介紹

在adobe推出Adobe Creative Cloud雲端服務後,設計界使用軟體的習慣因此有了重大的改變,對於軟體廠商而言,可稱做是整個使用生態的重構。字型對於設計師來說是一個重要的設計素材,而數位字體開發廠商本質上與Adobe一樣,都是軟體開發商,現今也都隨著趨勢轉型為以服務為導向的工作型態。 

 

字型使用行為,由一次性的消費習慣,轉換成以季或年為單位的租賃服務模式,在歐美、日本、韓國已經行之多年,在台灣,文鼎公司在2015年開始啟動iFontClout文鼎雲字庫,至今已經邁入第七個年頭,讓我們再一次的來認識一下iFontClout文鼎雲字庫的字型租賃服務: 

什麼是租賃字型–iFontCloud租賃字型提供了正版字型授權,可將字型透過雲端下載,到電腦上使用。而且,藉由雲端同步的機制,字型設計師新增與修改的字型也可以即時更新,讓使用者取得最新字型。 

可商業使用–為了保護智財權並兼顧會員使用便利性,可做為個人及商業用途。授權範圍請參照本服務之字型軟體使用授權書。  

雲端管理系統–依照需求的不同,選購符合的授權數量。一個帳號,在任何PC或Mac上皆可輕輕鬆鬆使用及管理。 

友善的管理介面–字型檔案存放雲端,輕鬆使用及管理字庫。透過工具列表,可快速輕鬆的完成安裝及移除。 

更新免煩惱–字型內容有修正或更新,用戶端即時更新。 

彈性租賃模式–針對特定字型需求,可至字型總覽頁面篩選。   


iFontCloud授權懶人包 

一個授權,一台電腦 

不論購買單套字或方案,購買數量1,指的是「一台電腦一個授權」,無法同時2台電腦使用,如需更換電腦,請登入iFontCloud至租賃管理頁面移轉。 

標準和進階版差異 

標準版:使用字型設計出來的產出物,以自用為目的,製作和使用都是同公司。作品所有權只可屬於授權方(製作者) 

適合對象:企業、自用 

進階版:使用字型設計出來的產出物,提供他人使用為目的,製作和使用是不同公司。作品所有權可屬於授權方(製作者)或客戶 

適合對象:設計公司 

不再租賃字型,作品可否繼續使用 

在購買一年內期間製作完成的作品,就算明年不再租賃方案,完成的作品仍然可以繼續使用,沒有時間限制。 

此外,字型檔案是放在雲端空間,當不再租賃方案,您的電腦沒有字型檔案,因此原始檔如果需要再編輯,會跳出找不到字型,需再次租賃才可編輯原始檔 

單套字的授權範圍 

單套字授權範圍同進階版。 

進階版:使用字型設計出來的產出物,提供他人使用為目的,製作和使用是不同公司。作品所有權可屬於授權方(製作者)或客戶 

同一套字型不同字重算幾套字? 

文鼎明體共有六種粗細(L, M, B, E, H, U),因此算六套字型 

已經購買租賃字型,如何開始使用字型? 

字型使用前需先下載「iFontCloud字庫管理工具」做為電腦與租賃服務的中繼,啟用訂單後,用戶依據使用需要,字型可選擇單套字下載或全部下載。 

請根據您的作業系統下載並安裝 https://ifontcloud.com/index/download_tool.jsp 

 

iFontCloud租賃字型授權範圍

 

如需更詳細內容,可參考標準版授權書、進階版授權書範本 

字體產品與應用 2021-03-31

文鼎UD晶熙黑體的拉丁造型搭配

中文字體與日文字體同樣都有漢字、拉丁與假名,如果有留意日文字型產品,會發現日文字型同樣的一個字體家族,但有著不同假名、拉丁的造型設計做搭配。

文鼎UD晶熙黑體開發之初也規劃有這樣的設計,亦即晶熙黑體在拉丁的造型上,共有三種造型可供設計師選用,以繁體中文為例,字體名稱分別是:

1. 文鼎UD晶熙黑體HK

2. 文鼎UD晶熙黑體E1HK

3. 文鼎UD晶熙黑體AktivBHK

這三款字型的拉丁造型可以追溯回到原始的拉丁字,分別是AR Dori Sans、AR NewHebe Sans、Aktiv Grotesk;AR Dori Sans、AR NewHebe Sans是文鼎字型近年來在拉丁字設計的代表作之一,除了文鼎內部的字體設計師參與設計開發外,也力邀位於美國波士頓Font Bureau字體公司的總監David Berlow協助設計指導、監修;兩款原生拉丁字皆有自 Light-Ultrablack 9個字重,在與晶熙黑體漢字12個字重搭配時,設計師重新給予字重的設定,細修曲線、調整架構再加入必要的視覺修正,字重擴充至極細的Hair到極粗的Ultrablack(E1版),再依據視覺灰度給予最佳的寬度比例,讓中文漢字、拉丁字搭配出最佳的整體視覺效果。

 

拉丁符號的設計通常會有因應造型、字重而做視覺校正的處理,目的是為了排版上的美觀、舒適性而做。以AR Dori Sans /文鼎UD晶熙黑體HK的符號為例,在數字1和4就有在不同的字重上做視覺校正,經過視覺校正的字型有字高(Font Height)的不同,但隨著字重(Weight)加粗,數字1、4、6將差距會縮小。

文鼎UD晶熙黑體,拉丁以AR Dori Sans做搭配,整體呈現出幾何、工程、現代的氛圍,具有Medium-Heavy共五個最常使用的字重,適合在數位顯示環境下使用,在中文顯示各分句之間停頓的逗號(U+FF0C),設計師簡化漢字逗號的造型,在這裡嘗試著做大膽的簡化設計,閱讀時營造出簡潔時尚的視覺感受。

    文鼎UD晶熙黑體HK排版展示

 

                                                                                       嘉義美術館以文鼎UD晶熙黑體HK做為指示標識用字/角白設計

 

文鼎UD晶熙黑體E1HK,拉丁以AR New Hebe Sans做搭配,整體呈現出經典、傳統、雋永的氛圍,適合使用在書籍排印完整產品共有12個字重可供選用。

                                                                                                                                      文鼎UD晶熙黑體E1HK排版展示

 

文鼎UD晶熙黑體AktivBHK,是晶熙黑體的漢字與英國合作夥伴Dalton Maag 公司的Aktiv Grotesk 進行搭配後的字型產品,共有繁體中文+香港字符集、簡體中文、日文三個語言,每個語言各四有個字重,旨在將晶熙黑體的簡潔與AktivGrotesk乾淨利落加以整合,感受上均勻平穩,視覺連貫而有當代感。文鼎UD晶熙黑體AktivBHK獲得國泰航空選用做企業字型。

                                                                                  TPOGRAPHY 字誌 選用文鼎UD晶熙黑體AktivBHK做為內文用字

 

搭配著不同拉丁造型的晶熙黑體產品,這樣的整合設計罕見於中文字體上,讓設計師們在字體使用時,多了不同設計情境字體選用上的彈性。

字體產品與應用 2021-03-29

在使用win10無法輸入文字要怎麼辦?

是不是有很多人最近升級到Windows10 20H1與20H2都會覺得輸入法哪裡怪怪的,時而閃退、部分候選字出不來或是直接當機呢!!!這真的是擾民,但又沒辦法不使用,這不是字型的問題,但在微軟還沒針對此問題做修改前,我們可以嘗試幾個步驟,讓你的輸入法起死回生。

 

目前微軟還在研究IME模式問題的解方案,如果使用者發現自己電腦上的輸入法發生異常的情況,不妨先嘗試透過 Windows Update 安裝更新,看看情況是否得到改善,如果沒有的話話,我可以先IME本,暫時決問題如何切換舊版,可以照以下步及可暫時目前的擾。

 

Step1. 左下始功能列點選

 

 

Step2. 點選時間與語

 

Step3. 點選中文() 

 

Step4. 選擇使用中的法,點擊選項

Step5. 選擇一般

Step6. 一般選擇使用舊版的微注音開關開啟

 

 

 

以上的步驟可暫時目前所遇到IME入法問題當務之急,在微軟尚未對此問題更新前,大家不妨試試。

精選字體 2021-03-21

【字型介紹】文鼎書苑黑體的設計理念及應用介紹

設計沿革

文鼎的『書苑』字型商標,早於成立的第二年1991年就申請。

這是文鼎字型創立之初,計畫開發具原創特色的經典明黑字體,能與當時市場流行日本照打字型有所區隔,而特別創立的字體系列。

但這個創作計畫由於台灣市場盜版的嚴重打擊,轉而以日本為主要市場,發展嵌入式螢幕字型而擱置。

在日本市場發展逐漸穩定後,於1999年開始著手原創書苑黑的設計,設計過程斷續進行,直到2003年才較成熟,其特色為較扁形的字型,字面縱橫比為93.5:100。

當2003年完成調整設計的同時,日本C&G字型公司與文鼎合作,承接到微軟日文 Vista 作業系統字型「明瞭 (Meiryo, メイリオ)」的委託設計開發,很巧合的是,「明瞭」也是一個扁型的設計,字面縱橫比為95:100的設計,因此就停下原來書苑黑體開發。

完成日文明瞭字體開發後,再於2008~2011年陸續完成書苑黑Big5 /GB2312兩字集,Bold & Medium 字重開發。

設計原型

文鼎書苑黑體原型設計,字面飽滿,大字腔,於當時以小字面的長型傳統黑體設計市場中,獨樹一格。

而在文鼎字型團隊反覆精煉下,於2003年設計出字構寬扁、筆型簡潔、大字腔設計之書苑黑造型。

完成日文明瞭字體開發後,再於2008~2011年陸續完成書苑黑Big5 /GB2312兩字集,Bold & Medium 字重開發。

設計特色

文鼎書苑黑體,設計採簡潔、大字面、寬扁型、大字腔設計,同級字較清晰不易糊字,容易於螢幕顯示閱讀。







文鼎書苑黑體字級適用範圍

  Text Display
起(pt) 迄(pt) 起(pt) 迄(pt)
Medium 6 12 15 56
Bold 8 14 16 56

 

文鼎書苑黑體風味輪屬性

Medium 傳統、正式、安靜、纖細、剛毅
Bold 傳統、正式、安靜、力量
字體產品與應用 2021-03-15

對方電腦未安裝字型,在PPT和Word的文件也能顯示字型?

有沒有在PowerPoint精心選用適合的字體、費心編排完成簡報或是報告後,要傳送給客戶、長官或是老師,可是發現對方的電腦可能沒有你選用的字型,開啟檔案後,字型都變成新細明體而且版面還大跑版的慘痛經驗呢?

 

我們來使用軟體內鍵的小功能,只要存檔時做一個小步驟,對方就能看到有套用字型的文件,輕鬆解決字體沒有套用的問題。

 

Microsoft PowerPoint

1.點選「PowerPoint選項」

 

2.點選「儲存」,勾選「在檔案中內嵌字型」和「只內嵌簡報中所使用的字元」

3.將文件存檔

4.對方看到的文件即為已套用字型

 

 

PPT可使用另外一種方式儲存即可在未安裝字型的電腦顯示字型,但版本需要2010以上

 

 

1.點選發佈>封裝成光碟

 

2.點選選項,勾選「內嵌TrueType字型」

My alt text

3.點「複製到資料夾」儲存檔案

Microsoft Word

1.點選「word選項」

2.點選「儲存」,勾選「在檔案中內嵌字型」和「只嵌入文件中使用的字元」

 

提醒:

1.未安裝字型的電腦,文件開啟時是唯讀檔案,無法修改文件內容,且顯示時有可能部分字未套用到字型;若要修改文件,需點擊「移除受限的字型」即可編輯文件,點選後文件內的字型為未套用字型。

 

2. 無論是word還是PowerPoint,勾選上述任一選項後,因嵌入字型的因素,將增加檔案的資料量

 

 

字體產品與應用 2021-02-24

文鼎UD晶熙黑體 TTC格式產品說明

TrueType Collections (TTC)允許將多個性質相近的字型合併為一個檔案,其目的是為了節省字型檔的資料量。以繁體中 文UD晶熙黑為例,針對43個常用全角符號做調和(Proporitional)設計,分別放在兩個不同的字體名稱上,使用者可以依 自己的喜好及需求,選擇常規的全角符號字型或是有標示P的常用全角符號調和設計產品。這兩套不同名稱的字體可以 合併成TTC,漢字和部分符號可共用,只要增加39個調和符號的資料量。合併後的TTC字檔和分開成兩個TTF字檔效果一 樣,卻可節省95%以上的資料量。

在我們對設計師的訪談中,我們聽到一個聲音,有設計師認為在進行長文排版時,全角位符號的字寬常常出現一些尷尬 的排版問題,如川流(river)、凸排等,影響著整體的閱讀感受。在理解設計師的困擾後,我們挑選了39個中文常用全角符 號,進行字寬調和(Proporitional)的設計,有此設計特點的產品,在字體名稱上都會多一個「P」,代表Proporitional的代 號。

以文鼎UD晶熙黑體E1HK字體為例,使用者在安裝字體後,在字體選單中會看到「文鼎UD晶熙黑體E1HK」與「文鼎UD晶 熙黑體PE1HK」兩個字體名稱,這是因為文鼎UD晶熙黑體E1HK字體檔案使用了上方描述的TrueType Collections (TTC) 的機制而呈現出來的結果。

 

下圖為文鼎UD晶熙黑體E1HK 產品使用常用全角符號及常用全角符號調和設計的排版示意圖,選用經過符號調和設計 的字體,排版後漢字、符號呈現出較佳的字寬比例,將有助於段落文字訊息閱讀的舒適性。

字體產品與應用 2021-02-19

文鼎字重應用分類與建議

一款字體如以家族的方式做呈現,大多是由細到粗以字重(Weight)的面貌呈現出來,這是字體的使用,除了造型的選擇 外最常使用到的情境。

字重的選用與字級的大小具有不可分割的相依性,我們以使用情境做字重應用字級大小的分類,共分成微字型/Micro、 內文/Text、標題/Display三大類,微字型/Micro指的是極小字的使用,內文/Text應用在長文排版的閱讀情境,標題/Display應用在標題、大字、有視覺距離的情境,三個類別字級大小的建議使用分別如下表:

以文鼎UD晶熙黑體為例,我們依據市場需求與開發規劃,將字重由極細到極粗共規劃出完整12個字重,讓用戶能依所處 的需求使用在各種不同情境上,文鼎UD晶熙黑體的字重應用建議如下:

字體產品與應用 2021-02-08

文鼎DC陳森田MORITA

文鼎DC陳森田MORITA是文鼎字型與插畫家_陳森田合作開發的手寫字型,所有字體的內容包含中文、英歐文、符號等,都是陳森田手寫繪製,再由文鼎字型作數位化產品設計,產品同時涵蓋繁體中文、簡體中文。

陳森田MORITA_B體將漢字定距字與調和字整合在一個字型檔案裡,讓,森田手寫字的手感、Q感及溫度可以呈現出來。使用者透過字型選單選擇適合情境的字型做應用。

 

本影片透過Adobe Illustrator來呈現文鼎DC陳森田體的使用方式,演示漢字定距與漢字調合設計排版上視覺的不同。

應用設計

字體產品與應用 2021-02-08

文鼎DC香蕉人體

來自宇宙的香蕉人學寫字,慢慢地寫、緩緩地進步,他的字,有點呆、有點萌。這是文鼎字型與插畫家_香蕉人(林柏辰)合作開發的手寫字,所有字體的內容都是香蕉人手寫繪製,再由文鼎字型作數位化,產品同時涵蓋繁體中文、簡體中文。

 

手寫字體具有溫暖的感受,在數位化的過程中,我們思考傳統上數位字型的規格以及用戶的體驗,最終,將香蕉人體漢字定距字與調和字整合在一個字型檔案裡,使用者透過字型選單選擇適合情境的字型做應用。

 

本影片透過Adobe Illustrator來呈現文鼎DC香蕉人體的使用方式,演示漢字定距與漢字調合設計排版上視覺的不同。

應用設計

字體產品與應用 2021-02-08

文鼎方新書

文鼎方新書立於黑體,保留黑體的簡練、穩重,融合明體的舒適、清雅,並以高規格審視標題用字之識別性、內文用字易讀性,期望帶給使用者最佳的使用體驗。文鼎方新書造型設計捨棄明體傳統點、捺造型,收筆如眉,清新盈盈,兼容字構的均衡平穩。

因橫直筆寬度的搭配及收筆縮減,文鼎方新書融合黑體和明體的優點,加上反覆雕琢視覺濃淡,排版視覺清晰不突兀。拓展Condensed 系列後,使方新書在排版的表現更為出色,提供使用者多元選擇。

 

本影片透過Adobe Illustrator來呈現方新書的使用方式,分別演示中文常用全型符號調和設計(Proportional)、長體Condensed家族、經過字元灰度調整後的方新書,使用在桃園機場第三航廈的介紹以及方新書的可變式字體(Variable Font)。

 

應用設計

字體產品與應用 2021-02-08

文鼎DC黃陽尖魏

文鼎DC黃陽尖魏體是知名書法家_黃智陽教授,與文鼎合作開發的真跡書法字型;黃陽的字體是書法的專業技術與現代造形特質的新媒合,長時間逐字用心書寫與設計,使尖魏體突顯了瘦金體的利落美,結合了魏碑體的方折感,使字體的使用更具有文化意義與時尚氛圍!黃陽尖魏在設計時,加入中文排版裡「疊字」效果的巧思,黃智陽教授在書寫時,特意創作「相同字的不同寫法」,以展現書法中「不雷同」「不重複」的美感,讓黃陽尖魏更能呈現書法藝術的美感。

 

本影片透過Adobe Illustrator來呈現云康行楷TrueType(TTF)與OpenType(OTF)兩個字型格式的使用方式,分別演示疊字的選用、兩款拉丁字的造型設計,以及中文常用全型符號調和設計(Proportional)。

應用設計

字體產品與應用 2021-02-08

文鼎DC云康行楷

由施隆民教授書寫的文鼎DC云康行楷,字型書寫旨在掌握書法的美感,筆法上以流暢、生動為原則;結構上為了排版印刷的美觀,盡量保持「端莊」的體態。云康行楷在設計時,加入中文排版裡「疊字」效果的巧思,施隆民教授在書寫時,特意創作「相同字的不同寫法」,以展現書法中「不雷同」「不重複」的美感,讓云康行楷更能呈現書法藝術的精神。此外,云康行楷提供了兩種不同書法風格作選擇,其中云康行楷碑帖版,藉由部首共用、改變寫法、增減筆畫等多方式,保留傳統書法運筆藝術之美。

 

本影片透過Adobe Illustrator來呈現云康行楷TrueType(TTF)與OpenType(OTF)兩個字型格式的使用方式,分別示範疊字的選用,以及中文常用全型符號調和設計(Proportional)。

應用設計

名詞解析 / 設計 2021-02-05

字寬/Width

字元的寬度,包含字元左右的空間。數位中文字體裡的漢字,基本上字元寬度是等距固定的,但依字體的風格,如擬人化的手寫字,在漢字上也可以設計成調和(Proportional)的樣貌,讓字體排版更具有溫度感。

名詞解析 / 技術 2021-02-04

OpenType

OpenType 是由 Adobe 和Microsoft聯合開發的字體格式,可以支援替代字、連字及各種文體集。OpenType的字形(glyph)輪廓資料格式有兩種:一個是TrueType格式輪廓,另一個是基於PostScript語言的CFF(壓縮字型格式,Compact Font Format)格式輪廓。前者的字型副檔名為 .ttf、.ttc,而採CFF格式的字型副檔名通常為 .otf。

字體產品與應用 2019-10-18

【字型介紹】文鼎DC清圓體

文鼎DC清圓體為知名設計師-蔡啟清教授設計的全新圓體字型。清圓體的設計,容易辨識、容易閱讀、設計簡約,表現比較圓、滑及柔和的個性,讓使用更具有彈性 。清圓體適當減小字面佔字身89%,讓字元間距不擁擠,字高稍減,字體更方正,行間也適當。

設計動機
目前過多風格獨特但不適於閱讀的字體,易閱讀的通用字體還是只有黑體字,需要增加更多通用字的設計。現代中文字體字面被加大,當字元間距預設值為0時,看來顯得太緊了。各國中文字體標準不同,但台灣的正體中文標準被質疑。








字體設計與發展 2019-10-09

Word、Illustrator中有引號該怎麼排版?

您在Word、Illustrator、InDesign中選擇中文字型編輯文字時,是否在輸入英文雙引號(”)或是單引號(’)時會被強制替換成全角引號,造成排版上的困擾(設計師表示頭很痛)。其實這個功能原本是好意可以自動將英文引號取代為中文全角引號,但似乎太過"智慧",有時反而造成麻煩。

讓文鼎小編教你如何解決問題吧!

Word

1.點選「word選項」

2.點選「校訂」→「自動校正選項」→「輸入時自動套用格式」,取消勾選「將一般引號取代為智慧引號」

Illustrator

點選「檔案」→「文件設定」,選擇「文字」,取消勾選「使用印刷體引號」

InDesign

1.選擇要匯入的word檔案時,勾選「顯示讀入選項」

2.取消勾選「使用印刷體引號」

 

字體產品與應用 2019-10-02

文鼎4套免費商用字型介紹

文鼎推出4套免費商用字型,提供iFontCloud會員免費使用,無論是個人或商業使用,都可以在文鼎iFontCloud雲字庫免費取得使用,包含2套繁中字型,及2套簡中字型。

文鼎上海宋體_L   AR ShangHaiSongB5 LT
文鼎楷體_M         AR KaiB5 MD
文鼎上海宋_L       AR ShangHaiSongGB LT
文鼎中楷体           AR KaiGB MD

文鼎在2001年及2010年曾提供多套公眾授權字型,給社會大眾作公眾授權使用;2019年文鼎再提供4套免費商用字型,只要你加入iFontCloud雲字庫成為會員,就可以使用iFontCloud Font Manager免費下載這4套字型,可以製作個人文件,或製作商業廣告、文宣品...等,授權使用範圍與旗艦包進階版的授權範圍相同。
 

取得文鼎4套免費商用字型的步驟
1.成為iFontCloud雲字庫會員
2.下載安裝iFontCloud Font Manager工具
3.在iFontCloud 雲字庫即可使用4套免費商用字型



字體產品與應用 2019-05-21

如果IG限時動態可以換中文的話?

「2018年10月24日,派傑投資公司最新調查顯示,美國85%青少年每月登入一次 Instagram,首度超越Snapchat的84%」 ─摘自Wikipedia

社群網絡早已滲透在你我的生活中,如同精神食糧般紮根在生活日常。相信大家對Instagram的現實動態功能一點都不陌生吧?24小時就會消失,要是喜歡的人發文沒看到就會覺得搥心肝😢(小心肝~。

 

英文字有多個選擇,中文字選擇好像不多?

發圖不附文,此風不可長!拍了美美圖片再點綴幾句金玉良言,圖文並茂就是好棒棒!不過大家有沒有發現,IG裡面的英文字型有多達五款字型可以選擇,但...中文字型除了系統字之外,就沒有別的選擇了...😱。

 

如果有不同中文字型選擇

由於我們都知道目前中文字的選擇只有一種,那如果選項變多了?可以帶來什麼樣的視覺感受呢?(圖例用字為文鼎字型)

是不是覺得有換有差😁?(在此感謝辦公室夥伴圖片支援),中文字不同帶來的視覺感受也不一樣,如果可以有更多不同的造型搭配更能豐富貼文給人的印象!

 

中文英文配一配

IG提供了5款不同造型英文字,如果說搭配時可以搭配上類似風格的中文字,在視覺上會不會更順眼呢?

以這款IG顯示「現代感」的英文字為例,最大的兩個特色為:筆畫收尾處導圓角;整體視覺比例瘦長。因此搭配中文字時就要考量到這兩個特色,文鼎公司現有字體產品裡,沒有完全符合的中文造型可以搭配。不過現在有了「Variable Font」這項新技術,小編巧手一弄,將晶熙黑體轉了圓角、瘦身一下....

一款可以搭配現代感的新字型就誕生了!可能很多人還沒聽過Variable Font,沒關係,下一篇我們就介紹Variable Font給大家認識!!

其他字型可以怎麼搭配:

字型搭配是一門學問,上面四款IG的現有英文字,小編先用文鼎現有的字型產品或Variable Font搭配,大致做到60分的標準,但仔細下去評估,例如:字體傾斜的角度在視覺上有沒有一致?手寫字筆畫有沒有更接近的筆感特徵?等...,要做到特徵完全吻合,必須要字體設計師評估,特別為這款字量身打造一套搭配的中文字型。不過這樣的搭配是非常費工一件事,除了評估、造型搭配外,設計師還要一字一筆慢慢製作等...,細節很多一項大工程,之後也會寫一篇字型搭配的文章,到時候我們再好好介紹字體搭配的流程吧!

 

上述總結

不管什麼原因,每天都要滑個手機看看IG。如果在中文字型可以增加新的中文字型,想必是可以帶來嶄新的視覺感受!最後就讓我們像IG許願,大神大神!造福廣大中文語系用戶吧!有什麼想法想要討論,都可以在下方留言回覆我們。那我們就期待下篇文章吧!

字體技術 2019-04-25

我的網頁為什麼會眨眼

一招教你搞定WebFont網頁瞬閃問題

如果你的網頁使用了Web Font,你可能或多或少會收到網站的使用者告訴你:欸,為什麼你的網頁字會閃一下?這時,你可能納悶什麼叫做閃一下,開了網頁後,卻又沒看到使用者描述的狀況。這其實是CSS加上網路速度的問題:在還未將Web Font字型下載完成前,會先以系統預設字型顯示頁面,等到下載完成才套用到已顯示在瀏覽器的字型上。也因為如此,如果瀏覽網頁的電腦網路不夠快,可能會發生已經頁面載入完畢了,Web Font的內容隔了1~2秒才接著載完並套用,此時,就會發生所謂的「眨眼」現象了。

這樣的問題,我們可以透過加入以下CSS的方式,告訴網頁在確認Web Font狀態前,就算頁面內容載入完畢,也先將文字隱藏起來,直到確認了Web Font的狀態後,再將文字顯示,這樣就可以避免瀏覽網頁時出現文字瞬閃了!

 

code
.arwf-loading body { /*Web Font正在載入中,不顯示文字*/

          opacity: 0;
          visibility: hidden;
}
.arwf-active body { /*Web Font處理成功,直接顯示文字*/
          opacity: 1;
          visibility: visible;
}
.arwf-inactive body {/*如果Web Font處理失敗,直接顯示文字*/
         opacity: 1;
         visibility: visible;
}

字體設計與發展 2019-04-18

從UD Font設計談起(下)

UD Font設計概念

UD Font字型產品共有的特徵為容易辨識、容易閱讀、簡約設計等,換言之,就是讓字型在標準規範下,使用者可以直覺的進行識別,毋需耗費時間在視覺的辨視。在閱讀上,眼球的視覺觀感習慣於明體(宋體)、黑體、圓體、楷體等傳統經典風格的字體造型,我們由街坊的招牌、書報、雜誌中使用的字型,即可窺見這四類字體造型的運用最廣泛,最為大多數人接受,其原因就在於這四類字體的筆劃、造型曲度的可讀性與易讀性較高,因此UD Font大多為這四種造型的字體。

UD Font設計概念是近幾年字型設計界在字型設計時所考量一個要點,尤其在日本地區,許多字型廠商都會推出具有UD設計概念的字型;在台灣,除了文鼎科技大力推展UD Font字型設計,推出UD晶熙黑體系列的經典字型之外,其他字型廠商如威鋒數位、justfont等,也在開發及推廣UD Font的設計概念,這對使用者及設計界都是有正面幫助的。

UD Font字型的設計,就是延伸自Universal Design,設計精神包含:識別性、易讀性、設計簡潔。UD Font 字型設計的四個要素:

1. Visibility:文字構成要素易於視認。適度的加大文字的字腔會讓文字更容易視認,尤其是在遠距離或是要在眼睛一瞥間閱讀文字時,效果會更顯著。

2. Legibility:具有高辨識度,不容易誤認(不容易與其他字搞混),這一點對視力不好的人尤其重要。

3. Display adequacy:設計簡約,以減少在低解析度螢幕顯示時產生不平順的曲線。UD Font設計的筆畫造型簡潔化,移除筆頭和筆尾的華麗裝飾造型,以降低在螢幕顯示時產生會干擾視覺的灰階凸點發生機會。

4. Readability:容易閱讀。中文、日文假名及英數文字排在一起時,呈現的字面大小分布之協調性對閱讀的流暢度也是有很大的影響。

UD Font四要素:Visibility, Legibility, Display adequacy, Readability

UD Font 字型設計除了上述的設計四要素,還要考慮字體的空間分佈、筆寬設計、中英文字造型搭配及字面比例等不同要素;無論是經典的黑體、書法風格的隸書體、俏皮風格的美術字體、手寫風格的個性化字體,每套字體的設計背後都有他的設計理念。對設計師而言,在選擇字型時,除考量字體顯示效果外,選擇高可讀性與易讀性的UD Font字型,讓使用者得到最佳的視覺體驗及感受,是字型廠商與設計師共同努力的目標。

字體設計與發展 2019-04-18

從UD Font設計談起(上)

何謂UD(Universal Design)

UD (Universal Design)通用設計,又稱為全方位設計,是指不需要經過任何的調整與特別的設計,就能為所有人使用的產品、環境的設計。1950年代,在日本及歐美開始提倡「無障礙空間設計」,為身體障礙者除去了存在環境中的各種障礙。1987年美國設計師Ronald L. Mace,開始使用「Universal Design」一詞,就是說在設計時要從對需求的認知,以清楚易懂的方法,讓我們設計及生產的產品或環境都能在最大的程度上讓每個人使用,不論其年齡或能力。

Universal Design在現代社會中已受到普遍的重視,例如:無障礙低底盤公車,讓老弱婦孺上下公車特別方便;斜取式滾筒洗衣機,讓老人、小孩、身障者都能方便拿取洗衣機的衣服。在台灣「自由空間教育基金會」為了將通用設計的理念向下紮根,已舉辦多次的通用設計獎(Universal Design Award),讓學生藉參與通用設計競賽發想過程中,體會不同類型的人各種不同的需求,導入通用設計,創造出真正能為人帶來幸福的設計。

設計讓產品在最大程度上讓每個人使用,無論其年齡或能力。

 

 

20~30年前,字型大部分都是被列印在紙張等媒體上,無論是鉛字印刷、照相打字或電腦排版印刷,只要字型在紙張上呈現清晰,就已經足夠。但是2000年以後智慧型手機、平板電腦等3C電子產品盛行,人們大量使用3C電子產品來閱讀各種文字訊息,之前使用於紙張媒體的字型,顯然無法完全適用於3C電子產品上,而且電子產品的螢幕解析度越來越高,多年前為了320x240 2英吋QVGA螢幕設計的字型,要使用在2K/4K高解析度的不同大小螢幕上,一定無法直接適用;另外,高齡化社會的來臨,如何讓視力退化的老人,很容易辨識及閱讀,不同媒體上的文字訊息,字型設計就是一個重要因素。

如何讓一套字型符合上面這些需求,在字型設計時,就要導入Universal Design的概念及精神。

 

UD 字型產品共有的特徵為容易辨識、容易閱讀、簡約設計等。

字體產品與應用 2019-04-18

關於響應式網頁設計(RWD)

RWD淺談

先前我們在介紹Web Font時曾經提過:「RWD網頁可以針對不同的載具選擇不同粗細的字型,讓小螢幕上顯示的字不會糊成一團」,除了道出了Web Font的優點,也點出了一個好的RWD網站,應該要將載具適合的字級大小考慮進去,而今天我們就繼續介紹,什麼是RWD(Responsive Web Design)式的網頁。

根據Google Developers對於RWD的介紹中解釋:「任何解析度的裝置,伺服器傳的都是同一份的HTML,透過CSS來判定裝置的解析度後,生成適合該裝置大小的畫面顯示。」,因此一個網站可以用電腦、平板、手機來瀏覽,且都會得到最適合的畫面與內容。

任何解析度的裝置,伺服器傳的都是同一份的HTML。

 

早在RWD概念盛行前,就已經有許多購物與行動網站注意到,根據電腦螢幕所顯示的內容架構,可能不適合在手機上,因此他們購買了第二個網域,建立專給手機的頁面,以COSTCO網站為例,如果你看到的網域包含了特殊的前贅字(http://m.costco.com),可能就是這樣的方式。但早先HTML與CSS並未發展到目前的階段,因此這樣形式的網頁多採WML(Wireless Makeup Language)語法所編寫,然而該語法是以XML為基礎,有點類似簡易版的HTML,因此在許多功能的撰寫上都會受限。

在智慧型手機流行後,各家瀏覽器廠商如Chrome, Firefox, Safari, Opera等,也都有針對手機版本所開發的瀏覽器,這時,開始有了以偵測瀏覽器是哪種版本來決定對應內容的方式,而這種方式由於各廠商與各版本間有太多不同的組合,因此在會需要針對許多的版本做設定,甚至要定義不同的手機解析度就是個大議題。

因此在HTML5和CSS3出現之後,許多可以自動偵測螢幕大小與根據大小調整內容比例的語法,就成為了RWD概念的核心技術:簡單的說就是取得裝置的螢幕大小,設定每個標籤的內容該出現的比例與位置。這樣的方式,讓網站工程師只需要針對一個網站開發,就可以讓拜訪者(Visitor)根據其裝置得到最佳的畫面呈現,除了畫面美觀外也更有效的吸收網站資訊,因此成為了近年來製作網頁的熱門詞彙。

HTML5和CSS3是RWD概念的核心技術。

 

Load More ▼