產(chǎn)品界面文字的可讀性

如何迅速改善網(wǎng)頁(yè)文字的可讀性?

網(wǎng)站字體有多重要珠叔?它幫網(wǎng)站提高了38%的流量蝎宇!

字體的性格!未成曲調(diào)先有情

文字可以是優(yōu)美的祷安、簡(jiǎn)單的姥芥、狂放的、有趣的汇鞭、激動(dòng)人心的凉唐,還有很多其他種類庸追。它能激起情緒,幫助用戶理解你所要傳達(dá)的訊息台囱。字體有很多種淡溯,但有一點(diǎn)是共通的——它必須具有可讀性。

文字是一個(gè)產(chǎn)品(網(wǎng)頁(yè)簿训、app)交互的基本元素咱娶,它的可讀性影響產(chǎn)品的用戶體驗(yàn)。每一個(gè)元素强品,都影響著屏幕閱讀的難易程度膘侮。這每一種元素,都是設(shè)計(jì)師能夠操控的的榛。記住琼了,本文中談?wù)摰倪@些元素,是指網(wǎng)站主體部分的文字夫晌,此處文字的可讀性可以說(shuō)是首要考慮因素雕薪。(別處文字的標(biāo)準(zhǔn)相對(duì)寬松許多,只要主體部分高度可讀晓淀。)

一所袁、文字閱讀的因素有哪些?

那什么使得文字能夠閱讀呢要糊?它實(shí)際上是很多因素共同作用的結(jié)果纲熏,包括行長(zhǎng)度、行距锄俄、字體樣式、外邊距和內(nèi)邊距勺拣,還有顏色和對(duì)比度奶赠。

1、行長(zhǎng)度:每行的字符個(gè)數(shù)對(duì)于整體的可讀性起著主要作用药有。如果文字段落非常寬毅戈,那是很嚇人的,難以閱讀愤惰。同理苇经,每行文字太短也不行,會(huì)給讀者的眼睛帶來(lái)壓力宦言,造成混亂扇单。

2、行距:每行文字間的間距也同樣重要奠旺≈├剑看看這篇文章施流,如果每行文字都與上下兩行粘在一起,你就無(wú)法理解這些句子鄙信。

3瞪醋、字體樣式:字體的樣式也會(huì)影響可讀性。簡(jiǎn)潔的襯線字體和無(wú)襯線字體是最具可讀性装诡、最易瀏覽的银受,而那些華麗的手書和新奇字體則最難破譯。

4鸦采、外邊距和內(nèi)邊距:和行距一樣宾巍,元素周邊和之間的空隙也影響著用戶閱讀文字本身。

5赖淤、顏色與對(duì)比度:文字顏色與相應(yīng)背景也至關(guān)重要蜀漆。如果在綠色背景上寫綠色文字,就難以閱讀了咱旱。設(shè)計(jì)師選擇淺色字深色背景确丢,或是深色字淺色背景,都是有原因的吐限。對(duì)比使得字符容易閱讀鲜侥。

二、不同屏幕上的可讀性

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

從何開始呢狐粱?最佳行長(zhǎng)度有助于幫你確定文字段落的大小舀寓。可以這樣:確定正文部分的寬度——通臣◎撸可以假定分成桌面互墓、平板、手機(jī)三種尺寸蒋搜。然后調(diào)整文字大小到理想的單行字?jǐn)?shù)篡撵。

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

桌面:每行55到75個(gè)英文字符育谬,包括空格;理想狀態(tài)是每行65個(gè)字符

移動(dòng)設(shè)備:每行35到50個(gè)字符

將最佳的單行字?jǐn)?shù)與絕佳的行距相結(jié)合帮哈,可以提升可讀性膛檀。通常,行距最好是按照正文字體字號(hào)的百分比來(lái)定義,也可以定義為固定值或是em宿刮。

桌面:字號(hào)的1.5倍

移動(dòng)設(shè)備:字號(hào)的1.75至2倍

三互站、可讀性的其他提示

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

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

標(biāo)題

鏈接

粗體或斜體

字無(wú)序或有序列

表圖像元素,例如照片

說(shuō)明文字

引用文字

在各元素中混合使用襯線字體和無(wú)襯線字體

四焕参、字體的那些事兒

1轻纪、粗與細(xì);2叠纷、曲與直刻帚;3、松散與嚴(yán)謹(jǐn)涩嚣;4崇众、簡(jiǎn)與繁;

工具:黃金比例文字計(jì)數(shù)器

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末航厚,一起剝皮案震驚了整個(gè)濱河市顷歌,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌幔睬,老刑警劉巖衙吩,帶你破解...
    沈念sama閱讀 218,941評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異溪窒,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)冯勉,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,397評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門澈蚌,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人灼狰,你說(shuō)我怎么就攤上這事宛瞄。” “怎么了?”我有些...
    開封第一講書人閱讀 165,345評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵份汗,是天一觀的道長(zhǎng)盈电。 經(jīng)常有香客問我,道長(zhǎng)杯活,這世上最難降的妖魔是什么匆帚? 我笑而不...
    開封第一講書人閱讀 58,851評(píng)論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮旁钧,結(jié)果婚禮上吸重,老公的妹妹穿的比我還像新娘。我一直安慰自己歪今,他們只是感情好嚎幸,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,868評(píng)論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著寄猩,像睡著了一般嫉晶。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上田篇,一...
    開封第一講書人閱讀 51,688評(píng)論 1 305
  • 那天替废,我揣著相機(jī)與錄音,去河邊找鬼斯辰。 笑死舶担,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的彬呻。 我是一名探鬼主播衣陶,決...
    沈念sama閱讀 40,414評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼闸氮!你這毒婦竟也來(lái)了剪况?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,319評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤蒲跨,失蹤者是張志新(化名)和其女友劉穎译断,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體或悲,經(jīng)...
    沈念sama閱讀 45,775評(píng)論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡孙咪,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,945評(píng)論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了巡语。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片翎蹈。...
    茶點(diǎn)故事閱讀 40,096評(píng)論 1 350
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖男公,靈堂內(nèi)的尸體忽然破棺而出荤堪,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 35,789評(píng)論 5 346
  • 正文 年R本政府宣布澄阳,位于F島的核電站拥知,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏碎赢。R本人自食惡果不足惜低剔,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,437評(píng)論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望揩抡。 院中可真熱鬧户侥,春花似錦、人聲如沸峦嗤。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,993評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)烁设。三九已至替梨,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間装黑,已是汗流浹背副瀑。 一陣腳步聲響...
    開封第一講書人閱讀 33,107評(píng)論 1 271
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留恋谭,地道東北人糠睡。 一個(gè)月前我還...
    沈念sama閱讀 48,308評(píng)論 3 372
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像疚颊,于是被迫代替她去往敵國(guó)和親狈孔。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,037評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容