資訊

精準傳達 • 有效溝通

從品牌網站建設到(dào)網絡營銷策劃,從策略到(dào)執行的(de)一(yī / yì /yí)站式服務

微文本在(zài)網頁設計中的(de)運用技巧

來(lái)源:山东烈日网络科技有限公司 | 2020.07.13

目前,濟南網站設計的(de)趨勢之(zhī)一(yī / yì /yí)就(jiù)是(shì)對網站所承載的(de)内容進行簡化和(hé / huò)小型化。微小化的(de)文本元素已成爲(wéi / wèi)一(yī / yì /yí)種流行趨勢。然而(ér),這(zhè)種設計趨勢在(zài)設計界也(yě)引起了(le/liǎo)一(yī / yì /yí)些争議。


毫無疑問,小文本會在(zài)大(dà)小和(hé / huò)大(dà)小上(shàng)造成一(yī / yì /yí)些可讀性問題。但如果你仔細而(ér)恰當地(dì / de)做,小文本塊實際上(shàng)可以(yǐ)幫助你創建視覺焦點和(hé / huò)重心,并将用戶吸引到(dào)設計的(de)特定部分。


微文本在(zài)網頁設計中的(de)運用技巧


接下來(lái),請記住,讓我們看看這(zhè)個(gè)小文本趨勢應該如何實現,以(yǐ)及它将如何幫助您獲得一(yī / yì /yí)些設計靈感。


1創建層次結構和(hé / huò)組織感


雖然超大(dà)文本的(de)使用已經爲(wéi / wèi)設計領域奠定了(le/liǎo)基礎,但它已經成爲(wéi / wèi)主頁和(hé / huò)标題設計的(de)主要(yào / yāo)選擇。但在(zài)保證視覺的(de)基礎上(shàng),人(rén)們傾向于(yú)在(zài)浏覽器或桌面的(de)第一(yī / yì /yí)個(gè)屏幕上(shàng)提供盡可能多的(de)信息(原因之(zhī)一(yī / yì /yí)可能是(shì)設備尺寸和(hé / huò)分辨率的(de)不(bù)斷提高給了(le/liǎo)設計師更多的(de)設計空間)。


這(zhè)就(jiù)是(shì)微小化中出(chū)現“橫空出(chū)世”的(de)原因。字體大(dà)小和(hé / huò)比例的(de)差異使排版具有明顯的(de)視覺流動動态性。通過使用一(yī / yì /yí)個(gè)非常小的(de)文本層(通常是(shì)14到(dào)16個(gè)點大(dà)小),您可以(yǐ)創建一(yī / yì /yí)個(gè)額外的(de)焦點供用戶關注。小文本,尤其是(shì)與其他(tā)較大(dà)的(de)文本一(yī / yì /yí)起使用時(shí),可以(yǐ)吸引用戶,因爲(wéi / wèi)它們不(bù)同,從而(ér)形成視覺對比。


Maximum bonhome在(zài)其網站設計中使用了(le/liǎo)小文本。如您所見,較小的(de)文本元素提供了(le/liǎo)有關項目的(de)關鍵細節,而(ér)較大(dà)的(de)文本元素提供了(le/liǎo)對工作的(de)描述。你需要(yào / yāo)觀察并注意如何


這(zhè)些小文本元素周圍有很多空間和(hé / huò)内容。


2窗體樣式


有時(shí)候,小短信是(shì)爲(wéi / wèi)了(le/liǎo)引起你的(de)注意或者讓你想再看一(yī / yì /yí)眼。


因爲(wéi / wèi)它的(de)外觀往往出(chū)乎意料或與用戶在(zài)其他(tā)網站上(shàng)看到(dào)的(de)不(bù)同,所以(yǐ)設計元素可以(yǐ)立刻吸引用戶。


Mountain Dew,一(yī / yì /yí)個(gè)從不(bù)害怕引領時(shí)尚的(de)品牌,在(zài)其網站設計中使用了(le/liǎo)一(yī / yì /yí)個(gè)超小的(de)标題,但它可以(yǐ)讓你一(yī / yì /yí)下子(zǐ)注意到(dào)它。标題與X的(de)頂點完美契合,創造了(le/liǎo)一(yī / yì /yí)種獨特的(de)閱讀模式。即使是(shì)在(zài)交互設計方面,他(tā)們也(yě)盡量縮小規模,這(zhè)不(bù)會讓用戶感到(dào)不(bù)舒服,因爲(wéi / wèi)這(zhè)是(shì)有意爲(wéi / wèi)之(zhī)。


三。創建有吸引力的(de)導航


雖然目前主流和(hé / huò)很多網站的(de)設計都取消了(le/liǎo)主頁的(de)導航功能,但實際上(shàng)隻是(shì)改變了(le/liǎo)導航的(de)呈現方式,用漢堡包/隐藏式菜單導航取代了(le/liǎo)導航,使用小文本可以(yǐ)讓一(yī / yì /yí)些元素回歸到(dào)屏幕上(shàng),而(ér)不(bù)會打擾人(rén)。這(zhè)是(shì)一(yī / yì /yí)個(gè)設計模式的(de)過程,從一(yī / yì /yí)從一(yī / yì /yí)個(gè)極端到(dào)另一(yī / yì /yí)個(gè)極端。


在(zài)一(yī / yì /yí)個(gè)小的(de)商業網站上(shàng),點擊導航确實是(shì)很難的(de),因爲(wéi / wèi)要(yào / yāo)在(zài)網頁上(shàng)使用大(dà)的(de)文本是(shì)很難理解的(de)。使用簡單的(de)字體也(yě)很重要(yào / yāo),因爲(wéi / wèi)小字體對眼睛來(lái)說(shuō)有點難以(yǐ)适應。


拉普蘭的(de)魔力似乎找到(dào)了(le/liǎo)一(yī / yì /yí)個(gè)很好的(de)解決方案來(lái)解決在(zài)主菜單欄中使用小文本的(de)問題。在(zài)他(tā)的(de)網頁設計的(de)主導航中,你可以(yǐ)看到(dào)每個(gè)元素都有足夠的(de)間距,有些甚至是(shì)兩倍的(de)間距,白色無襯線字體有助于(yú)在(zài)黑暗的(de)背景下閱讀。


4展覽空間


當頁面的(de)視覺空間很大(dà)時(shí),小文本最有效。小元素和(hé / huò)大(dà)空間之(zhī)間的(de)對比總能産生驚人(rén)的(de)效果。然而(ér)


不(bù)推薦大(dà)量的(de)小文本,因爲(wéi / wèi)它們不(bù)善于(yú)閱讀,所以(yǐ)要(yào / yāo)保持文本元素的(de)簡潔。


微文本的(de)使用應該有一(yī / yì /yí)個(gè)特别的(de)目的(de),當你第一(yī / yì /yí)次打算這(zhè)樣做的(de)時(shí)候。在(zài)使用這(zhè)種設計趨勢之(zhī)前,你需要(yào / yāo)扪心自問:爲(wéi / wèi)什麽我要(yào / yāo)在(zài)這(zhè)裏使用小文本?它對我的(de)網站設計有什麽貢獻或意義?


如果你對這(zhè)些問題沒有一(yī / yì /yí)個(gè)确切的(de)答案(當然,因爲(wéi / wèi)我樂意不(bù)算在(zài)内),那麽你應該考慮其他(tā)問題,直到(dào)你确定它正是(shì)你需要(yào / yāo)的(de)。


月亮農場主給了(le/liǎo)一(yī / yì /yí)個(gè)美麗的(de)演示如何微小的(de)單詞适合太空。網頁設計使用兩個(gè)層次的(de)排版和(hé / huò)大(dà)量開放的(de)視覺塊來(lái)創造一(yī / yì /yí)種情感,并在(zài)用戶點擊或滾動之(zhī)前将内容介紹給他(tā)們。小文本隻是(shì)設計的(de)許多細節中的(de)一(yī / yì /yí)個(gè),您想停下來(lái)看看。元素之(zhī)間有很多對比,所以(yǐ)你不(bù)必太擔心可讀性。


還有一(yī / yì /yí)件事你需要(yào / yāo)記住:你不(bù)必到(dào)處使用小文本。把它看作是(shì)一(yī / yì /yí)種特殊的(de)藝術元素,比如月亮農場主主頁上(shàng)使用的(de)小文字,然後将同樣的(de)字體添加到(dào)一(yī / yì /yí)個(gè)更常見的(de)大(dà)小,以(yǐ)供其餘設計使用。


5當文本不(bù)是(shì)最重要(yào / yāo)的(de)元素時(shí)


有時(shí),最重要(yào / yāo)的(de)顯示元素不(bù)是(shì)文本,它可能是(shì)視覺元素的(de)次要(yào / yāo)元素。


Freedom TV是(shì)一(yī / yì /yí)個(gè)很好的(de)例子(zǐ),說(shuō)明如何使用腳本幫助用戶,同時(shí)允許另一(yī / yì /yí)個(gè)元素成爲(wéi / wèi)設計的(de)主要(yào / yāo)部分。對于(yú)這(zhè)個(gè)項目,視頻是(shì)最重要(yào / yāo)的(de)元素,您也(yě)可以(yǐ)看到(dào)它,而(ér)小文本作爲(wéi / wèi)另一(yī / yì /yí)個(gè)元素可以(yǐ)提供額外的(de)信息,并鼓勵用戶訂閱或注冊,無論它出(chū)現在(zài)主頁的(de)什麽位置。


6創建可視元素


文本元素的(de)主要(yào / yāo)作用是(shì)閱讀,這(zhè)是(shì)符合的(de)


十九年 建站經驗

多一(yī / yì /yí)份參考,總有益處

聯系客服,免費獲得專屬《策劃方案》及報價

咨詢相關問題或預約面談,可以(yǐ)通過以(yǐ)下方式與我們聯系

業務熱線:400-606-8008 / 大(dà)客戶專線 濟南:15589999555