第十二课 · 阶段三 页面优化
修好站内的路:内链与图片
前面几课在打磨「单个页面」。这一课把页面连成网:内部链接让权重流动、让爬虫走得到每一页;再顺带把图片交代清楚,让它们也能被搜到。阶段三到这里收尾。
学完你能做什么
识别缺少内链的页面;写描述性锚文本并检查链接是否可抓取;按图片用途选择 alt,并减少图片带来的加载与版面问题。1 内部链接:站内的路
内链给页面留一条可走的路
链接是发现页面的重要入口。内部链接(站内页面互相指)帮助爬虫发现页面、传递链接信号,也帮助用户理解页面关系。缺少站内入链的页面叫孤岛页:它仍可能通过 sitemap 或外链被发现,但不利于导航和持续发现。下面的模拟只演示「从首页沿链接走」这一种发现方式:
锚文本要有信息量
链接上那几个可点的字(锚文本)也在告诉引擎「链接那头是什么」。「手冲水温指南」远胜过「点这里」——后者等于什么都没说。
2 内链怎么做好
把相关的页面连起来
- 相关页面互相链:主题相关的页面彼此指一指(还记得第 8 课那两个页面要互链吗);
- 重要页面容易找到:从导航、主题目录与相关正文给出合适入口;不是机械地增加链接数量;
- 锚文本有信息量:用能描述目标页的词,别用「更多」「点这里」;
- 只放有用的链接:没有通用数量上限;避免为了 SEO 堆满链接,或挤在一起使读者难以判断;
- 让链接可抓取:通常用
<a href="目标网址">描述性文字</a>,不要只用没有网址的 JavaScript 点击按钮代替文章链接。
3 图片与 alt
alt 是图片的替代文本
alt 用文字传达图片在当前页面中的意义,主要服务不能看到图片的读者,也为搜索引擎理解图片提供线索。引擎还会结合视觉识别、周围正文等信息,不能说「没有 alt 就完全看不懂」。写好 alt 也不保证进入图片搜索。
- alt 写清图里是什么:如
alt="V60 滤杯分三段注水的手法示意",别写alt="图片1"或堆关键词; - 纯装饰图用空 alt:
alt=""让屏幕阅读器跳过无信息的装饰。图片如果充当按钮或链接,应说明用途或去向;复杂图表还要在正文提供结论与数据说明; - 文件名也有意义:
v60-pour-technique.jpg好过IMG_2931.jpg; - 尺寸与加载匹配场景:压缩大图、提供适合设备的尺寸并设置
width / height;非首屏图可延迟加载,首屏关键主图不要一律加 lazy(第 15 课)。
4 随堂自测
点一点、填一填,检查你会了没
练 真实页面练习 · 20 分钟
给一页补入口,给三张图写替代文本
- 选一个重要内容页,找到从首页或主题页抵达它的路径。记录相关的 2 个页面和链接理由;只有 sitemap 中有它时,补一个对读者有用的站内入口。
- 选 3 张图,分别判断信息图、装饰图或功能图,再写 alt。图表附文字结论,装饰图保留空 alt;检查文件大小及是否预留尺寸。
- 预览改稿,逐个打开链接,确认目标正确。没有网站权限时交付「来源页—锚文本—目标页」表和图片替代文本建议。
验收
链接去向清楚、目标能正常打开、HTML 中有可用的 href;3 张图的 alt 与用途一致,没有堆词。关闭或看不到图片时,读者仍能理解关键信息。记录修改前后图片大小,不把优化方案当成已经测得的速度提升。