<strike id="cy2gs"><menu id="cy2gs"></menu></strike>
  • <del id="cy2gs"><dfn id="cy2gs"></dfn></del>
  • 如何有效布局信息繁雜的網站?

    2014-3-6    藍藍設計的小編

    轉載藍藍設計(   m.skdbbs.com  )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供有效的   BS界面設計 、 cs界面設計 、  ipad界面設計   、  包裝設計 、  圖標定制 、  用戶體驗 、交互設計、   網站建設 、平面設計服務

    來源:http://www.uisdc.com/100-things-you-should-know-about-design

    如果您想訂閱本博客內容,每天自動發到您的郵箱中,   請點這里

    互聯網信息時代,很多內容為主的網站都信息過載,這導致了載入速度過慢。電商網站如此,新聞類網站也是如此,而一些設計師作品集網站或者設計機構的網站也是如此,老實說,作為設計師,應該避免信息過載現象的出現。而一旦你掌握這些技巧,那么你離高薪酬的資深ui設計師也就不遠咯。

    內容主導的頁面布局會自然而然的繁雜、問題多,設計這種網站的過程,也是一個艱難的挑戰,而且網站設計擁有者的目的是想給用戶提供更多的信息,信息會越來越多。當然,可以聽聽專家指導,堅持一些亙古不變的界面設計原則,來確保布局的組織良好和架構分明,這就能減少很多不必要的繁雜。

    今天藍藍設計涵蓋了一堆信息量大,但是卻不雜亂的網頁設計,具備愉悅的即視感。不吹牛,您可以挨個點看感受一下:)

    Action Film 
    相當復雜的網站,但是在布局上很聰明將一堆小視頻組織的條理分明。登錄頁分成好幾條線,是的多媒體側邊欄。

    Action Film

    Salon’s
    組織有序,不同尺寸的很多照片排列在一起也非常有序,打破了單調布局的常規。

    Salon homepage

    House
    柵格布局,整齊、靈活,不同區域的縮略圖和文字看上去很舒服,很有區分性。

    House

    W Magazine
    有樣、精致,內容區域文本和圖像的高度對比,黑色的背景也起到了良好的陪襯。

    W Magazine

    Served MCR
    強烈的手繪風格,極其沖擊的視覺表現。細節到位,草圖很有趣,一點點精致的水彩效果,幾組手繪風字體,多而不亂。

    Served MCR

    Butterfly
    信息密集的作品集網站,設計師很有技巧的利用色彩和扁平的圖像來中和”繁雜的信息”

    Butterfly

    Health
    著名的在線雜志,信息結構層次分明,背景干干凈凈。

    Health

    My Own Corks
    干凈優雅,扁平化的區塊帶來了額外的呼吸空間。

    My Own Corks

    Karl Anders
    結構堅實有力,標準的平鋪式格局。黑白配色,去除了繁雜感。

    Karl Anders

    Tomorrow Counts
    大量的文本和信息,因此他們仔細的調整了布局,以便達到更好的可讀性。柔軟的綠色,活力的橙色,這兩種顏色作為點綴,點亮了整個頁面。

    Tomorrow Counts

    REI 1440
    從來沒見過吧,概念化、、效果令人振奮。
    通過鍵盤便可以實現縮略圖的滾動。

    REI 1440 Project

    The Camry Effect 
    很好的將功能不同的區塊和數據良好的結合到了一起,網站也提供了過濾功能,讓用戶自行定制顯示內容。

    The Camry Effect

    Phillips Internet Consulting 
    標準的圖像滑動,屏幕只有一半用來顯示圖像,這給導航元素留下了大量的空間。不過,深邃的背景和較大的字體有點讓人感覺雜亂。

    Phillips Internet Consulting

    Accuel AZKS
    簡明、直觀、,讓用戶快速了解設計師作品,深色效果,每個作品的風格不一,彼此襯托。欄式布局有效的防止了視覺混淆。

    Accuel AZKS

    Etch
    整個網站,黑色支配,但是Lomo風的圖像賦予整個頁面一種活力。內容之間留下了充足的空間,讓頁面變得很有序。

    Etch

    Vogue
    信息量大,內容非常的流行。沒有沿襲雜志等紙媒傳統,完美無瑕的展示各個照片,通過白色背景作為間隔。三欄式布局。

    Vogue

    The New York Times
    深思熟慮的ui設計,如何在內容量大的前提下保證信息組織的效率?類似報紙的風格。盡管這個頁面的第一印象是繁雜,但是仔細觀察,你會發現頁面的分割、組織其實非常有效率,易于消化。

    The New York Times

    How Cool
    又一個流行時尚類網站的界面設計,主要通過圖片的視覺表現來吸引用戶注意。主頁面看起來非常協調整齊,因為對留白區域的合理運用。

    How Cool

    Mamo
    很用心的布局,僅僅包含了Logo設計、標題以及圖像。讓整個頁面很干爽。

    Mamo

    Time
    三欄布局,如有需要可切換成四欄

    Time

    Direnduvar 
    非常規的網站設計,插畫風格,精致的小涂鴉,手繪風字體。拖拉起來非常爽,非常有趣的探索體驗。

    Direnduvar

    Kod and Form
    留白區域很足,有機協調的布局,潤滑流暢的字體。整體看起來不錯。

    Kod and Form

    結論

    大體上來說,網格式布局可以幫助信息量大的網站有效組織布局,合理設置信息層級,達到一致性的視覺效果。
    你是如何通過布局來防止信息過載的?有什么訣竅嗎?求分享!

    日歷

    鏈接

    個人資料

    藍藍設計的小編 http://m.skdbbs.com

    存檔

    主站蜘蛛池模板: 亚洲精品无码久久久久久| 亚洲av无码成人精品区在线播放| 国内精品久久久久久麻豆| 国产午夜精品一区二区三区| 久久精品国产一区二区三区不卡 | 日韩精品一二三四区| 久久精品视频网| 久久精品中文闷骚内射| 欧美成人精品欧美一级乱黄码 | 日本精品一区二区三区在线视频| 91av国产精品| 精品国产91久久久久久久| 精品一区二区三区自拍图片区| 午夜一级日韩精品制服诱惑我们这边 | 久久亚洲精品中文字幕| 韩国三级中文字幕hd久久精品| 97久久超碰国产精品2021| 婷婷五月深深久久精品| 亚洲2022国产成人精品无码区| 欧美激情精品久久久久久久九九九| 国产精品麻豆欧美日韩ww| jizz国产精品| 国产精品区AV一区二区| 国产av无码专区亚洲国产精品| 欧美日韩精品在线| 天天爽夜夜爽精品视频app| 日本精品在线视频| 最新亚洲精品国自产在线观看| 欧美激情精品久久久久| 91自慰精品亚洲| 国产精品亚洲视频| 精品国产三级a乌鸦在线观看| 国产精品日日摸夜夜添夜夜添1国产精品va欧美精 | 99国产精品久久| 国产亚洲欧美精品久久久| 久久精品毛片免费观看| 少妇人妻偷人精品无码视频 | 人妻少妇精品系列| 亚洲国产精品综合久久一线| 中文字幕久精品免费视频| 人人妻人人澡人人爽精品日本|