干貨-提高網(wǎng)站可讀性實用技巧

      評價一個網(wǎng)站的良莠往往是從用戶體會的角度考慮的。合理簡要的框架布局，美觀契合用戶閱覽習(xí)慣的界面當然是網(wǎng)站杰出的用戶體會的要害點，一起增強網(wǎng)頁內(nèi)容的可讀性，讓用戶有杰出的網(wǎng)頁閱覽體會就是一個網(wǎng)站建設(shè)成功的重要評分標準。網(wǎng)頁規(guī)劃是增強網(wǎng)頁內(nèi)容的可讀性的一個突破點，經(jīng)過網(wǎng)頁規(guī)劃上比照度的操控往往能讓頁面內(nèi)容更流暢更有邏輯的出現(xiàn)在閱覽者面前，更直擊用戶的體會需求點。怎么從比照度上提高網(wǎng)頁內(nèi)容的可讀性，其實說起來也并不是那么雜亂。

顏色比照

      遠景的文字需求和布景有著顯著的比照，它需求能夠吸引用戶的眼球。

      創(chuàng)建顏色比照的辦法有很多，最盛行的做法是在白色或許淡色的布景上運用黑色或許深色的文字。這種規(guī)劃由來已久，經(jīng)久不衰的理由是它確實十分有用。當然，將兩種顏色倒置過來，也相同有用。

可是，在實際的規(guī)劃過程中，情形雜亂多變。文字和布景的配色往往遭到多種要素的影響，這個時分需求多加嘗試，反思文字在布景的映襯下是否能夠被用戶明晰的看到，尤其是在視頻和圖片之上追加文字排版的時分。

      為了下降布景多變的顏色關(guān)于文字的視覺影響，一個比較靠譜的計劃是在圖片和視頻上掩蓋上一個半透明的有色圖層，來“共同”色調(diào)，讓文本的可讀性更好。規(guī)劃師能夠經(jīng)過調(diào)整這個有色圖層的透明度、明度和色調(diào)來操控和文字的比照度，這樣一來，布景圖片和視頻中的內(nèi)容關(guān)于文字的影響能夠降到最低。

      另外一個計劃，是將文字和圖片、視頻分開排布，這樣就不會獻身兩者的信息表現(xiàn)力，僅有的問題是需求供給雙倍的展現(xiàn)空間，并且需求選取合理的排版布局。

文本款式的比照

     不同風格款式的文字能夠憑借差異，吸引用戶的注意力。風趣而讓人著迷的字體越來越多。

     單個字體自身的優(yōu)秀規(guī)劃是很不錯，可是兩種不同字體的比照帶來的反差，更能吸引用戶。不過，不同字體的調(diào)配對錯常講究的，由于風格不搭的不恰當誰家常常會讓用戶感到震動。能夠選擇一些具有相同特征的不同字體，用戶不會為之感到突兀，這些字體最好擁有相同的x高度(小寫字母x的高度)，在弧度和傾斜角度上十分挨近。這些“和而不同”的字體能讓文本內(nèi)容看起來共同而有差異，風趣而不枯燥。

巨細尺寸比照

     超大的字體和超小的字體所構(gòu)成的視覺差常常能夠讓用戶驚嘆。

     當字體大到必定程度的時分，就能帶來足夠的視覺沖擊，假如調(diào)配上很小的字體構(gòu)成比照，那么這種視覺沖擊會顯得愈加引人矚目。雖然超小的字體獨自運用也能構(gòu)成類似的效果，可是相比超大字體要困難的多。字體的巨細差異，很簡單被用戶注意到，超大的字體能夠在你的整個規(guī)劃當中構(gòu)成視覺焦點。在文章排版中，正文字體運用正常巨細，標題和副標題運用超大字體(副標題會相對小一些)，這樣的規(guī)劃會讓文章排版的輕重緩急明晰地出現(xiàn)出來。

對齊形式

     談到可讀性的時分，對齊其實也個無法回避的論題。而在排版中，不同的對齊形式也是能構(gòu)成比照的。

     一般，在對齊的規(guī)劃上有兩種常規(guī)思路：

·正文和標題選用不同的對齊形式，構(gòu)成比照

·在悉數(shù)排版中沿襲相同的對齊形式

     從某種意義上來說，兩種思路都是對的。選取那種思路，主要取決于文本、標題和其他規(guī)劃元素之間的關(guān)系。假如選用相同的對齊方法，能否確保標題和正文之間有顯著比照、能否從布景和其他元素中鋒芒畢露?文本的行間距、字體巨細、和其他元素之間的間隔能否構(gòu)成杰出的視覺差?

     在談到UI中的對齊問題的時分，最直觀的模型是一段文本和按鈕之間的關(guān)系。排版中，文本元素和按鈕之間的對齊形式應(yīng)該是怎樣的?這個問題很有意思，許多規(guī)劃師傾向于讓文本和按鈕縱向排列，居中對齊，可是網(wǎng)站的其他元素調(diào)配進來的時分，又往往不會居中對齊。所以，對齊方法，是由元素自身的特點來決議，依據(jù)整個規(guī)劃，合理調(diào)配。

長文本內(nèi)容

      關(guān)于包含很多文本內(nèi)容的網(wǎng)站而言，正文部分的內(nèi)容排版就顯得相當重要了。假如文本內(nèi)容都是無縫的出現(xiàn)出來的話，用戶很可能由于沒有層次而無法抓住重要信息。

所以，網(wǎng)頁中很多的文本信息，應(yīng)該考慮下列要素：

·文本塊的區(qū)域和巨細

·每行文字的長度和高度

·項目編號和列表

·字符的粗體和斜體

·顏色

      一切的這些特點都能將文本中特定的要害詞、信息乃至口氣同其他的內(nèi)容區(qū)分開來，它們會成為文本中重要的錨點，將和總要的信息經(jīng)過這種差異和比照，推送到用戶面前。

      在較長的文本區(qū)塊中(尤其是博客和長文中)運用不同的款式來區(qū)分不同類型的內(nèi)容，這樣做能夠顯著下降用戶閱覽的疲勞度。將長內(nèi)容分解為更易于閱覽的部分，用戶才更簡單買單。

保持共同

      共同性幾乎是一切規(guī)劃范疇都遵從的準則，無論你在首頁或許標題、正文中是怎么運用比照的，最好將它延伸到整個規(guī)劃規(guī)范當中去。

      盡量運用相同的顏色，相同的款式，共同的字體，假如規(guī)劃無法確保共同性，會讓用戶在界面中感到迷惑。確保用戶到哪個地方都會覺得他們在你的網(wǎng)站或許APP當中。

     比照度是讓網(wǎng)頁規(guī)劃在視覺上更具吸引力的重要東西，它讓排版布局愈加賦有層次結(jié)構(gòu)，高比照度的規(guī)劃讓內(nèi)容的可讀性有顯著的提高，而這也是規(guī)劃可用性達標的最基本條件，也是網(wǎng)站建設(shè)成功的基本要求。