PTT 如何放大版面+字體放大加粗,瀏覽起來更舒服?
![PTT 如何放大版面+字體放大加粗,瀏覽起來更舒服?](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTKnUIlE7EvxU0ANLCFCs9b39PeFDIxmq4iPccr1pWnbJRYeHTsP7zouAKNbW7fhAacHjutM9TPdcKzsxHpDRWGrM7CiKlt2KlLwpv-NTpwbtw1Cz5WmPeOXletsDhSl5Xi9GIixNA9FIJNV_WeSLv2fkbpktnR4ER_WwHhL514mK5K1osfSdrUiVFmq8/s1600/ptt-font-size-high-contrast.jpg)
最近「 為了克服電腦背光,使用大尺寸螢幕 」,PTT 在遠距離看起來字體顯的不夠大。由於 PTT 使用頻率算高,為了讓眼睛看得舒服,有必要對 PTT 進行版面完整優化。 需要調整的事項不少,而且過程不輕鬆,本篇會分享在瀏覽器使用下,PTT 網頁版如何加大加粗字體、放大版面、使用...
繼續閱讀全文不用買字型,用 CSS 做出專業的縷空文字+外框
![不用買字型,用 CSS 做出專業的縷空文字+外框](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisuczgebLNpeD_Qdmg5MHA2MVhofcPD4J6Ud_hkalQySFiNAnsdHi2gBuf5HqsHU6dnOUgoi6DqrBFPNKFsthAbW-nwrqQgM-ooNVAEUHAn7nZWvwnsS3UyipC_uuY8xHsec3HTm3y1RgLPdffbNlTECkW4Ejbwuwscxlg_ppDQJmjIVjFYZ80PXNuKQ/s1600/css-text-stroke.jpg=s0-rw)
最近接到一個需求,製作醫學疾病風險自我檢測頁面,客戶提供的設計圖質感不錯,只不過有設計感的畫面在製作 RWD 效果時,難度會提高很多。 其中一個部分需要使用高超的 CSS 技巧「縷空文字+外框」,這樣的效果無法用簡單的 CSS 語法做出來,原設計圖版面如下(紅框標示的部分...
繼續閱讀全文網頁安裝思源宋體﹍CSS 最佳化實作 + 展示頁面
![網頁安裝思源宋體﹍CSS 最佳化實作 + 展示頁面](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmI64K-AYVukhq5CgAslcYf9fCbrY1qjb72InLUVJfvQeVyFXuBBdK_1e_paMc_hMitLa2Go_ZTc7j1sBtq045qwS-pRr8SMQyxOwUi_CM0zoC7MUMIlJpRPPFTLbxWoopS8aLI4MFkvDP/s1600/noto-serif-tc-css-optimize.jpg)
上一篇「 網頁安裝思源黑體﹍載入速度最佳化實作 」已說明了 Google Fonts 的中文字型處理技術原理,本篇直接說明如何安裝「思源宋體」。 最佳化的要點為: 手動拆解官方 CSS 檔內容,逐一加入 font-display: swap 參數 把所有 CSS 內容塞...
繼續閱讀全文網頁安裝思源黑體﹍CSS 最佳化實作 + 展示頁面
![網頁安裝思源黑體﹍CSS 最佳化實作 + 展示頁面](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlv29UYS5Ew-pscr5U8QbAXTy1YDrLFsBUkt4CkJJKVFbwVzrgU45JWvG_dZwRSAz_l1lEJQ2s8bfJAmbbY74wFho8BjkMhIRxhdUtzlmrUI7pMMAsde8adqgNwUfUyvKDnNaDZwniRxtB/s1600/noto-sans-tc-css-optimize.jpg)
前陣子與朋友討論網頁安裝「思源黑體」的效果,有強者大大告知現在載入字型檔時,會拆成上百個小檔案。研究後發現這真是 Google Font 技術上的一大進步,「思源黑體」也正式成為我的選項之一。 以我個人的看法,微軟正黑體作為網頁內文主要字型的話稍微偏細,思源黑體視覺效果比較適...
繼續閱讀全文網頁是否安裝思源黑體、中文字型的考量﹍影響載入速度的因素及作法分析
![網頁是否安裝思源黑體、中文字型的考量﹍影響載入速度的因素及作法分析](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKNRWVQM_dygQkKOuLfjwI7mudBtDCqkLAz8SGMcTHyFD0lYb2R3ahG8VsbTYZRyA7MjL9n7cDhBKBx_Fk0UPe53JKJPXMwIEewNBxbCSlQEoYv16HgBNpKkWp217Zia5t3_QNDcL-o3J1/s1600/noto-sans-serif-traditional-chinese-web-font.jpg)
過去在「 網頁中文字型除了微軟正黑體, 還有這些好選擇! 」曾提過,網頁若使用「作業系統」以外的字體,由於中文字型檔案太大,會影響網頁載入速度。 後來 Google Fonts 免費讓「 讓思源黑體可直接外連 」,使用 Google 的 CDN 伺服器肯定比自己找網頁空間的連...
繼續閱讀全文