你的目标市场已经变得移动化。移动用户最多可将其时间的12%花费在其设备上浏览，这相当于每月花费87个小时，或每年花费1,044个小时。其中90%的时间都花在了使用移动应用上。

　　这就是为什么拥有移动APP对你的业务如此有价值的原因。难怪每个人似乎都在追赶潮流。现在，甚至67%的小型企业都拥有移动APP。

　　问题是，许多APP只是对本来就不好的网站的可怕扩展。尽管你可能会渴望直接开发自己的产品并将其推向市场，但这是一个巨大的错误。移动APP是你网站的门户。因此，尝试在没有进行关键的网站优化的情况下实施它们会直接影响创建应用程序所需的时间和金钱。

　　在考虑使用移动APP之前，你需要进行以下15个网站调整。

　　速度优化

　　速度对于用户体验至关重要。这意味着，如果你希望你的网站和移动APP提供出色的用户体验，那么你要做的第一件事就是优化网站速度。

　　为此，你需要进行以下调整：

　　1.缩小

　　缩小可减少网站CSS，JavaScript和HTML内容的大小。它可以通过删除任何不必要的网站代码来工作，例如：

　　JavaScript中不必要的代码;

　　CSS中未使用的空格;

　　HTML中不必要的换行符。

　　如果你使用WordPress，则有很多可用的插件可以帮助你完成此过程，包括Fast Velocity Minify和Autoptimize。

　　2.压缩

　　文本压缩还可以提高速度，尤其是在博客等文本繁多的网站上。大多数Content Delivery Network支持发送压缩文件，因此你可以通过诸如Gzip之类的工具设置默认压缩。

　　如果你没有自己的网站，则可以使用Check GZIP Compression查看是否已设置压缩。如果不是，最简单的安装方法是通过插件，例如W3 Total Cache，WP Super Cache或WP Rocket。

　　3.最大化缓存

　　HTTP缓存是浏览器存储资源副本时可以更快地重新访问它们的时间。使用HTTP缓存头，可以定义响应的时间，方式和时间。

　　你可以将服务器配置为附加HTTP Cache-Control标头，并对其进行修改，使其保留数据的时间。一种方法是将标头直接添加到代码中。

　　这是一个PHP标头的示例，其中Cache-Control设置的max-age等于84,600秒(1天)：

　　header('Cache-Control: max-age=84600')

　　通过设置最大有效期限标头，可以确保重复访问者不会降低访问他们之前下载的资源的速度。旨在尽可能安全地在尽可能长的时间内缓存尽可能多的资源。然后提供验证令牌，以有效地重新验证已更新的资源。

　　4.减少JAVASCRIPT加载时间

　　JavaScript可能会导致延迟，特别是如果捆绑有大量JavaScript时。在普通手机上，处理这些捆绑包所花费的时间可能比台式机长5–10倍。你可以通过代码拆分来解决此问题。

　　代码拆分将你的JavaScript包分成几部分，以便仅在用户需要时才更快地交付它们。可以使用React，Parcel和Webpack之类的工具将其应用于路由级别或组件级别。

　　5.优化图像

　　视觉效果对于提高用户参与度很重要，但是你最后想要的是让它们减慢用户体验。值得庆幸的是，市场上有很多工具可以帮助你压缩和优化图像。

　　6.格式化动画内容

　　GIF格式在动画中很流行，但实际上从来没有将其用作动画平台。通过切换为更合适的视频格式，你可以大大减小文件大小并加快页面时间。

　　你可以使用FFmpeg工具将动画GIF转换为mp4文件。你还可以使用有效类型API工具来确定较慢的带宽，并自动将其从提供动画图像转换为更小的JPEG。尽管确实消除了一些用户体验，但比站点无法加载或运行缓慢不正常要好。

　　7.减少插件

　　WordPress有超过54,000个插件。尽管它是市场上最大的平台，但即使竞争的选件，仍然可以提供成千上万种插件。有插件几乎任何你能想到这些天-电子商务插件，像的Bigcommerce为WordPress，邮件营销插件，像Mailchimp和转化率优化插件，像OptinMonster。其中许多添加了有价值的功能。

　　问题是，太多的插件会降低你的网站速度。首先，请确保没有安装任何未使用的东西。接下来，卸载可通过其他方式与你的网站集成的服务的所有插件。当你可以使用API密钥进行集成时，没有理由使用插件。

　　最后，如果你仍然有很多插件，请寻找一些可以替代少数特殊产品的多合一解决方案。例如，当所有三个解决方案都有一个时，请不要使用单独的插件进行缩小，压缩和缓存。但是，请执行尽职调查，因为诸如Jetpack之类的多合一插件会使你的网站变慢的速度比其他任何网站都要慢。

　　多少个插件算太多?这是一般的经验法则：

　　如果你拥有共享或预算的云托管，则不得超过五个;

　　如果你使用云托管，VPS托管或专用服务器，则不超过20个。

　　8.使用AMP

　　加速移动页面(AMP)是指一种开源Web编程语言，可将静态内容立即传递到移动设备。它基本上是精简，精简的HTML版本，专门用于加速移动设备上的非交互式网页。

　　由于它是精简版，因此你需要权衡一些功能以实现这种快速的速度。有两个潜在的缺点需要注意：

　　JavaScript仅限于现成的AMP库;

　　启用了延迟加载功能(向下滚动图像时会加载图像);

　　潜在客户的产生可能会受到影响，因为AMP经常删除选择加入的表格。

　　另一方面，最大的优势(除了提高的速度)是搜索引擎的移动优先索引功能可以在搜索结果中提升AMP页面。有许多用于启用AMP的插件可供选择，包括AMP，用于WP的AMP –加速的移动页面和AMP WP – WordPress的Google AMP。

　　9.地址重定向和链接断开

　　重定向和断开的链接可能会破坏你的用户体验，并减慢你的网站速度。

　　重新导向

　　你将要尽可能减少重定向，因为它们会影响页面速度，甚至会影响网站的整体加载时间。当用户使用移动设备时，延迟往往会变得更加明显。

　　你可以使用免费的工具来检查你的网站是否有任何重定向。找到某些内容后，请删除所有不需要的内容，并对需要更新的内容进行更改。

　　如果你有一个安全的站点，则还可以使用HSTS删除SSL重定向。

　　由于重定向和断开的链接会随着时间的流逝再次出现，因此这两项检查都应作为网站管理的常规部分。

　　10.持续测试

　　在介绍移动APP之前，我们已经介绍了九种重要的方法来优化你的页面速度。尽管这可以显著提高网站性能，但你仍有更多的改进机会。

　　有数百种工具可用于测试你的网站页面速度和移动准备情况，但是最好的起点是Google的PageSpeed Insights工具。

　　它将为你提供网站的桌面版和移动版的当前页面速度得分，并就如何改进提出具体建议。

　　下一步是使用“ 测试我的网站”进一步分析移动页面的速度和友好程度。

　　你需要做的就是输入你的网站URL，它将扫描你的网站并进行评估。你还可以获得包含优化建议的免费报告，以换取提交你的电子邮件。

　　网站速度还提供了巨大的SEO收益。除了编写高质量的长格式内容并获得反向链接外，网站速度对增加网站流量也有重大影响。

　　在2019年初，我进行了个人案例研究，在15天内我写了尽可能多的嘉宾帖子。在这段时间内，我收到了247个反向链接，自然流量增加了372%。

　　但是，与网站速度对我的移动流量的影响相比，这显得微不足道。根据Google Analytics(分析)数据，通过将我的移动设备速度从33提升到75+，我的移动设备排名提高了1775%。

　　UI优化

　　速度可能是UX层次结构中的最高级别，但这不是唯一的因素。还有其他要考虑的组件，例如：

　　找到你想要的东西很容易;

　　该网站适合你的移动屏幕的程度;

　　使用起来很简单;

　　它看起来有多吸引人。

　　你可以使用以下站点调整来简化和最大化用户界面。

　　11.简化你的网站结构

　　你的网站必须直观易用，以便用户浏览，尤其是当他们尝试在移动设备的小屏幕上浏览时。

　　确保简化了层次结构，并且嵌套的内容级别不超过一个。你理想的网站结构应如下所示：

　　主页

　　类别(或部分)

　　子类别(仅适用于较大的网站)

　　个别页面和帖子

　　关注用户通常会寻找的内容，并规划出他们将采取的常见路径。然后，你可以按层次结构排列类别，这将对你的受众群体最有意义。

　　你还应该使用知识库软件为寻求常见问题答案的任何用户创建中央资源或知识库。

　　这是关于你可以进行的最简单的设计调整，它将对台式机和移动设备的使用产生持久影响。

　　12.专注于内容设计

　　围绕移动设备设计内容可能会有些棘手，但这对于成功的移动体验至关重要。一个糟糕的网站设计可以杀死你的应用内容。

　　最重要的是，你需要让你的内容发光，并尽可能减少干扰。为此，你可能需要删除表格，图形和其他不适用于小屏幕的笨重元素。

　　你还需要精简页眉，页脚，菜单和侧栏之类的功能，以便可以在较小的屏幕上隐藏或折叠它们。由于许多移动设备不具有此功能，因此请对其内容禁用任何悬停效果。

　　你也不想使用太多文字。你可以使用语法目标和受众等工具来减少文本，以帮助你创建更简洁的文本。甚至更好的是，集中精力用更多的视频内容替换文本，以最大程度地提高移动体验。

　　13.减少banner和滚动条

　　滚动条已经流行了一段时间，但是人们通常会向滚动条添加5-6张高质量的图像，这会增加网站的整体加载时间。此外，研究表明，滚动条会惹恼用户并降低可见度，尤其是在移动设备上。

　　标语可能会导致类似的问题，特别是如果标语在图像中有任何嵌入的文本。如果当前有带有文字的banner，则应使用HTML和CSS呈现文字，而不是将其嵌入图像中。这将使其更灵活，更易于在较小的屏幕上查看。

　　14.优化表格和接触点

　　如果你的网站上有表格，请注意字段类型，长度和标签。在任何设备上，一切都应该清晰可见。启用功能，以便如果用户点击某个字段以输入信息，则该视图会放大到正确的位置。

　　检查是否有需要其他键盘或触摸屏的字段类型，例如邮政编码，电话号码或电子签名。如果是这样，则应将其设置为在点击时触发正确的键盘，因此用户不必手动切换。

　　确保所有触摸点和按钮都可见并且足够大，以便可以用手指在小屏幕上轻按。标准建议是它们的大小应约为48 x 48 dp。将文本放在按钮内而不是上方或下方，以便于识别。

　　15.简化下单流程

　　如果你经营一个电子商务网站，那么最后的调整建议是给你的。

　　大约一半的电子商务流量来自移动设备，但要购买更多的人，仍然可以在台式机上进行。这很可能是因为针对移动设备未正确优化订购，结帐和付款的整个流程。

　　要确定你的过程需要改进的地方，请跨多个设备和屏幕尺寸完成所有步骤，并确定所有难点。问题可能是我们已经解决的问题，例如表单导航困难或接触点太小。

　　但是，即使进行了优化，但如果你需要大量数据，从移动设备上输入所有数据仍然很麻烦。

　　你可以通过以下方式之一对此进行补救：

　　允许用户创建配置文件，该配置文件将保存并预先填充其结帐信息，包括送货地址和信用卡号

　　与其他付款网关集成，后者不需要它们重新输入信息。

　　结论

　　手机屏幕越来越大，平板电脑也越来越复杂，因此难怪更多的观众正在通过移动设备登录并进行交互。

　　移动APP可能是与用户进一步互动的好方法。但是，只有先优化你的网站才能确保流畅的用户体验。