让网页表达关系：本站的语义化思路
Making Relationships Explicit: This Site's Semantic Design
在这个站点是怎么搭的里，我介绍了本站的静态架构和写作流程。这里想补充另一个技术特点：页面除了展示文字，也明确描述这些文字的结构，以及作者、文章和站点之间的关系。
这与我做知识组织和关联数据研究的兴趣有关。个人网站规模很小，却已经包含一些值得认真表达的关系：一篇文章由谁写作，属于哪个博客，介绍页说的是谁，这个人又如何与站外的学术身份对应。本站的语义化实现，就从这些关系开始。
从页面结构开始
网页上的标题、导航、正文和日期各有自己的含义。本站用 HTML 中相应的元素组织这些内容，让浏览器和辅助技术能够识别页面结构。读屏软件可以据此定位正文，键盘用户也可以通过“跳到正文”的链接越过导航。
语言同样是结构的一部分。本站有中英文内容，页面会声明主要语言，英文副标题、中文导航等片段再单独标注。这些标记帮助读屏软件选择发音，也让排版规则能够按内容语言生效：中文两端对齐，英文左对齐。
以一篇中文文章为例，省略样式和导航后，页面骨架大致是这样：
<html lang="zh-Hans">
<head><title>让网页表达关系</title></head>
<body>
<main>
<article>
<h1>让网页表达关系</h1>
<p lang="en">Making Relationships Explicit</p>
<time datetime="2026-10-09">2026 年 10 月 9 日</time>
<p>文章正文……</p>
</article>
</main>
</body>
</html>
main 标出页面主体，article 标出文章，time 提供可解析的日期。英文副标题的 lang="en" 则覆盖了页面默认的中文语言。这些信息直接写在 HTML 中，随页面一起交给浏览器。
这些设计大多藏在页面底下，阅读时未必会注意到，但它们构成了网页可被理解和使用的基础。
把作者、博客和文章连起来
本站还在页面中嵌入了 JSON-LD，使用 Schema.org 的词汇描述内容。可以把它理解为随网页一起提供的一份机器可读说明。
这份说明里有几个基本对象：作者、博客、文章，以及介绍作者的 about 页面。每个对象都有明确的类型；文章指向它的作者和所属博客，about 页面则指向它介绍的人。由此，分散在不同页面中的信息可以组成一张小型关系图。
其中一个关键选择是使用稳定的标识。作者和博客各有固定的地址作为身份标识，文章引用这些标识时，指向的是同一个对象。中文名与英文名也作为同一个人的不同语言名称记录。这让后续增加内容时，已有的关系能够继续沿用。
下面把实际分布在不同模板中的数据合在一起，并省略日期、摘要等字段，留下关系的骨架：
{
"@context": "https://schema.org",
"@graph": [
{
"@id": "https://litaolin.com/#me",
"@type": "Person",
"name": "林立涛"
},
{
"@id": "https://litaolin.com/#blog",
"@type": "Blog",
"author": {"@id": "https://litaolin.com/#me"}
},
{
"@id": "https://litaolin.com/2026/semantic-web-design/",
"@type": "BlogPosting",
"author": {"@id": "https://litaolin.com/#me"},
"isPartOf": {"@id": "https://litaolin.com/#blog"}
}
]
}
这里的 @id 标识对象，@type 说明对象的类型。文章中的 author 和 isPartOf 分别引用作者与博客的标识，明确表达“谁写了这篇文章”和“这篇文章属于哪里”。这段 JSON-LD 会放在 HTML 的 <script type="application/ld+json"> 中，供支持结构化数据的工具读取。
关系还延伸到了站外。作者节点通过 ORCID 和 GitHub 主页声明身份对应；研究领域中的“数字人文”和“知识组织”则连接到 Wikidata 中的概念。这样，本站的一部分信息便有了可与外部资源对接的标识。
让语义跟着写作维护
这层描述由 Jekyll 在构建时生成，随静态页面一起发布。作者身份信息集中在站点配置中，文章标题、摘要和日期则来自文章本身的元数据。写作时维护一份信息，页面和结构化描述就能使用同一个来源。
例如，这篇文章的 Markdown 文件开头就有这样一段元数据，这里只展示几个字段：
---
title: "让网页表达关系：本站的语义化思路"
date: 2026-10-09
lang: zh
---
构建时，标题会进入页面标题和文章的结构化描述，日期会生成可见的发布时间及机器可读的时间值，语言字段则决定正文的语言标记。写作者维护的是这些信息，模板负责把它们表达在相应的位置。
我也尽量让每种信息承担清楚的用途。例如，站点印章用于社交平台的分享预览；文章的结构化数据只有在另行指定相关图片时，才把它记录为文章代表图片。修订日期也需要明确填写，才会作为更新信息输出。
目前，这张关系图主要覆盖作者身份和出版关系。about 页中更具体的研究经历、机构和论文，仍以正文与链接呈现。今后可以按实际需要继续补充，但我希望每一步都建立在已经写清楚、能够维护的信息之上。
对本站来说，语义化是一种很具体的知识组织实践：把页面结构标明，把对象身份固定下来，把已经存在的关系表达出来。它让日常写作积累的内容，在供人阅读的同时，也留下可供机器处理的结构。