自適應(yīng)和響應(yīng)式｜北京藍(lán)藍(lán)UI設(shè)計公司

2023-9-18    博博

出現(xiàn)原因（Reason）：

電腦，平板，智能手機的屏幕尺寸逐漸多樣化，設(shè)備類型的增長增強了網(wǎng)頁的適配需求。
注：屏幕尺寸為瀏覽器尺寸的上限

自適應(yīng)（Responsive）：

自適應(yīng)是根據(jù)設(shè)備分辨率的不同，分別為不同的屏幕進行布局定義，創(chuàng)建多個固定布局，即“多套設(shè)計，多套開發(fā)”。適用于閱讀類交互多的網(wǎng)站，如知乎官網(wǎng)。

響應(yīng)式（Self-adaptive）：

響應(yīng)式是基于同一套代碼、同一套設(shè)計語言，能夠兼容多尺寸、多終端設(shè)備的展示，即“一套設(shè)計，一套開發(fā)”。 網(wǎng)頁根據(jù)顯示寬度（瀏覽器寬度）自動調(diào)整內(nèi)容，適用于企業(yè)、產(chǎn)品等視覺展示型網(wǎng)站中，信息少圖片多，如華為官網(wǎng)。

響應(yīng)式好處（Advantage）：

開發(fā)成本更低，一套代碼。
設(shè)計成本更低，一套設(shè)計。
業(yè)務(wù)迭代更快，一次運營。

響應(yīng)式適配原則（Principle）：

拉伸布局：內(nèi)容在屏幕顯示區(qū)域進行相對拉伸，已達到完整布局。
等比縮放：內(nèi)容在屏幕的相對位置上進行等比例縮放，一般用于圖片。
擴展布局：內(nèi)容可靈活按照屏幕尺寸進行增減，擴展為多行多列等。

藍(lán)藍(lán)設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請加藍(lán)小助，微信號:ben_lanlan，報下信息，藍(lán)小助會請您入群。歡迎您加入噢～希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系01063334945

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計( yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司

日歷

鏈接

個人資料

存檔