『壹』 什麼是響應式網站響應式網站有什麼優缺點
一、什麼是響應式(自適應)網站?
響應式網站(簡稱RWD)，這個網站可以適應不同設備的訪問(手機、平板電腦、桌面計算機)，方便用戶的瀏覽，減少用戶放大縮小的操作，給用戶更好的體驗，簡單而言就是一個界面，能在不同的設備上訪問並看到不同的效果，針對的是展示形式。
二、優缺點
優點：
1、響應式網站的智能化，用戶體驗友好
隨著電腦尺寸多元化，智能設備（pad/智能手機）普及化，在當下追求用戶體驗至上的時代，之前網站普遍使用固定的寬度（960px）逐漸滿足不了現在不同設備與不同解析度需求。在高解析度電腦寬屏顯示器上，兩邊留白過多。在手機上顯示，內容顯示過小，用戶為了看清楚，首先需要放大界面，再左右拖拖界面。
建設響應式網站，最大的優勢就是具有智能化的響應設計，這種網站能夠針對用戶設備顯現端的尺寸不同，主動的調整網站的顯示方法，讓網站幾乎能夠適應所有的顯示終端，而且還能夠在瀏覽器中調整網站的寬度，讓網站不會呈現出滾動條，使用戶不管在任何一種顯示器上瀏覽網站，都不會呈現出布局紊亂、顯示不全、或者是出現亂碼的情況，因而用最大程度的是為用戶能夠提高網站體驗。
2、響應式網站也能節約設計開發成本
相對需要開發電腦網站、pad網站、手機網站來說，響應式網站節省設計開發成本的。建設響應式的網站，能夠讓客戶不會再用針對不同的設備而製作pc版網站，或者是手機版的網站，建設一個響應式的網站，花一份的錢，就能獲得兩種網站的體會，最終實現一站多用的作用效果，從後期維護角度來說，再不需要分別維護pc界面、pad界面、移動界面，專心維護一個網站即可，從而到達節約網站建設優化本錢。
3、響應式網站更利於優化
響應式建站相比傳統網站來講要簡練得多，且應用多媒體的環境下，對搜索引擎的抓取也是異常友好的，是以網站優化起來加倍輕松。在PC端於移動端上的推廣也不在需要分開優化推廣，只需要做好一個便能得到效果。
由於響應網站在不同終端有友好的界面展示效果，用戶可以與網站一直保持聯系，比如URL不變積累分享；通過單一的URL地址手機所有的社交分享鏈接最佳化搜索引擎。搜索引擎也在變得越來越聰明，它們足夠智能可以完成移動網站和桌面網站的鏈接。Google也建議優先採用響應式設計，因為無論是什麼網頁版本都是相同的HTML、相同的內容，Google最容易處理。
不同設備上的地址都一致,不像以前,不同的設備有不同的地址。這樣可以搜索優化,讓谷歌網路爬蟲更容易找到你的網站,對網站的改變,可以更快速的在搜索引擎的結果中得到更新，大大加快了網站收錄的速度。
缺點：
1、 響應式網站載入需要一定的時間
由於響應式頁面是同時下載多套CSS樣式代碼，可能在手機上就下載PC、Pad的冗餘代碼，導致文件變大，影響載入速度。還有一些圖片並沒有根據設備調整到適宜的大小，而這正是導致載入時間加倍的原因。
2、響應式網站在優化搜索引擎時
關於響應式Web設計，為搜索引擎確定關鍵字並不是一件簡單的事情。因為相比一般桌面用戶，移動用戶多數採用不同的關鍵字，修改標題和其他事項都比較困難。
3、響應式網站影響Google的排名
如果響應式網站僅僅根據移動內容，它可能會影響到網站的Google排名。由於Google不支持這樣的網站，它不會對你的網站進行索引。
4、做響應式網站所耗的時間很多
如果企業計劃想把一個現有網站轉化成響應式網站，可能耗時更多。如果企業真的想要一個響應式網站，建議企業最好從草圖開始設計。
5、對低版本瀏覽器兼容性不友好
對於老版本瀏覽器支持不好，這是一個致命的問題。老版本瀏覽器上打開響應式網站會經常出現圖片顯示不全，排版錯亂等情況。
『貳』 什麼是web響應式網站
響應式Web設計(Responsive Web design)的理念是：
頁面的設計與開發應當根據用戶行為以及設備環境(系統平台、屏幕尺寸、屏幕定向等)進行相應的響應和調整。具體的實踐方式由多方面組成，包括彈性網格和布局、圖片、CSS media query的使用等。無論用戶正在使用筆記本還是iPad，我們的頁面都應該能夠自動切換解析度、圖片尺寸及相關腳本功能等，以適應不同設備；換句話說，頁面應該有能力去自動響應用戶的設備環境。響應式網頁設計就是一個網站能夠兼容多個終端——而不是為每個終端做一個特定的版本。
『叄』 國內優秀的響應式WEB網站有哪些
互聯網時代，網頁這種東西是不可或缺的，也是視覺設計師還有程序員們一直在努力的方向，一個適用性良好，美觀的網站，總能得到更多的關注。網頁從靜態的到動態，再從動態到如今的響應式Web網站，這都是網頁設計的進步。
總而言之，現在的響應式Web可以說是大勢所趨，是現在的潮流也是未來網頁發展的趨勢，畢竟這種良好的交互性，是非常棒的。
『肆』 html5怎麼製作一個響應式網頁
HTML5 製作響應式網頁，首先需要考慮是全平台適配還是只是移動端適配。這里以移動端響應式網站為例，講述如何製作響應式網頁。
1、選定基本設計尺寸，一般以1080為基準。確定響應式web設計的應用場景之後，和美工（或設計師）溝通，之前，一般需要美工出幾套主流移動設備屏幕解析度的設計圖，現在，使用流式布局以及rem等可以使用一套設計圖，以最常用的移動設備屏幕解析度為基準。
2、當美工完成設計圖之後，前端工程師的工作就開始了。這時你就可以使用PS或是FW進行切圖了。一般說來，Fireworks cs6切圖更快，但是Fireworks有時會有圖片失真的情況發生，所以，有時需要使用PS進行配合，PS有切片工具可以專門用來切圖。
『伍』 什麼叫響應式網站
響應式布局，是一個網站能夠兼容多個終端——而不是為每個終端做一個特定的版本。
優點：
1、用戶體驗友好
響應式網站可以根據不同終端、不同尺寸和不同應用環境，自動調整界面布局、展示內容、內容大小，提供非常好視覺展示效果，一致性友好體驗。
2、節省設計與開發時間
響應式網站界面只需要設計兩套設計效果圖，後期維護不需要分別維護pc界面、pad界面、移動界面，專心維護一個網站即可。
3、SEO友好
由於響應網站在不同終端有友好的界面展示效果，用戶可以與網站一直保持聯系，比如URL不變積累分享。
4、可以適應所有設備屏幕
擁有了響應式的網站設計則不同，用戶可以一直和網站保持聯系，而且它對用戶非常用好。
(5)響應式web網站擴展閱讀：
響應式布局的缺點
1、設計與風格有局限性
自由度太低，局限性較大。
2、對IE老闆兼容性不友好
對於老版本IE（IE6、IE7、IE8）支持不好。
3、靈活性有所欠缺
基於不同終端的設備屬性不同，對產品用戶體驗要求就會截然不同。內容比較多帶有功能性的網站不適合做響應式網站設計。
『陸』 什麼是響應式網站及其特點
響應式網站設計是一種網路頁面設計布局，也即可以智能地根據用戶行為以及使用的設備環境進行相對應的布局。響應式網站就是使用響應式網站設計而設計出的網站。
為什麼這么多人喜歡響應式網站?響應式網站優勢有哪些呢?
1、利於用戶體驗
響應式網站，是良好用戶訪問體驗響應式設計的呈現，改良了網頁內容被插件約束的場所，豐富了多彩的網站，滿意了用戶視覺上的審美需求，且能夠提高網站的載入速率，利於提升用戶體驗度。
2、不用在根據不同的終端設計不同的網頁類型
前面說過，響應式網站可以智能地根據用戶行為以及使用的設備環境進行相對應的布局，所以只需求設計完成一個pc站就能順應一切的終端設備，不需去為特定的終端做一個特定的版本網站。
3、不用在被動的調整顯示方式方法
網站智能化建設響應式網站，可以針對用戶設備顯示端的尺寸不同，自動的調整網站的顯示方式方法，讓網站幾乎可以適應所有的顯示終端，而且還可以在瀏覽器中調整網站的寬度，從而最大程度的提高用戶的網站體驗。
4、一個後台統籌管理
便捷式管理響應式網站也是其中的一大優勢，在網站的日常管理與維護上輕松運營，在後台管理上不需求經過不同後台來管理不同終端，只需求一個後台便能統籌管理。
5、節省建站成本
建設響應式的網站，客戶不用再針對不同的設備而製作不同的頁面。建設一個響應式的網站，最終實現一站多用的效果，從而達到節省網站建設成本的目的。而且，多種營銷方式方法，可以通過唯一的URL地址進行社交分享，通過分享帶來更多的潛在用戶。
上面提到的幾點響應式網站的優點，大家會常遇到，感觸更深些，其它的響應式網站優點不在一一累述，大家可以在平常的工作中自行發掘。
『柒』 web響應式網站怎麼做
Step1：信息架構，確定內容策略。
根據產品定位和用戶分析，交互設計師確定站點信息架構。（信息架構呈現方式有很多種，這不是本文重點，不詳述）。
這時候可以明確這個產品有多少頁面，每個頁麵包含多少內容，內容優先順序是什麼。很多產品包含N多頁面，每個頁面一一考慮響應式設計容易造成混亂且成 本巨大。所以下一步重要工作是分析頁面類型把頁面歸類。以玩客為例，可以把10多個頁面分成三類：列表類頁面、詳情類頁面、操作類頁面。
Step2：響應式移動框架
先說下為什麼第二步要先設計移動框架。移動優先是移動互聯網浪潮下應運而生的理念，由Luke Wroblewski最早提出。移動優先並不是指移動更重要，響應式設計理念里設備是同等重要的。它是指優先設計手機端的體驗，有三個原因：
手機讓設計專注，強迫你想清楚什麼信息是最重要的。因為手機屏幕小，每屏呈現的內容少；觸屏手機使用手指操作而非滑鼠這樣的精密設備來操作，對操 作有更高要求；手機使用場景更加豐富，很多場景用戶是缺乏耐心的，比如當你排隊看電影正在找手機上的電子票，馬上排到你了翻半天卻遲遲找不到那張票這是多 么令人崩潰的事情。
手機許多特性讓設計更強大。手機上的語音輸入、地理位置定位、豐富的手勢操作、越來越多感測器，手機交互比PC擁有更多可能性。從手機開始設計，讓你更早地思考如何發揮這些特性。
手機正在迅猛增長。手機即將超越PC，成為最主流的上網方式，這個趨勢是不可逆的。
從移動開始做設計對習慣了PC環境的設計師可能是一種挑戰，思考方式工作習慣都被迫做出改變。但這種改變必須去適應，因為用戶習慣在改變。
回正題，上一步已經把頁面歸類並確定每個頁面內容優先順序，現在接著分析每種類型頁面的導航、主體內容等框架結構，最終得出一份框架結構表。從玩客框 架結構看出，全局導航是所有頁面公共的，局部導航只有列表類頁面才有，詳情類頁面都有一個「頁面主人」信息，而關聯導航不是每個頁面都有。
Step3：響應式設計框架
根據手機端的框架拓展出平板和PC端框架。這是復雜產品實現響應式設計的關鍵步驟，它是讓眾多頁面有條理地響應起來的基礎。第一件事情是確定響應式 模式，即從手機到平板到PC，導航怎麼變化，頁面布局用哪種響應方式，根據內容優先順序如何調整模塊順序，等等。玩客在PC端以三欄布局為主，左邊欄作為局 部導航或者主人信息區，中間欄始終是頁面主體信息，當頁面需要關聯導航時統一放在右邊欄。
應式是一種設計理念與前端技術緊密結合的新興形態，鼓勵盡早進行跨職能溝通協作。交互確定響應式框架和柵格系統後，其他角色就可以同步開展工作 了。前端開始介入完成柵格和框架搭建，產出頁面基礎框架。視覺同步開始探索和定義視覺風格探索，制定視覺框架，產出風格關鍵詞、產品配色方案。整個過程需 要幾個角色不斷討論確定。
Step4：模塊設計
按照用戶體驗中的移動優先的原則應該先進行移動端的模塊細節設計，不過我們選擇了從PC端開始設計細節。因為PC端開發能夠充分暴露業務復雜度，項目團隊的設 計、開發、測試在PC環境下擁有成熟的工具和流程，從PC開始讓開發過程更順暢。所以個人認為移動優先是確定內容策略時應該遵循的理念，細節設計和開發過 程是否要移動優先，取決於產品定位和項目團隊情況。
響應式框架確定了頁面結構和響應模式，模塊設計這個過程開始完善所有信息排版和交互形式，這是交互設計師最熟練也是最耗時的工作。這個過程與傳統流程沒太大區別，只是心裡要不斷提醒自己，這個模塊不是只為這個設備設計，它在其它設備下會出問題嗎？
交互確定頁面模塊細節後可以抽取出產品用到的控制項、組件和公共模塊，現在視覺和前端開始做一件有別於傳統流程的事情。視覺根據前期定義的風格設計控組件和公共模塊的視覺效果，把它們拼成一個模擬的頁面，我們稱之為風格拼貼稿。前端再把風格拼貼稿里的控組件和公共模塊實現出來，統一維護一套組件規范代碼。
Step5：響應式模塊設計
PC端頁面模塊細節和風格拼貼稿完成後，剩下工作是拓展出平板和手機端的完整設計稿，前端產出全部響應式頁面代碼。進行響應式模塊設計時最需要關注的仍然是讓操作符合設備習慣，充分利用設備特性。
至此，一個全站響應式產品的頁面就陸續出來了。很多人認為響應式設計維護成本高的理由是一個頁面要同時設計多套設計稿。玩客這次經驗告訴我們，確定一套設計稿和柵格系統後再拓展出其它設備下的設計方案，工作量遠比想像中的低。
Step6：測試&討論&優化，提交開發
離大功告成還差最後一步，在真實設備下測試頁面效果，項目團隊討論並持續優化用戶體驗。
在提交開發之前需要盡早明確服務端響應（RESS） 的策略。服務端與客戶端結合是目前解決響應式頁面性能問題的最合理方案。哪些大圖片在移動設備下只需輸出小尺寸圖片？哪些內容在什麼設備下是不需要開發輸 出的？哪些可以減少輸出的數據數量？與開發團隊協作的響應式可以有效控制頁面文件大小，避免頁面成為移動設備上燒用戶流量的罪魁禍首。
測試通過後提交頁面進入開發環節。我們從可用性和可訪問性兩方面總結了一份響應式頁面測試checklist，測試要點包括但不限於以下內容。
『捌』 響應式網頁設計的優勢有哪些
1、響應式網頁設計的優勢——這個網站是獨一無二的
響應式web設計的優點是針對企業的需求進行定製，並且在網路中沒有重復的web站點，因此具有獨特性，使用戶不會體驗到審美疲勞。
2、響應式網頁設計的優勢——網站結構合理，易於優化
在模板構建過程中，很多用戶片面關注網站的創意，往往忽略網站的架構，導致後期優化困難。定製網站擁有專門的技術團隊，確保優化後的創意企業，充分吸引目標客戶的消費。
3、響應式網頁設計的優勢——網站可擴展性強
責任型網站建設具有擴展性，模板網站功能基本固定，升級難度較大。自定義網站的擴展功能更加方便。通過找到一個技術團隊來修改代碼，您可以快速滿足企業的業務需求。
4、響應式網頁設計的優勢——可以滿足更多的系統功能
響應式網站可以滿足更多的系統功能，如餐飲網站需要訂餐服務，一般網站無法滿足，所以可以定製專門開發的訂餐系統。
5、響應式網頁設計的優勢——兼容所有設備
基於最尖端的HTML5技術，智能跨平台網站解決了手機和其他移動終端屏幕尺寸、屏幕解析度不一致、瀏覽器差異化等三大移動終端適配問題，適應全球5000多台移動設備。
6、響應式網頁設計的優勢——多終端視覺效果統一
H5響應網站可以自動檢測設備屏幕的大小，並自動調整網站的內容和布局，使網站在任何設備上都有良好的顯示效果。
7、響應式網頁設計的優勢——高端氛圍，良好的用戶體驗
響應式web設計的優點可以突破移動終端和計算機終端的限制。不需要在不同設備之間切換，可以看到相同的布局，可以提高用戶體驗，這是企業所喜歡的。
8、響應式網頁設計的優勢——性價比高，開發、運維成本低
你不需要為不同的設備開發不同版本的網站或應用程序。網站內容的實時更新不僅可以降低網站開發成本，還可以節省大量的後期維護的人力和時間成本。
總之，響應式網頁設計的優勢在於它可以幫助實現一站式的多功能想法。這種基於網格布局和CSS3的移動網頁設計可以使網頁對屏幕的變化做出響應，提高用戶體驗。資料庫的管理也給網站管理員帶來了更多的便利。後續將會有更多關於ui設計中各個分類的設計技巧與資訊，可以點擊本站其他文章進行學習。