响应式设计如何让你从你的网站得到更多

我们生活在一个多屏幕世界中。我记得在80年代的孩子中成长为一个孩子，我们的五口之家在我们的生活中恰好是一个屏幕。这是家庭电视（我认为的索尼Trinitron），我们用它来看电视，VHS磁带和电脑（我们有一个Commodore 64）。

但时期已经改变了......很多。前一天，我和家人坐在客厅里。在我的妻子，我们的宝贝女儿和我自己之间，我们都被屏幕包围着。我们有2个智能手机，iPad，iPod，LED电视，MacBook，Wii U控制器和婴儿监视器。

一个房间里有8个屏幕。

甚至疯狂的是，每一个单一（除了婴儿监视器）都有能力浏览互联网。将其添加到每个人具有不同的分辨率。

这可以为现代网络设计师创造一个非常棘手的情况。为什么？您的艺术作品需要在夸张的设备上看起来很甜蜜。

那么现代营销人员要做什么？

一个选项只是为了忽略移动屏幕，因为大多数人仍然在传统计算机上浏览互联网，但这并不主动，真的限制了下一个网站构建的保质期。

统计数据显示，随着时间的推移，手机流量将继续增长，考虑到新的手持设备的流行，这是有道理的。事实上,根据Masable，2013年在美国，17.4%的网络流量来自手机，较2012年11.1%的流量增长了6%以上。

挑战

一个网页设计师要如何处理所有这些可用于互联网设备的选项?我们曾经专注于迎合智能手机用户，为他们提供一个完全独立的移动版网站。虽然这在某种程度上是有效的，但它是一个完全独立的web属性，需要额外的开发资源和最终的成本。reybet雷竞技下载内容还需要在两个版本上进行维护，这只会让事情变得更复杂。

在这个时代的定位特定设备和决议的想法是荒谬的。然后有更多的分辨率，手机和平台。如果您采取了这种方法，当您完成针对每个特定设备的目标和编码时，您的网站将超出日期，并且是重新设计的时候了。听起来有效，对吗？我们没有这么认为。

然而，有趣的是，这一挑战存在于分辨率谱的两端。越来越多的人不仅在有限的显示器(如智能手机或平板电脑)上浏览网页内容，而且他们也在真正高分辨率的显示器(如高清电视)上浏览内容。

“非理想”解决方案

尽量最低，我们需要专注于合规性。如果我们对用户必须平移和缩放以在移动设备上查看Web内容（我们真的不应该是）那么，我们需要做的就是确保我们的网站有一些基线合规性。这是你应该做的：

• 避免闪存，QuickTime或可能无法用于移动用户的任何其他插件
• 不要超过960px宽或人员将在滚动城
• 不要使用较小的字体然后11px
• 确保主要站点导航相当大

但真正的问题是，这足够好吗？我们愿意满足此解决方案吗？

理想的解决方案

这种情况下的理想解决方案是响应性的设计。响应设计的总体思想是建立一个具有能力的单个Web属性动态改变其显示基于它的设备（无论硬件或软件平台如何）。雷竞技苹果下载官方版这适用于低分辨率设备以及真正的高分辨率设备。

上面的图片显示了响应的设计。它显示了如何在多个设备上出现具有响应性设计的网站。请记住，它仍然是同一个网站（我们没有设计一个单独的移动友好版本），但无论我们的最终客户使用的设备是什么，网站都经过优化。

现实是，响应性的设计更像是拥有一个网站的想法，这些网站在多种设备上呈现良好。它仍处于早期几年，但我们正在看到越来越多的网站，这些网站是响应的。

在开发世界中有一个伟大的辩论，以便在响应方面的最佳方式。我们在新品种中休息的解决方案是我们的许多同事，正在与我们的网站一起启动Twitter Bootstrap框架。

此框架使用12列网格系统，允许响应站点。我们所看到的许多主题和平台（包括HUBSPOT COS.）正在利用这一框架，我们对结果印象深刻（以及从开发角度的易用性）。

执行

现在我们希望已经激起了您的兴趣，并且您可以明白为什么响应式设计很重要，我们想向您展示如何在您自己的组织中实现它。

响应式设计始于你的网站，但很快成为你营销策略的一个更深的部分。你会怎么想?首先，正如我们在这篇文章中提到的，响应式设计是你的网页呈现的一个重要组成部分，随着互联网浏览器改变他们的行为，它变得越来越必要。

第一步在考虑使用响应设计重新设计您的网站时是看您的分析。使用哪些类型的设备使用访问您的网站？如果您仍然有一个主要使用桌面的受众，那么响应的设计可能不是必要的转变。但是在翻盖方面，如果您的流量改变了他们的行为，现在正在使用平板电脑和移动设备访问您的网站，那么您可以从响应的网站上大大受益。

看看下面的图表，将我们的实际交通来源与去年的此时相比。这些图表代表了在线发生的大规模班次。

如果您的图表看起来像这样，那么我们鼓励您考虑以响应性设计重新设计您的网站，因为几个原因。当您的网站响应时，这里有六种积极影响，您可以期待：

1)增加转换

在我们之前的内部人士博客上的帖子中，我们谈到了如何用销售就绪网站最大化转换。这是相同的方法论 - 如果您的网站准备好销售（即，有明确的转换路径映射到您的买方Personas），您将在您最大化转换的路上。

有一个销售准备网站的一部分是有一个网站设计的响应。由于响应式网站迎合了访问者使用的特定设备，因此与你公司的整体体验得到了改善，用户不太可能去你的竞争对手那里。raybet电子竞技

2）较低的反弹率

更常常不会，如果访问者正在移动或平板电脑设备上浏览您的网站，并且该网站并不响应，则它们将离开（即“弹跳”）。这意味着当他们击中您的主页时，他们必须捏住缩放或滚动以找到搜索框（例如示例），他们将沮丧并继续前进到其他内容。这可能对你的反弹率有一个戏剧性的影响 - 以一种糟糕的方式。

有了响应式网站，这些用户就不必担心用手指夹住和滚动来找到他们要找的东西。该网站将适应他们使用的任何设备。反过来，他们可能会点击并访问更多页面，从而降低你的跳出率。

3)页面排名增加

我们介绍了这一点，但搜索引擎（特别是谷歌）现在有利于搜索结果中的响应网站。具体地，如果用户从他们的移动设备搜索，谷歌更有可能为他们服务于移动响应的相关网站。

他们的最终目标是给予搜索者他们正在寻找什么，这意味着减少他们对无法找到他们正在寻找的东西的可能性。

4）更强大，统一在线存在

大多数迎合移动访客的公司都有一个移动特定网站。这个网站生活在子域上，有时看起来不同，然后是主场。它仍然适合品牌标准（至少应该），但它不觉得同一网站。

但如果是响应式网站，你就不用担心了。你一开始就设计了你的主站点，所以它在不同的设备上看起来是一样的(尽管有些部分稍微改变了)。

5）降低开发成本

有了响应式网站，你就不必再为手机建立单独的网站了。这意味着你的开发成本可以减少一半。维护成本也是如此。我们都知道维护一个网站不是免费的，所以有两个网站在运行，你要支付两倍的维护费用。即使重新设计您的网站可能是一笔前期费用，但从长远来看，您将节省金钱。

6)竞争优势

如果您的竞争对手尚未接受敏感性设计，贵公司有机会获得竞争优势。raybet电子竞技从比赛中脱颖而出 - 更好的是，拿走留下非响应网站的访客并将其转换为您自己的客户！

结论

现在，比以往任何时候都更重要的是，我们的网站可以通过多种设备访问。由于我们的客户的行为正在改变，我们需要与他们一起发展，我们觉得优化您的网站使用响应式设计是一个显而易见的。这不仅可以节省时间(和头痛)，还可以降低开发成本，你的网站在每台设备上都有一个优化的显示。

谷歌也更加关注那些针对手机进行优化的网站，甚至给予这些网站更高的排名。随着搜索世界的不断变化，拥有一个移动优化的网站将增加在线能见度。

如果你还没有被说服，可以这样想:人们正在通过他们的移动设备访问你的网站，不管你是否希望他们这样做。建立你的网站优化转换和生成,但是当那个人使用他们的智能手机或平板电脑进入你的网站,不能找到他们正在寻找或纾困,因为他们必须滚动,然后你可以失去转换成铅。基本上，你把钱留在了桌上。