[原文地址：http://www.webdesignfromscratch.com/web-2.0-design-style-guide.cfm]
我使用“ Web 2.0設(shè)計(jì)”來(lái)形容目前占主導(dǎo)優(yōu)勢(shì)的網(wǎng)頁(yè)設(shè)計(jì)風(fēng)格， 很多人用這個(gè)詞來(lái)形容：
- 網(wǎng)絡(luò)經(jīng)濟(jì)的復(fù)蘇
- 網(wǎng)站和用戶(hù)之間更高水平的交互
- 或一種社會(huì)想象，由新型的網(wǎng)上社區(qū)和社會(huì)網(wǎng)絡(luò)而形成
Web2.0 式網(wǎng)頁(yè)先睹為快
如果您沒(méi)有足夠的資源創(chuàng)建自己的2.0式的網(wǎng)站，TemplateMonster 剛發(fā)布的web2.0模版頻道可以幫到你。當(dāng)然，購(gòu)買(mǎi)的模版不一定能完美的契合你的目標(biāo)，但是為用戶(hù)定制的設(shè)計(jì)也常常不能保證。
簡(jiǎn)介
我將帶你過(guò)一下目前優(yōu)秀的網(wǎng)頁(yè)設(shè)計(jì)特征，仔細(xì)分析最突出的特色，講解每個(gè)點(diǎn)優(yōu)秀的原因，并向你展示如何將他們使用在你自己的網(wǎng)站上。
如果讓我用一個(gè)詞來(lái)總結(jié)web2.0，那將是“簡(jiǎn)單”，那我們就從這開(kāi)始說(shuō)起。
我是簡(jiǎn)單的極力支持者，我認(rèn)為它是網(wǎng)頁(yè)設(shè)計(jì)未來(lái)的方向。目前簡(jiǎn)單、大膽、優(yōu)雅的網(wǎng)頁(yè)設(shè)計(jì)用少來(lái)傳遞更多：
- 通過(guò)引導(dǎo)用戶(hù)視線只瀏覽少量但精心選擇的視覺(jué)元素，使設(shè)計(jì)師能直接瞄準(zhǔn)網(wǎng)站的目標(biāo)
- 它們用更少的語(yǔ)言來(lái)表達(dá)更多信息，同時(shí)精心選擇的圖片設(shè)計(jì)去創(chuàng)造看的欲望
- 它們認(rèn)為，我們能猜測(cè)用戶(hù)期望從網(wǎng)站得到什么
一、簡(jiǎn)單
網(wǎng)頁(yè)設(shè)計(jì)比起以前風(fēng)格更簡(jiǎn)單，這是一件好事。
2.0風(fēng)格設(shè)計(jì)代表著聚焦、干凈和簡(jiǎn)單，但那并不代表著要極簡(jiǎn)主義，我們應(yīng)該用少量但必需的元素去達(dá)到我們的目標(biāo)； 有個(gè)原則是我一直堅(jiān)持的：假如解決某個(gè)問(wèn)題有兩種方案，那么更簡(jiǎn)單的就是更好的。
這里有一些例子，注意他們把不必要的元素都剔除了，也許每個(gè)頁(yè)面都可以有更多的元素，但是那樣能使頁(yè)面變得更強(qiáng)大嗎？
結(jié)果你會(huì)感覺(jué)不由自主地去看主體內(nèi)容，你發(fā)現(xiàn)自己與頁(yè)面的元素互動(dòng)正是設(shè)計(jì)師所希望的，而且你并不介意這種簡(jiǎn)單，同時(shí)又達(dá)到了你的目的。
為什么簡(jiǎn)單更好
·網(wǎng)站和每個(gè)頁(yè)面都有目標(biāo)
·用戶(hù)的注意點(diǎn)是有限的資源
·幫助用戶(hù)找到他們想要的（或讓用戶(hù)注意我們希望他們看的內(nèi)容）是設(shè)計(jì)師的職責(zé)
·屏幕上的元素吸引眼球，元素越多，用戶(hù)去關(guān)注的各種不同的事情就越多，同時(shí)他去關(guān)注重要內(nèi)容的幾率就下降了
·所以我們需要很確定的交流方式，也需要把信息噪音減少到最少，那代表著我們要找到一個(gè)盡可能少用元素的解決方案，那就是節(jié)約元素即簡(jiǎn)單
何時(shí)/如何讓你的設(shè)計(jì)簡(jiǎn)單
1、何時(shí) 始終如此
2、如何做 有兩個(gè)方面能讓你成功做到簡(jiǎn)單
1）在不影響效果的情況下，去掉多余的元素
2）能達(dá)到同樣效果的可行方案中，選擇更簡(jiǎn)單的
看起來(lái)達(dá)到完美的結(jié)果，不是沒(méi)有東西可再添加，而是沒(méi)有任何東西可被去除的時(shí)候，每當(dāng)你設(shè)計(jì)的時(shí)候，有意識(shí)的把去除多余的視覺(jué)元素作為準(zhǔn)則。
不要把注意力特別集中在和頁(yè)面目標(biāo)相關(guān)性比較小的區(qū)域，因?yàn)橛脩?hù)視線在關(guān)注這些時(shí)會(huì)分散在主要內(nèi)容和導(dǎo)航的注意力。利用視覺(jué)細(xì)節(jié)如線條、文字、形狀和顏色去傳達(dá)信息，而不僅僅是為了裝飾。
這里有個(gè)設(shè)計(jì)的例子，由于不夠簡(jiǎn)單而深受其害：
Yaxay 的界面用了很多像素，但是大多數(shù)都是修飾性的，一部分是頁(yè)面的背景。相對(duì)少的像素被用來(lái)讓用戶(hù)找到或理解信息或被站點(diǎn)吸引。
想想這個(gè)頁(yè)面看上去東西可真多啊，但是能使真正的導(dǎo)航、內(nèi)容和交互特征清晰的元素實(shí)在太少了。
愛(ài)德華?托佛特用“數(shù)據(jù)墨水”（如可以傳遞信息的細(xì)節(jié)）和“非數(shù)據(jù)墨水”（如只是修飾的細(xì)節(jié)）來(lái)形容這一現(xiàn)象。
托佛特的衡量信息設(shè)計(jì)（圖形，圖表，演示等）有效性的一種標(biāo)準(zhǔn)是數(shù)據(jù)墨水和非數(shù)據(jù)墨水的使用比例，數(shù)據(jù)墨水使用的比例越高，設(shè)計(jì)的有效性可能就越高。
以Yaxay第二幅的細(xì)節(jié)圖為例，它有太多被稱(chēng)為“繁忙”的元素，比如大量的邊緣、色調(diào)、顏色變化、形狀、線條……很多要看的元素，但是在這個(gè)細(xì)節(jié)真正有用的是：
- 網(wǎng)站的logo
- 導(dǎo)航按鈕上的標(biāo)簽文字：art gallery
剩余的其他“繁忙”元素：背景上的形狀、界面上的斜線、網(wǎng)格、漸變……所有這些噪音都是非數(shù)據(jù)墨水，因?yàn)樗鼈兌疾荒軅鬟_(dá)信息。
我并不反對(duì)網(wǎng)站設(shè)計(jì)的豐富、復(fù)雜或美感性
簡(jiǎn)單的意思：無(wú)論采用什么方式，只要是為了讓信息傳達(dá)更順利的元素是越多越好，當(dāng)然，通常你要傳達(dá)的不是硬數(shù)據(jù)，而是軟數(shù)據(jù)；
硬數(shù)據(jù)：指事實(shí)，如新聞、股票價(jià)格、列車(chē)時(shí)間或你銀行賬戶(hù)的存款……
軟數(shù)據(jù)：涉及信息傳達(dá)的質(zhì)量，如公司給人的第一印象，服務(wù)提供者是否親切，一種產(chǎn)品是否適合你……這些都是同樣重要的。
無(wú)論你要傳達(dá)的是硬數(shù)據(jù)還是軟數(shù)據(jù)，你都應(yīng)該有意識(shí)并謹(jǐn)慎的使用元素?cái)?shù)量。
以下圖為例：
Alex Dukal的站點(diǎn)很豐富、有趣、吸引人，它用了一系列視覺(jué)技巧來(lái)引起你注意，讓你感覺(jué)有趣，對(duì)Alex的工作給你一種溫暖的感覺(jué)。但是它也是簡(jiǎn)單的，因?yàn)樗?jǐn)慎而敏感的使用像素、墨水或繁忙元素，它并非是沒(méi)必要的，而是節(jié)儉而豐富的。
無(wú)論怎么說(shuō)，當(dāng)你使用墨水、像素時(shí)要明智的選擇，用它來(lái)傳達(dá)首要的信息，同時(shí)，問(wèn)問(wèn)自己用少量的元素能否有效的傳達(dá)信息，如果可以，就這樣做。[未完待續(xù)……]
第一次翻譯專(zhuān)業(yè)性文章，有不得到之處歡迎指正：）
粵公網(wǎng)安備 44010402000282號(hào)