<kbd id="l36ds"><label id="l36ds"><wbr id="l36ds"></wbr></label></kbd>
  • 從文字到排版進(jìn)一步解析網(wǎng)頁設(shè)計

    2014-10-30    藍(lán)藍(lán)設(shè)計的小編

    藍(lán)藍(lán)設(shè)計( bouu.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供有效的 BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

    來源:http://www.58img.com/design/1761

    如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里

    文字可以是優(yōu)美的、簡單的、狂放的、有趣的、激動人心的,還有很多其他種類。它能激起情緒,幫助用戶理解你所要傳達(dá)的訊息。字體有很多種,但有一點是共通的——它必須具有可讀性。

    這是一個時常被遺忘的因素。設(shè)計師們往太狹小的空間填入太多信息,或是選用了外觀勝過可讀性的字體。但重點是:如果字體無法閱讀,你的設(shè)計就無法完全生效。

    盡管有些聳人聽聞,但它幾乎是普適規(guī)律。你會問:“作為藝術(shù)元素的那些字體怎么說?” 不可閱讀的字體在這類設(shè)計中確實能發(fā)揮作用,但是,僅限于與可讀的文字搭配使用。

    在狹窄空間體現(xiàn)可讀性

    藍(lán)藍(lán)設(shè)計

    什么使得文字能夠閱讀呢?它實際上是很多因素共同作用的結(jié)果,包括行長度、行距、字體樣式、外邊距和內(nèi)邊距,還有顏色和對比度。每一個元素,都影響著屏幕閱讀的難易程度。這每一種元素,都是設(shè)計師能夠操控的。記住,本文中談?wù)摰倪@些元素,是指網(wǎng)站主體部分的文字,此處文字的可讀性可以說是首要考慮因素。(別處文字的標(biāo)準(zhǔn)相對寬松許多,只要主體部分高度可讀。)

    • 行長度:每行的字符個數(shù)對于整體的可讀性起著主要作用。如果文字段落非常寬,那是很嚇人的,難以閱讀。同理,每行文字太短也不行,會給讀者的眼睛帶來壓力,造成混亂。
    • 行距:每行文字間的間距也同樣重要??纯催@篇文章,如果每行文字都與上下兩行粘在一起,你就無法理解這些句子。
    • 字體樣式:字體的樣式也會影響可讀性。簡潔的襯線字體和無襯線字體是最具可讀性、最易瀏覽的,而那些華麗的手書和新奇字體則最難破譯。
    • 外邊距和內(nèi)邊距:和行距一樣,元素周邊和之間的空隙也影響著用戶閱讀文字本身。
    • 顏色與對比度:文字顏色與相應(yīng)背景也至關(guān)重要。如果在綠色背景上寫綠色文字,就難以閱讀了。設(shè)計師選擇淺色字深色背景,或是深色字淺色背景,都是有原因的。對比使得字符容易閱讀。

    不同屏幕上的可讀性

    那如何創(chuàng)造最易讀的文字?如果是正文文字,有一些基本準(zhǔn)則規(guī)定每行的字?jǐn)?shù)——每種設(shè)備不同—— 有助于打造最佳的可讀性。

    從何開始呢?最佳行長度有助于幫你確定文字段落的大小??梢赃@樣:確定正文部分的寬度——通??梢约俣ǚ殖勺烂?、平板、手機(jī)三種尺寸。然后調(diào)整文字大小到理想的單行字?jǐn)?shù)。

    雖然還有其他因素在起作用,這些準(zhǔn)則是很好的入手點。

    • 桌面:每行55到75個英文字符,包括空格;理想狀態(tài)是每行65個字符
    • 移動設(shè)備:每行35到50個字符
    • 將最佳的單行字?jǐn)?shù)與絕佳的行距相結(jié)合,可以提升可讀性。通常,行距最好是按照正文字體字號的百分比來定義,也可以定義為固定值或是em。
    • 桌面:字號的1.5倍
    • 移動設(shè)備:字號的1.75至2倍

    如果你想找個工具來簡化所有這些工作,試試黃金比例文字計數(shù)器 。

    可讀性的其他提示

    要打造可讀的排版,正文以外的文字也大有關(guān)聯(lián)。使用標(biāo)題、無序列表、段落間的額外間距和顏色,也能提升整體可讀性(標(biāo)題則有助于瀏覽整個網(wǎng)站)。

    考慮使用如下元素增進(jìn)文字層級,創(chuàng)造更完整、更易讀的網(wǎng)頁設(shè)計。記得要把這些元素“設(shè)計”成獨特的字體、字號和顏色,并要在正文中保持協(xié)調(diào)。

    • 標(biāo)題
    • 鏈接
    • 粗體或斜體字
    • 無序或有序列表
    • 圖像元素,例如照片
    • 說明文字
    • 引用文字
    • 在各元素中混合使用襯線字體和無襯線字體

    可讀性清單

    既然你已經(jīng)有了好點子,決定下個設(shè)計項目中要使用什么字體和樣式,你確定能以一種完全可讀的方式將它們組合起來嗎?下面是一列清單,供你規(guī)劃字體的設(shè)計。

    • 主體部分字號夠大嗎?在每種設(shè)備上,它是否達(dá)到最佳的行長度?
    • 每行文字間是否有足夠的間距?
    • 文字與頁面邊界和其他元素之間有沒有足夠的空間?
    • 正文文字顏色與背景對比反差夠強(qiáng)烈嗎?
    • 每個新段落之間是否有額外的空隙?
    • 標(biāo)題和其他元素與正文文字不同嗎?
    • 有沒有使用其他元素(無序列表、粗體字等)分解大段文字?
    • 正文文字是否使用了易讀的字體(建議選用一種襯線或無襯線字體)?

    結(jié)論

    可讀性是設(shè)計中至關(guān)重要的組成部分。如果無法閱讀和理解頁面上的內(nèi)容,對于用戶而言,它就完全不相關(guān)也不重要。如何在設(shè)計項目中規(guī)劃可讀性?你有沒有其他通往成功的技巧?在評論中與我們分享吧。

    分享本文至:

    日歷

    鏈接

    個人資料

    存檔