金镕基

摘 ? 要：隨著網(wǎng)絡(luò)購物的日益普及，各大電商平臺紛紛在網(wǎng)站頁面的優(yōu)化上做足了功課，以增加客戶粘性及回購率。電商頁面的視覺設(shè)計元素，是保障用戶在使用電商網(wǎng)頁時的舒適性，增強(qiáng)用戶體驗的重要內(nèi)容。在本文中，將分析在電商網(wǎng)頁中的基礎(chǔ)文字表達(dá)、Tad標(biāo)簽、網(wǎng)頁導(dǎo)航、延展表單、logo、圖標(biāo)、配色、手機(jī)網(wǎng)頁等主要設(shè)計元素，以此優(yōu)化使用電商頁面的視覺設(shè)計。

關(guān)鍵詞：電商網(wǎng)頁 ?視覺設(shè)計 ?設(shè)計要素

中圖分類號：TP393.0 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 文獻(xiàn)標(biāo)識碼：A ? ? ? ? ? ? ? ? ? ? ? 文章編號：1674-098X（2019）11（b）-0233-02

隨著現(xiàn)代網(wǎng)絡(luò)技術(shù)的發(fā)展與人們生活水平的提高，電子商務(wù)越來越受到人們的歡迎，而電商頁面作為用戶在進(jìn)行電商瀏覽過程中的主要內(nèi)容，其視覺設(shè)計的合理性是保障用戶視覺感官能夠獲得提升的有效途徑。為此需要綜合利用影響網(wǎng)頁視覺感官的設(shè)計元素來實現(xiàn)整體視覺設(shè)計效果的提升。

1 ?基礎(chǔ)文字表達(dá)

在電商網(wǎng)頁的界面設(shè)計元素中，文字是其中的基石部分，一個優(yōu)秀的文字設(shè)計與頁面排版能夠?qū)崿F(xiàn)吸引住用戶眼球，強(qiáng)化頁面設(shè)計附加功能的作用。但在對文字元素的實際應(yīng)用中應(yīng)當(dāng)注意的是，要確保文字能夠清晰可見，并且方便用戶進(jìn)行閱讀，把握好文字的間距、字距、字體以及文字排列方式，而后適當(dāng)采用一些具有變化或是藝術(shù)感的文字，使網(wǎng)頁界面看起來更加時尚且與商品的特點(diǎn)相互匹配。同時還要注意將促銷、打折等活動區(qū)域的文字更加醒目，更加具有震撼力，讓用戶能夠第一時間注意到這些活動頁面。并且需要注意對彩色字體的使用與控制，如果在頁面當(dāng)中濫用彩色字體會使整體頁面的視覺效果變得混亂無序，使用戶感到視覺疲勞，不僅起不到美化的效果，還會降低用戶的適應(yīng)體驗[1]。

2 ?Tad標(biāo)簽

在電商網(wǎng)頁當(dāng)中，Tad標(biāo)簽是網(wǎng)頁當(dāng)中不可缺少的要素。通常在網(wǎng)頁設(shè)計中，標(biāo)簽都是通過垂直的方式進(jìn)行布置，并且應(yīng)當(dāng)避免標(biāo)簽的排列過于密集。而當(dāng)標(biāo)簽之間有重要性與關(guān)聯(lián)性的區(qū)別時，需要將標(biāo)簽按照重要性的大小進(jìn)行排列。并在標(biāo)簽過多時，將使用次數(shù)較低，或是相較之下并不重要的標(biāo)簽納入到“更多”選項當(dāng)中。同時，通過分組以及下拉菜單等形式還可以使標(biāo)簽的結(jié)構(gòu)性更強(qiáng)，方便用戶進(jìn)行瀏覽與使用。而在對標(biāo)簽進(jìn)行設(shè)計的過程中，要注意通過設(shè)置將用戶選種的標(biāo)簽與未被選種的標(biāo)簽進(jìn)行區(qū)分，一般可以通過對背景色的加深或是便是實現(xiàn)這種情況，并盡可能的保障界面的簡潔與精煉，實現(xiàn)對信息的整合，在有限的空間內(nèi)讓用戶得到關(guān)于網(wǎng)頁產(chǎn)品的索引信息，使用戶的操作更加便捷。

3 ?網(wǎng)頁導(dǎo)航

網(wǎng)頁導(dǎo)航，是電商頁面的重要組成部分，用戶可以利用電商導(dǎo)航來進(jìn)入到電商平臺的各個頁面之中進(jìn)行選購。而當(dāng)前流行的網(wǎng)頁導(dǎo)航主要分為主導(dǎo)航、次導(dǎo)航、面包屑導(dǎo)航三種，這三種導(dǎo)航分別實現(xiàn)了對訪問者的引入、切換以及確認(rèn)位置的作用。在實際應(yīng)用中，大部分網(wǎng)站導(dǎo)航菜單設(shè)計都采用頂部水平欄導(dǎo)航，這種設(shè)計下網(wǎng)頁導(dǎo)航位置主要位于網(wǎng)站logo的上方或者下方。這種方式不僅操作更加簡單，同時用戶使用時也更加輕松。此外，在網(wǎng)頁導(dǎo)航中，為了避免用戶無法尋找到自己所需的瀏覽頁面，簡化網(wǎng)頁導(dǎo)航的復(fù)雜性。并且在對用于確認(rèn)用戶當(dāng)前位置的面包屑導(dǎo)航進(jìn)行設(shè)計時，需要通過加粗加大字體、改變字體顏色等方式，將導(dǎo)航設(shè)計的更加容易識別。

4 ?延展表單

表單，是用戶在進(jìn)行購買、投訴、注冊、評價等內(nèi)容時所必須填寫的項目，并且電商頁面在設(shè)計的過程中，要盡可能的簡潔。將可以重復(fù)利用的信息在用戶的同意下儲存在云端，在下次填寫時可以有系統(tǒng)自動進(jìn)行填寫，而需要改動的信息則由用戶自主進(jìn)行操作。而且表單的外觀要確保用戶不會在使用的過程中對其感到反感，或是產(chǎn)生抵觸心理。為此，在對表單進(jìn)行設(shè)計時需要能夠?qū)⒈韱伪M可能的簡化。而通常表單是由標(biāo)簽、輸入框、行為、幫助、信息以及驗證六個部分所組成，這六個內(nèi)容相符相呈，但又各不相同。設(shè)計者必須能夠把握住這幾項內(nèi)容的特點(diǎn)，合理的進(jìn)行規(guī)劃與設(shè)計。此外，表單在進(jìn)行驗證時，為了確保安全通常采用不同的驗證方式，如驗證碼、圖片滑塊、文字選取等形式，但如果安全驗證過于復(fù)雜，雖然在一定程度上確保了驗證的安全，卻降低了用戶的使用體驗。為此，在進(jìn)行驗證設(shè)計時，需要權(quán)衡驗證設(shè)計的安全性與使用性，在保障用戶安全的同時使用戶體驗得到優(yōu)化。

5 ?Logo

Logo是一個企業(yè)與公司在傳播過程中的重要標(biāo)志，能夠幫助用戶輕松的對網(wǎng)站進(jìn)行識別。一個優(yōu)秀的Logo不僅是企業(yè)的臉面，同時也是企業(yè)文化最為重要的外在表現(xiàn)。在電商網(wǎng)頁中，Logo的作用更加明顯，好的Logo能夠吸引用戶的眼球，并給予用戶關(guān)于網(wǎng)站的第一印象，使用戶對網(wǎng)站產(chǎn)生好感，樂于使用網(wǎng)站進(jìn)行購物。而在對Logo進(jìn)行設(shè)計的過程中，除了藝術(shù)性以外也要關(guān)注Logo的簡潔性與使用性。并且當(dāng)前主流的電商網(wǎng)站logo都是有圖形與文字進(jìn)行組合較少使用卡通形象，這是由于電商與其他企業(yè)的不同特點(diǎn)所決定的，而電商在對Logo設(shè)計的過程中，也要注意Logo能夠符合當(dāng)前網(wǎng)頁的類型、網(wǎng)站的受眾群體以及整體風(fēng)格來進(jìn)行量身定做。

6 ?圖標(biāo)

圖標(biāo)，不僅能夠幫助用戶了解到自身的位置，也能夠提升當(dāng)前電商網(wǎng)頁的美感，強(qiáng)化視覺設(shè)計的效用，為此在進(jìn)行設(shè)計的過程中需要商戶能夠根據(jù)當(dāng)前網(wǎng)頁的特點(diǎn)與風(fēng)格來制定與其相符的圖標(biāo)。并且圖標(biāo)作為在電商網(wǎng)站中，持續(xù)且明顯的一個符號，能夠?qū)崿F(xiàn)對相應(yīng)功能的表達(dá)。為此，需要使圖標(biāo)能夠明確對其所包含的內(nèi)容進(jìn)行明確表達(dá)，比如，在電商網(wǎng)站通常都會通過一個簡化的手機(jī)符號來代表手機(jī)充值等行為。

7 ?配色

配色，是電商網(wǎng)頁界面設(shè)計中最重要的一部分，只有確保顏色的合理性，才能夠使用戶在進(jìn)行瀏覽的過程中，更加舒適。電商網(wǎng)頁的配色需要具有一定的導(dǎo)向性，為此一般的電商網(wǎng)站都會采取暖色作為頁面設(shè)計的主要顏色，比較常見的有橙色與紅色，而一些對男性用品進(jìn)行販賣的頁面通常會采用藍(lán)色，這是為了凸顯出顏色的象征意義。對配色的實際應(yīng)用中，使用得當(dāng)?shù)念伾粌H能夠強(qiáng)化用戶的操作體驗，還能在心理層面，影響用戶的內(nèi)心思維以及心理狀態(tài)，為用戶留下深刻的印象[2]。同時，要降低對顏色的使用過程中過多的使用多種顏色，顏色過于繁雜會導(dǎo)致用戶產(chǎn)生視覺疲勞，也因此大部分網(wǎng)站都是采取單一的顏色，并適當(dāng)?shù)卦跇?biāo)簽被選中時改變顏色。此外，配色還要考慮電商網(wǎng)頁潛在用戶的感受，使電商網(wǎng)頁的配色能夠符合自身的設(shè)計風(fēng)格。

8 ?手機(jī)網(wǎng)頁

雖然當(dāng)前大部分電商都開發(fā)了專屬的手機(jī)APP，但電商網(wǎng)頁在手機(jī)上的網(wǎng)頁設(shè)計也不可忽視。通常在進(jìn)行手機(jī)網(wǎng)頁的設(shè)計過程中，會采用將電商網(wǎng)頁按照手機(jī)的比例進(jìn)行調(diào)整的方式來進(jìn)行網(wǎng)頁設(shè)計，但這種方式卻無法保證網(wǎng)頁設(shè)計的合理性，因此電商有必要對相應(yīng)的手機(jī)網(wǎng)頁進(jìn)行重新設(shè)計，方便手機(jī)網(wǎng)頁用戶能夠更加便捷地進(jìn)行操作。

9 ?結(jié)語

綜上所述，電商網(wǎng)頁界面設(shè)計效果離不開對基礎(chǔ)文字表達(dá)、Tad標(biāo)簽、網(wǎng)頁導(dǎo)航、延展表單、logo、圖標(biāo)、配色、手機(jī)網(wǎng)頁等設(shè)計元素的優(yōu)化與合理選用，實現(xiàn)整體視覺設(shè)計效果的提升，能夠?qū)崿F(xiàn)電商網(wǎng)頁的整體可操作性與舒適性，令用戶對電商網(wǎng)頁的使用體驗進(jìn)一步提升。

參考文獻(xiàn)

[1] 馮浩煜.電商網(wǎng)頁界面視覺設(shè)計元素解析[J].科技視界，2018（1）：159-160.

[2] 董華君.手機(jī)App界面的視覺設(shè)計研究[J].藝術(shù)科技，2017，30（8）：291.

[3] 楊帆.視覺營銷下購物類網(wǎng)站頁面設(shè)計的研究[D].天津工業(yè)大學(xué)，2017.