打開手機,桌面上都是圖標(biāo)。打開電腦,桌面上同樣有很多圖標(biāo)。但是,在很長時間里,網(wǎng)站其實沒有很多的圖標(biāo),有的網(wǎng)站甚至只有一個LOGO。但是,逐漸網(wǎng)站上的圖標(biāo)越來越多了。
網(wǎng)站為什么需要圖標(biāo)?
一個企業(yè)官網(wǎng)上,為何需要圖標(biāo)呢?我們認為有三個原因。
其一,響應(yīng)式網(wǎng)站的出現(xiàn)。需要在較小的手機屏幕上呈現(xiàn)網(wǎng)站,就需要減少網(wǎng)站的信息量。而圖形傳達的信息量要超過文字,當(dāng)占據(jù)的版面相同的時候。所以,響應(yīng)式網(wǎng)站的圖標(biāo)要多一些。
其二,受到手機系統(tǒng)的影響。無論是安卓還是蘋果系統(tǒng),都是以“圖標(biāo)”作為入口的,圖標(biāo)是重要的識別方式。所以,自從智能手機出現(xiàn)之后,網(wǎng)站的圖標(biāo)開始增多。
其三,受到APP設(shè)計的影響。一些公司需要APP、網(wǎng)站、小程序等端口設(shè)計保持一致,所以,網(wǎng)站的圖標(biāo)數(shù)量也就增多了。
網(wǎng)站圖標(biāo)數(shù)量統(tǒng)計
我們發(fā)現(xiàn),不同類型的網(wǎng)站,圖標(biāo)數(shù)量是存在巨大的差別的。我們對企業(yè)網(wǎng)站圖標(biāo)數(shù)量多少排列如下:
圖標(biāo)數(shù)量最多:商城類網(wǎng)站。通常來說,購物網(wǎng)站的圖標(biāo)數(shù)量比較多。我們分析認為,這其中有兩個原因。其一是簡單的圖標(biāo),可以引發(fā)購物的欲望;其二是模仿原因。一些一線電商平臺,都采用圖標(biāo)設(shè)計,而不是文字說明。
圖片數(shù)量次多:企業(yè)官網(wǎng)。企業(yè)官網(wǎng)的導(dǎo)航、產(chǎn)品詳情頁、交互等方面,也會使用圖標(biāo)。
圖片數(shù)量較少:資訊類網(wǎng)站。我們發(fā)現(xiàn),新聞類網(wǎng)站、資訊網(wǎng)站,圖標(biāo)數(shù)量較少。
網(wǎng)站圖標(biāo)設(shè)計原則
網(wǎng)站圖標(biāo)設(shè)計其實屬于“UI設(shè)計范疇”。而UI設(shè)計分為三個層次,一是擬物,簡單來說就是“能看明白”,看到了圖標(biāo),明白是什么意思;二是協(xié)調(diào)統(tǒng)一,不同圖標(biāo)其風(fēng)格、顏色、背景、明暗的統(tǒng)一;三是情感傳遞,通過交互,能夠產(chǎn)生較好的用戶體驗。
基于如上分析,我們來看看網(wǎng)站圖標(biāo)應(yīng)該如何設(shè)計?
第一,能看懂。即,圖標(biāo)可以準(zhǔn)確傳達內(nèi)容。做到這一點并不容易。以目前流行的“擬物化”圖標(biāo)設(shè)計為例,如果我們?yōu)?ldquo;直播”設(shè)計圖標(biāo),可以設(shè)計成一個攝像機或者電視的輪廓,這樣用戶基本能夠看得懂,但是如果設(shè)計成為“一個眼睛”的輪廓,則傳達的意思就比較模糊。
第二,要進化。圖標(biāo)需要根據(jù)消費趨勢和用戶群體進行變化。以電視圖標(biāo)為例,很多網(wǎng)站的電視圖標(biāo)是老式電視,但是對于完全沒有見過老式電視的00后來說,可能會讓其產(chǎn)生困惑。此時,就需要對圖標(biāo)進行更新和重新設(shè)計。
第三,要統(tǒng)一。如果是多個圖標(biāo),圖標(biāo)的高光、背景、形態(tài)、風(fēng)格要進行協(xié)調(diào)和統(tǒng)一,避免差異性太大導(dǎo)致的突兀。
第四,可說明。圖標(biāo)+文字說明,可以更清楚地闡釋想要表達的內(nèi)容,不能過于追求“極簡風(fēng)格”,而讓用戶看不明白。
如沒特殊注明,文章均為方維網(wǎng)絡(luò)原創(chuàng),轉(zhuǎn)載請注明來自http://pdcharm.com/news/5846.html