定出一個有自主風格、一睇就知係你嘅網頁。睇吓網頁風格有幾多嘢可以自由設定。
一個網頁想要獨特,就需要有一套屬於自己嘅風格,而依個風格就係透過更改一系列嘅項目屬性而成。喺網頁神整網頁,你可以自己決定點樣改變同改變邊樣屬性,令模板區塊,甚至係成個模板網頁都有一套特別嘅風格。以下係所有客戶可以要求改變或者需要設定嘅項目屬性:
注意:
- 屬性唔係改得越多就越好,尤其係模板網頁,所有屬性已經設計好晒,有時改多咗,可能會有反效果。
- 依部分係構成網頁風格嘅大範圍屬性,細範圍嘅區塊屬性睇依度。
- 再細緻啲例如某隻字嘅顏色喺網頁做好後會有教學教你點改(同 MS Words 差不多)。
- 屬性優先次序:自定屬性 > 模板預設屬性 > 一般屬性。
- 客戶必須要為網頁設定最少一隻顏色。
網頁主風格
網頁顏色
可為網頁設定最多兩種顏色,一主一副。一般會用嚟做標題、超鏈結、按鈕或背景等顏色。
點擊瀏覽顏色代碼
網頁底色
主底色
可以選擇最常見嘅白色,比較型格嘅黑色,或者主/副色加深或變淺。
網頁寬度
除非有特別要求,一般提供標準、中型、大型三種比客戶選擇。
- 標準(1000px):亦係預設寬度,係現時最多人用嘅寬度。適合文字比較多嘅網頁,使用者雙眼左右移動幅度較小。
- 中型(1140px):適合圖文比例相近既網頁。
- 大型(1370px):適合資料較少,圖片為主,想有空間感嘅網頁。
區塊間距
每個區塊之間都要有一定嘅距離將佢地分隔開。一般嚟講可以分到四種距離:
- 窄:感覺緊密,適合資料較多嘅網頁。
- 適中(預設):八搭,適合絕大部分網頁。
- 寬:空間感高,適合資料較少網頁。
- 全屏,即高度與顯示器相同,但前提係內容唔可以過多。
示範
及
預設
文字
字體(只限非中文網站)
可為網頁設定一種字型,點擊瀏覽字型。
示範
及
預設
The font family used here is “Roboto”
這裡使用的字體是這是 “Noto Sans TC”
注意:
- 小部分字型可能無法使用。
- 若網頁為中文,中間夾雜的英文字將繼續使用中文原字體 “Noto Sans TC”。
一般文字段落
顏色
一般為黑色。
字型大小
預設為 20 px。
字重(字體粗細)
除非有特別要求,一般有以下三種:
- 幼體:較為優雅細膩,一般適合設計類。
- 中型(預設):最多人使用,適合所有網頁。
- 粗體:較為粗獷型格,一般適合運動類。
示範
及
預設
這是一般文字段落,顏色為#2A2A2A,字型大小為 20 px,字重為 300 幼體。
這是一般文字段落,顏色為#2A2A2A,字型大小為 20 px,字重為 400 中型(預設)。
這是一般文字段落,顏色為#2A2A2A,字型大小為 20 px,字重為 500 粗體。
備註文字段落
顏色
一般為灰色,比一般文字段落顏色淺。
字型大小
比一般文字段落略小,預設為 18 px。
字重(字體粗細)
預設與一般文字段落相同。
示範
及
預設
這是備註文字段落,顏色為#707070,字型大小為 18 px,字重為 400 中型
主標題(h1)
顏色
一般為黑色/白色(視乎背景)或網頁主色。
字型大小
一般依照模板上設計出的大小,建議不要更改。
字重(字體粗細)
一般比一般文字段落重 200。
示範
及
預設
這是主標題,顏色為#2A2A2A,字型大小為 40 px,字重為 600。
副標題(h2)
顏色
一般為文字段落顏色或網頁主色。
字型大小
預設 32 px。
字重(字體粗細)
一般比一般文字段落重 200。
示範
及
預設
這是副標題,顏色為#2A2A2A,字型大小為 32 px,字重為 600。
小標題(h3)
顏色
一般為文字段落顏色或網頁副色。
字型大小
預設 26 px。
字重(字體粗細)
一般比一般文字段落重 200。
示範
及
預設
這是小標題,顏色為#2A2A2A,字型大小為 26 px,字重為 600。
超鏈結
顏色
顏色: hover (懸浮)
如果沒有裝飾(底線),一般為原本顏色加深或加淺。
裝飾
示範
及
預設
這是超鏈結,顏色為#6d970b
按鈕
顏色
一般黑或白,視乎按鈕顏色。
字型大小
預設與一般文字相同。
字重(字體粗細)
預設與一般文字相同。
示範
及
預設
按鈕
圓角
按鈕分直角、小圓角同圓角三種。
- 直角:感覺俐落、常與幼體字同用。
- 小圓角:預設,八搭。
- 圓角:較常見。
顏色
一般網頁都有兩個按鈕,一主一副。客戶可以選擇用網頁主副色或者黑/白色(視乎背景)。
網頁主副色
主按鈕用主色;副按鈕用副色。
黑/白色(預設)
主按鈕用實色;副按鈕用空心。
寬度
分窄、中、寬三種。
厚度
分窄、中、寬三種。
其他屬性
種類凡多,直接選擇按鈕編號