<strike id="cy2gs"><menu id="cy2gs"></menu></strike>
  • <del id="cy2gs"><dfn id="cy2gs"></dfn></del>
  • 【前端技巧】網頁界面文字+圖片排版設計

    2014-10-29    藍藍設計的小編

    在頁面設計中,除了文字之外,通常都會加入圖片或是插圖等視覺直觀性的內容。表示這些視覺要素所占面積與整體頁面的之間比率的就是圖版率。簡單說來,圖版率就是頁面中圖片面積的所占比。這種文字和圖片所占的比率,對于頁面的整體效果和其內容的易讀性會產生巨大的影響。

    圖版率高低的區別:同樣的設計風格下,圖版率高的頁面會給人以熱鬧而活躍的感覺,反之圖版率低的頁面則會傳達出沉穩、安靜的效果。提高圖版率可以活躍版面,優化版面的視覺度。但完全沒有文字的版面也會顯得空洞,反而會削弱版面的視覺度。

    如果頁面的整體全部都是圖片的時候,圖版率就是100%。反之如果頁面全是文字,圖版率就是0%。

    有時在沒有圖像素材的情況下,但因為頁面性質的需要,頁面又需要呈現出圖版率高的效果。那么,該如何進行設計呢?

     一. 通過對頁面底色的調整,取得與提高圖版率相似的效果,從而改變頁面所呈現出來的視覺效果。

    二.如果素材圖像尺寸小,卻不想讓圖版率變低。可以通過色塊(相近色或是互補色)的延伸或是圖像的重復來組織頁面結構,避免這種素材資源不足的情況。

    采用和圖片相同大小的色塊可以保持界面的統一性與簡潔性,而且這樣的排版會造成一種錯覺,使用戶覺得有底色的方框整體視乎是一張圖片。而原本小尺寸的素材圖在背景色的映襯下也似乎變成了一張很大的圖。這種重復排列、添加變化的方法有效地避免了頁面的單調和無趣。

    三.版式的強節奏設計也能間接優化頁面的圖版率

    合理的利用排版的節奏感以及跳躍率(文字和圖片的跳躍率,是指版面中最大標題和最大的圖與最小正文字體和圖片大小之間的比率)。在版面設計中,圖片或是文字的跳躍率可以獲得較高的注意力,讓無趣的版面充滿活力。另外,排版層次豐富,也可以區分文章主次信息,讓瀏覽更加輕松,并且提高版面的視覺度。

    四.增加頁面中的圖形也可以改善圖版率低的問題

    無論是數字、序號、角標、圖標,甚至是視覺處理后的標題文字,都能提高頁面的視覺度,并給用戶留下活躍生動的印象。同時,圖形作為一種更直觀的傳達信息的方式,也使人一眼就能快速獲取信息,從效率上優于用 文字表達時的逐行掃描。

    圖標

    圖標的設計讓瀏覽和交互操作更加方便。圖與文的搭配可以降低閱讀的疲勞感,也增強了排版的設計節奏感。

    數字

    對數字的視覺處理也能起到類似插圖的裝飾效果,成為頁面上的視覺要素,同時增強頁面的設計感。

    序號

    頁面中的序號既有引導閱讀順序的功能,也可以作為圖片起到頁面的裝飾作用。另外,通過對序號的突出設計,可以讓布局更清晰靈活。即便是毫無規律的排版,也可以通過清晰的序號找準閱讀的軌跡。

    標題文字的處理

    如果頁面中沒有圖片和插圖,那么通過對文字及其顏色的處理,也可以使之起到與視覺要素相近的作用。下面的例子中,對于標題文字都進行了視覺加工,起到了整體頁面的裝飾效果。借助對這種文字大小、顏色、形狀的靈活運用,來突出頁面的重點,避免視覺上的單調感。

    日歷

    鏈接

    個人資料

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

    存檔

    主站蜘蛛池模板: 国产午夜无码精品免费看| 国产成人精品日本亚洲网址| 精品无码久久久久久尤物| 国产精品久久久天天影视香蕉| 精品久久久久久无码专区 | 精品国产一区二区三区在线观看| 国产成人精品优优av| 亚洲一区精品伊人久久伊人| 国产乱人伦偷精品视频不卡| 久久九九亚洲精品| 国产精品成人va在线观看| 久久久久久夜精品精品免费啦| 亚洲第一区精品观看| 免费人成在线观看欧美精品| 精品国产高清在线拍| 国产vA免费精品高清在线观看| 精品国产美女福利到在线不卡| 99国产欧美精品久久久蜜芽| 黑人巨大精品欧美| 精品欧洲AV无码一区二区男男| 日韩精品无码AV成人观看| 亚洲国产成人精品无码区在线观看 | 亚洲午夜福利精品久久| 日本精品自产拍在线观看中文| 精品人妻少妇一区二区三区不卡| 国产一区二区三精品久久久无广告| 国产成人精品大尺度在线观看| 999国产精品视频| 99久久综合国产精品二区| 97久视频精品视频在线老司机| 国产高清精品在线| 国产精品无打码在线播放| 国产精品亚洲w码日韩中文| 国产精品成人啪精品视频免费| 国产日韩久久久精品影院首页 | 国产精品无套内射迪丽热巴| 国产午夜精品无码| 国产精品自在线拍国产| 国产精品禁18久久久夂久| 55夜色66夜色国产精品视频| 国产精品1区2区|