★ 地圖雷奧鎮山神廟 ↓↓↓

顯示雷奧鎮廟口位置圖

請問？ 您就是？ (
找你半個月。很會躲是不是！)

雷奧鎮廟口 [鎮長]：
你終於順利走到這，
在這趟漫漫旅程中，獲得能力者各種幫助。

雖然只是個開端，但總有了方向。

★★★ 關卡條件 ↓↓↓

雲端字型 (WebFont, IconFont)

通過 Wappalyzer 網站分析，圖示顯示目前字體類別中全球市佔率。

雷奧鎮廟口 [雲端蛇]：
如果說我能看的更遠一些，
那是因為我站在巨人的肩膀上。

痾！ 沒事。 請繼續。

Google fonts

由 Google 的一群設計師，作家和開發人員領導的合作成果。目標是通過提供直觀，強大的開放源代碼 Web 字體集合來簡化該過程。無論您身在何處，都可以共享排版並將其集成到任何設計項目中。

Typography “exists to honor content,” and when it’s done well it “reveals every element, every relationship between elements, and every logical nuance of the text.” — Robert Bringhurst

線上提供選擇 Web Fonts：入門指南 (執行項目、文本字數量、標題、內文或語系等)，透過分步指導找到合適的字體，或參考總字體瀏覽量作為選擇依據。

( 註 圖片來源：Google design )

<head>
  <link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet">
</head>

body { font-family: 'Open Sans', sans-serif; }

Google Noto Fonts

思源黑體一詞來自於成語「飲水思源」，是由 Adobe 與 Google 所領導開發的開源字型家族 (2014.7 發布)，支援 CJK (中文 / 日文 / 韓文) 等。為當時涵蓋字元數量最多的字型，此為 OpenType 字型技術的極限。

思源黑體的開發以 Adobe 的西塚涼子為中心，西文及數字採自 Source Sans Pro 字型，漢字部分則分別以各語種為基礎，其字形皆依循各國國家標準。包含 65,535 字，共 7 種字重：ExtraLight(250)、Light(300)、Normal(350)、Regular(400)、Medium(500)、Bold(700)、Heavy(900)。

Google 將此字型另起名為 Noto Sans CJK 釋出，僅是字型和字重的稱呼不一樣而已。「Noto」一詞源自於「No more tofu」。當電腦無法顯示的字型，會出現空白的虛缺號「□」，這些方格又稱為「豆腐」。其目的就是要消滅這些豆腐，這表示在 Unicode 內排版時不會再出現空白字符。接續發布思源宋體 Source Han Serif，也就是思源黑體的有襯線對應字體。

Font Awesome

基於 CSS 和 LESS 的字體和圖標工具包。它由 Dave Gandy 製作，用於 Twitter Bootstrap，後來被整合到 BootstrapCDN 中。可在網站上獲取向量圖標和社交標誌。[範例參考]

<!-- Test Out Font Awesome Pro Version 5.11 -->
<head>
  <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.11.1/css/all.css">
</head>
<body><i class="fas fa-thumbs-up fa-5x"></i></body>

雷奧鎮廟口 [雲端蛇]：
或許情況總是超乎預期，條件極為嚴苛下，
必要時，就需做出不同抉擇。

主要 web 字型容器格式有四種：EOT、TTF、WOFF 和 WOFF2。

• EOT 格式僅 IE 支援。
• TTF 格式具有部分 IE 支援。
• WOFF 1.0 格式的支援最廣泛，留意在許多較舊的瀏覽器中無支援。
• WOFF 2.0 格式支援對於許多瀏覽器來說還未實現。

不過，無論選擇的範圍多廣泛，都找不到在所有瀏覽器上，單一通用格式，這表示我們需要交付多種格式才能提供一致的體驗：

• 將 EOT 格式提供給舊版 IE (IE9 版以下) 瀏覽器。
• 將 TTF 格式提供給舊版 Android (4.4 版以下) 瀏覽器。
• 將 WOFF 1.0 格式提供給大多數瀏覽器。
• 將 WOFF 2.0 格式提供給支援的瀏覽器。

註：就技術方面來說，還有 SVG 字型容器，但目前大都尚未實現。以上列點隨著瀏覽器演進，支援度有所差異。

• w3.org Requirements for Chinese Text Layout
  明確描述中文排版之需求與問題，另一方面也提出與既有標準 (例 Unicode) 的對應，提供更有效地促進實作。
• justfont
  提供中文雲端字型服務。justfont blog 提供字體領域相關學術文章，含金量極高。
• caniuse
  Web 技術的瀏覽器支援表。創建和維護由 @Fyrd，設計由 @Lensco。
• CSS fonts
  查看 Microsoft Windows 和 macOS 系統內建字體相容性。

雷奧鎮廟口 [鎮長]：
由衷感謝你的一切，為「排印」世界帶來些許不同。

最後！ 隨時準備好，就闖關去吧！
突破極限，勇者試煉塔。

：什麼！！ 還來啊？？

[ 追加經驗值 ]
註：參考來源 Google fonts
Sandoll Communications
Iwata Corporation
Wappalyzer: Global market share of Font Script technologies