簡評:最新 2017 年 11 月網(wǎng)頁設(shè)計趨勢油额。分別是下劃線叠纷、遮蓋文字、黑白潦嘶。
11 月的三種網(wǎng)頁流行趨勢涩嚣,視覺效果都杠杠的,不過易用性和可讀性如何呢掂僵?讓我們進入今天的文章航厚。
I.文字下劃線和下劃線元素
下劃線的文字是一種相當意想不到的趨勢。這里說的下劃線不是你文字編輯時的普通下劃線锰蓬,也不是網(wǎng)頁超鏈接的那種下劃線幔睬。
下劃線的文字和元素趨勢使用顏色和線條,來突出顯示特定信息并將焦點集中到某個內(nèi)容區(qū)域芹扭。明智的使用下劃線能夠?qū)⒃O(shè)計中的不同元素結(jié)合麻顶,達到無縫過渡的效果。
案例:
西蒙·李畫廊使用下劃線把用戶的視線聚焦于最下的字體上冯勉。有一個強烈的對比同時澈蚌,又不會讓焦點失卻。
HooHaa 設(shè)計使用下劃線灼狰,線的下面有一個小三角元素宛瞄,整體構(gòu)成了天平既視感。有助于用戶聚焦和記憶 HoohaaDesign 這個名字交胚。
亞伯設(shè)計集團采用另一種方式份汗,橙色的線條在此充當著中心線的作用,達到將背景圖案與文本相結(jié)合的作用蝴簇。
II.遮蓋文字
可能你覺得這種設(shè)計已經(jīng)出來好久了杯活,不應(yīng)該成為 11 月的最新的趨勢,不過實話告訴你熬词,還有好多設(shè)計是在玩這個概念旁钧。
這種設(shè)計有一定的難度吸重,好多的設(shè)計師都在這折了。特別是在響應(yīng)式框架中更容易出問題歪今。
但如果能玩明白這個設(shè)計嚎幸,會非常的抓人。下面 RootStudio 例子就非常精彩寄猩,顯眼的色彩配合間接地字體嫉晶,加上長頸鹿栩栩如生,讓人印象深刻田篇。
如何能玩轉(zhuǎn)這改字體這種設(shè)計呢替废?
確保這個詞常見遮蓋的詞或短語很常見
不要遮蓋到太多的文本
文本上面的遮蓋物是主體
使用極簡的字體,確保字體不會與前面的遮蓋物產(chǎn)生沖突
保持其余的設(shè)計簡單泊柬,以便用戶可以輕松的關(guān)注字體并閱讀理解
III.黑白美學(xué)
黑白配色方案是近年來較少的椎镣,但最近黑白配色、偏暗配色彬呻、或者單色衣陶、灰色系配色多了起來。(我們知道闸氮,有時候設(shè)計趨勢與設(shè)計者的心情有著相關(guān)性剪况,難道最近設(shè)計師都感覺很陰沉么?)
過去的黑白網(wǎng)頁設(shè)計大多都是攝影作品集網(wǎng)站蒲跨,不過最近的黑白網(wǎng)頁設(shè)計有很大的區(qū)別译断。下面的案例包含了家具設(shè)計公司、網(wǎng)站設(shè)計公司或悲、心理健康咨詢網(wǎng)站孙咪。
沒有其他的色彩,讓這些網(wǎng)站擁有相似的情感傳遞巡语。
當時用黑白配色時翎蹈,設(shè)計師可能要注意文本放置位置和可讀性,以及在某些部分包含顏色該如何處理男公。盡管色彩不足荤堪,不過設(shè)計師也依舊可以創(chuàng)造一些有趣的東西。
這里有種技巧枢赔,能夠讓黑白配色顯得更有溫度感澄阳,可以為深色調(diào)使用更豐富的色彩搭配√ぐ荩可以用紅碎赢、藍、綠等其他顏色作為底色速梗,這樣可以讓黑色顯得更有層次肮塞,有助于創(chuàng)造不同的觀感襟齿。
豐富的黑色用 HEX 編輯器看,是由多種色彩構(gòu)成的峦嗤。Hex #000000 根本沒有顏色蕊唐,豐富的黑色是 #004040屋摔,還有很多更豐富的黑色的烁设。更豐富的黑色可以作為黑白之間的過度,成為特殊的設(shè)計元素钓试。
案例:
結(jié)論
本月的所有設(shè)計趨勢弓熏,都會讓文本更難閱讀一些恋谭。這是設(shè)計的概念之一,不過也要分項目來選型挽鞠,有的項目能夠體現(xiàn)出非常好的效果疚颊,有的項目就不太搭。
英文原文:3 Essential Design Trends, November 2017 | Webdesigner Depot
舊文推薦:
設(shè)計師必看的10個視頻(全中文字幕)
靈感迸發(fā) | 國外 28 個知名網(wǎng)站的 404 頁面
UI 設(shè)計中最重要的顏色