如何确保您的网站在所有设备上看起来都不错

就在 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) 技术，响应式设计创建了您网站的单个版本，该版本可以自动调整以在大多数设备上正确显示，但旧手机除外。 响应式设计足够灵活，以确保您的网站看起来不错，无论设备上的显示器大小或处理器速度如何。

这些方法有缺点。 自适应设计代表了当今网站设计的巅峰之作，但实施和支持的成本非常高。 响应式设计更实惠，但还没有达到自适应设计的水平。 尽管如此，与其他选项相比，响应式在构建一个简单的移动网站之前是遥不可及的。

当您考虑重新设计网页时，请记住我们在这篇文章中提到的因素。 无论您的预算是多少，您都需要留出资金来设计一个在任何设备上都可见且用户友好的网站。 今天是智能手机、平板电脑和越来越多的智能电视。 明天，消费者可能会在厨房的冰箱门上或浴室的镜子上查看您的页面。 立即准备您的网站以应对挑战。