比較漂亮的網(wǎng)頁專題頁面設(shè)計的經(jīng)驗總結(jié)
看過“非誠勿擾”的同學(xué)都知道,節(jié)目中女嘉賓只需幾分鐘時間就能決定自己的約會對象。同時也能否決掉N個男嘉賓。
如果把網(wǎng)頁上的各色推廣專題比作是參加非誠勿擾滴各色男嘉賓,而廣大網(wǎng)友則是那舞臺上18位漂亮滴美眉。決定的時間將更加短暫,就幾秒鐘時間。如何瞬間抓住“美女”的心。第一印象是至關(guān)重要的。而推廣專題中第一屏幕,就好比專題頁面的第一印象,一定要抓住用戶的心。這樣才有后續(xù)發(fā)展~~~
總結(jié)了幾點自己經(jīng)驗,不算權(quán)威發(fā)布,僅供參考。*-*
a.精致的臉蛋,定能最快吸引眼球。
專題的標(biāo)題文字好比男嘉賓天生麗質(zhì)的臉蛋。1.專題需求下來時,標(biāo)題文字和副標(biāo)文字基本是確定的。2.專題標(biāo)題文字一般都很精辟簡短,概括了整個專題的商業(yè)訴求。3.標(biāo)題文字是直接的表達(dá),是什么,為什么,怎么樣,不看圖形,網(wǎng)友也能明白個大概?;谝陨?點,專題設(shè)計時,標(biāo)題文字是需要著重刻畫下的。從何入手呢?這個時候把自己當(dāng)成網(wǎng)友,分析下如果你是網(wǎng)友,這句話中最吸引你的文字是什么。將其拆分,然后對重要文字做一些形狀,色彩,大小,質(zhì)感,版式等方面做改變和突破,這些標(biāo)題文字的設(shè)計都是符合整個專題風(fēng)格的。舉例:

標(biāo)題文字占用頁面最重要的位置。文字精心排布,筆畫也經(jīng)過精心的調(diào)整,優(yōu)美的曲線連貫著字題之間。使整個標(biāo)題形成一個整體。綠色的四葉草裝飾,襯托這春天的氣息。充滿活力的字體設(shè)計。

標(biāo)題文字占用頁面最重要的位置。文字精心排布,筆畫也經(jīng)過精心的調(diào)整,優(yōu)美的曲線連貫著字題之間。使整個標(biāo)題形成一個整體。綠色的四葉草裝飾,襯托這春天的氣息。充滿活力的字體設(shè)計。

它很簡單,設(shè)計只在原有字體的尾部稍加變形,銜接。就像新娘的白的婚紗一樣簡單而不失高雅。新字上的小小桃心。恰到好處的表現(xiàn)了新娘待嫁的心情。兩個粉色絲帶質(zhì)感的蝴蝶結(jié),增加少許性感和可愛。我個人很喜歡的一個設(shè)計,呵呵···

稍稍打散字體,改變大小,排版的方式,也能有很好看的標(biāo)題的設(shè)計。

文字好像是被一塊一塊積木搭出來滴,稍稍一碰就怕會散掉。質(zhì)感的塑造,給標(biāo)題帶來了新的聯(lián)想。以后可以多嘗試。

同樣是質(zhì)感的表現(xiàn),這個充滿了未來感,光的運用,添加了不少動感。

既然是大兒童,就不能太規(guī)矩?。¢_心,快樂最重要。

浪花,椰樹,沙灘色,美女,比基尼元素一個都不少,能不明白那是去海邊嗎??
b.適宜的穿著,體現(xiàn)氣質(zhì)和內(nèi)涵。
如果對自己的樣貌不是很自信,也不用太緊張,俗話說人靠衣裝。穿著得體也能讓你第一印象得高分。專題題圖的風(fēng)格就像是專題的衣服,體現(xiàn)整個專題的氣質(zhì)。決定風(fēng)格的基本要素包括:色調(diào),構(gòu)圖,質(zhì)感,設(shè)計元素等,這些元素跟文字交相輝映,集中展示頁面的訴求。他不像標(biāo)題文字那么直白,他用含蓄的方式襯托著主題。舉例:

果然是格子鋪,除了文字能直白的表現(xiàn),背景的布紋恰到好處的表現(xiàn)這一主題。值得注意的是,布的質(zhì)感除了它自帶的紋理,針線扎邊的效果很自然的也體現(xiàn)了。開業(yè)的小標(biāo)簽,側(cè)邊的小標(biāo)題標(biāo)簽,不管在位置還是質(zhì)感的選擇方面都很自然。元素雖少,但主題很突出。設(shè)計師對細(xì)節(jié)的處理真的超贊。

有米有皮草的感覺~~。皮質(zhì)顏色的大背景,幾件皮質(zhì)的高檔商品。兩個穿著皮草的靚女·,皮質(zhì)的小標(biāo)簽·····再加上金屬質(zhì)感的釘扣.一個充滿皮草味道的專題,時尚還有點小霸氣。

一杯咖啡,一只蝴蝶,幾多從窗外伸進(jìn)來的花朵。像不像你房間窗前的感覺。早這種情境中看話語周刊,是多愜意的感覺?。?!元素簡單明了。創(chuàng)造了一個情境,讓網(wǎng)友不自覺的產(chǎn)生聯(lián)想。很自然的烘托主題。

柳條,細(xì)雨,遠(yuǎn)山,云煙,亭子···江南的情境。這個也是同上,用元素創(chuàng)造一種情境,讓網(wǎng)友有身臨其境的感受。

多可愛的課堂啊,我小時候就曾幻想過,要是能在云中漫步多有意思。這個題圖給我們搭建了一個很夢幻的課堂場景,小朋友們在云彩中的教室上課學(xué)習(xí),每一個云彩中都浮著一個小屋,那應(yīng)該是孩子們的家吧···呵呵真令人向往。

嘿嘿·有這樣賣車的場景嗎??我們搭一吧。
例子還有很多·可以總結(jié)的方法也有很多。還有待研究·呵呵。有個值得注意的問題:不管如何表現(xiàn)主題。第一屏的元素都不要過多。放最必要的,去不必要滴,學(xué)會做減法。主旨都在烘托主題,達(dá)訴求。
c.合理的配飾,可以畫龍點睛。
當(dāng)眾多的專題都已經(jīng)做到以上兩點時。想要從中脫穎而出,就得再加點難度,那就添加一些多媒體形式吧(在不影響用戶體驗的情況下)。偶爾可以給咱的專題標(biāo)新立異下,添加一些FLASH動畫效果,視屏效果,鼠標(biāo)鍵盤互動效果。讓網(wǎng)友充滿樂趣的去看頁面。但是這些不建議多用,它就像人的配飾一樣,只能作為點綴。這里就不舉例子了,給出幾個專題網(wǎng)址,可以去看看具體效果。
邀你就有:http://topic.19lou.com/club/2010/yyjj/index.php
幺幺久久命中注定我愛你:http://topic.19lou.com/design/2010/0412/index.html
19樓新春大采購:http://topic.19lou.com/bb/2010/0111/newyear.html
春季大秀場:http://topic.19lou.com/bb/2010/0401/qjd.html
索菲亞杯裝修日記:http://www.19lou.com/forum-72-thread-29083448-1-1.html
最后,感謝19樓UED部門的兄弟姐妹,無償提供優(yōu)秀設(shè)計作品。
希望在做專題時,能對大家有所幫助吧!*-*。
版權(quán)聲明:本站文章來源標(biāo)注為YINGSOO的內(nèi)容版權(quán)均為本站所有,歡迎引用、轉(zhuǎn)載,請保持原文完整并注明來源及原文鏈接。禁止復(fù)制或仿造本網(wǎng)站,禁止在非maisonbaluchon.cn所屬的服務(wù)器上建立鏡像,否則將依法追究法律責(zé)任。本站部分內(nèi)容來源于網(wǎng)友推薦、互聯(lián)網(wǎng)收集整理而來,僅供學(xué)習(xí)參考,不代表本站立場,如有內(nèi)容涉嫌侵權(quán),請聯(lián)系alex-e#qq.com處理。
關(guān)注官方微信