清晰可讀的網(wǎng)頁(yè)設(shè)計(jì)文字,對(duì)于你的文字卻出現(xiàn)在網(wǎng)頁(yè)上？ 文字是另一個(gè)視覺(jué)元素在您的網(wǎng)站上，就像你的圖像，顏色，和模板。

就像其他的視覺(jué)元素，文本需要設(shè)置樣式的方式，明確并訪問(wèn)您網(wǎng)站的用戶訪問(wèn)，網(wǎng)站的文本，應(yīng)該是“可讀性，可讀性，可讀性。”

重點(diǎn)對(duì)文本的可讀性
“可讀性”基本上是人們認(rèn)識(shí)單詞，句子衡量它是多么容易，和段落。考慮到人們?nèi)绾慰焖贋g覽你的網(wǎng)站， 可讀性成為一個(gè)關(guān)鍵因素在多久他們會(huì)花上你的網(wǎng)頁(yè)，他們是否會(huì)試圖理解你所說(shuō)的。

在屏幕上閱讀是艱難的。不同的研究發(fā)現(xiàn)人們閱讀速度慢，不準(zhǔn)確，記得少了什么，他們?cè)陂喿x時(shí)，它顯示在屏幕上。根據(jù)一些估計(jì)，網(wǎng)站訪問(wèn)者僅僅閱讀正文25%在您的網(wǎng)站上。

任何障礙，可讀性文本太小，字體顏色很難讀，或不規(guī)則的線的長(zhǎng)度會(huì)降低這一比例更。

所以你可以保持你的文本的可讀性，更快樂(lè)的你的訪客會(huì)和他們更有可能會(huì)想堅(jiān)持一會(huì)兒。

你如何設(shè)計(jì)文本，并抓住讀者的眼睛？這里是看一些因素：

1。線的長(zhǎng)度
我們可能已經(jīng)從8.5 x 11張紙的閱讀，但在屏幕上閱讀，線的長(zhǎng)度要短的多，人的眼睛必須一邊照顧所有的話，并努力保持你從一行到下一，用相同的文字和字體（16號(hào)字體Noto Sans）

許多網(wǎng)站模板有全寬內(nèi)容領(lǐng)域，使他們理想的顯示大圖片或照片，當(dāng)涉及到著陸頁(yè)的文本，最好不要讓你的線橫跨整個(gè)寬度。嘗試使用列元素和照片元素為了打破文本創(chuàng)建較短的線。

2。對(duì)比
背景和文字之間的顏色對(duì)比度更好，更好的可讀性。

為您的網(wǎng)站，確保你的背景顏色和文字顏色，文字是清晰的足夠的差異。即使是非常不同的顏色沖突嚴(yán)重時(shí)，放在一起（如紅色和藍(lán)色的例子，下面）。

選擇正確的顏色

3。白色的空間
線高度問(wèn)題的例子

在你的網(wǎng)站上，有沒(méi)有需要的人群。給你的文字舒適的“白色空間”（空）的周圍，這將是閱讀和掃描更容易。

想想如果你打開網(wǎng)頁(yè)，就看到一個(gè)大的文本塊，你可能不會(huì)讀過(guò)它。但如果你看到文本分解成更小的，更易于管理的部分，你可能會(huì)給它至少一眼。

添加空間和分手的段落

以創(chuàng)造更多的白色空間在您的網(wǎng)站上，嘗試使用間隔元件與水平線元素之間添加文本元素更多的緩沖。

你也可以分解成更小的段落文本，或添加項(xiàng)目符號(hào)或編號(hào)列表。

調(diào)整行的高度

使用樣式編輯器來(lái)增加你的身體文本行的高度（這調(diào)整文本行之間的空格數(shù)量）。沒(méi)有規(guī)則你的線高度應(yīng)你需要調(diào)整基于什么最好看的字體和字體大小你使用。

在下面的例子中的網(wǎng)站，無(wú)論是圖片和文字有一個(gè)很好的量空他們周圍的空間。這將創(chuàng)建一個(gè)和諧的感覺(jué)和視覺(jué)層次（你知道怎么看，先讀）。

注意設(shè)計(jì)師在右邊的文本行的高度增加，使較小的字體容易閱讀。

4。對(duì)準(zhǔn)“棱角”
在文本的元素，你會(huì)發(fā)現(xiàn)你有使文本左對(duì)齊，右對(duì)齊選項(xiàng)，中心或。

左對(duì)齊的文本是相當(dāng)多的金標(biāo)準(zhǔn)。引導(dǎo)擺脫中心或正文文本右對(duì)齊。而中心的文本可以為標(biāo)題和標(biāo)題的工作，這是 要多讀幾行艱難 。這是因?yàn)殚_始的地方每行文本的每一行的變化，意味著讀者必須找到每一行的開始。

為你的文字可以很整齊，統(tǒng)一的段落。但是根據(jù)你的文字，有時(shí)說(shuō)的話會(huì)出現(xiàn)拉伸或看起來(lái)不自然。

5。字體大小

如果你有很好的視力，一會(huì)兒拍拍自己的背，然后馬上去檢查你的網(wǎng)站的字體大小。一些看起來(lái)完全正常的你可能會(huì)有很多讀者得撓頭。

一個(gè)典型的經(jīng)驗(yàn)法則，你會(huì)在網(wǎng)頁(yè)上看到的是保持你的身體文本至少16pt。這是一個(gè)很好的開始，但是記住，號(hào)碼是完全取決于你用什么字體。

6。字體風(fēng)格
超過(guò)600的谷歌Web字體選擇，你如何選擇合適的字體？這是一個(gè)基本的食譜：

標(biāo)題：選擇一個(gè)程式化的“有趣”的字體。因?yàn)闃?biāo)題是大的，短的，和少用，你可以把字體有點(diǎn)難讀，但增加視覺(jué)趣味。
段/正文： 選擇一個(gè)普通的無(wú)襯線字體。這是設(shè)計(jì)來(lái)閱讀屏幕上的所以他們會(huì)提供一個(gè)光滑，易于閱讀的經(jīng)驗(yàn)在段落和更小的尺寸。好的選擇打開手機(jī)，SANS，Ubuntu，廣義，和諾托SANS（這些例子中使用的字體）。

導(dǎo)航菜單：你可以用你的第一個(gè)字體，或選擇三分之一，補(bǔ)充了其他兩個(gè)。導(dǎo)航菜單必須容易閱讀，所以選擇一些有個(gè)性，但轉(zhuǎn)向擺脫手寫或裝飾字體。
將擺脫所有大寫字母如果你寫幾句話。大寫字母是偉大的導(dǎo)航條和短詞，但很難讀的句子。

看看我們的文章 上谷歌網(wǎng)頁(yè)字體更多的建議。

你可讀性清單
你把很多想進(jìn)入你的網(wǎng)站的文本，一旦你完成寫作內(nèi)容，下一步是要確保你把它在盡可能清楚的方式。回顧，這里有一個(gè)清單的可讀性因素考慮為你建立你的網(wǎng)站：

線的長(zhǎng)度：使用列和圖片讓你的文字在你的著陸頁(yè)面少于70個(gè)字符。博客文本可以更長(zhǎng)一些。
對(duì)比：確保有足夠的差異，你的背景和文本顏色。
白色的空間：使用它！簡(jiǎn)短的段落，項(xiàng)目符號(hào)列表，和元素的間距是一個(gè)好的開始。
對(duì)齊：使用左對(duì)齊文本和花時(shí)間整理了段落的右手邊。
字體大小：不是所有的字體大小相同，所以即使你用你的16pt段落文本，它仍然是太小了。檢查的人誰(shuí)不有20 / 20的愿景，一定要閱讀它的舒適。
字體風(fēng)格：當(dāng)有疑問(wèn)時(shí)，使用無(wú)襯線字體段落文本。他們的設(shè)計(jì)工作在屏幕上。如果你不想用黑色，棕色，灰色或嘗試海軍，另一個(gè)黑暗的顏色。
遵循這些建議，你可以創(chuàng)建有吸引力的，誘人的，容易在沒(méi)有時(shí)間閱讀的網(wǎng)站，這將讓你的實(shí)際消息閃耀。

• 牧羊人專業(yè)的深圳網(wǎng)頁(yè)設(shè)計(jì)相關(guān)推薦：
• 響應(yīng)網(wǎng)頁(yè)設(shè)計(jì)的未來(lái)
• 網(wǎng)頁(yè)設(shè)計(jì)素材免費(fèi)按鈕圖標(biāo)字體
• 深圳網(wǎng)頁(yè)設(shè)計(jì)師的網(wǎng)站設(shè)計(jì)欣賞
• 網(wǎng)頁(yè)設(shè)計(jì)命令行是偉大的網(wǎng)頁(yè)設(shè)計(jì)工具