本文將揭秘網(wǎng)站設(shè)計(jì)的10條錦囊妙計(jì)。
1.?視覺(jué)上”一語(yǔ)雙關(guān)”
我最喜歡的一些網(wǎng)站在視覺(jué)設(shè)計(jì)上”一語(yǔ)雙關(guān)”,將兩張圖片、兩張意象巧妙結(jié)合,合二為一。
WinePlace?的網(wǎng)站就是一個(gè)絕佳的案例
這個(gè)網(wǎng)站看起來(lái)像圖釘,暗喻著”定位”,又像一個(gè)顛倒的酒杯。這種聰明的設(shè)計(jì)讓人感覺(jué)印象深刻??吹竭@種”小聰明”設(shè)計(jì),瀏覽者肯定會(huì)會(huì)心一笑。
下面這個(gè)網(wǎng)站選自?fifty?fantastically?clever?網(wǎng)站s,有興趣的可以看看,你是否也喜歡這種網(wǎng)站設(shè)計(jì)呢?
?
2.用色上嚴(yán)格把關(guān)
配色太重要了,這可不僅僅是表面文章,色彩能夠影響情緒,色彩關(guān)乎到網(wǎng)站的意義,以及網(wǎng)站傳達(dá)的理念。有的時(shí)候客戶會(huì)限定使用的顏色,而有的時(shí)候允許你自由探索。我特別喜歡下面的這個(gè)Zion?網(wǎng)站
通過(guò)配色,吸引你的注意,然后將自己帶入這片風(fēng)景中,美妙的插畫(huà)給予瀏覽者更多的體驗(yàn)。我記得有句話是”好的網(wǎng)站設(shè)計(jì)是多功能的,即使是灰度模式也極具功能性”
永遠(yuǎn)要注意到網(wǎng)站的用途以及目的。合理采用不同的演示版本。
3.?避免陳詞濫調(diào)
不久之前,一些新的風(fēng)格在網(wǎng)站設(shè)計(jì)界開(kāi)始流行。我喜歡研究設(shè)計(jì)趨勢(shì)表象的背后,我喜歡跟進(jìn)流行保持與時(shí)俱進(jìn),但是大家都做流行,大家都一樣,這就有點(diǎn)千篇一律、陳詞濫調(diào)、毫無(wú)創(chuàng)新了。
國(guó)外極度流行的”Hipster”風(fēng)網(wǎng)站設(shè)計(jì)。
上圖的這個(gè)原型在網(wǎng)站設(shè)計(jì)中一遍又一遍的被模仿,我覺(jué)得馬上就要不流行了。
為什么要跟風(fēng)呢?為什么就不能自己開(kāi)創(chuàng)一個(gè)風(fēng)潮、時(shí)代呢?為什么別人干什么你就干什么呢?
本人有一篇文章講述的就是網(wǎng)站設(shè)計(jì)中的跟風(fēng)現(xiàn)象——?網(wǎng)站?design?clich?s,設(shè)計(jì)的東西要有靈感,設(shè)計(jì)不等于生產(chǎn),設(shè)計(jì)是創(chuàng)意,別跟風(fēng)!
4.個(gè)性化一點(diǎn)
這一條跟上一條其實(shí)差不多,不跟風(fēng)之后,就要考慮個(gè)性化問(wèn)題了。
設(shè)計(jì)必須具備某種獨(dú)一無(wú)二的辨識(shí)度。看看印象筆記的網(wǎng)站吧
實(shí)際上就是一個(gè)象頭,看起來(lái)沒(méi)什么了不起。然而卷曲的象鼻,以及代表翻頁(yè)的象耳讓此網(wǎng)站極富個(gè)性化。
設(shè)計(jì)網(wǎng)站一定要保持設(shè)計(jì)獨(dú)一無(wú)二。你還能找出其他類似的嗎?因此你的設(shè)計(jì)一定要如此。在定型之前多想幾種方案,頭腦風(fēng)暴,然后畫(huà)在草圖紙上,再進(jìn)行選擇。
5.?人人都愛(ài)定制化
字體設(shè)計(jì)的定制感特別強(qiáng),讓人感覺(jué)獨(dú)一無(wú)二。
說(shuō)是網(wǎng)站設(shè)計(jì),但是字體設(shè)計(jì)占了不少份額,我們需要花心思去挑選字體或者去設(shè)計(jì)字體。如果有人支付你錢去”設(shè)計(jì)”網(wǎng)站,那么字體上下點(diǎn)功夫吧。
定制化設(shè)計(jì)會(huì)讓你的網(wǎng)站獨(dú)一無(wú)二。無(wú)良設(shè)計(jì)師雖然可以拷貝你的作品,但是他們永遠(yuǎn)無(wú)法掌握你的技藝和創(chuàng)意!
比如說(shuō)可口可樂(lè)的網(wǎng)站設(shè)計(jì),就以字體為主。
你看,有人就這么抄,但是永遠(yuǎn)沒(méi)有可口可樂(lè)那么出名。?
6.KISS(Keep?it?Simple?Stupid)原則
有的時(shí)候,網(wǎng)站設(shè)計(jì)不必太注重美感,太過(guò)度在意字體。簡(jiǎn)約就是美,極度簡(jiǎn)約能夠打造出一種純凈、令人敬仰的品牌網(wǎng)站
Kiss原則講的就是這個(gè)道理,保持簡(jiǎn)約,保持明了??纯聪旅娴倪@兩個(gè)圖標(biāo)式的網(wǎng)站,一直都是這么出眾。
而不得不提蘋(píng)果的網(wǎng)站,一個(gè)咬痕讓人記憶猶新
如果像上面那么設(shè)計(jì),就毫無(wú)設(shè)計(jì)感了。
咬痕將網(wǎng)站提升到新的高度,讓整個(gè)設(shè)計(jì)更有深度。
多想想,再想想,怎么讓你的網(wǎng)站變得獨(dú)一無(wú)二。
7.?比例與對(duì)稱
比例,對(duì)稱,這是要大講特講的話題??纯碩witter的新網(wǎng)站解析吧。
這些圓不是什么宇宙怪談,是設(shè)計(jì)的指導(dǎo),是用來(lái)平衡網(wǎng)站比例美感的工具。
我們?cè)賮?lái)看看蘋(píng)果那驚世駭俗的一”咬”。很明顯蘋(píng)果在設(shè)計(jì)網(wǎng)站時(shí)也考慮到了比例和對(duì)稱問(wèn)題。
8.?留白
FedEx就是絕佳展示,利用留白,打造了一語(yǔ)雙關(guān)的效果。
還沒(méi)看見(jiàn)嗎?好吧你再看會(huì)兒吧。
我終于忍不住揭曉謎底了,仔細(xì)看Ex之間的白色區(qū)塊,是不是有個(gè)箭頭?很多人看到FedEx的快遞卡車來(lái)來(lái)往往,但是很少人能注意到這個(gè)箭頭。
網(wǎng)站pond巧妙利用留白,既像牛角,又像酒杯。
9.?消極與積極
網(wǎng)站設(shè)計(jì)中還有一點(diǎn)比較重要,那就是網(wǎng)站要具備一種積極的象征意義。唉,詞不達(dá)意,準(zhǔn)確的說(shuō)是網(wǎng)站要讓人看了積極向上、心情不壓抑。
看看Twitter早期網(wǎng)站吧,低頭鳥(niǎo),毫無(wú)自信,又怎么能飛的起來(lái)呢?
這幾代的twitter的網(wǎng)站,昂首挺胸,一鳴驚人。
這副網(wǎng)站不光是馬林魚(yú),還有一種勝利者遨游的凱旋姿態(tài)。
這個(gè)設(shè)計(jì)將原本毫無(wú)生氣的物體轉(zhuǎn)變?yōu)榛盍λ纳涞摹?纯雌渲刑N(yùn)藏的情緒吧。
10.?為網(wǎng)站講一個(gè)故事
每個(gè)優(yōu)秀的網(wǎng)站設(shè)計(jì)必有其故事。并不只是簡(jiǎn)簡(jiǎn)單單的草圖繪制,然后定型,優(yōu)秀的網(wǎng)站蘊(yùn)意深刻,明喻暗喻均有。比如上面的FedEx的箭頭就代表著追求”便捷高速”的服務(wù)品質(zhì)。蘋(píng)果的網(wǎng)站將”咬”(byte=咬=字節(jié))發(fā)揚(yáng)光大,而Twitter那種翱翔天空的姿態(tài)。
“有深度的設(shè)計(jì)師,能夠向客戶展示網(wǎng)站設(shè)計(jì)中的意義和暗喻”
雖然有的時(shí)候網(wǎng)站已經(jīng)設(shè)計(jì)完了,再去進(jìn)行意象表達(dá)來(lái)不及了。不過(guò)亡羊補(bǔ)牢為時(shí)未晚,可以再審視以便你的設(shè)計(jì),看看其中還有沒(méi)有什么閃光點(diǎn)可以進(jìn)行”放大”?
如果你的意義夠深刻,夠貼題,那么客戶會(huì)很愉快的接受你的設(shè)計(jì)。
本文作者來(lái)自北京網(wǎng)站建設(shè)公司-傳誠(chéng)信,轉(zhuǎn)載請(qǐng)注明出處!