網(wǎng)頁設計中微文的使用技巧

2022-05-07    分類: 網(wǎng)站建設

目前,廣州網(wǎng)站設計的大趨勢之一是使網(wǎng)站所承載的內容極簡化和微小化,“微小化”的文本元素已經(jīng)成為一種流行趨勢,但這種設計趨勢,在設計領域同樣引發(fā)了一些爭論。
毫無疑問,小文本在大小和尺寸上可能會導致一些可讀性問題。但如果你用心并處理得當?shù)脑?,小文本區(qū)塊實際上可以幫助你創(chuàng)建一個視覺焦點和重心,并將用戶吸引到設計的特定部分。
接下來,跟上思維,讓我們來看看這個微小的文本趨勢應該如何實現(xiàn)以及它將如何發(fā)揮作用,以幫助你獲得一些設計靈感。
1、創(chuàng)建層次結構和組織感
盡管超大型文本隨著使用已經(jīng)在設計領域打下一定的基礎,成為主頁和標題設計的主要選項。但是目前有一種趨勢——在瀏覽器或桌面的第一個屏上盡可能在保證視覺的基礎上提供更多的信息(原因之一可能是設備尺寸和分辨率的不斷增加,給設計師更多的設計空間)。
這也就是“微小化”文本“橫空出世”的原因。字體的大小和比例的不同,使得排版有明顯的視覺流動感。通過使用一層很小的文本(通常使用14到16點的尺寸大小),你可以創(chuàng)建一個額外的焦點讓用戶聚焦。小文本,特別是與其他較大文本一起使用時,可以吸引用戶,因為它們是不同的,這在視覺上就形成了對比。
Maxime Bonhomme在其網(wǎng)站設計中使用了小文本。你可以看到,微小化的文本元素提供了關于項目的關鍵細節(jié),而更大的文本則負責提供工作的描述。你需要觀察和注意這些周圍有大量空間和內容的微小文本元素是如何工作的。
2、形成風格
有時候,微小化文本信息的設計目的是為了引起你的注意或者讓你忍不住想看第二眼。
因為它的出現(xiàn)經(jīng)常是出乎意料的,或者不同于用戶在其他網(wǎng)站上看到的,所以設計元素可以一下子就吸引用戶。
Mountain Dew,一個永遠不懼于引領時尚的品牌,在它的網(wǎng)站設計上使用了一個超級小的標題,不過,它確實能夠讓你一下子注意到它。這個標題完全和X的頂點契合,創(chuàng)造出一種獨特的閱讀模式。即使是對交互動作的設計他們也盡量做到微小,它不會讓用戶感到不舒服,因為它感覺是故意的。
3、創(chuàng)建吸引人的導航
雖然現(xiàn)在的主流并且很多網(wǎng)站設計都取消了主頁的導航功能,但實際上它們只是變更了導航的表現(xiàn)形式,將他們替換為漢堡/隱藏的樣式菜單導航,使用小文本可以讓一些元素回到屏幕上,而不讓人覺得受到打擾。它是設計模式中的一個流程,從一個極端到下一個極端。
確實,在網(wǎng)頁設計的導航中使用小文本是一件很棘手的事情,因為它需要足夠大,以便可以被輕松閱讀和點擊。使用簡單的字體也是非常重要的,因為小文本對眼睛的適應來說可能有點困難。
Magic of Lapland貌似對在主菜單欄中使用微小文本這個問題找到了一個很好的解決方案。在他的網(wǎng)頁設計的主導航中,你可以看到每個元素都有足夠的間距,有些甚至使用雙倍間距,并且在黑暗背景下,白色無襯線字體有助于可讀性。
4、展示空間
當頁面的視覺空間很大時,微小文本最有效。小元素和廣闊空間之間的反差是總是可以產(chǎn)生驚人的效果。不過,大量的小文本就不建議使用了,因為它們總歸在閱讀上并不是很好,所以要保持文本元素的簡潔。
微小文本的使用在最初你打算這么做的時候就應該在你的思維中有一個特殊的目的性。在使用這個設計趨勢之前,你需要問問你自己:為什么我要在這里使用小文本呢?它對我的網(wǎng)站設計將有什么貢獻或者意義呢?
如果你對這些問題沒有可靠的答案(當然“因為我樂意”不能算答案),那么你應該考慮其他的問題,知道你確定它確實是你需要的。
Moonfarmer做了一個漂亮的示范,它向我們展示了微小的文字應該如何和空間搭配。該網(wǎng)頁設計使用了兩種級別的排版和大量的開闊的視覺塊來建立一種情緒,并在用戶點擊或滾動之前向他們介紹內容。小小的文字只是設計的眾多細節(jié)之一,讓你想停下來看看。元素之間有很大的對比,所以對于可讀性你可以不用有太多的顧慮。
還有一點你需要記?。耗悴槐氐教幨褂眯∥谋?。把它當作一種特殊的藝術元素,就像在Moonfarmer的主頁上使用的小文本一樣,然后在整個設計的其余部分將相同的字體增加到更常見的尺寸。
5、當文本不是最重要的元素時
有時,需要展示的最重要的元素并不是文本,文本在視覺元素中可能只是次要的。
Freelance TV是一個很好的例子,說明如何使用小文本來幫助用戶,同時允許另一個元素作為設計的主要部分。對于這個項目,視頻是最重要的元素,你一樣就可以看出來,而小文本作為另一個元素,可以提供額外的信息,并鼓勵用戶進行訂閱或者注冊,不管它在主頁上的什么位置出現(xiàn)。
6、創(chuàng)建一個可視元素
文本元素的主要作用是用來閱讀的,這很符合邏輯。
但有時候,將文本元素作為視覺元素的一部分,是否被閱讀的重要性就不那么重要了(這需要前期的計劃和大量的討論,所以不要在你突發(fā)奇的時候就草率的使用這項技巧)。
HTML Burger的網(wǎng)站設計中使用了一系列的小文本圖層,將小文本用作描述大標題的視覺部分。在每個“Burger”包裝上都使用了小的文字,以創(chuàng)造出更酷的視覺元素。這是一個你可能不太常見的設計技巧和思路,在這種情況下,它是有影響力的(但這種技術很難實現(xiàn);要小心行事)。
總結
使用微小文本,或者不使用,這可能是一個艱難的決定。雖然小文本的使用是有爭議的,但對于小字體的使用還是有適當?shù)挠锰幍?。為了確保在你的設計中添加有效的小文本元素,你需要給它足夠的空間,使用一個高度可讀的字體,并使用其他的設計元素來對比或者提示用戶。
最后,如果你打算使用微小風格的文本內容在你的下一個設計項目時,當然,這是好事,但是我們也建議不要過多的使用它們。這不是一個能幫助你把更多的內容“塞進”你的設計的技術,它只在最合適的位置,賦予一個直接的目的性才能發(fā)揮它大的效果。
網(wǎng)站SEO優(yōu)化、 網(wǎng)站建設、 網(wǎng)站設計

網(wǎng)頁題目:網(wǎng)頁設計中微文的使用技巧
文章起源:http://muchs.cn/news42/150892.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供動態(tài)網(wǎng)站網(wǎng)站內鏈、網(wǎng)站維護搜索引擎優(yōu)化、全網(wǎng)營銷推廣微信小程序

廣告

聲明:本網(wǎng)站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經(jīng)允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)

成都做網(wǎng)站