設計出色響應式網站的十個技巧

　　移動技術並沒有漸退的跡象，反而對於個人和企業去建立入口網站，必須考慮移動使用者已經變成了趨勢。對於那些在不同裝置上看起來很酷、功能十分有效的正在發展中的網站，響應式設計仍保持實踐性。作為一個Web設計師，也會嘗試用各種各樣的網頁設計技術。如果響應式設計趨勢讓你印象深刻，並且也打算用響應式設計深入研究網站創新，那麼你已經來到了初學者的門口。這裡，已經包含了10個關於設計一個完美的響應式網站的很酷的建議。因此，讓我們深入瞭解這些建議。

　　1. 確保效能是你主要的目標

　　不管現在移動裝置的網路連線速度有多快，在建立網站時都推薦為設別配備慢的網路連線。例如，由於4G網路在現代國家是受限制的，因此你需要特別注意設計移動友好的網站，能在2G和3G網路上完美的執行。確保網站的載入時間非常迅速。

　　2. 採用‘影像’方式

　　對於每一個響應式網站，影像是一個很關鍵的元素。不像基於桌面的入口網站，一張很大的圖片可以一個很好的指引。在移動優化的網站上使用一張這樣的圖片，對於網站所有者並沒有好處。因此，需要裁剪圖片或者整個刪除圖片，原因非常簡單，小螢幕的移動裝置沒有能力按照預期的方式顯示圖片。在為不同的移動裝置設計網站時，採取一個合適方便的圖片管理計劃並遵守它。有些情況下，你需要為桌面和其它移動訪問者建立一個圖片的多版本。

　　3. 避免包含導航選單

　　由於響應式網站的目標是類似平板和智慧手機的小螢幕，所以建議隱藏主選單導航。可以選擇用圖示結合可以提示使用者選單的方式代替。例如，你可以設計一個簡單的下拉式選單，它可以滑下或者擴充套件到覆蓋整個螢幕。這也意味著，如果導航包含的元素超過三個，你可以只設計一個可以開啟特定選單的圖示。

　　4. 試著嘗試多個軟體程式

　　對大多數網站設計師，建立一個複雜的響應式web設計可能會從選定的軟體程式中得到幫助。例如，使用一個類似‘Moboom’的模板建立一個相當簡單的佈局是有效的，但是對於複雜的佈局，你可以會選擇像GoMobi一樣的特定軟體，對於移動使用者，它可以幫助你設計一個極好的網站佈局。

　　5. 簡化網站導航

　　儘管傳統的電子商務網站有建立複雜導航方案的方法，你可以更進一步，使用一個可以被可預測的標籤提供的健壯的導航選單。如果在瀏覽一個最受歡迎的電子商務網站，你會發現它包括了一個簡單而清晰的導航系統，從而讓訪問者能體驗公司提供的產品和服務。

　　6. 充分利用Google網頁設計標準

　　如果你是一個響應式網站開發的初學者或者已經開發了一些響應式網站，但是你不滿意，那就有必要去了解一下Google的設計標準。除了獲取針對智慧手機關於響應式設計的優秀建議和技巧外，你也會了解你需要做的事情—如何使網頁在不同的手持裝置上快速載入。

　　7. 讓你網站的內容可讀

　　為了閱讀特定的文字片段，讀者需要對其放大或縮小，這不是一個好的建議。作為一個經驗，確保文字大小足夠大，因而即使在小的螢幕裝置上也是可讀的，建議將文字設定成16px、12pt或者1em。

　　8. 瞭解網格和斷點

　　當設計響應式網站時，確定你對斷點很熟悉。此外，還需要了解網格系統，這允許你在網頁設計中實現行和列結構。

　　9. 對於高分辨螢幕，用兩倍大小的圖片

　　按照這個建議，你需要兩倍大小的圖片，以讓圖片在高解析度值的螢幕上看起來很銳利。同時，需要保證不會對網站的載入時間產生負面影響。

　　10. 考慮螢幕方向

　　根據資料統計，41%的人使用直式（縱向）定向，59%的人喜歡橫向定向。因此，你需要採用某中方式來設計你的響應式網站，讓它在橫向和縱向看起來都是極好的，特別是橫向。

　　總結

　　不管人們選擇哪種裝置，響應式設計使每個人都有可能訪問和使用你的網站。我相信，上面列出的建議將會在你的下一個響應式網站開發專案中給你指導。

　　英文原文：Top 10 Tips on Designing Outstanding Responsive Websites