一個受大眾審美歡迎的網(wǎng)站往往是從優(yōu)秀的排版開始的。雖然偶爾打破規(guī)則可以幫助你的網(wǎng)頁設計創(chuàng)造不同的視覺風格,吸引用戶注意,但是,有時候我們更應該回歸基礎的排版原則以及思考如何以更好的方式創(chuàng)建它們。這是一個很重要的思維更新,可以幫助你重新思考你的設計項目,考慮一種新的方法或只是簡單的回到一個更簡單,更流線型的設計。所以今天,天權(quán)互動將先忽略那些“揚言”要打破排版規(guī)則的理論趨勢和方法,專注于“規(guī)則”,看看它如何指引我們創(chuàng)造出驚人的作品的重要方向。
1.大小和層次結(jié)構(gòu)
思考一下那些有關(guān)尺寸大小的相關(guān)事件和元素。在屏幕上創(chuàng)建可讀性排版大綱時,尺寸可能是很重要的因素之一。過于微小的文字可能令人錯愕,難以看清。超大的文本又可能會以奇怪的方式打亂用戶的閱讀習慣,導致混亂。 在網(wǎng)站設計中建立符合可讀性要求的排版需要具備層次結(jié)構(gòu),可以告訴用戶,第二等等。因此,你需要創(chuàng)建一個明顯的視覺規(guī)格,將主內(nèi)容文本、標題、小標題和強調(diào)性文本“區(qū)別對待”,以營造這種文本的層次感。
2.文本間距和字距
我們經(jīng)常會感到困惑,Tracking和Kerning難道是不一樣的兩項調(diào)節(jié)參數(shù)嗎?Kerning調(diào)整是一對字母之間的空間調(diào)整,而Tracking是對一整套字符之間的空間進行調(diào)整,例如對一段文本的段落或整體調(diào)整。 Kerning通常應用于單個元素,以創(chuàng)建精確度,增強大文本的可讀性甚至風格。Tracking通常用于在整體文本內(nèi)容中收緊松散的字體。
3.限制字體使用
在同一個網(wǎng)站設計中使用太多種類的字體在視覺上可能給用戶造成壓力和減低閱讀體驗。大多數(shù)設計項目使用兩到三個字體就已經(jīng)足夠了。 選擇可以固定的字體樣式的關(guān)鍵是選擇哪些具有大量變化風格的字體家族。大多數(shù)字體都有多種樣式——粗體,常規(guī),斜體,細體,黑色等。通過選擇具有多個選項的字體,你將可以在不同的用途和重量以及樣式上自由的選擇。
4.混合和匹配設計風格
網(wǎng)站建設過程中,選擇字體誠然是所有設計項目中比較棘手的部分,你可以選擇兩種不同的類型。常見的配對是襯線和無襯線字體。但你不必非要堅持這一點。 當配對不同的樣式風格和字體時,你可以通過查找具有類似x高度的字體(查找具有相同垂直小寫“x”大小的字符集)和碗形(封閉字母,如“o”具有相似的內(nèi)融空間)。這些細節(jié)可以使盡管不同的字體組合在一起仍然像是同一個而不會產(chǎn)生過多的差異化,用戶在閱讀文本時也會更適應和簡單。使用不同風格的類似字形仍然具有視覺熟悉度,可以使所有類型的組合更容易一起閱讀。
5.忘記連字符和下劃線
大多數(shù)時候,連字符和過多的下劃線是不必要的。特別是在網(wǎng)站設計等線上的項目中,這些技術(shù)可能使文本更難以消化和了解一目。連字符會分解閱讀體驗,下劃線則會在奇數(shù)間距上導致文本難以閱讀。 盡管這兩個要素都在某些項目中可能占有一席之地,但它們通常應該被避免。
6.不要改變字體
你永遠不應該過多的干預字體的形態(tài)。不要試圖使它更胖,更高或更薄。如果你必須使用這樣的樣式才能符合你的設計要求的話,選擇一個新的字體代替。字體設計師努力創(chuàng)建一個一致的字符集,這種專業(yè)的設計可以保證這些字符是可讀的,是很適合的字體樣式。所以,不要嘗試改變一組字符的外觀。你可能不會改進它們,反而會造成異常混亂。 如果在網(wǎng)頁設計過程中,目前的這種字體不太適合你的需要,尋找別的字體以代替。嘗試使用Identifont或類似的字體工具來識別具有相似外觀的字體,以在項目中選擇可能更好的其他選項。
7.對比
使用字體的不同類型設計和創(chuàng)建對比。正如你會使用不同的尺寸大小來創(chuàng)建層次結(jié)構(gòu)一樣,考慮不同的字體權(quán)重,顏色和樣式,以提供不同的視覺。顏色是創(chuàng)造對比度有效和簡便的方式之一。理想的對比度是在淺色背景上使用深色文字(或相反的)。在網(wǎng)頁設計中可以幫助你創(chuàng)建對比的顏色選項沒有限制。當你在使用顏色和排版時,請注意一些顏色組合不要輕易的使用它們,如亮藍色的亮紅色,真的很難被閱讀。尋找在亮與暗,活力和飽和度方面不同的組合。 當談到對時比,簡單的背景通常適合給予文本空間以閱讀的。但如果背景包含視覺元素,如圖像或圖案,則會產(chǎn)生字體的大小凹凸感,以創(chuàng)建背景和前景文本元素之間的分隔。
8.關(guān)于度量的一些事項
度量是指容納文本的容器大小??梢允嵌嗔懈袷降恼麄€文本框或單列的寬度。 文本度量之所以很重要的原因在于,屏幕上的字符數(shù)(包括空格,字形和標點符號)可能會影響可讀性。這個概念背后的理論是,如果線條太長或太短,由于來自一條線路到下一條線路的不斷往復運動,用戶的眼睛可能會感到疲勞。應用一段《The Elements of Typographic Style》中提及的相關(guān)描述:“45到75個字符被廣泛地認為是在文本大小的襯線文本中設置的單列頁面的令人滿意的長度。66字符的行(計數(shù)字母和空格)被廣泛認為是理想的。對于需要以多列排版呈現(xiàn)的內(nèi)容來說,更好的平均值是40到50個字符?!?對于大多數(shù)項目來說,這是一個非常好的起點,盡管許多項目傾向于稍大一點的排版樣式,但是理想的字符數(shù)(字符長度)還是在這個范圍之內(nèi)。盡管移動端排版在書籍的出版并不會在文字的長度上產(chǎn)生太多的問題,但是對于多列文本展示來說,這份指南是可以接受的起點。你甚至可以選擇稍微降低一點,并針對小屏幕每行優(yōu)化至35個字符。
總結(jié)如果你想繼續(xù)思考有關(guān)排版理論和字體使用,除了上述經(jīng)典之外,還有一些好書值得推薦。他們分別是:
Thinking with Type——by Ellen Lupton
Why Fonts Matter——by Sarah Hyndman
Just My Type: A Book About Fonts——by Simon Garfield
—-圖文來自:design shack
—-由天權(quán)互動翻譯編輯整理,為您提供更多有關(guān)網(wǎng)站建設、網(wǎng)站設計、網(wǎng)頁設計及其他互聯(lián)網(wǎng)應用服務
非常感謝您訪問我們的網(wǎng)站
在您使用本網(wǎng)站之前,請您仔細閱讀本聲明的所有條款。
1、本站部分內(nèi)容來源自網(wǎng)絡,涉及到的部分文章和圖片版權(quán)屬于原作者,本站轉(zhuǎn)載僅供大家學習和交流,切勿用于任何商業(yè)活動。
2、本站不承擔用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。
3、本聲明未涉及的問題參見國家有關(guān)法律法規(guī),當本聲明與國家法律法規(guī)沖突時,以國家法律法規(guī)為準。
4、如果侵害了您的合法權(quán)益,請您及時與我們,我們會在第一時間刪除相關(guān)內(nèi)容!
聯(lián)系方式:021-67669186?電子郵件:[email protected]