Return to site

不好的响应式设计正在扼杀三分之二的转化率。如何解决它?

H5响应式设计

桌面和移动设备之间的转换差距为270%,因为移动网站很糟糕,我们都做错了。(现在我已经解决了这个问题,我将解释为什么以及需要做些什么来解决这个问题。)

从本质上讲,响应式设计应该通过使您的桌面设计适应更小的移动屏幕,使跨设备世界成为更加无缝的体验。不幸的是,将所有桌面内容压缩到如此小的屏幕中会产生完全相反的效果 - 实际上会导致转换率大幅下降。但是如何?

响应式设计使移动网站与移动访问者的内容混杂在一起。以桌面用户为基础构建,具有不同意图和不同心态的移动访问者可能无法找到他们正在寻找的内容,并使您的网站感到沮丧和困惑。是您在转化中损失巨大的原因。

这并不是说你应该放弃响应式设计。相反,您必须更具体地考虑移动Web 体验和移动访问者的心态,而不是简单地网站建设将桌面设计转移到移动设备。

要开发有用的响应式移动体验,我们必须做两件事:

  1. 最重要的是,请考虑移动客户访问您网站的原因;
  2. 并了解他们的意图。

(以下是您应该遵循的5个指标,以便更好地了解您的移动访问者。)

这两个参数将有助于确定您需要在移动网站上突出显示,删除或网站优化的内容,并更清晰地了解响应式设计应包含的内容。以下是设计移动体验时应考虑的5个基本要素:

优化响应式站点的5个步骤
1.优化图像缩放并考虑价值

大多数图像通过响应式设计缩小。但是,在桌面上看起来不错的图像可能突然变成移动网站的主导和分散注意力的部分。虽然图像是可扩展的,但根据它们的价值,它们可能不是移动设计所必需的。考虑图像在响应式设计中的显示方式。它是否有效地使用了视觉效果?如果图像占据了手机上的整个屏幕,或者仅仅是网站的一个很好的核心,那么就该重新考虑一下这个图像在设备到设备中的使用方式了。例如,辛普森一家解决方案的桌面图像不能很好地扩展并超越移动屏幕,使设计混乱,并且难以理解该页面上发生的事情。

在桌面上运行良好的图像(徽标和主图像)完全超过移动屏幕,在手机上几乎没有价值,并且难以理解产品。

另一方面,户外零售商REI的网站使用相同的照片作为移动和桌面上的焦点,但它可以根据访问者的需要进行扩展。

2.简化导航

手机网站最重要的功能之一可能是一个清晰而实用的导航栏。拥有一个可见,易于访问的菜单或搜索栏,可帮助移动访问者快速到达目的地。大多数移动访问者都会考虑到一个目标来访问移动网站; 他们会浪费时间查找菜单栏,搜索关键字,然后点击他们需要的页面。

分析您的移动客户在您的网站上进行的搜索和搜索是了解如何根据这些需求定制移动网站的必要条件。您可能会发现大多数移动访问者使用搜索栏而不是点击您的主要号召性用语按钮; 因此,您可能会重新设计移动网站,以便更突出地展示搜索栏,从而帮助移动访问者更快地实现目标。此外,了解人们在网站上实际搜索的内容将为您提供缺失,不清楚和优化需求的指示。

因为他们在旅途中,移动访问者通常需要一个联系页面,通常寻找一个地址或电话号码,以便轻松到达您的公司。实体企业应特别注意这一点,确保他们通过网站导航或主页本身直接找到易于查找的联系页面。如果发现您的简单和直接,客户更有可能完成订单,访问您的实体店,并对体验感到满意。

3.杀死响应式弹出窗口,使用移动叠加层

为移动设备上的桌面体验而构建的叠加层和弹出窗口往往会分散移动访问者登陆您网站的主要目的。相反,引导他们并将他们集中在一个单一的目标 - 他们的目标。使用桌面解决方案实现移动体验会导致转换失败。由于桌面覆盖/弹出窗口的设计不符合当今移动设备上的19,000种屏幕尺寸和分辨率组合,因此明智的做法是不在移动设备上使用它们。您不希望叠加适合桌面的分辨率和规格 - 这些不会缩小,使移动导航无法忍受。

如下面的示例所示,错误的叠加层会完全接管移动屏幕,阻止您看到任何其他内容,难以点击,并且不适合移动设备屏幕

相反,研究移动访问者在您网站上的行为方式可以帮助您确定叠加层应该要求的内容,导致甚至是应该包含哪些信息。考虑移动技术必需品和客户的移动行为,以设计覆盖移动访问者的确切需求。

少即是多:简化,缩短和优化文本

虽然看起来很明显,但文本往往是一个功能,很少有高端网站建设花时间开发有效的桌面(更不用说移动)网站。为了避免过度拥挤和混淆,最好保持文本简洁,并指出网站上出现的单词数量。这是信息层次结构发挥重要作用的地方。您的公司可以重新排列,重写和重新格式化任何标题和标语,以便仅为移动访问者提供最重要的信息。这种做法还可以确保文本不会占用具有长而冗长的视觉效果的页面。

虽然所有这些文本似乎在桌面上运行良好,但移动是一个完全不同的故事。文本完全隐藏页面,无法读取,并且所有转换元素(例如信任符号和号召性用语按钮)都被推到了首位。这是响应式设计失败的另一个案例:

另一个要考虑的因素是移动设备上滚动的自动特性。桌面可以一目了然地捕获完整的消息,文字和图片。虽然较少的人在桌面上滚动,但在移动设备上,访问者立即开始滚动,希望能够吸引他们的注意力。这应该会影响您根据滚动的位置和方式编写标题的方式。文字应简洁明了,以便吸引眼球,对读者有价值。

5.重新考虑并澄清你的号召性用语

移动网站应该有一个明确的目标,即号召性用语按钮应该支持。号召性用语按钮应该是移动访问者关注的第一个元素,它应该立即告诉访问者该做什么。例如,在线学习平台Udemy在其移动登陆页面的顶部提出了一个非常明确的号召性用语,与公司的总体目标保持一致。他们知道他们的客户来到他们的网站学习,所以为了帮助他们立即实现这一目标,他们提供了一个用于查找课程的按钮和一个用于增强导航的搜索栏。

立即创建无缝设计

虽然我们的目标是为您的客户创建跨所有渠道的无缝体验,但为了增加转化率并在移动设备或任何其他设备上创造更好的体验,公司必须更好地了解他们的客户,了解他们的行为和心态。选择实施简单,通用的解决方案,可能会破坏他们的转换和体验。在设计下一个目标网页或网站之前,请务必牢记移动客户的特定行为和需求。

杭州网站建设嘉兴网站建设湖州网站建设义乌网站建设的企业,我们可以上门进行服务。

All Posts
×

Almost done…

We just sent you an email. Please click the link in the email to confirm your subscription!

OKSubscriptions powered by Strikingly