SEO 元数据、站点地图与规范链接
YouTeacher 的落地页是一个按语言(locale)渲染的 Next.js 应用,而这套子系统负责让它能被搜索引擎发现。一切都由一份很小的语言列表驱动——en 与 zh,默认是 en——因此标题文案、规范 URL、站点地图条目以及语言备选项,全都与这一个真相来源保持同步。
按语言生成的元数据
locale 布局导出一个 generateMetadata 函数,每个语言各跑一次。它从翻译目录的 metadata 命名空间里读取页面的 title 与 description,因此搜索引擎看到的文案是本地化的,而不是写死的。它还用同样这两段文字构建一个 OpenGraph 块——标题、描述、type: website,以及一个 OpenGraph 的 locale:把 zh 映射成 zh_CN,其余映射成 en_US。这样一来,分享进聊天或社交预览的链接就带着正确的语言与呈现方式。
规范链接与 hreflang 备选项
元数据还声明了 alternates:当前页面的规范 URL 为 /<locale>,外加一个语言映射,把 en 指向 /en、zh 指向 /zh。这就是 hreflang 信号——它告诉爬虫,英文页与中文页是彼此的翻译版本,而非重复内容,并指明每种语言下哪个 URL 是权威版本。
静态参数与语言护栏
generateStaticParams 枚举语言列表,让 Next.js 能在构建期预渲染每个语言的路由。布局本身会校验传入的 locale,对不在列表里的任何值返回 404(notFound),随后设置请求 locale、加载文案、并把页面包进应用的 providers 里。因此一个未知的语言段绝不会渲染出一个半本地化的坏页面。
站点地图与 robots
另有两个路由文件补全了整幅图景,二者都以 https://youteacher.io 为根:
sitemap.ts为每个语言生成一条条目(/en、/zh),每条标记changeFrequency: weekly、priority: 1,lastModified取生成时的时间。若新增一个语言,站点地图会自动扩展。robots.ts放行所有爬虫(userAgent: *、allow: /),并把它们指向https://youteacher.io/sitemap.xml。
贯穿始终的一条线:语言列表是唯一输入,而元数据、规范链接、备选项与站点地图,全都是从它推导出来的,而非手工维护。