Blog的外觀呈現由範本(亦稱版型)與版面配置做調整,
Blog外觀調整的第一步,要先尋找網路上的版型(Template),讓外觀有概略的雛型後再微調。尋找範本時的注意事項有:
一、尋找版型的關鍵字
- Blogger
- Template
- Responsive Web Design (RWD)
響應式網頁設計之概念可參考Google說明文件 - One-Page Web Design
單頁式網站是因應平板及行動裝置的瀏覽行為 - Material Design
Google發表Material Design以統一Google全平台設計風格 - Parallax-Scrolling
網頁多層背景以不同的速度移動而形成立體的運動效果
二、Responsive Web Design
響應式網頁設計可讓伺服器向所有裝置發送相同的 HTML 程式碼,並透過 CSS 調整網頁在裝置上的呈現方式。也就是說,不論是使用電腦、平板電腦或手機,不論螢幕是何種顯示比例,網誌讀者所看到的外觀都可以正常顯示,而不會發生圖片被截斷等情形。由於行動裝置普及率高,所以現在的網站設計都應該使用Responsive版型以便操作。
![]() |
三、如何判斷RWD
提供版型的網站通常會註明是否為 Responsive Template,我們也可以在下載前先進入預覽畫面(Live Preview)。
並在預覽畫面中拉動瀏覽器視窗,觀察網頁是否會隨視窗大小而變動,以判斷版型是否為Responsive Design。
或者也可以用Google的Resizer網站來觀看:
找到Responsive設計且外觀與功能符合需求的Template後,就可以下載準備套用。
四、特推幾個免費版型的網站
下載版型後如何套用請接續閱讀 版型套用操作。





