通常很多初級網(wǎng)頁設(shè)計師經(jīng)常會忽略排版細節(jié)。其實這是很不好的，一個網(wǎng)站其排版是否合理直接影響著網(wǎng)站整體的設(shè)計和可讀性。以下是征帆網(wǎng)絡為您簡列的10點細節(jié)：

    1、正確網(wǎng)頁行高和段落間距

    最常見的網(wǎng)頁布局錯誤之一是定義了不正確的行高。行高是定義一行文本的高度，所以我們必須按照文本字體大小來設(shè)定行高。

    一般來說，在設(shè)置文本行高的時候，我經(jīng)常在字體大小的基礎(chǔ)上加上7個像素（對12-17像素的字體而言）

    body{
    font-size:14px;
    line-height:21px; /* 14px + 7px */
    }

    2、合理標題margin值

    另外一個常見的錯誤是標題周圍不正確的margin值。標題其實是與它下面的段落是相關(guān)聯(lián)的，而不僅僅是兩個段落的分 割符。這就是為什么標題的margin-top比margin-bottom要寬。

    3、合理使用網(wǎng)頁字體

    為了確�？勺x性和專業(yè)性，你的網(wǎng)頁上不應該使用超過3種字體。使用過多的字體會干擾你的用戶而且讓你的網(wǎng)站看起 來很亂。相反，較少的字體讓你的網(wǎng)站顯得干凈易讀。你可以標題使用一種字體，正文使用一種字體，最后 logo或副標題使用另外的字體。

    4、代碼部分使用等寬字體

    如果你是一位開發(fā)者(就像大部分讀這篇博客的人)你可能想貼一些代碼在你的博客里。如果是這樣，請使用等寬字體。 那么，什么是等寬字體？它就是字母和字符占相同水平寬度的字體。

    那么在網(wǎng)站的代碼段你應該使用哪種字體呢？ 到目前為止 Courier字體是最流行的，那么嘗試一下最新的一些字體像 Consolas或 Monaco怎么樣呢？那你一定要看看這里咯。這里

    5、關(guān)注對比

    即使你的網(wǎng)站有很好的排版了，另一個需要注意的是對比。如果你的頁面背景是中灰色（#999999），那么不要使用深灰色（#333333）的文本，否則你的內(nèi)容很難看清，尤其是對一些年紀比較大的或視力差的人。

    總之，除非你的網(wǎng)站是關(guān)于黑客、黑帽seo或哥特搖滾的，不然你應該使用淺色背景和深色字體來保證清晰的對比度增加你網(wǎng)站的可讀性。

    6、給部分文本鏈接加下劃線

    在我上網(wǎng)的12年中，瀏覽器用在鏈接的默認樣式一直是藍色文本加下劃線。雖然這個藍色經(jīng)常被改成另外的顏色，但下劃線一直被當做是鏈接的常規(guī)樣式。這就是為什么除了鏈接你不要給其他的東西加上下劃線的原因。否則，這可能對你的用戶造成很大的困惑。

    7、創(chuàng)建CSS樣式庫

    讓你的網(wǎng)站產(chǎn)生視覺震撼的一個簡單高效的方法是給特殊的頁面創(chuàng)建特殊的樣式。例如，創(chuàng)建一個.warning的CSS類來向 你的用戶顯示“警告”。

    8、按級別來排列標題和文本

    為了增加可讀性，給標題、介紹段落和常規(guī)文本創(chuàng)建標簽層級是很重要的，這樣你的用戶可以看清你的文章結(jié)構(gòu)并能很 快的找到他們感興趣的部分。

    9、大膽留白

    我認為最重要的排版技巧之一是“大膽留白”。留白是指空白區(qū)或沒有使用的空間，它會使你的設(shè)計整齊而專業(yè)。許多人 喜歡蘋果網(wǎng)站的原因是：它盡管簡單但很精致，而且有很多留白。

    10、正確使用標點符號

    如果你想提升你的排版水平不容忽視的一點是正確使用標點符號。例如，引號經(jīng)常用雙撇符號代替（譯者注：我想作者要表達的意思應該是全角符號和半角符號的區(qū)別，就像中文的引號和英文的引號不同一樣）。

    注意區(qū)分雙撇符號：

    He said "Hello".
    同樣的文本，使用引號：
    He said “Hello”.
    這樣更好，不是嗎？如果你是WordPress用戶，你可能很樂意知道你最喜歡的博客平臺自動將雙撇號轉(zhuǎn)換為智能的引號 。否則，你得使用HTML字符編碼。如下所示：

    He said &s;ldquo;Hello”.