贵阳网站开发:如何测试WordPress网站的响应性设计

2019.04.15 贵阳网站开发

87

Ethan Marcotte在2010年发表的一篇文章中首次向我们介绍了响应式网页设计。分开的单子标题(如你所料)响应Web设计.

就在同一年-事实上,就在几周前-iPad成为了目前向公众发布的移动平板设备的第一波浪潮,改变了我们上网和相互交流的方式。

从那时起,响应性设计逐渐变得更加广泛。

但是对于绝大多数使用网络的人来说,这个词毫无意义。他们只是想让网站在他们的设备上正确渲染。他们不想点击微小的超链接,这些链接可能会或者可能不会带他们去他们想要的页面,当然他们也不想等着一个被资源密集的代码和图像压在一起的页面,下载的时间太长了。

他们贵阳网站开发想要快速、易于使用的页面,这就是你想要的。从响应性设计中获得。

简而言之,这就是你阅读这篇文章的原因。在这篇文章中,我们将帮助你将要。

移动响应能力现在是一个排名因素

谷歌几个月前宣布,移动设备上网站的用户友好性将成为一个排名因素。

谷歌宣布2月:

从4月21日开始,我们将扩大使用移动友好作为排名信号.这一变化将影响全球所有语言的移动搜索,并将对我们的搜索结果产生重大影响。因此,用户会发现更容易获得相关的、高质量的搜索结果,这些搜索结果是针对他们的设备进行优化的。

尽管如此,4月21日还是来来去去,什么也没有发生。至少不是尚未。但你可以保证只是时间问题.

更新被称为动员在SEO和在线营销圈。这对企业来说也是一件大事;事实上,这是一个非常重要的最新消息,在美国和英国都有报道。

在今天的帖子中,我想看看你可以测试你的网站-或者你的客户-的方法,看看他们是否能有效地移动响应。如果他们,我们会报道你能做些什么。

什么是好的反应设计?

贵阳网站开发

响应性设计能够流畅地适应所有屏幕大小和分辨率。

很简单,响应性设计的目标是为每个用户提供一种持续可用的浏览体验,无论他们使用的是什么设备。

更具体地说,这意味着所有功能在每个设备上都应该以相同的方式工作和行为。在你的典型博客中,这可能是从社交分享按钮,到邮寄列表注册表格,到导航菜单的所有内容。此外,无论终端用户正在浏览什么设备,内容都应该很容易被消化。

通常,有四种屏幕类型:

  1. 台式机,

  2. 笔记本电脑

  3. 片剂,和

  4. 智能手机。

每个制造商的确切尺寸差别很大。你的网站应该在每个变体上看起来都是一样的。听起来很有趣,对吧?

你是需要一个有反应的网站?

快速回答:你将来一定会这么做的。毫无疑问。但是你需要一个吗?现在?另一个快速回答:几乎可以肯定。

如果你不花太多时间查看GoogleAnalytics中的数据,这是一个纠正这个问题的好时机-特别是对于那些在移动设备上访问你网站的人来说。从这些数据中,您可以了解有多少人使用移动设备访问您的站点。你也可以发现他们在这里呆了多长时间,他们有什么样的经历。

根据您如何设置Analytics,您还可以了解有多少人使用移动设备转换为客户,加入您的邮件列表或注册免费试用您的服务或软件。

要查看数据,登录到GoogleAnalytics帐户,选择要查看的站点并导航到受众>移动>概述.

在这里,你会看到桌面,手机和平板电脑的分析。

如果您的站点没有响应性,请查看有关人们如何与您的站点交互的数据:

  • 弹跳率

  • 网页/会议

  • AVG会议持续时间

  • 目标转化率

如果数字明显低于桌面统计数据,则您手上有一个严重的问题。这些数据告诉你,手机和平板电脑上的人在访问你的网站时没有很好的体验。

这意味着是时候做点什么了。

测试站点的移动响应性

如果您不认为您的网站是移动响应,您必须做的第一件事是运行一些测试。值得庆幸的是,有很多在线工具可以帮助你评估一个网站在移动设备上的外观和工作方式。

几秒钟后我们贵阳网站开发就会看到其中的一些。但是现在,让我们执行最简单的测试。

如果你在台式机上,去你想要测试的网站,让它加载,然后使你的浏览器屏幕变窄。当你这样做的时候,如果网站有一个响应性的设计,来自网页的元素会互相折叠,但是你仍然可以通过滚动看到整个页面。

如果您正在使用移动设备,只需访问您想要测试的站点,并查看它如何在您的计算机上呈现。如果它看起来与桌面版本完全相同,但是缩小了,那么您的站点就没有响应能力了。

如何使用在线仿真器测试多个设备

运行这两个简单的测试是很好的,但是太多的机器呢?从iPad到谷歌Nexus再到三星Galaxy智能手机?你的网站如何看待这些?

幸运的是,你不必在市场上的每一个设备上花费一小笔钱。相反,使用一个可用的模拟器站点来运行您的测试。

让我们看看其中的一些。

MobileTest.me

这一个测试你的网站在六个流行的移动设备仿真器,包括iPhone 5,HTC One和谷歌Nexus。

要测试网站,请单击感兴趣的设备,并输入要测试的站点/页面的URL。几秒钟内,模拟器将检索设备上的页面。不仅如此,页面链接和其他数据仍然处于活动状态,因此您可以通过模拟器浏览站点。

使用MobileTest.me.

应答器

一个漂亮的仿真器,主要集中在苹果设备上,但也包括几台Android机器。不必依次测试每个设备,比如MobileTest.me,只需输入测试URL并向下滚动页面即可。

正如您所做的,您将看到它在流行设备上的外观,无论是纵向模式还是横向模式。

使用应答器.

我有反应吗?

这里的过程相同:输入测试URL以获得结果。这一次,您不会滚动;您将在屏幕顶部看到通用设备的结果。如果你点击屏幕内的每一个,你可以滚动和使用正常的网站。

使用:我有反应吗?.

谷歌的移动友好测试

还有一个值得提及的问题:谷歌自己的工具。

使用Google的移动友好测试.

接下来怎么办?

此时,您已经了解了响应性设计的重要性,并且了解了您的站点在多个设备上的样子。但你需要采取行动吗?

如果您的站点可以跨所有设备运行,您就不需要做任何事情,只要继续为当前和未来的访问者改进您的站点就行了。

如果你的网站工作,你有三个选择:

  1. 将当前设计转换为响应。这很可能是更多的麻烦,而不是它的价值。

  2. 使用移动主题。这违背了一致性和可用性这一关键的响应性设计原则。

  3. 采用新的移动响应主题或设计。虽然不是最便宜的选择,但从零开始可以说是唯一不代表某种妥协的选择。

顺便说一句,我不应该说我们制作漂亮的响应主题,不少于21人可供选择.

一旦安装了新的主题,就该对其进行测试了。以下是三个需要牢记的关键事项:

  1. 用户很容易浏览您的网站吗?

  2. 内容容易阅读吗?

  3. 用户很容易跟随你的行动号召吗?

把你网站的每一个部分都当作用户来浏览,并解决你发现的任何问题。如果您正在使用我们的主题之一,并且遇到了某个问题,只需联系我们很乐意帮忙。

包起来

贵阳网站开发认为,谷歌“强迫”人们采用移动响应设计的举措早就应该实施了。

同样,大型网站和大型企业在转换业务方面也步履维艰。这种潜在的交通和销售损失是他们采取行动的必然信号。

对于自由职业的网页设计师和主题建设者来说,你可能会进入职业生涯中最繁忙的时期,因为你的工作节奏在加快。您有多少客户仍在使用无响应的设计?有多少个没有响应的站点在等待更新?我一想到就不寒而栗!但有一件事是肯定的:有很多事情要做,特别是如果你能清楚地表达响应性设计的重要性的话。

如果您需要向客户说明响应性设计的重要性,以及他们的站点与竞争对手相比的重要性,那么在线仿真器是一个很好的工具,应该可以更容易地销售您的服务!


关键词

最新案例

联系电话 400-6065-301

微信咨询 寒总监