在如今這個(gè)屏幕無處不在的時(shí)代，我們用手機(jī)刷微博、用平板看視頻、用電腦辦公，屏幕大小千差萬別。那怎么讓一個(gè)網(wǎng)站或應(yīng)用在各種屏幕上都能讓用戶用得順心呢？這就得靠跨屏幕的響應(yīng)式設(shè)計(jì)來大顯身手啦。

　　1、靈活的布局是關(guān)鍵

　　它會(huì)根據(jù)屏幕大小自動(dòng)調(diào)整布局。在大屏幕上，內(nèi)容可以寬寬松松地排成多列，看起來清爽又大氣；到了小屏幕手機(jī)上，它就變成單列，內(nèi)容依次排開，字體也自動(dòng)變大，按鈕也變大，手指點(diǎn)起來輕松得很。就是在什么設(shè)備上，都能給用戶帶來友好的體驗(yàn)。

　　2、圖片和視頻要自適應(yīng)

　　響應(yīng)式設(shè)計(jì)能讓圖片和視頻聰明起來。它們會(huì)根據(jù)屏幕寬度自動(dòng)調(diào)整大小，保持原有的比例，該大就大，該小就小。比如你用平板看一個(gè)風(fēng)景視頻，畫面剛好充滿屏幕，視覺效果超棒；換成手機(jī)看，視頻也正好縮到合適的尺寸，不會(huì)出現(xiàn)黑邊或者變形的情況，來保證用戶無論在哪種設(shè)備上都能享受到最佳的視覺盛宴。

　　3、交互設(shè)計(jì)要貼心

　　在不同屏幕上，用戶的操作習(xí)慣也不同。在電腦上，我們習(xí)慣了用鼠標(biāo)懸停、點(diǎn)擊；在手機(jī)和平板上，更多是觸摸操作。響應(yīng)式設(shè)計(jì)會(huì)考慮到這些差異。比如，電腦端的導(dǎo)航欄可以用鼠標(biāo)懸停顯示下拉菜單；到了手機(jī)上，就換成一個(gè)漢堡菜單圖標(biāo)，輕輕一點(diǎn)就能展開，方便用戶快速找到自己想要的內(nèi)容。按鈕的設(shè)計(jì)也會(huì)根據(jù)屏幕大小和操作方式進(jìn)行調(diào)整，手機(jī)上的按鈕會(huì)更大，方便手指點(diǎn)擊，以避免誤操作，讓交互過程流暢又自然。

　　其實(shí)響應(yīng)式設(shè)計(jì)的核心，就是 “跟著用戶的設(shè)備走”，不管用手機(jī)、平板還是電腦，網(wǎng)站都能自動(dòng)調(diào)整到最舒服的狀態(tài)，不用用戶手動(dòng)調(diào)整，這樣才能讓網(wǎng)站更加備受青睞。