安靜的結構:控制頁面的視覺(2)_網(wǎng)頁設計教程
教程Tag:暫無Tag,歡迎添加,賺取U幣!
推薦:讓網(wǎng)站似個彬彬有禮的紳士不可否認,web的用途越來越廣。大家在互聯(lián)網(wǎng)上看資訊/電影、聊天、找朋友/工作、玩游戲、寫小說/日志、交易/買賣、聽音樂/廣播。互聯(lián)網(wǎng)已經不僅僅是一個窗口,
下面的例子將圖釋如何進行圖/文配對,解決閱讀是否舒適、眼睛是否疲憊的問題。
先看下面第一張圖。在第一張圖的結構中,一對單獨的圖/文需要你上/下不停的移動你的雙眼,造成視覺上的消耗。要想瀏覽整組信息,還需要左/右移動你的眼睛。而上下兩組信息的并排加劇了這種消耗。
相反,下面第二張圖的圖/文配對結構答應你的眼睛停在一個平面上。幾組新聞之間也不會沖突。(另:請注重兩個例子在視覺復雜程度上的不同。)
網(wǎng)格和間距的排版
一些人可能認為,布置一個好的網(wǎng)格只需要注重欄目寬度和水平間距。創(chuàng)造水平方向的韻律當然很重要,但假如你想設計出一個安靜的結構,垂直方向的節(jié)奏感同樣重要。
在下面的例子里,網(wǎng)格在欄目的水平方向上是一致的。但需要注重的是,垂直方向的不同排版在結構上會產生一定程度的視覺噪音。
在下面的例子里,水平和垂直方向的間距相同,這使得整個結構在背景里淡入淡出。因而所有呈現(xiàn)內容更顯干凈,也更輕易將視覺吸引到內容上。可見它對安靜的結構起到重要作用。
分享:初步了解信息架構結合一葉千鳥對信息架構的講解,談談自己的看法。我是學信息專業(yè)畢業(yè)的,考過信息架構師,但是似乎和工作中的了解還是有點區(qū)別,就此拿出項目實例和大家分享
相關網(wǎng)頁設計教程:
- 中國互聯(lián)網(wǎng)黑色產業(yè)人數(shù)近10萬 5分鐘1起網(wǎng)絡入侵
- 馬云最后的發(fā)布會:打假,打出阿里的新未來
- 實踐分享:ACCESS數(shù)據(jù)庫導入mysql數(shù)據(jù)庫
- ACCESS數(shù)據(jù)庫轉ORACLE數(shù)據(jù)庫分享
- CDN.net免費CDN申請使用教程:100GB流量香港日本新加坡節(jié)點
- WordPress 教程:為插件自定義數(shù)據(jù)表
- 如何使用查找我的iPhone教程
- 微信公眾平臺教程(二) 消息管理與群發(fā)
- 中國IPv4地址今年將告罄 IPv6期待打破政策局
- 移動廣告野蠻成長:75%投放在iOS平臺
- 災難面前,互聯(lián)網(wǎng)公司可以如何做的更好?
- 富士康500萬部iPhone遭蘋果退貨 損失10億元
- 相關鏈接:
- 教程說明:
網(wǎng)頁設計教程-安靜的結構:控制頁面的視覺(2)
。


