這是提供給想要以 WordPress 接案做網頁設計的人的一些建議,以下依照重要性排序,愈重要的擺前面,雖然我覺得它們都很重要。

建議 1:習慣用 CSS 語法

和許多新手接觸的經驗,有很多人都很依賴全圖形化的頁面編輯器,例如 Elementor,認為只要拖拉放就可以製作頁面很方便,但我自己是認為這樣有點可惜。主要是受限於編輯器的設定選項,你做出來的網頁會比較缺乏變化與細節調校。基於「魔鬼都藏在細節」的道理,我也認為一個好的網頁設計,通常都贏在細節,舉個例,很多 WordPress 主題(Theme)都是針對英語系環境所設計,當你看英文的 Demo 頁面覺得很好,所以就拿來用,可是當你敲上中文字的時候,許多問題都會一一浮現,例如:

  1. 文字太小:因為中文字需要較大的顯示空間
  2. 行距太小:中文字的行與行之間,需要更高的行高
  3. 頁面太空:英文字體積較大,可以輕易填滿畫面,但中文字卻比較難

因此,當你拿到一個主題,如何讓它恰到好處地顯示中文字,就需要透過自訂 CSS 語法來控制許多細節,這是字體排印學(Typography)的領域,當然,CSS 還能處理更多網頁設計的細節問題,端看你如何運用它。

另外,學習使用 CSS 還有另外一個好處,就是當你看到某一個欣賞的網頁設計的時候,可以運用瀏覽器內建的網頁檢閱器(Web Inspector)功能,來查看對方的 CSS 是怎麼寫的,學習人家的參數如何設定,進而運用在自己的設計上。當你養成這個「偷學」的好習慣之後,你的網頁設計功力就會自然而然地逐漸進步。(備註:開啟瀏覽器內建網頁檢閱器的方式,Chrome 是按右鍵點選「檢查」,Safari 則是按右鍵點選「檢閱元件」)

而且,隨著你使用 CSS 愈來愈熟練,慢慢地你也會養成自己的設計風格,有些慣用的外觀或效果,其實都可透過複製 CSS 語法,來快速應用到一個新開發的網站上,對於慢慢從選項一一設定相比,運用自訂 CSS 的開發速度都會再快上許多,而且可以一目瞭然你做了哪些客製化設定,當出現問題的時候也比較容易追查問題源頭。

建議 2:習慣用英文介面

在 WordPress 管理後台,如果你是使用英文介面的話,最大的好處是當你碰到問題的時候,可以比較快速找到答案,無論是透過 Google 大海撈針,或者透過主題或外掛的支援服務。因為以一個網頁設計開發流程來說,通常卡關的時間花費都比設計本身還來得多,因此只要縮短卡關的時間,就能縮短整體開發時間;縮短整體開發時間,意味著你可以接更多案子,提高收入。

我自己的習慣是開發的帳號都是統一用英文,給客戶的帳號才會使用繁體中文。假如擔心自己會不適應英文介面的人,建議可以先從自己熟悉的介面開始嘗試,以提升語感,例如把手機或電腦先調成英文看看,或者只調自己常使用的服務,如網頁版的 Facebook、Gmail 等等。

建議 3:習慣讀說明文件

上一個建議,我們提到卡關的時間通常比設計本身還來得多,然而習慣在使用一個新主題或新外掛之前,先閱讀作者提供的說明文件,也是可以降低未來卡關的機率。就像你買一個新的 3C 產品,總要先看一下說明書再使用的道理,因為很多問題,都不是產品本身的問題,而是使用者自己使用上的問題。

當你文件看得多的時候,就會慢慢發現,通常優秀的主題或外掛,都會伴隨著具備優秀的說明文件。未來當你文件看得夠快的時候(這取決於你的英文讀取能力),也可以直接在購買新主題或新外掛之前,就先透過它的說明文件了解這個產品是否符合你的需求,若沒問題再購買,可以降低買到不合適的產品的機率。

 

Photo by Kobu Agency on Unsplash
徐仲威

徐仲威

1986 年生,生肖虎,新北板橋人,人生角色很多,是網頁設計師、讀書會成員、孩子的爸、父母眼中的叛逆兒子、單車百岳站長,也是 PTT 行銷板主。你現在閱讀的部落格是從 2004 年寫到現在的人生縮影,今年因為認知到自己壯年發福,所以決定不轉戰當 YouTuber。

Leave a Reply