在過去的12個月里，全球智能手機用戶預計將達到35億。這是一個顯著的9.3%的增長。

在一個每個人都與自己的移動設備不斷連接的世界里，網頁開發者和設計師需要考慮如何創造吸引人的體驗的新規則是有道理的。畢竟，我們大多數人發現每天用智能手機瀏覽網頁要比坐在筆記本電腦前方便得多。

如果運氣好的話，你已經在采取行動優化你的手機網站，但標準一直在變化。為了確保你的網站達到標準，以下是你的指南，讓你的網站優先考慮移動設備，為新的一年做好準備。

理解嘗試設計

更新網頁設計和開發原則的第一步是理解“移動優先設計”的概念，以及它是如何變化的。

有了響應式網站，你可以根據任何設備的屏幕大小進行調整;對于移動優先網站，你首先要關注的是人們在移動設備上獲得的用戶體驗，以此為起點，然后從那里開始構建。你應該先考慮移動設備，而不是在建立臺式機網站時再考慮移動設備。

甚至谷歌最近也通過移動優先索引算法強調了這一過程的需求。如果你不能為移動優先而設計，那么你的客戶可能無法在搜索引擎排名中上升。

那么，如何開始呢?

1. 從正確的工具開始

Web開發人員和設計人員如果沒有一個很棒的工具包就什么都不是。

好消息是，有一些解決方案可以幫助你掌握適合移動用戶體驗的技能。例如，Skeleton非常適合需要流動網格和最小編譯的小型項目。

另外，Bootstrap可以為移動設備的前端開發提供一個通用的解決方案。有一個默認的網格系統，大量的組件和JavaScript插件可以使用。

有了正確的工具，您可以將對您的網站項目最有價值的內容最小化并按優先級排序。當涉及到內容和圖像時，這對于最大化網站速度和創造清晰度是至關重要的。

例如，看看ESPN的網站;它被分成非常容易理解的內容類別，非常適合在智能手機上滾動。這些網格狀的視頻讓你感覺你在使用一個像YouTube這樣的工具。

2. 優先考慮嘗試元素

一旦你有了合適的工具來幫助你，是時候開始從頭開始構建你的移動優先網站了。與其直接考慮最新的設計趨勢，還不如從基礎入手。

例如，移動頁面中的導航通常隱藏在漢堡按鈕下面。不過，您也可以將這個概念提升到下一個層次。例如，Shojin手機網站只在導航欄中展示了最重要的網站選項，以避免讓用戶不知所措。

這里的關鍵是讓事情盡可能的簡單，當你的用戶訪問你的網站時，不要限制他們可以做什么。盡管您希望保持站點上的交互元素數量較少，但您還需要確保這些元素易于發現和使用。

所有的按鈕和cta應該是清晰的和可點擊的。字體必須足夠大，可以從任何屏幕上讀取，導航系統必須100%簡單，不會減慢速度。

我們建議所有可點擊元素的平均高度至少為48像素。

3.使用響應圖像和svg

圖片是任何網站的重要組成部分。它們為你的設計增加了背景和吸引力。然而，如果你不小心的話，它們也會嚴重降低你的網站速度。

記住，當涉及到意象時，不同的手段有不同的要求。一個桌面頁面可能需要1200px寬的圖像，而一個移動的頁面最多需要400px寬的圖像。讓你的圖像工作的老方法是加載一個大分辨率的圖像，然后在每個平臺上使用相同的文件。不幸的是，這大大降低了下載時間。

相反，最好為移動和桌面解決方案提供至少兩個相同圖像的不同版本。您也可以考慮SVG。

svg具有難以置信的可伸縮性——比位圖更強。使用SVG，您可以確保任何圖標或圖形在所有設備上都保持清晰和可點擊。因為這些文件通常更小，你的網站加載也更快!Hubspot非常擅長使用svg。

復雜的插圖是HubSpot品牌的重要組成部分。如果這些圖像被保存為png或其他替代文件，那么加載它們將花費很長時間。因為他們都是svg，所以你可以在桌面和移動設備上享受相同的體驗。

4. 排版要正確

當提到移動優先設計時，不僅僅是大的圖形和圖像對你的網站有很大的影響。你還需要考慮你的網站在所有設備和平臺上的易讀性和清晰度。如果人們不能讀懂你為之設計的公司的價值主張，你就會遇到大問題。

盡量讓你的內容更容易閱讀。看看在各種設備上看起來最具吸引力的字體。

記住要平衡正文和標題字體的大小。你需要確保用戶滾動每一頁時的體驗是一致和流暢的。以IMPACT網站的手機版為例。

標題不像桌面版本的網站那么大，而且它們顯示在特色圖片的下面，而不是上面。然而，這有助于為移動用戶提供更吸引眼球和結構化的體驗。

甚至還有一個方便的“搜索引擎優化”標簽，如果用戶想找到更多相關文章，可以點擊它。

說到排版，請記住，重要的不只是大小和清晰度，還有網站的結構。你的類型應該自然地引導你的訪問者沿著頁面。

5. 掌握可用的設備特性

最后，在智能手機上，你可以完成一系列在臺式設備上無法完成的令人驚嘆的事情。你的用戶可以在他們的移動瀏覽器中打電話、打開應用程序、發送消息等等。他們還可以在房間里移動智能手機，利用AR和VR等概念。

利用智能手機設計可以提供的獨特功能，讓你有機會獲得獨特的用戶體驗。

充分利用手機體驗比你想象的要簡單得多。例如，在桌面網站上，您可以在聯系頁面上列出您的電話號碼。在手機網站上，點擊該號碼就可以開始呼叫。你也可以用同樣的方法處理電子郵件地址和社交媒體圖標。

根據你的實驗性程度，你還有很多機會超越手機功能。你可能決定創建一個網站的移動應用程序版本，你的客戶可以下載到他們的手機上。

另外，你也可以研究AR技術。這可以讓你的用戶練習如何將他們可能正在考慮從網上零售商購買的家具放置到他們的房子里，這樣他們就可以看到他們如何與其他室內設計選擇工作。

充分利用移動優先設計

最終，在現代世界，擁有一個可在移動和桌面設備上運行的響應式網站是必須的。然而，超越移動優先設計是超越游戲的好方法。

如果你能夠專注于創建一個將移動用戶體驗放在首位的網站，那么你就能夠創造出更有可能吸引用戶注意力并傳遞令人驚訝的體驗的內容。

如果沒有其他的東西，向你的客戶展示你有能力為手機設計，這是確保你能獲得盡可能多的新項目機會的好方法。