北京单场玩法

圖文搭配網頁不累!如何讓圖文混排好看又好用?

2017-05-28

create-fabulous-useful-typesetting-1

編者按:來看看高手是怎么做的!今天搜集了一組值得同學們借鑒學習的圖文混排優秀案例,為了同學們能有所收獲,案例都附有到位的分析,幾乎每個案例都有特別的排版技巧,對提升版式設計能力很有幫助,來學習咯。

借鑒之前先來看看,這些案例有木有用到這些技巧?《推薦!網頁首屏設計之圖文混排的10大技巧》

從過去到現在,設計師們總是對方位性的問題格外敏感,可能還有些輕微的強迫癥。比如有的網頁設計師特別偏好黃金比例的使用,從而忽視了用戶的視覺感官體驗。

其實,所有的法則或規律都需要設計師們的彈性使用,生搬硬套可能只會適得其反。以下是AnyForWeb為大家搜集的值得借鑒的圖文混排案例,供大家評論欣賞。

Nature House

第一個案例是圖文交錯的一種新形式。案例圖片中的每一個字母或是小圖片都會隨著鼠標的懸停產生效果,由圖變字,這樣的設計不僅讓圖文之間的搭配變得更加生動,也增加了用戶瀏覽時的趣味性。

The Tech Beach

The Tech Beach的網站背景利用了Metro的設計風格,擔心太規整?所以設計師將透明度較高的潑墨形狀色塊放在頁面中間位置,文字重點和logo浮在色塊上方。這樣的圖文搭配模式能讓用戶很自然的領會瀏覽時的先后順序。

 Anyi Lu

Anyi Lu的巧妙之處在于留白部分。案例網頁中的留白在中間的位置,看似文字和圖片被一分為二了,但從心理角度上來說,這樣做其實更加能激發用戶連結圖和字之間聯系的好奇心、在單色底色的映襯下,幽靈按鈕的設計也變得很搶眼,更有利于用戶點擊。

如何搞定留白?來這里學習!《高端網站都懂的!如何在網頁設計中使用留白》

Moon Camp

Moon Camp徹底把文字和圖片混合在一起。這種做法成功與否不僅取決于整體頁面的布局,色彩的搭配也是個很關鍵的因素。網頁色調屬于昏暗系,所以設計師選擇了星空色作為字體的顏色,與網站風格吻合,文字的不規則排列也讓網站多了一份神秘感。

如何正確配色的6個法則:《秒變配色高手!怎么都不會錯的6條網頁設計配色原則》

Zizzi Ristorante

Zizzi Ristorante的網站第一眼可能會覺得有些凌亂,但用戶的視線最終還是會聚集到枚紅色框內的內容上。單從布局上來說,這個網站并沒有什么過人之處,但仔細一看,我們不難發現其實網站中圖片的占比很少,按照常規的做法,頁面會變得很單調,因此,設計師最后用一些色塊或是圖形巧妙地化解了這個不足,無形中完成了圖片與文字之間的完美合作。

 LUKE BEARD

LUKE BEARD的網站幾乎沒有什么布局可言,左邊文字右邊圖片,僅此而已,但一些小設計讓整個頁面變得精致起來。圖片中人物的視線向文字流去,沿著視覺流向來排布信息是很多國外網站慣用的布局手法。圖片會引導用戶去看文字內容,兩者之間形成一種默契的邏輯關系。

ZULU & ZEPHYR

ZULU & ZEPHYR的網站運用的是對比布局法。大海和天空在色彩上形成了一種對比,起到了互相烘托并且增強效果的作用。他們之間的對比讓頁面中央的文字引起了用戶的注意。用圖來襯托文字,讓畫面充滿了產生了一種別樣的韻律。

Tomas Jasovsky

Tomas Jasovsky網站中的圖文看起來似乎置身于兩個圖層中,也許若隱若現的內容才是設計師想表達的重點。

M-Power Yoga

M-Power Yoga的網站圖片為用戶帶來了一種垂直和水平的雙向平衡感,這樣的圖片能讓用戶更加心平氣和的認真閱讀頁面中的文字。

Segno

Segno的網站無論從圖片內容或是色調上都充滿了神秘感。對稱的設計也顯得比較討巧,文字在頁面居中的位置,給了用戶最佳的瀏覽體驗。

網頁設計中,文字內容和圖片的比重占了很大一部分,但差不多的信息量,呈現在網頁上的效果卻會大相徑庭。如何將這些內容和元素安置在最合適的位置,也許是這其中很主要的原因。


原文地址:http://www.uisdc.com/create-fabulous-useful-typesetting


  • 查看地圖,了解我們的位置
  • 關注微信,一舉一動盡在掌握

億校云是一支致力于開拓學校型軟件的團隊,
專注于為校園互聯網建設提供解決方案。

    • 公司:杭州億校云信息技術有限公司
    • 地址:杭州市濱江區濱文路426號文苑大廈13樓1308
    • 電話:0571-85100351
    • 郵箱:[email protected]
Close
北京单场玩法 山东时时开奖视频 水果拉霸游戏 通比牛牛app下载 时时彩倍投会赚钱吗 扑克斗三公的秘诀 麻将胡牌牌型大全集图 aa国际动漫有人开过吗 西游争霸怎么看吐分 爱丽丝梦游凶境 幸运pk10玩法技巧