排版在網(wǎng)頁設(shè)計(jì)中經(jīng)常被忽略。其實(shí)這是不對的,因?yàn)樽⒅鼐W(wǎng)頁排版確實(shí)可以提高你的網(wǎng)頁設(shè)計(jì)水平和可讀性。下面,我列出了幾個(gè)非常有用的排版技巧讓你的網(wǎng)站看起來更好。 1、糾正行高 最常見的網(wǎng)頁布局錯(cuò)誤之一是定義了不正確的行高。行高是定義一行文本的高度,所以我們必須按照文本字體大小來設(shè)定行高。 一般來說,在設(shè)置文本行高的時(shí)候,我經(jīng)常在字體大小的基礎(chǔ)上加上7個(gè)像素(對12-17像素的字體而言) 2、糾正標(biāo)題margin值 另外一個(gè)常見的錯(cuò)誤是標(biāo)題周圍不正確的margin值。標(biāo)題其實(shí)是與它下面的段落是相關(guān)聯(lián)的,而不僅僅是兩個(gè)段落的分 割符。這就是為什么標(biāo)題的margin-top比margin-bottom要寬。 3、不要使用過多的字體 為了確??勺x性和專業(yè)性,你的網(wǎng)頁上不應(yīng)該使用超過3種字體。使用過多的字體會(huì)干擾你的用戶而且讓你的網(wǎng)站看起 來很亂。相反,較少的字體讓你的網(wǎng)站顯得干凈易讀。你可以標(biāo)題使用一種字體,正文使用一種字體,最后 logo或副標(biāo)題使用另外的字體。 4、代碼部分使用等寬字體 如果你是一位開發(fā)者(就像大部分讀這篇博客的人)你可能想貼一些代碼在你的博客里。如果是這樣,請使用等寬字體。 那么,什么是等寬字體?它就是字母和字符占相同水平寬度的字體。 那么在網(wǎng)站的代碼段你應(yīng)該使用哪種字體呢? 到目前為止 Courier字體是最流行的,那么嘗試一下最新的一些字體像 Consolas或 Monaco吧。 5、關(guān)注對比 即使你的網(wǎng)站有很好的排版了,另一個(gè)需要注意的是對比。如果你的頁面背景是中灰色(#999999),那么不要使用深灰色(#333333)的文本,否則你的內(nèi)容很難看清,尤其是對一些年紀(jì)比較大的或視力差的人。 總之,除非你的網(wǎng)站是關(guān)于黑客、黑帽seo或哥特?fù)u滾的,不然你應(yīng)該使用淺色背景和深色字體來保證清晰的對比度增加你網(wǎng)站的可讀性。 6、只給鏈接的文本加下劃線 在我上網(wǎng)的12年中,瀏覽器用在鏈接的默認(rèn)樣式一直是藍(lán)色文本加下劃線。雖然這個(gè)藍(lán)色經(jīng)常被改成另外的顏色,但下劃線一直被當(dāng)做是鏈接的常規(guī)樣式。這就是為什么除了鏈接你不要給其他的東西加上下劃線的原因。否則,這可能對你的用戶造成很大的困惑。 7、創(chuàng)建樣式庫 讓你的網(wǎng)站產(chǎn)生視覺震撼的一個(gè)簡單高效的方法是給特殊的頁面創(chuàng)建特殊的樣式。例如,創(chuàng)建一個(gè).warning的CSS類來向 你的用戶顯示“警告”。 重慶網(wǎng)站制作公司 |