干貨 | 網(wǎng)頁設(shè)計的7種字體排版設(shè)計趨勢
時間：2023-09-29 06:30:02 | 來源：網(wǎng)站運營
時間：2023-09-29 06:30:02 來源：網(wǎng)站運營
干貨 | 網(wǎng)頁設(shè)計的7種字體排版設(shè)計趨勢：
2006年，Oliver Reichenstein發(fā)表了文章《網(wǎng)頁設(shè)計95%的工作是排版》，成為當年備受爭議的文章之一。Reichenstein也說：“
網(wǎng)頁設(shè)計不是選擇偉大的字體，而是我們?nèi)绾问褂盟鼈?。?/b>
下面就讓我們來看看網(wǎng)頁設(shè)計中是如何使用字體的。
01 加粗字體的首頁排版設(shè)計
超大的、加粗的、直接的、沒有戲劇性的字體可能是最近幾年網(wǎng)站首頁設(shè)計中運用最多的字體。網(wǎng)站首頁的超大圖片被超大文本標題所代替，這些標題往往與主題、品牌或者信息緊密關(guān)聯(lián)。
而效果也如圖所見，字體排版成為網(wǎng)站中最顯眼的設(shè)計。
所用字體Dharma Gothic Heavy
例如CreativeDoc的首頁中，6個加粗的白色字母在強烈的黑色背景中，對比強烈，十分醒目。
所用字體自定義（Souffl Web）
而Souffl這家歐洲的設(shè)計創(chuàng)意公司，網(wǎng)頁上運用了一種更為簡潔、狹窄的白色字體，黑色背景搭配流行的彩色動畫元素。
02 襯線字體
襯線字體與無襯線字體相比更加優(yōu)雅。所以設(shè)計師通常會在標題和說明中運用襯線字體強調(diào)突出，比如Calluna和Minion這兩個字體。
在Cobble Hill和Gin Lane這兩個網(wǎng)頁設(shè)計上，設(shè)計師就在極簡主義的首頁上運用了優(yōu)雅襯線字體。
所用字體Arno Pro 和 Proxima Nova
所用字體Miller Disp, Lt
03 純文字排版
新聞業(yè)和其他行業(yè)的文字視覺革命進行的如火如荼，但有部分網(wǎng)頁仍然追求直觀、簡單的文字排版。
Justin Jackson 的這個名為 Word 的這個網(wǎng)站的主要內(nèi)容，是在網(wǎng)頁上獨立呈現(xiàn)文本的顯示效果的。
所用字體瀏覽器默認字體
Jackson 說：“文本是最網(wǎng)頁中最強大的工具”，雖然這一說法直到最近才被接受。使用純文字進行網(wǎng)頁設(shè)計并不容易，但使用的好我們甚至不會注意到圖像的缺失。
位于哥本哈根的設(shè)計機構(gòu)B14就使用簡單直白的文字來填滿主頁，說明他們是誰，做了什么。
所用字體Maison Neue
一圖雖然勝千言，但并沒有像文字對信息的控制那么好。
自由撰稿人喬?科爾曼（Joe Coleman）以一種全新的方式詮釋了“純文字排版”。他用交互性元素和純文字的設(shè)計來吸引用戶。
所用字體Work Sans
Max Kaplun的作品又有不同，純文字的排版中加入運用字符，字大小和重量的變化，和一個彩色的光標。
04 為等寬字體騰空間
等寬字體應(yīng)用較廣，不僅會出現(xiàn)在文字密集的場合，也可以用于網(wǎng)頁設(shè)計。由于這種字體帶有復(fù)古感，恰好與網(wǎng)頁設(shè)計中粗野主義的回歸相吻合。
使用字體Space Mono
Laurent Desserrey設(shè)計了一套令人著迷的作品集網(wǎng)站，借助閃光背景和等寬字體營造出粗野主義的視覺效果。
所用字體：Titling Gothic, Space Mono
Run Your Mouth也通過使用等寬字體創(chuàng)造了同樣迷人的粗野主義效果。
05 使用高亮效果來吸引關(guān)注
高亮效果的作用是構(gòu)建內(nèi)容的層次結(jié)構(gòu)，這有利于讀者在瀏覽時抓住關(guān)鍵信息。正如我們在課本的重點處涂上鮮艷色彩來突出一樣，設(shè)計師在網(wǎng)頁設(shè)計上也是如此。
所用字體Noe 和 Atlas
舊金山的一家設(shè)計公司Godfrey Dadich在其主頁上運用熒光綠的高亮部分來突出重點。
所用字體Freight Display + Theinhardt
康奈爾大學(xué)（Cornell University）在網(wǎng)頁上也運用了高亮效果。 通過熒光黃標記的關(guān)鍵詞來突出重點，方便用戶瀏覽。
06 運用縱橫交錯的標題文本
將文本塊拆分，在網(wǎng)站首頁上進行縱橫交錯的排布也是最近比較流行的方式。這種方式拋棄了傳統(tǒng)水平對齊方式，給整體布局更多留白，產(chǎn)生了意想不到的效果。
所用字體DIN + Courier
例如上圖的電影網(wǎng)站，就將Take What You Can Carry拆開來單獨排版。
所用字體Azo Sans + Capitolium 2
而其他的設(shè)計機構(gòu)，比如 Elegant Seegulls 的網(wǎng)站，甚至進一步嘗試垂直文本對齊，以創(chuàng)造持續(xù)的滾動效果。
在創(chuàng)意機構(gòu) Magic People Voodoo People 的網(wǎng)站上，則在四角上使用了水平和垂直的文本來構(gòu)成它的名稱。
07 分散字體
最后要介紹的就是分散字體，將單詞徹底打散成單個字母，相較于第六種方式更為大膽。雖然視覺效果很好，但如果不謹慎部署，可能會犧牲可讀性和可訪問性。
The Impossible Is Inevitable 是一個在莫斯科猶太人博物館所舉辦的展覽，展覽的名字是以在主頁上浮動的、連在一起的字母形式出現(xiàn)。
展覽的名字以這種分散的串聯(lián)的方式出現(xiàn)也是有意為之。微小的絲線將視覺上分散的字母串聯(lián)在一起，象征著展覽對未知的探索和人類支離破碎、脆弱的血緣關(guān)系。
Octoplus Group是一個散布信件來講述故事的通信機構(gòu)，網(wǎng)站首頁就是借助小而粗的字母來充當導(dǎo)航元素。這種設(shè)計從品牌信息傳達和故事性的角度上來看是非常有趣且有效的。
撰文 ? 小香菇
51design出品，無條件歡迎分享轉(zhuǎn)發(fā)
關(guān)鍵詞：設(shè)計,字體,排版,趨勢,干貨
在線咨詢