移动端SEO完整指南：移动优先、速度与体验优化全讲清
移动端SEO的核心意思, 就是指要让网站能够在手机端被人访问到, 让人看得懂内容, 让操作变得流畅, 并且还能被搜索引擎正常地抓取索引以及进行排名。现在的这个状况是主流搜索引擎全都采用了移动优先的索引机制, 也就是说它们主要依靠移动版的页面来评估整个网站的质量好坏。
如果想要把移动端SEO这件事做好, 就必须得满足三个具体的条件, 第一个条件是移动端的内容要和PC端保持一致, 第二个条件是要确保移动端的加载速度能够达到标准, 第三个条件是移动端的交互体验要符合规定。
移动优先索引核心要求
移动版以及PC版在核心内容方面, 还有标题也就是title、描述也就是description、结构化数据这些地方, 全部都必须要保持一致。不可以因为在移动版本上面, 就删除掉大段的文字正文内容, 也不可以把那些关键的链接给隐藏起来。
虽然允许把一些内容进行折叠处理, 但是一定不能把主要的核心内容给藏起来了。假如是使用了独立的移动站点, 好比说m.example.com这样的网址存在的话, 那么就必须要把canonical标签还有alternate标签配置得正确无误。最终的目的是为了保证这两个版本上面的内容是完全一致的。
如果采用动态服务这个模式, 也就是会根据User-Agent返回不同HTML的情况, 那么必须要添加Vary: User-Agent这个响应头,只有这样才能够保证搜索引擎能够获取到完整的内容, 同时也不可以对搜索引擎和用户返回不同的结果。
移动端速度优化
速度这个方面, 有个叫做LCP, 也就是最大内容绘制的指标, 它是应该小于2.5秒的, 还有个CLS, 是布局偏移的意思, 那个也应该是小于0.1的, 另外还有一个INP, 就是交互到下一次绘制的时间, 得小于200毫秒。
关于优化路径, 大家需要注意到首屏图片是严禁使用懒加载这一点的, 必须要采用WebP或者是AVIF这样的格式来处理, 并且应当按照屏幕的不同的尺寸去输出内容, 同时还要设置好宽高以防出现布局跳动这个问题。
对于那些非关键性的JS代码, 应当采取延迟加载的措施, 并把那些冗余的第三方脚本给删除掉。此外, 要开启gzip或者brotli压缩技术, 并结合CDN加速手段来进行操作。在字体方面呢, 中文字体必须按需加载, 优先选用系统自带的字体, 以此来避免因为字体切换这个行为而引发CLS。
内容与交互体验规范
正文的字体大小不能够低于16px, 行高要在1.9到1.6这个范围当中；按钮以及链接的点击区域需要不小于44像素乘以44像素, 并且链接之间要留出足够的间距；页面上不允许出现横向滚动的现象, 遇到固定宽度元素、表格或者是大图时需要进行设置max-width以及overflow操作以解决此问题；底部存在的固定导航须适配安全区, 具体而言是要使用包含env(safe-area-inset-bottom)这种代码的方式进行适配。
广告不能够去遮挡那些主要的内容, 弹窗必须是要容易关闭的, 定位、通知、相机这些权限的请求, 必须在用户去触发相关功能的时候再弹出来, 不可以一进入页面就立马请求。
百度设立了专门的算法体系, 其中被称为闪电算法的内容主要负责关注移动端的首页加载速度这一块的情况, 它有着明确要求那就是首页所需的资源一定要尽量精简, 图片也要进行压缩处理, 而另一个名叫冰桶算法的则是用来治理那些强制用户下载、强迫打开应用程序以及诱导点击的不当行为的, 至于叫做惊雷算法的那一部分, 它的工作重心就在于打击刷取点击量和使用快速排名这类违规现象, 对于移动端落地的页面来说, 必须保证其具备正常的返回功能这一点是不可忽视的, 绝对不可以设置那种恶意的跳转链接, 站长人员应当利用百度搜索资源平台这一工具去提交关于移动站点的地图信息, 同时还需要持续关注针对移动端抓取情况以及索引数据方面的各项指标表现。
Google移动友好标准
视口参数必须被设置成为width=device-width, initial-scale=1, 用户是不能禁用缩放的功能的, 字号必须是可读的, 点击区域的面积要充足, 内容是不可以超出屏幕的范围的, 是不使用Flash等那些不兼容的插件的, 首屏的主要的内容是不可以进行懒加载的操作的, 下方的图片是可以进行懒加载的处理的, 但是必须要保证搜索引擎是能够发现的。
移动端的结构化数据和个人电脑端的结构化数据, 这两个东西完全是一样的, 我们用了富媒体测试工具去做了这个验证工作。
上线前检查清单
viewport 设置正确；不会出现横向滚动条；正文部分的字号大小不少于 16px；点击区域的大小不小于 44×44px；首屏内的内容完整展现, 不需要依赖懒加载；图片已经经过压缩处理, 并且尺寸合适；CSS 和 JS 不会阻塞首屏内容的渲染；HTTPS 连接正常；移动版的 title、description、canonical 属性正确；结构化数据完整；没有强制下载文件的情况, 也没有强制打开 App 的弹窗行为；弹窗不会遮挡主要内容；表单的键盘类型设置正确；底部固定的元素不会遮挡内容；移动端的 LCP 数值小于 2.5s, CLS 数值小于 0.1, INP 数值小于 200ms。
数据监控
需要把流量和转化的数据分开来看, 具体的做法是按照设备来进行区分, 不能拿全站的平均值来蒙混过关, 从而掩盖了手机端实际上存在的种种问题。要利用日志分析的方法去检查移动蜘蛛抓取的状态, 借此排查出那些会出现404错误以及5xx错误代码的异常情况。
还要结合运用热图工具或者录屏这样的工具去仔细观察用户在真实环境中的操作行为, 坚决避免仅仅依据自己手头的那台设备就轻易对整体的使用体验做出主观的判断。
常见问题
《移动端SEO完整指南：移动优先、速度与体验优化全讲清》主要讲什么？
移动端SEO的核心意思, 就是指要让网站能够在手机端被人访问到, 让人看得懂内容, 让操作变得流畅, 并且还能被搜索引擎正常地抓取索引以及进行排名。
文章提到了哪些重点？
正文的字体大小不能够低于16px, 行高要在1.9到1.6这个范围当中；按钮以及链接的点击区域需要不小于44像素乘以44像素, 并且链接之间要留出足够的间距
文章给出了哪些建议？
页面上不允许出现横向滚动的现象, 遇到固定宽度元素、表格或者是大图时需要进行设置max-width以及overflow操作以解决此问题；