這已經(jīng)是一個(gè)老生常談的問題:網(wǎng)站設(shè)計(jì)的最合適的字體是什么?
根據(jù)你正在設(shè)計(jì)的項(xiàng)目和品牌類型,你可能會得到包含特定字體的答案(設(shè)計(jì)師經(jīng)常會開玩笑說在所有設(shè)計(jì)上使用蘋方或者微軟雅黑就好,但作為一個(gè)特定項(xiàng)目或主題來說,這個(gè)答案往往有點(diǎn)過于草率了)。
或者我們應(yīng)該試著轉(zhuǎn)變一下思路,不妨這么問:網(wǎng)站設(shè)計(jì)中最易讀的字體是什么?答案植根于核心設(shè)計(jì)原則,可以幫助你選擇美觀且可讀性強(qiáng)的字體。
以下是你如何選擇正確的字體以提高可讀性的一些看法。
從 Web 排版的基礎(chǔ)開始(Start with the Basics of Web Typography)
有一些我們都知道的字體,并且可能認(rèn)為可讀性“好”。其中包括一些具有均勻外觀和感覺的簡單無襯線字體。
但不僅如此。字體必須正確的同上下文和設(shè)計(jì)配對。
Adobe 的一組研究人員對 350 多名用戶進(jìn)行了一項(xiàng)研究,研究了各種字體和可讀性,最終發(fā)現(xiàn)字體選擇和可讀性歸結(jié)為閱讀速度。
他們查看了這些字體(以及其他一些字體):
· 經(jīng)典字體(Times、Helvetica、Garamond)
· 專為計(jì)算機(jī)使用而設(shè)計(jì)的字體(Calibri、Arial)
· 專為易讀性設(shè)計(jì)的字體(Noto Sans、Montserrat)
結(jié)論:背景和受眾很重要。這對我們意味著什么:你必須首先考慮用戶的字體選擇。
注意大小和比例(Look at Size and Scale)
現(xiàn)在你正在從用戶的角度去看問題,是時(shí)候考慮與你的排版選擇相關(guān)的事情(但不是字體本身):項(xiàng)目中字體的大小和比例。
大小、間距和整體排版比例對可讀性有巨大影響。你的內(nèi)容越容易閱讀,這一考慮就越重要(這對于注意力持續(xù)時(shí)間很短的年輕用戶也更重要)。
合適的排版比例在文本元素之間有很大的差異,可以將它們區(qū)別開并使閱讀更容易。對于某些字體,這并不難實(shí)現(xiàn)。由于字母形狀和筆劃寬度,其他字體可能是一個(gè)挑戰(zhàn)。
考慮加載和速度(Consider Loading and Speed)
你是否知道影響可讀性的一個(gè)因素是網(wǎng)站上的字體加載和正確渲染的速度?
這是你在真正遇到這個(gè)問題之前比較容易忽視的錯誤之一。訪問一個(gè)網(wǎng)站,并且在加載另一種字體之前,字體會以一種閃爍或者空白或者默認(rèn)計(jì)算機(jī)系統(tǒng)字體的形式進(jìn)行預(yù)加載,這種不一致的時(shí)刻足以破壞用戶的閱讀和可讀性體驗(yàn)。
用技術(shù)術(shù)語來說,這意味著你需要使用運(yùn)行良好且在線加載速度快的字體。不要試圖用不是來自通用集合的古怪字體在這里重新發(fā)明輪子。對于大多數(shù)網(wǎng)站設(shè)計(jì),Google 字體通常是標(biāo)準(zhǔn)。如果你不需要,也不要過于陷入嘗試加載自定義字體選擇的困境。
不要太花哨(Don’t Get Too Fancy)
正常的寬高比、圓潤不太緊湊的字母和規(guī)則的筆劃寬度可能聽起來很無聊,但它們的可讀性很高,一定要堅(jiān)持使用他們。
真的就是這么簡單。
注意對比度和背景(Pay Attention to Contrast and the Background)
雖然背景顏色和對比度不是字體的一部分,但它們會極大地影響字體選擇。為確保對比度和可閱讀性,請注意 W3C 的指南,即在文本和背景之間使用至少 4:5:1 的對比度。
這不僅僅是可讀性的最佳實(shí)踐,它也是可訪問性的絕佳指南。
認(rèn)真的!打印出來(Print It Out (Seriously))
這是網(wǎng)站設(shè)計(jì)師不會每天聽到的一條建議。把設(shè)計(jì)打印出來放在紙上看。讀起來容易嗎?你能稍微遠(yuǎn)一點(diǎn)點(diǎn)的距離閱讀到它嗎?
這些可以作為確定整體可讀性的重要指南。如果在紙上很難被閱讀,那么在屏幕上也可能很困難。
打印字體和你的設(shè)計(jì)還可以提供其他可讀性線索。字體是否鋒利?它會以其他比例尺寸或其他用途使用嗎(這是響應(yīng)能力的一個(gè)因素)?
一切看起來仍然像您預(yù)期的那樣嗎?令人驚訝的是,從這個(gè)新的角度來看,事情會有多么不同。
征求用戶反饋(Ask for User Feedback)
這并不總是一種選擇,但如果可以,請尋求用戶的反饋。
Adobe 的這項(xiàng)研究發(fā)現(xiàn),人們并不總是對字體擁有最佳的判斷,但他們可以幫助你確定某些字體是否適合你的核心受眾。
理想情況下,你可以在網(wǎng)站啟動之前詢問并獲取反饋,但如果你質(zhì)疑字體選擇,遲到總比沒有好。請記住,用戶并不總是知道如何告訴你他們希望在可讀性方面看到的內(nèi)容。你可能使用了很棒的字體,但為了便于閱讀,它需要改變大小或比例,對這些機(jī)會(和快速修復(fù))保持開放態(tài)度。
什么字體在可讀性方面最適合?(What Font Is Best For Readability?)
這一切都回到了最初的問題:什么是可讀性最好的字體?
雖然我們不能給出特定的字體,但你可以從以下三個(gè)規(guī)則開始:
· 選擇常用字體或同 Google 字體同一類型的字體。
· 選擇一種簡單的字體(襯線或無襯線),并且具有規(guī)則的筆畫粗細(xì)和 x 高度。
· 選擇適合受眾的字體(年輕的受眾更喜歡無襯線字體,而年長的受眾可能更喜歡襯線字體以獲得更傳統(tǒng)的感覺)。
總結(jié)
在可讀性方面沒有正確或錯誤的字體。這一切都與應(yīng)用和項(xiàng)目場景和類型有關(guān)。選擇網(wǎng)站字體時(shí),請考慮內(nèi)容、上下文和目標(biāo)受眾,以找到適合的字體。
并且不要忘記測試它。詢問用戶對字體的想法,查看分析或使用熱圖工具來查看設(shè)計(jì)(和字體選擇)是否以你想要的方式引導(dǎo)用戶完成整體的網(wǎng)頁設(shè)計(jì)。
----圖文來自:design shack
----由深圳網(wǎng)站建設(shè)公司-Clh翻譯編輯整理,為您提供更多有關(guān)深圳網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、網(wǎng)頁設(shè)計(jì)及其他互聯(lián)網(wǎng)應(yīng)用服務(wù)