- 作(zuò)者:admin
- 發表時(shí)間(jiān):2013-07-02 14:17:18
- 來(lái)源:未知
2013年Web設計(jì)趨勢:CSS3+HTML5居首位
在設計(jì)和(hé)編程之間(jiān)隻有(yǒu)薄薄的一線,當我們進入新的十年時(shí),這條線變得(de)越來(lái)越模糊。在Photoshop上(shàng)繪制(zhì)漂亮的模型就夠了嗎?5年以前也許如此。在今天,普通(tōng)的網絡用戶要求的更多(duō)。所有(yǒu)的東西都很(hěn)漂亮,但(dàn)沒有(yǒu)實質內(nèi)容,過段時(shí)間(jiān)人(rén)們就會(huì)厭煩。如果你(nǐ)唯一的目标是用你(nǐ)漂亮的設計(jì)影(yǐng)響圈內(nèi)其他設計(jì)師(shī),你(nǐ)會(huì)發現你(nǐ)很(hěn)快就落伍了。2013年不關心漂亮,而是關心功能。新的一年甚至十年的趨勢是交互設計(jì)、粘度和(hé)虛拟現實。
2013年你(nǐ)會(huì)如何設計(jì)呢?設計(jì)師(shī)的最終目标是留住用戶,而不是讓人(rén)炫目。所有(yǒu)得(de)到驚訝聲和(hé)贊歎聲的設計(jì)師(shī)都很(hěn)容易被忘記。高(gāo)超的設計(jì)師(shī)可(kě)以創造出一種環境,吸引并迷住用戶到不想點擊"返回"按鈕的地步。幾個(gè)元素彙聚在一起,組成一個(gè)奇妙的幻境:和(hé)諧的色彩主題、直觀的設計(jì)、易用的信息和(hé)快速的反應。另外,永遠不要低(dī)估簡潔的力量。當然,情況一直如此,但(dàn)在2013年,你(nǐ)将不再僅針對電(diàn)腦(nǎo)桌面和(hé)筆記本,還(hái)要為(wèi)智能手機、上(shàng)網本、Tablet等等設計(jì)。你(nǐ)準備好了嗎?
1、更多(duō)的CSS3+HTML5
多(duō)麽令人(rén)滿意啊!在過去幾年裏,CSS3和(hé)HTML5隻出現在網頁設計(jì)那(nà)遙遠的地平線上(shàng)。但(dàn)現在,在2013年,我們看到了它的爆發。設計(jì)師(shī)們終于開(kāi)始讓Flash走開(kāi)。你(nǐ)可(kě)能感覺到,Flash和(hé)一些(xiē)對你(nǐ)當前和(hé)潛在用戶有(yǒu)用的最新最熱技(jì)術(shù),配合的不是很(hěn)好。在2013年,你(nǐ)會(huì)慢慢遠離Flash,擁抱被稱為(wèi)HTML5的魔術(shù)。看看這組驚人(rén)相似的比較:
現在已經顯示,Flash和(hé)HTML5是不相等的對手。在2013年兩者都有(yǒu)大(dà)量的應用空(kōng)間(jiān)。問題是設計(jì)師(shī)們在2010年(和(hé)之前)濫用了Flash。舉一個(gè)例子,很(hěn)少(shǎo)整個(gè)網站(zhàn)由Flash組成,特别是這些(xiē)日子。HTML5減輕了Flash的一些(xiē)負擔。不過,HTML5還(hái)不能完全取代我們由Flash實現的那(nà)些(xiē)非凡的設計(jì)元素。
也許更讓人(rén)興奮的是,CSS3在今年可(kě)以投入使用了。移開(kāi)Photoshop(哇,Adobe還(hái)是不能休息),CSS3可(kě)以更快實現文本陰影(yǐng)、圓角邊框和(hé)背景透明(míng)。如果你(nǐ)還(hái)沒有(yǒu)開(kāi)始,現在就開(kāi)始鑽研了解CSS3和(hé)HTML5吧(ba)。
2、簡潔的配色方案
簡潔。沒有(yǒu)什麽比在安靜的背景上(shàng)顯示清晰的消息更安靜了。安靜可(kě)以被解讀為(wèi)幾種不同的方式。忘掉黑(hēi)白和(hé)灰度陰影(yǐng),想想綠色、黃色或甚至紅色作(zuò)為(wèi)你(nǐ)的主色調。不過,限制(zhì)你(nǐ)的調色闆隻有(yǒu)兩或三種顔色,試試各種顔色不同的灰度。用少(shǎo)量顔色表現信息是非常了不起的。觀察一下:
綠色陰影(yǐng)創造了這個(gè)Twitter可(kě)視(shì)的工具。邊注:這個(gè)網站(zhàn)是用XHTML/CSS和(hé)Javascript創建的。
如果做(zuò)的不好,紅色很(hěn)容易産生(shēng)沖突。這個(gè)網站(zhàn)用高(gāo)對比的易讀文字克服了紅色本來(lái)的特性。
3、适用于手機
智能手機、iPad、上(shàng)網本,哦天哪!一個(gè)令人(rén)眼花(huā)缭亂的手機産量在2013年提供給消費者。這意味着你(nǐ)的網頁設計(jì)必須适應多(duō)種窗口。
創建一個(gè)适用于手機的網站(zhàn)不是簡單的從你(nǐ)的設計(jì)中去掉那(nà)些(xiē)花(huā)哨的東西。這隻會(huì)産生(shēng)一個(gè)空(kōng)虛無個(gè)性的設計(jì)。雖然不太可(kě)能,但(dàn)從你(nǐ)的原始設計(jì)中去掉那(nà)些(xiē)魔法,變成簡單陳述你(nǐ)的品牌,這非常困難。幸運的是,技(jì)術(shù)正在快速解決這些(xiē)麻煩。
借助CSS3的幫助,主要是media queries,手機網頁設計(jì)有(yǒu)一個(gè)大(dà)的飛躍(以後詳說)。最重要的一個(gè)進步是,你(nǐ)可(kě)以設計(jì)一個(gè)整站(zhàn)并允許你(nǐ)的編碼遵從用戶的可(kě)視(shì)區(qū)域。
設計(jì)一個(gè)專門(mén)的手機網站(zhàn)可(kě)能很(hěn)有(yǒu)誘惑力,但(dàn)這可(kě)能不再能滿足你(nǐ)的觀衆了。越來(lái)越多(duō)的手機網站(zhàn)包含了訪問原始網站(zhàn)的選項。如果你(nǐ)沒有(yǒu)提供這一選項或你(nǐ)的原始網站(zhàn)沒有(yǒu)為(wèi)手機标準優化好,你(nǐ)就沒有(yǒu)為(wèi)2013年做(zuò)好準備。預測顯示,智能手機今年的銷量将超過個(gè)人(rén)電(diàn)腦(nǎo)。準備好你(nǐ)的設計(jì),滿足這一需求。