如何確保您的網站在所有設備上看起來都不錯

就在 10 年前，網站管理員不必擔心創建網站的多個版本以在不同平台上查看。 消費者在家中或辦公室使用台式機或筆記本電腦來研究產品、預訂假期和閱讀最新消息。 屏幕雖然大小不同，但以相同的設計模式為消費者呈現信息，並且有一種可預測性，使工作變得更容易一些。

今天，消費者通過台式機、筆記本電腦、智能手機、平板電腦、電子閱讀器和遊戲機訪問網絡。 這些設備使用不同的連接速度，有多種屏幕尺寸，不同的分辨率，並且在反應時間方面提供從烏龜到兔子的處理速度。 隨著消費者在任意數量的不同設備上瀏覽您的頁面，無論他們使用哪種設備與您的品牌互動，您如何確保您的網站看起來不錯？

在這篇文章中，我們將討論您需要牢記的因素，並提供一些有用的提示來指導您優化網頁以在多種設備上查看。

如何在不同設備上查看您的網站

如果您像大多數美國人一樣，您可能擁有智能手機或平板電腦，或兩者兼有。 但是，這些設備不太可能配備當今市場上所有不同的屏幕尺寸、處理器和操作系統。 幸運的是，HubSpot 的好人創建了一個工具，允許您在各種設備上查看您的網站，而無需在每台設備上進行測試。 他們的設備實驗室於 2013 年推出，您只需輸入網站的 URL。

設備實驗室不僅會向您展示您的頁面在不同設備和操作系統上的外觀，還會生成有關來自各種平台的移動訪問者百分比的快速報告。 您將看到 iPhone 4/4S、iPhone 5 和 iPhone 6/6 Plus 以及三星 Galaxy S3/S4/S5 設備和當今最流行的平板電腦設備的報告。

如何創建適合移動設備的網站

Device Lab 將幫助您在各種平台上查看您的網站。 您會看到您的頁面是否在平板電腦上被截斷或需要訪問者進行過多的縮放和滾動操作，但它不會告訴您如何進行必要的更改以開發適合移動設備的平台。 您希望確保您的消費者找到一個用戶友好的引人入勝的網站，無論他們使用何種設備訪問您的網站。

Entrepreneur 為希望創建在任何設備上看起來都很棒的網站的網站管理員提供了一些基本的起點。 對於初學者，您應該花時間查看您當前的網站並確保它與今天的網絡用戶相匹配。 全球有超過 10 億人使用智能手機，其中許多人將智能手機用作互聯網的主要接入點。

首先簡化您的整體網站設計。 您需要考慮更簡單的頁面設計和更大的字體大小，以加快加載時間並更輕鬆地在移動設備上查看。 舊報紙術語“首屏”在現代網頁設計中很重要。 如果您的查看者必須在移動設備上向下滾動頁面，他們會很快放棄，轉而支持精心設計的網站。 確保您的關鍵信息位於首屏（意味著無需滾動即可找到它）並使用可觸摸的大按鈕。 對接撥號已成為過去，但胖手指每天都會導致意外按下智能手機的按鈕。

如果您不想調整當前網站，您還可以選擇創建移動網站。 為您的企業開發移動網站會建立一個平行網站，該網站與您的傳統網站分開存在，但與您的傳統網站相連。 處理器確定訪問者是來自台式機/筆記本電腦還是智能手機/平板電腦，並在他們輸入您的 URL 時立即將他們重定向到您的移動網站。

不過，移動網站需要權衡取捨。 構建使用第二個 URL 的移動站點，尤其是 .m 子域，您在搜索引擎中的可見性將受到影響。 .m 子域未找到 Google 和 Bing，並推動網站管理員使用一個 URL 以提高知名度和搜索引擎優化。

話雖如此，您的預算可能會迫使您創建一個單獨的移動站點，而不是重建您的主站點。 一個不太顯眼的移動網站總比完全錯過移動受眾要好。 只要確保將您的移動網站鏈接到您的主網站，您就可以縮小一些差距。

最佳選擇

當然，您總是可以對您的業務進行大量投資，並重建一個可以隨時在任何設備上運行的網站。 通過自適應和響應式設計，您可以構建一個經過驗證的網站，每次訪問者點擊您的頁面時都能正確顯示，無論他們使用什麼設備。 以下是對這兩個概念的簡要介紹：

• 自適應設計：大公司在自適應設計上投入巨資。 自適應網站可在幾秒鐘內檢測並識別每個用戶的設備，並生成與該特定設備的功能相匹配的頁面。
• 響應式設計：使用級聯樣式表 (CSS) 技術，響應式設計創建了您網站的單一版本，該版本可以自動調整以在大多數設備上正確顯示，但舊手機除外。 響應式設計足夠靈活，以確保您的網站看起來不錯，無論設備上的顯示器大小或處理器速度如何。

這些方法有缺點。 自適應設計代表了當今網站設計的巔峰之作，但實施和支持的成本非常高。 響應式設計更實惠，但還沒有達到自適應設計的水平。 儘管如此，與其他選項相比，響應式在構建一個簡單的移動網站之前是遙不可及的。

當您考慮重新設計網頁時，請記住我們在這篇文章中提到的因素。 無論您的預算是多少，您都需要留出資金來設計一個在任何設備上都可見且用戶友好的網站。 今天是智能手機、平板電腦和越來越多的智能電視。 明天，消費者可能會在廚房的冰箱門上或浴室的鏡子上查看您的頁面。 立即準備您的網站以應對挑戰。