淺談網(wǎng)頁(yè)設(shè)計(jì)的細(xì)節(jié)創(chuàng)造價(jià)值(一)
2011-09-03 文章來(lái)源: 和君設(shè)計(jì)
細(xì)節(jié)使得這個(gè)世界從平凡變得不平凡。
一輛豪華汽車(chē)與傳統(tǒng)汽車(chē)擁有同樣數(shù)量的車(chē)輪、座位、門(mén)窗,但是使得它在競(jìng)爭(zhēng)中脫穎而出的卻是花費(fèi)在細(xì)節(jié)上的時(shí)間。加熱真皮座椅,一按即啟動(dòng)引擎,無(wú)鑰車(chē)門(mén)開(kāi)關(guān),自動(dòng)泊車(chē)系統(tǒng),豐富的數(shù)字電臺(tái)等等使得它成為一輛昂貴的新型車(chē)。
同樣的規(guī)則也適用于網(wǎng)頁(yè)設(shè)計(jì)。愿意花費(fèi)時(shí)間專(zhuān)注于細(xì)節(jié)的網(wǎng)頁(yè)設(shè)計(jì)師能夠獲得擁有更多價(jià)值的設(shè)計(jì)。這里的關(guān)鍵詞就是價(jià)值。我們無(wú)法保證建立網(wǎng)站所花費(fèi)的時(shí)間和其結(jié)果所帶來(lái)的價(jià)值之間有直接的關(guān)系,總有一些細(xì)節(jié)比其他更加重要,關(guān)鍵是要能夠確定哪些細(xì)節(jié)更具有影響力。
增加價(jià)值的細(xì)節(jié)
這一類(lèi)型的細(xì)節(jié)是我們?cè)敢庠趯徝缹用嬷饣ㄙM(fèi)額外時(shí)間以改進(jìn)我們工作的細(xì)節(jié)。我們希望專(zhuān)注于可以深入改變用戶(hù)體驗(yàn)的視覺(jué)調(diào)整,例如用戶(hù)對(duì)該網(wǎng)站的主題和消息的體驗(yàn)或者他們?nèi)绾螘秤尉W(wǎng)站。
一般的沒(méi)有建站經(jīng)驗(yàn)的網(wǎng)站訪(fǎng)問(wèn)者,無(wú)法指出某些細(xì)微差別來(lái)的用戶(hù)體驗(yàn)改善,但是如果這些細(xì)節(jié)被移除,用戶(hù)將在感知和可用性方面感覺(jué)到明顯的差異。這些就是我們?cè)敢饣ㄙM(fèi)時(shí)間的細(xì)節(jié)。
那么一個(gè)設(shè)計(jì)細(xì)節(jié)到底如何為網(wǎng)站帶來(lái)附加價(jià)值呢?訣竅就在于用戶(hù)體驗(yàn)。網(wǎng)站設(shè)計(jì)師應(yīng)該能夠出色的理解負(fù)空間、對(duì)比度、形狀、顏色和所有不同的視覺(jué)元素在用戶(hù)使用和體驗(yàn)一個(gè)網(wǎng)站設(shè)計(jì)時(shí)所起的作用。真正令人驚訝的是設(shè)計(jì)者僅僅需要操縱幾個(gè)像素就可以發(fā)生很大的差異,使之產(chǎn)生更大的影響。
這些差異到底是什么?
進(jìn)一步觀察
我覺(jué)得Photoshop最令人舒服的是當(dāng)我將圖片放大到500%甚至更大時(shí),它看上去就像在家一樣舒服。我們來(lái)仔細(xì)研究一些相當(dāng)成功的用細(xì)微細(xì)節(jié)引導(dǎo)用戶(hù)體驗(yàn)方面圖片吧。
以Concentrate 網(wǎng)站為例,它看起來(lái)很適合我們初次集中精力來(lái)欣賞。從一個(gè)高層次的視角開(kāi)始,我們可以看到Concentrate網(wǎng)站的使用了一個(gè)富有創(chuàng)意視覺(jué)技巧。
除了這罐橙汁,我們看到一個(gè)橙色為主題的調(diào)色板和背景,很好的模擬了真實(shí)的橙子的果肉口感。進(jìn)一步研究,我們發(fā)現(xiàn)它使用了CSS3為文本增加一些陰影來(lái)增加與背景的對(duì)比。為了真正的欣賞細(xì)節(jié),我們需要在進(jìn)一步的研究。