手机上的企业网站：常被忽视的细节

许多企业主是在办公室用笔记本电脑查看自己网站的。页面整齐，照片很大，一切看起来都没问题。但潜在客户往往换一种方式打开它：点开 WhatsApp 里收到的链接，用手机浏览，可能是在等开会，也可能正站在项目现场。

在小屏幕上，笔记本电脑上看不出的问题会变得很明显：按钮难点，表格被截断，表单填起来很累。本文介绍最常被忽视的几个方面，以及如何自己动手检查。

为什么手机上的显示效果很关键

原因有两个。第一是访客。打开 Google Analytics 或您使用的其他分析工具，查看按设备类型划分的访客比例。每家企业的数字都不同，与其猜测，不如看看自己的数据。

第二是 Google。Google 使用网站的移动版本来编制索引和确定排名，并要求移动版与桌面版的内容保持一致。所以，如果为了让手机页面更简洁而隐藏了某些信息，Google 也可能读不到这些信息。

按钮和链接太小

手指没有鼠标指针那么精确。又小又挤的按钮会让访客点错，进而感到烦躁。WCAG 2.2 无障碍指南规定，触控目标至少为 24 × 24 CSS 像素，或者目标之间留有足够间距。这只是下限，并非理想尺寸。“索取报价”这类主要按钮应当大得多，并且拇指容易够到。

几个常被遗忘的小细节：

• 电话号码无法点击。如果号码只是普通文字，访客必须手动复制。使用 tel: 链接后，手机会直接提示拨打。
• 菜单层级太深。用鼠标操作很顺手的三级菜单，在手机上就很难用。精简菜单，确保重要页面一两次点击即可到达。
• 悬浮按钮遮挡内容。WhatsApp 按钮、在线聊天按钮和“返回顶部”按钮可能挤在屏幕一角，挡住文字或其他按钮。

放不下的规格表和文档

制造商和经销商的网站通常有列数很多的规格表：编号、尺寸、材料、重量、包装。在笔记本电脑上可以看清，在手机上则列被截断，或者整个页面可以左右拖动，版面因此变得凌乱。

解决办法有几种。可以让表格在自己的区域内左右滑动，而页面本身保持不动。较短的表格可以在手机上把每一行显示为一张小卡片。非常大的表格只显示最重要的几列，并提供完整的规格书供下载。

还要注意那些只存在于大型 PDF 中的信息。在手机上，访客必须先下载整个文件，才能读到其中任何一行。

在手机上填起来很累的表单

在手机上打字更慢，也更容易出错。询价表单每多一个栏位，就多一个让人中途放弃的理由。

• 只问必要的信息。首次联系时，姓名、公司、联系方式和需求通常就够了。其他细节可以在跟进时再问。
• 使用正确的栏位类型。正确设置的电子邮件和电话栏位会让手机显示合适的键盘：输入邮箱时带 @ 符号，输入电话时显示数字键盘。
• 允许自动填充。通过 autocomplete 设置，浏览器可以填入访客手机上已保存的姓名、邮箱、电话和公司名称。
• 清楚的错误提示，紧挨着填错的栏位显示，而不是放在看不到的页面顶部。

遮住屏幕的弹窗和横幅

在笔记本电脑上只遮住一部分屏幕的弹窗，在手机上可能遮住整个屏幕。如果关闭按钮很小，访客干脆就离开网站了。

Google 本身建议不要用弹窗遮住整个页面，而是使用只占屏幕一小部分的横幅。Google 指出，这类干扰性元素会让搜索引擎更难理解页面内容，也可能削弱访客的信任。法律规定必须显示的提示除外。

移动网络下的速度

办公室里的笔记本电脑通常连着稳定的网络，路上的手机却不一定。大尺寸产品照片、背景视频和过多的附加脚本，在这种情况下影响最明显。

Google 使用三项核心网页指标（Core Web Vitals）。“良好”的标准是：主要内容在 2.5 秒内显示，页面在 200 毫秒内响应点击，布局偏移不超过 0.1。这些指标对手机和桌面分别评估。您可以用免费的 PageSpeed Insights 检查，它会分别给出手机和桌面的报告。

15 分钟自查方法

1. 用您自己的手机打开网站，使用移动数据，而不是办公室 Wi-Fi。
2. 试着完成客户常做的事：找到一个产品，打开规格，然后提交询价。
3. 点击电话号码和 WhatsApp 按钮，能否直接使用？
4. 打开表格最长的页面，整个页面能否被左右拖动？
5. 检查是否有悬浮按钮或弹窗遮挡内容。
6. 在 PageSpeed Insights 中输入网站地址，查看手机端结果。
7. 请一位团队以外的人，比如熟人，也做一遍同样的操作。他们会发现您没有注意到的问题。

企业网站在手机上“能打开”还不够。客户必须无需放大屏幕，就能找到产品、看清规格并联系您。

另请阅读企业网站速度慢的原因、如何制作询价表单以及如何添加不打扰访客的 WhatsApp 按钮。如果您希望网站从一开始就适合手机浏览，请了解我们的网站建设服务。