由於原本Google提供的@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400&display=swap'); 會有阻塞渲染問題，導致 CSS 檔案載入變慢，瀏覽器必須先下載完 CSS，再解析到 @import，再去下載字體，這會增加網頁出現「空白字體（FOIT）」的時間。 基於效能優化，2026年建議改用CSS的@font-face自訂字體方法，也就是把字體放在自己的伺服器讓用戶載入網站字形，效能比@import方法要好，穩定性也更高，以下是完整建立@font-face方法說明。 1、先去fonts Google選擇需要的開源字體並下載 https://fonts.google.com/ 2、下載回來後解壓縮字形檔，因該是.ttf格式，建議改成 woff2格式會「比較穩」 .woff2 是現代瀏覽器標準壓縮過（小很多）Google Fonts 主力格式，以下網站可以更改字形副檔名格式 https://cloudconvert.com/ 點選Select File再選擇From my computer 選擇電腦中要改檔案的.ttf上傳後，選擇改為 woff2 Convert後等轉換完成，將.woff2 下載回來 3、在自己網站根目錄建一個fonts資料夾，然後吧字形檔貼入(例如cwTeXHei.woff2)，接者再fonts資料夾中建一個.htaccess 貼上以下防熱連設定，避免字形資源被人拿去白漂 RewriteEngine On # 只處理字型 RewriteCond %{REQUEST_URI} \.(woff2|woff|ttf|otf)$ [NC] # 允許空 referer（直接開 / 某些瀏覽器 / 本地） RewriteCond %{HTTP_REFERER} ^$ [OR] # 允許 localhost / 127.0.0.1（開發用） RewriteCond %{HTTP_REFERER} ^http://(localhost|127\.0\.0\.1)(:[0-9]+)? [NC,OR] # 允許自己網域（含 www / 子網域） RewriteCond %{HTTP_REFERER} ^https?://([^/]+\...
由於無障礙AA中規定對於A元素，或是iframe都需要有title語意說明，若是LINK外連還需要加上另開新視窗說明，如果用CK編輯器複製貼上，來源端就帶有連結但USER又沒設title就會被列為缺失，假使只是用於小型的說明用途欄位，用以下的CK設定參數就可以解決了! CKEDITOR.replace(" t extarea的id ", { height: 200, //高度 //toolbar參數，簡單的basicstyles及paragraph兩個插件(可自行增加) toolbar: [ { name: 'basicstyles', items: [ 'Bold', 'Italic', '-', 'RemoveFormat' ] }, { name: 'paragraph', items: [ 'NumberedList', 'BulletedList' ] } ], removePlugins: 'link,iframe,flash,forms', forcePasteAsPlainText: true }); 重點說明 removePlugins: 'link,iframe,flash,forms', 直接禁止：link，iframe，flash，forms類型的物件存在編輯器 forcePasteAsPlainText: true 貼上時，只保留純文字，不要任何格式 例如複製這一段有帶超連結的內容 貼到CK編輯框後，自動變成純文字格式，USER貼文也就不會有無障礙缺失的問題 這方法適合只需要簡單文字的編輯框，像是簡易討論區或是留言板，以及公開資料說明等，再必須符合無障礙AA規範下，用這方法能解決。 以上工作心得撰寫，有需要的朋友參考看看💁💁 工作心得撰寫： 徐嘉裕 Neil hsu