Benjamin,響應式設計佈景主題,支援手機、平板、電腦螢幕

benjamin-2

開工日當然就是要來個新的WordPress免費版型與大家分享。這回的版型叫做「Benjamin」,中文就是「班傑明」。不同於以往,這回我們帶來了自適應(響應式)網頁設計,讓你的版型可以在多種不同尺寸的螢幕上都可以有良好的呈現,讓你免去安裝手機板外掛就可以讓WordPress部落格網站擁有手機板的瀏覽畫面。

以往由阿腸工作室提供的版型都是單純的固定寬度,這回我們來點不一樣的,讓你網站的版型可以在不同的解析度上都可以正常的瀏覽。至於整體的配色感覺,跟之前的迪奇版型差不多,版面上倒是跟克努特類似,當然我們還是有做一些小微調,盡量讓網站精簡與乾淨。此外,版型這回改採左邊欄、左選單設計,上方不再有一整長排選單,取而代之是左側的手風琴選單。

本來在製作阿腸工作室阿腸工作室官方網站的時候,想說第一個動手開刀的響應式網頁設計應該是官網,沒想到卻變成了這一次推出的免費版型:Benjamin 班傑明,命名的由來是來自於一隻袋狼,至於詳細的故事就請自己查看一下這篇囉!原先製作響應式網頁設計時(Response Web Design,簡稱RWD),要使用Susy,不過之前用過幾次後發現不是用得很順手,最後走回傳統的手工CSS。

製作響應式網頁設計時,就直接使用Media Query + Respond.js 來讓IE和非IE之間皆可以正確地進行自適應的動作。不過要製作RWD,網頁的版面就得簡單,否則做出來可能直接哭噴了。在版面上盡可能地簡單化,讓在尺寸縮放的時候,可以有良好的表現,花比較多得時間是在研究要判斷的解析度與左側手風琴選單的部分。

整體的感覺本來是要走扁平式設計的感覺,不過在 METRO UI 和 Flat UI 的顏色規範上似乎都沒有我們想要的咖啡色,所以最後就隨意了XD。直接使用咖啡色,版型會有一種寧靜的感覺,進入看網站會有一種舒適、很像回到自己家裡的體驗,希望大家會喜歡這個版型囉!

版型下載】。【版型命名】。【使用規則

創用 CC 授權條款
WordPress架站百寶箱阿腸製作,以創用CC 姓名標示-非商業性-禁止改作 4.0 國際 授權條款釋出。

一般留言 (2)

  1. 阿腸大,您這個版型命名連結有誤哦

抱歉,本篇文章留言已經關閉。