一次多源调研模板的运行生成了一份关于投资工具的优质报告,然后把它排版得很糟糕。九十五个形如[^1]的标记散布在正文中,九行形如[^1]:的内容堆积在下方。无论是网页端还是手机端都是如此。
原因在于脚注不是Markdown的一部分。它是一个扩展,而我们提供的两套Markdown渲染引擎——一套用于网页,另一套用于移动端——都没有实现它。我们要求模型生成的正是这种格式,然后又把它当作字面文本渲染出来。
一个重写器,两套引擎
与其让两套渲染器分别学会同一个扩展,不如在任何一套引擎看到标记之前就先重写它们,变成一个两者都已经能一致渲染的简单链接。定义被提取出来并单独返回,原本跟在它们后面的内容则保留为文档的尾部。方括号留在链接文本内,因此叠加的引用会读作[1][2],而不是12。
在网页端,引用会以上标形式绘制,定义以带有真实锚点的列表形式渲染,点击其中一个会滚动到它并让该行闪烁,列表中的编号也会跳回到它第一次被引用的位置。悬停会显示定义而不移动位置。在手机端,同样的标记会以强调色绘制,点击其中一个会让面板滚动到对应的行。不是引用的链接依旧像以前一样在浏览器中打开。
报告下方的来源卡片从未受到影响——它们来自另一处,一直都是正常的。
下载文件中也是如此
你以.docx、.pdf或.md格式下载的报告,会经过另一个转换器,它会把原始标记直接打印进文档。文档规范没有上标,因此引用会被打印为[3],每条定义会以[3]开头开启自己独立的一行。带缩进的续行会衔接到对应的定义。文件中的编号就是屏幕上的编号。
第一次尝试出错的方式,我们其实早有防护
第一个版本把脚注编号做成了普通的片段链接——href="#fn-3"。在单页应用所需的<base href="/">之下,一个裸片段会相对于站点根路径解析,因此该链接会指向首页。点击处理程序取消了导航,所以它能正常工作——而且会一直正常工作,直到有人动了这个处理程序。
我们此前已经专门针对这种模式设置过一项检查,它在推送前的本地运行中亮了红灯。现在编号是按钮;它们会滚动、移动焦点,并尊重读者对减少动效的偏好设置。