鄰居確實(shí)很重要(頁(yè)面設(shè)計(jì)全局觀)_網(wǎng)頁(yè)設(shè)計(jì)教程
推薦:用戶特征描述對(duì)設(shè)計(jì)的影響這是一個(gè)挺長(zhǎng)命的問(wèn)題,至少?gòu)挠脩趔w驗(yàn)、可用性、用戶研究在國(guó)內(nèi)興起以來(lái),公司里同行間就一直聽(tīng)到類(lèi)似的爭(zhēng)論,相信這個(gè)問(wèn)題在設(shè)計(jì)界也是一個(gè)常論常青的問(wèn)題。
朋友發(fā)了一個(gè)比較幽默的圖片文章,說(shuō)的是“鄰居的重要性”呵呵,相當(dāng)?shù)母阈Γ粫?huì)我把URL寫(xiě)在下面。
看這個(gè)圖片文章標(biāo)題的時(shí)候,讓我想起了我在最近兩天畫(huà)產(chǎn)品結(jié)構(gòu)圖的時(shí)候遇見(jiàn)的一個(gè)問(wèn)題,正好記錄下來(lái)和大家分享一下。
問(wèn)題:
1、網(wǎng)頁(yè)排版過(guò)程中,過(guò)多的圖片之間的影響。
2、過(guò)多的圖片(或者廣告)對(duì)整體頁(yè)面的效果的影響。
這2個(gè)問(wèn)題是圖片多的網(wǎng)站和廣告多的網(wǎng)站必須要注重的。而作為PM,對(duì)版面的控制,我們?cè)谇捌谀茏龅木褪菍?duì)位置的控制,和對(duì)排版結(jié)構(gòu)的控制,在做這些結(jié)構(gòu)和排版的時(shí)候,一定要在腦子里有個(gè)整體的感覺(jué)和效果圖出來(lái)。
OK,上幾個(gè)圖來(lái)說(shuō)明一下,先上一個(gè)VISIO結(jié)構(gòu)圖,再上一個(gè)某頁(yè)面的實(shí)際圖,最后上一個(gè)某網(wǎng)站比較優(yōu)秀的處理后的圖,對(duì)比說(shuō)明一下原因。
這樣的VISIO圖相信很多PM都是這樣做出來(lái)的,我們都可能吸收了很多市場(chǎng)和銷(xiāo)售的意見(jiàn),然后做出這個(gè)結(jié)構(gòu),我們都相信做出來(lái)的效果應(yīng)該是不錯(cuò)的,最少布局上我們都設(shè)計(jì)的還算合理。
結(jié)果呢?往往出來(lái)后成了這個(gè)樣子。。看下圖
整體的效果大打折扣,頁(yè)面也缺乏整體性。
分析原因所在,很大的程度上是因?yàn)槿鄙夙?yè)面的整體性的控制,或者說(shuō)缺乏整體的規(guī)范,導(dǎo)致頁(yè)面廣告或者圖片的混亂疊加,最后出的一個(gè)混亂的效果。
作為PM,在前期,應(yīng)該將這些因素考慮進(jìn)去,這樣才能避免在后期出“一團(tuán)混亂”。想想整體,想想不同元素之間的“鄰居效應(yīng)”。
下面發(fā)一個(gè)淘寶的這個(gè)圖片整體感的頁(yè)面,這些是這些大網(wǎng)站為什么整體上看上去高質(zhì)量和整體感比一些小網(wǎng)站好的原因。
整體感,廣告和圖片之間的色彩影響,色彩協(xié)調(diào)。
呵呵,在這個(gè)過(guò)程中和PM分享一下一個(gè)頁(yè)面版塊設(shè)計(jì)的思想。
1、考慮圖片內(nèi)容的設(shè)計(jì)可能性結(jié)果對(duì)整體的影響。
2、考慮一下圖片之間的“鄰居效應(yīng)”
呵呵。。。上個(gè)幽默的圖。。。。發(fā)上那個(gè)幽默的URL鏈接。
原文:http://www.yangsu.cn/read.php?131
分享:網(wǎng)站項(xiàng)目開(kāi)發(fā)中的新工種—內(nèi)容設(shè)計(jì)師(一)WEB開(kāi)發(fā)技術(shù)發(fā)展到現(xiàn)在已經(jīng)有了越來(lái)越細(xì)化的分工,從90年代末,一個(gè)懂html代碼的人就能寫(xiě)一個(gè)站,到現(xiàn)在,內(nèi)容、架構(gòu)、UI、前端、程序、UE、分析監(jiān)測(cè)、SEO、推
- 中國(guó)互聯(lián)網(wǎng)黑色產(chǎn)業(yè)人數(shù)近10萬(wàn) 5分鐘1起網(wǎng)絡(luò)入侵
- 馬云最后的發(fā)布會(huì):打假,打出阿里的新未來(lái)
- 實(shí)踐分享:ACCESS數(shù)據(jù)庫(kù)導(dǎo)入mysql數(shù)據(jù)庫(kù)
- ACCESS數(shù)據(jù)庫(kù)轉(zhuǎn)ORACLE數(shù)據(jù)庫(kù)分享
- CDN.net免費(fèi)CDN申請(qǐng)使用教程:100GB流量香港日本新加坡節(jié)點(diǎn)
- WordPress 教程:為插件自定義數(shù)據(jù)表
- 如何使用查找我的iPhone教程
- 微信公眾平臺(tái)教程(二) 消息管理與群發(fā)
- 中國(guó)IPv4地址今年將告罄 IPv6期待打破政策局
- 移動(dòng)廣告野蠻成長(zhǎng):75%投放在iOS平臺(tái)
- 災(zāi)難面前,互聯(lián)網(wǎng)公司可以如何做的更好?
- 富士康500萬(wàn)部iPhone遭蘋(píng)果退貨 損失10億元
網(wǎng)頁(yè)設(shè)計(jì)教程Rss訂閱網(wǎng)站制作教程搜索
網(wǎng)頁(yè)設(shè)計(jì)教程推薦
- 論設(shè)計(jì)的布局與平衡
- 圖標(biāo)可用性測(cè)試
- 推薦10款來(lái)自極客標(biāo)簽的超棒前端特效[第一期]
- 李天宇:網(wǎng)絡(luò)公司錯(cuò)了 設(shè)計(jì)師也錯(cuò)了
- 免費(fèi)的Bootstrap網(wǎng)站模版 - Bootstrapper
- 用戶體驗(yàn)公式
- 網(wǎng)頁(yè)設(shè)計(jì)中安全色譜
- Jakob Nielsen:十大嚴(yán)重的網(wǎng)站設(shè)計(jì)錯(cuò)誤
- Yahoo!韓國(guó)設(shè)計(jì)探討
- 交互設(shè)計(jì)實(shí)用指南系列(8)—深廣度平衡 - 交互設(shè)計(jì)
- 相關(guān)鏈接:
- 教程說(shuō)明:
網(wǎng)頁(yè)設(shè)計(jì)教程-鄰居確實(shí)很重要(頁(yè)面設(shè)計(jì)全局觀)
。



