萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 響應式設計如何做出效果 移動端專題設計也可以很出彩

響應式設計如何做出效果 移動端專題設計也可以很出彩

  移動端的市場越來越火熱,這是有目共睹的。對於網建者來說,先做PC版頁面還是移動端頁面成為一個難以抉擇的問題。網站專題設計進入一個新階段,新領域。專題網頁設計的優勢在與短平快,在短時間內能取得較好的效果。

  移動端網頁所要考慮的因素並不亞於PC端,若是直接將PC端的設計搬到移動端上,在不同設備屏幕分辨率和網速的影響下,效果並不盡如人意,造成視覺限制。響應式設計是大勢所趨,但需要考慮在不同分辨率下的響應效果,投入的時間、金錢和精力是專題網頁設計的多倍。高效而有力的方法還是運用專題網頁設計。

    1.適應主流分辨率

  近年來,移動手機已經不滿於大屏,而是向著超大屏進發。在滿街都是6寸大屏手機的時代,許多人認為網頁也應順應潮流,向“大”看齊。但是一味的變大變寬,反而會不適應用戶的浏覽習慣。要知道,用戶的浏覽習慣是從上往下、從左往右,與PC端網頁設計一樣,移動端的網頁也要確定一個安全寬度,把重要信息控制在640PX寬度內。

響應式設計如何做出效果 移動端專題設計也可以很出彩 三聯

    2.控制字體大小

  移動端設計字號一般為PC端的2倍,為還原真實環境,盡量使用安卓和IOS默認的渲染字體和字號,以便適應用戶的感官習慣。

    3.把握圖片質量

  專題設計的頭圖一般多有強烈的視覺效果。如下圖所示,用戶首先會被中間的圖片吸引住。對於手機用戶來說,加載一張圖片的等待成本比PC上成本大很多。如若一個頁面加載時間超過5秒,70%的用戶會選擇關閉。所以圖片的質量和大小尤為重要。可多采用平鋪的素材,背景虛擬化,減少頭圖的大小,提高加載速度。

    4. 充分利用手指的滑動交互

  手機端的手指滑動交互在頁面中有良好的觸覺體驗。

  尤其是在游戲、網頁浏覽中,用戶更傾向於手指輕輕觸碰就能達到目的。

    5. 展開代替跳轉

  移動端的網絡環境不如PC端,頁面的加載跳轉對網絡環境不是那麼好的用戶來說是一件相當麻煩的事情。用戶總是想要越快越好。為減少用戶的不安全感以及關掉網頁的可能性,不妨采用展開、浮出的方式來撫慰用戶心靈。

  總結:移動端由於自身的限制,使得設計師在設計的時候畏手畏腳,現今也就還不能達到PC端那樣出彩的效果。但是隨著網絡環境的建設,wifi和 4G的逐漸普及,手機功能發展強大,移動端走起還是指日可待。移動端可利用手機的重力感應、隨身攜帶等優勢,也是可以很出彩,甚至可超越PC端,攀爬其無法達到的高度。本文由天天手游(http://www.apkyx.com/ )撰寫,轉載請注明出處。

copyright © 萬盛學電腦網 all rights reserved