如何提拔網(wǎng)頁(yè)內(nèi)容的可讀性
當(dāng)我們聊設(shè)計(jì)的時(shí)候,可讀性是我們最常提及的話題。優(yōu)秀的設(shè)計(jì)應(yīng)該都是可讀的設(shè)計(jì),假如信息都無法正常而清晰的傳達(dá),那么設(shè)計(jì)就失去了意義。
設(shè)計(jì)的可讀性和排版設(shè)計(jì)痛癢相關(guān),與此同時(shí),對(duì)比度的控制也是其中的核心。想要提拔內(nèi)容的可讀性,讓內(nèi)容以更加順暢、更吻合邏輯的情勢(shì)呈如今用戶面前,你必要借助對(duì)比度來表達(dá),讓用戶真正順暢的理解。
色彩對(duì)比
前景的筆墨必要和背景有著顯明的對(duì)比,它必要能夠吸引用戶的眼球。
創(chuàng)建色彩對(duì)比的方法有許多,最流行的做法是在白色或者淺色的背景上使用黑色或者深色的筆墨。這種設(shè)計(jì)由來已久,經(jīng)久不衰的理由是它確實(shí)特別很是有效。當(dāng)然,將兩種顏色倒置過來,也一樣有效。
但是,在現(xiàn)實(shí)的設(shè)計(jì)過程中,情形復(fù)雜多變。筆墨和背景的配色每每受到多種因素的影響,這個(gè)時(shí)候必要多加嘗試,反思筆墨在背景的映襯下是否能夠被用戶清晰的看到,尤其是在視頻和圖片之上追加筆墨排版的時(shí)候。
為了降低背景多變的色彩對(duì)于筆墨的視覺影響,一個(gè)比較靠譜的方案是在圖片和視頻上覆蓋上一個(gè)半透明的有色圖層,來“同一”色調(diào),讓文本的可讀性更好。設(shè)計(jì)師可以通過調(diào)整這個(gè)有色圖層的透明度、明度和色調(diào)來控制和筆墨的對(duì)比度,如許一來,背景圖片和視頻中的內(nèi)容對(duì)于筆墨的影響可以降到最低。
另外一個(gè)方案,是將筆墨和圖片、視頻分開排布,如許就不會(huì)捐軀兩者的信息體現(xiàn)力,唯一的題目是必要提供雙倍的展示空間,并且必要選取合理的排版布局。
文本樣式的對(duì)比
不同風(fēng)格樣式的筆墨能夠借助差異,吸引用戶的細(xì)致力。風(fēng)趣而讓人著迷的字體越來越多,比如手寫襯線字體 Le Farfalle 就是如此。
單個(gè)字體自己的良好設(shè)計(jì)是很不錯(cuò),但是兩種不同字體的對(duì)比帶來的反差,更能吸引用戶。
不過,不同字體的搭配是特別很是講究的,由于風(fēng)格不搭的不恰當(dāng)誰家常常會(huì)讓用戶感到震驚??梢赃x擇一些具有雷同特性的不同字體,用戶不會(huì)為之感到突兀,這些字體最好擁有雷同的x高度(小寫字母x的高度),在弧度和傾斜角度上特別很是接近。這些“和而不同”的字體能讓文本內(nèi)容看起來同等而有差異,風(fēng)趣而不枯燥。
大小尺寸對(duì)比
超大的字體和超小的字體所構(gòu)成的視覺差常常能夠讓用戶驚嘆。
當(dāng)字體大到肯定程度的時(shí)候,就能帶來充足的視覺沖擊,假如搭配上很小的字體構(gòu)成對(duì)比,那么這種視覺沖擊會(huì)顯得更加引人矚目。雖然超小的字體單獨(dú)使用也能形成類似的結(jié)果,但是相比超大字體要困難的多。
字體的大小差異,很容易被用戶細(xì)致到,超大的字體能夠在你的整個(gè)設(shè)計(jì)當(dāng)中形成視覺焦點(diǎn)。在文章排版中,正筆墨體使用正常大小,題目和副題目使用超大字體(副題目會(huì)相對(duì)小一些),如許的設(shè)計(jì)會(huì)讓文章排版的輕重緩急清晰地呈現(xiàn)出來。
本文地址:http://m.likemindfilms.com/tutorial/di18.html
您可能還喜歡
- Macaron 馬卡龍系色譜 ;附HC(16進(jìn)制碼
- 7個(gè)手機(jī)版網(wǎng)頁(yè)設(shè)計(jì)的原則
- 折紙多邊形網(wǎng)頁(yè)背景效果制作教程
- 龐門正道:好好玩耍的點(diǎn)線面(上)
- 網(wǎng)頁(yè)設(shè)計(jì)中的常見頁(yè)面布局方式
- WAP APP的柵格設(shè)計(jì)
- 八種很漂亮的排版方法和技巧分享
- 網(wǎng)頁(yè)設(shè)計(jì)的首屏標(biāo)準(zhǔn)你了解多少?
- 字體大寶庫(kù):40款為網(wǎng)頁(yè)設(shè)計(jì)師準(zhǔn)備的時(shí)
- 視覺設(shè)計(jì)分享—專題頁(yè)面設(shè)計(jì)篇
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問題
- 網(wǎng)頁(yè)設(shè)計(jì)精粹 網(wǎng)頁(yè)中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁(yè)UI - 原子設(shè)計(jì)理論(上)
- 如何通過設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺設(shè)計(jì)系列文章(二):全屏