設(shè)計(jì)與開發(fā)之間本有一線界限，但當(dāng)時(shí)代步入又一個(gè)十年，這個(gè)線變得更加模糊甚至感覺不到它的存在。使用PS北京網(wǎng)站制作設(shè)計(jì)網(wǎng)頁(yè)版面，足矣？或許五年前是吧!現(xiàn) 在的互聯(lián)網(wǎng)用戶要求越來(lái)越多。沒有內(nèi)涵的華麗很快就會(huì)被丟棄。如果你追求華而不實(shí)的設(shè)計(jì)，那么相信你很快會(huì)被時(shí)代遺棄。2011年不再屬于單純的華麗而是 注重功能。新的一年或者未來(lái)十年的設(shè)計(jì)趨勢(shì)是響應(yīng)設(shè)計(jì)(responsive design)、持續(xù)聯(lián)系(constant connection)和虛擬現(xiàn)實(shí)(virtual reality)。

作為設(shè)計(jì)師，您在2011年有什么計(jì)劃？真正的設(shè)計(jì)師設(shè)計(jì)東西不是為了嘩眾取寵，而是要在藝術(shù)和功能上做到兩全其美。膚淺的欣賞容易得到，膚淺的設(shè)計(jì)容易忘記。一個(gè)優(yōu)秀的設(shè)計(jì)師就像一個(gè)造夢(mèng)者，為用戶創(chuàng)造一個(gè)夢(mèng)境，讓用戶感覺如此真實(shí)以至于不知道自己是在做夢(mèng)。這樣的夢(mèng)想需要幾個(gè)要素：出色的配色、直觀的設(shè)計(jì)、良好的交互性和快速的響應(yīng)速度。另外，永遠(yuǎn)不要低估簡(jiǎn)單的力量。 2011 年，您的設(shè)計(jì)不僅要考慮筆記本電腦和臺(tái)式機(jī)，還要考慮智能手機(jī)、上網(wǎng)本和平板電腦等設(shè)備。你都準(zhǔn)備好了嗎？

2011年網(wǎng)頁(yè)設(shè)計(jì)趨勢(shì)有哪些變化？讓我們關(guān)注11個(gè)網(wǎng)頁(yè)設(shè)計(jì)趨勢(shì)熱點(diǎn)：

1. 更多CSS3 + HTML5

這是期待已久的事情。在過(guò)去的幾年里，設(shè)計(jì)師們開始關(guān)注和使用CSS3+HTML5，但是2011年CSS3+HTML5將會(huì)得到更廣泛的應(yīng)用。網(wǎng)頁(yè)設(shè)計(jì)師最終會(huì)放棄Flash。 Flash不再是過(guò)去的王者，新技術(shù)（指CSS3+HTML5）將取而代之。 2011年，F(xiàn)lash退去，魔術(shù)師“HTML5”成為舞臺(tái)主角：

當(dāng)然，現(xiàn)在說(shuō)HTML5將取代Flash還為時(shí)過(guò)早。從上面兩張截圖可以知道Flash和HTML5還是有差距的。因此，在2011年，兩者都將保持各自的地位。不過(guò)在2010年之前，網(wǎng)頁(yè)設(shè)計(jì)師濫用Flash的現(xiàn)象會(huì)逐漸減少。如今，很少有設(shè)計(jì)師使用Flash 來(lái)設(shè)計(jì)整個(gè)網(wǎng)站。他們?cè)谝恍┛捎玫牡胤绞褂肏TML5 而不是Flash 來(lái)使網(wǎng)站更容易和更快。但是目前HTML5還不能替代Flash，F(xiàn)lash的一些效果HTML5暫時(shí)還不能實(shí)現(xiàn)。 （高端網(wǎng)站建設(shè)）

不過(guò)，最令人興奮的是，CSS3的應(yīng)用越來(lái)越廣泛，有些地方甚至超過(guò)了PS（Adobe說(shuō)它有雅麗），因?yàn)橛肅SS3實(shí)現(xiàn)文字陰影真的是輕而易舉的事，圖片圓角和圖片透明度。如果還沒有，是時(shí)候?qū)W習(xí)CSS3 和HTML5 了。

2. 簡(jiǎn)單的配色方案

沒有什么比純色背景更直觀和簡(jiǎn)潔的了。純色可以用多種方式表達(dá)。不要總是非黑即白，太弱了。考慮將綠色、黃色或紅色作為網(wǎng)頁(yè)的主要顏色。當(dāng)然，最好一直使用2或3種顏色。調(diào)整顏色的透明度可能會(huì)給您帶來(lái)意想不到的效果。

只是簡(jiǎn)單的綠色，具有設(shè)計(jì)如此漂亮的Twitter 可視化工具的不透明度。你應(yīng)該知道：這個(gè)網(wǎng)頁(yè)只使用了XHTML/CSS 和Javascript，試試吧！

紅色絕對(duì)是經(jīng)典，如果配色做得好，視覺沖擊力會(huì)更上一層樓。

3、移動(dòng)互聯(lián)網(wǎng)時(shí)代來(lái)臨

智能手機(jī)、ipad 和上網(wǎng)本無(wú)處不在，天哪，2011 年現(xiàn)在將更加明顯。這意味著您的設(shè)計(jì)需要考慮更多的設(shè)備。

創(chuàng)建一個(gè)適合移動(dòng)設(shè)備的網(wǎng)站并不是簡(jiǎn)單地剝離花哨元素的原始設(shè)計(jì)，那將是一個(gè)沒有靈魂的設(shè)計(jì)。雖然在最初的設(shè)計(jì)基礎(chǔ)上設(shè)計(jì)一個(gè)適合移動(dòng)設(shè)備的網(wǎng)站是一件痛苦的事情。幸運(yùn)

　　在使用CSS3的情況下，設(shè)計(jì)移動(dòng)網(wǎng)頁(yè)方便多了。最重要的是你可以修改一個(gè)CSS文件完成整個(gè)網(wǎng)站修改以符合用戶使用不同設(shè)備進(jìn)行瀏覽網(wǎng)頁(yè)。

　　你也可以設(shè)計(jì)一個(gè)移動(dòng)設(shè)備專屬的網(wǎng)站，但相信那個(gè)網(wǎng)站不久還是要改版的，以現(xiàn)在科技產(chǎn)品的發(fā)展速度來(lái)看。越來(lái)越多的移動(dòng)網(wǎng)站包括原始網(wǎng)站的瀏覽選 項(xiàng)。如果你不提供這個(gè)選項(xiàng)或者你的原始網(wǎng)站沒有針對(duì)移動(dòng)網(wǎng)絡(luò)標(biāo)準(zhǔn)優(yōu)化，那你并未準(zhǔn)備好迎接移動(dòng)互聯(lián)網(wǎng)時(shí)代的到來(lái)。據(jù)相關(guān)預(yù)測(cè)，智能手機(jī)銷量將會(huì)超越個(gè)人 PC。趕快準(zhǔn)備好，迎接移動(dòng)設(shè)備大軍的來(lái)臨。
4. Parallax Scrolling

　　先來(lái)解釋下Parallax Scrolling，Parallax scrolling 是讓多層背景以不同的速度移動(dòng)，形成運(yùn)動(dòng)視差 3D 效果，雖然純屬視覺效果，但在內(nèi)容滾動(dòng)時(shí)形成的視覺體驗(yàn)仍然非常出色。2011年的網(wǎng)頁(yè)設(shè)計(jì)趨勢(shì)熱點(diǎn)就是要?jiǎng)?chuàng)造這樣的深度視覺效果。Parallax Scrolling可以通過(guò)一些簡(jiǎn)單的CSS技巧或jQuery插件來(lái)實(shí)現(xiàn)(示范站點(diǎn)：站點(diǎn)1 站點(diǎn)2)。Parallax scrolling運(yùn)用于網(wǎng)頁(yè)設(shè)計(jì)的次要元素中可以起到很好的效果：如header、footer或者背景。不過(guò)最好不要運(yùn)用于網(wǎng)站導(dǎo)航，那顯得有點(diǎn)不倫不類。

　　Old Pulteney Row to the Pole 在網(wǎng)站背景使用了Parallax Scrolling特效，打開該網(wǎng)站然后往下拉即可看到效果。

　　5. 設(shè)計(jì)需考慮更多的觸屏設(shè)備

　　觸屏技術(shù)應(yīng)用越來(lái)越廣泛，觸屏設(shè)備隨處可見。這意味著，你的導(dǎo)航設(shè)計(jì)不再只是鼠標(biāo)導(dǎo)航，你必須要要考慮你的設(shè)計(jì)適合觸屏設(shè)備。請(qǐng)問(wèn)你的設(shè)計(jì)做到指尖導(dǎo)航了嗎?

　　作為設(shè)計(jì)師，我們更喜歡鼠標(biāo)。當(dāng)鼠標(biāo)懸停的時(shí)候鏈接會(huì)變得高亮，然而觸屏沒有所謂的懸停。你將會(huì)在設(shè)計(jì)中如何向觸屏設(shè)備訪客展示鏈接?

　　同樣，如何才能做到方便你的游客仔細(xì)閱讀您的網(wǎng)站?這可能在瀏覽器標(biāo)準(zhǔn)上存在爭(zhēng)議，或者水平滾動(dòng)觸屏可能更加合適。將網(wǎng)站設(shè)計(jì)類似于雜志的布局更有利于游客瀏覽你的網(wǎng)站。

　　最后，你必須考慮在你的網(wǎng)頁(yè)設(shè)計(jì)中使用流體布局(liquid layouts)。2011年，你需要處理的重點(diǎn)不再是屏幕分辨率問(wèn)題，而是如何做到使訪客從垂直到水平閱讀你的網(wǎng)站都會(huì)清晰。你的設(shè)計(jì)必須做到靈活以應(yīng)付任何的挑戰(zhàn)。否則你將會(huì)成為過(guò)去式。

6. 深度判析

　　深度判析是關(guān)于在網(wǎng)頁(yè)設(shè)計(jì)使用維數(shù)，這樣可以使你的網(wǎng)頁(yè)變得更加真實(shí)。如果運(yùn)用得恰當(dāng)，那將會(huì)是一個(gè)虛擬的3D效果，就像3D電影阿凡達(dá)那樣。盡管3D技術(shù)還沒有去到網(wǎng)站設(shè)計(jì)，你仍然嘗試使用維數(shù)進(jìn)行設(shè)計(jì)。

　　Plántate提供了一個(gè)可旋轉(zhuǎn)的3D地球，靈活利用陰影和層等手段。

　　Jordon活動(dòng)頁(yè)，3D元素清晰簡(jiǎn)單，設(shè)計(jì)非常醒目。(貌似已經(jīng)撤掉)
7. 大背景圖

　　大背景圖的網(wǎng)頁(yè)設(shè)計(jì)應(yīng)用在2011年將會(huì)更加明顯。這些背景圖像一般是高分辨率，覆蓋這個(gè)網(wǎng)站。高清照片是一個(gè)迅速抓住你的讀者的好方式，可以產(chǎn)生極具沖擊力的視覺效果-游客的視線會(huì)不自覺地落在寬大的背景上。

　　當(dāng)然背景圖的色彩、內(nèi)容等都十分講究，任何情況下都不要破壞用戶的體驗(yàn)，不然再漂亮的照片也是枉然。圖片類型趨向于一些比較柔和、略帶透明的一類，不要影響到網(wǎng)站文字的閱讀，講究協(xié)調(diào)，易于閱讀。

　　上面的網(wǎng)站使用了高分辨率的圖片作為網(wǎng)站的背景，網(wǎng)站主色調(diào)是黃色。

　　This site adds playful animation with its grand scale imagery. Warning: auto-play music.
8. 不拘謹(jǐn)于頂級(jí)域名

　　嚴(yán)格意義上這一點(diǎn)與網(wǎng)頁(yè)設(shè)計(jì)無(wú)關(guān)，但這一點(diǎn)也是發(fā)展的趨勢(shì)，將出現(xiàn)更多創(chuàng)造性的域名。.com域名的吸引力越來(lái)越少，主要是你很難再找到一個(gè)比較短 的.com域名。2011年人們開始將視線慢慢轉(zhuǎn)移到.me、.co和.cc等身上。想想域名的發(fā)展，搶先一步，不然你很可能再次錯(cuò)失先機(jī)。

　　.me 用在個(gè)人展品陳列頁(yè)、博客是非常不錯(cuò)的。

　　另一個(gè).me域名的示范
9. QR: Quick Response

　　如果你注意現(xiàn)在越來(lái)越多的名片、雜志或者其他地方出現(xiàn)方形條形碼，證明你已經(jīng)看到2011年的這個(gè)趨勢(shì)熱門。但它跟網(wǎng)頁(yè)設(shè)計(jì)何干呢?實(shí)在匪夷所思。

　　這個(gè)方形的條形碼被稱為QR，全稱為Quick Response(在“QR Code讀取器QuickMark” 介紹過(guò))。使用你的手機(jī)拍攝一張唯一的條形碼的照片，像魔術(shù)一樣，手機(jī)上讀取QR的軟件就會(huì)打開條形碼相關(guān)的網(wǎng)站。最美妙的事情是你可以將QR應(yīng)用到很多 地方。應(yīng)用QR到你的網(wǎng)站，目的是讓瀏覽者擁有一個(gè)你的移動(dòng)網(wǎng)頁(yè)的快捷方式。你還可以通過(guò)在您的網(wǎng)址上放置一個(gè)特殊的推介代碼QR追蹤你的訪客。 哈哈，你完全可以使用QR作為你的頭像，然后到別人的網(wǎng)站留言、評(píng)論。2011年的移動(dòng)媒體優(yōu)勢(shì)更加凸顯，而利用這點(diǎn)優(yōu)勢(shì)的網(wǎng)頁(yè)設(shè)計(jì)是最明智的選擇也是將 來(lái)的發(fā)展趨勢(shì)。

　　上面是軟礦博客的QR . 如果你也想創(chuàng)建一個(gè)，猛點(diǎn)擊這里 .

　　10.縮略圖設(shè)計(jì)(Thumbnail Design)

　　Google已經(jīng)向?yàn)g覽用戶推出它們的瀏覽預(yù)覽技術(shù)。過(guò)去我們只能通過(guò)點(diǎn)擊鏈接才能看到網(wǎng)頁(yè)的內(nèi)容，現(xiàn)在你只需點(diǎn)擊放大鏡然后將鼠標(biāo)懸停在鏈接上就可以預(yù)覽該鏈接的網(wǎng)頁(yè)內(nèi)容。

　　如果你的設(shè)計(jì)是基于Flash，會(huì)存在這樣的一個(gè)問(wèn)題，預(yù)覽將無(wú)法顯示你的設(shè)計(jì)元素。

　　2011年的一般互聯(lián)網(wǎng)用戶變得更加精明，他們更希望看到更多人性化的導(dǎo)航設(shè)計(jì)。

?

我們專注高端建站，小程序開發(fā)、軟件系統(tǒng)定制開發(fā)、BUG修復(fù)、物聯(lián)網(wǎng)開發(fā)、各類API接口對(duì)接開發(fā)等。十余年開發(fā)經(jīng)驗(yàn)，每一個(gè)項(xiàng)目承諾做到滿意為止，多一次對(duì)比，一定讓您多一份收獲！