支持图像标题 - 除了替代文本

继续讨论 如何为上传的图片添加描述?

我一直在寻找一种为图片添加所有人可见的标题的方法。(<figcaption>

alt 与 caption

我很高兴 Discourse 支持为视障读者提供 alt 文本,但对于视力正常的读者来说,它们实际上是不可用的。视力正常的读者不一定需要相同的完整图像描述,但有时会需要一些上下文信息,例如:这张截图是关于哪部电影的?这幅艺术作品的标题是什么?

由于“caption”在这里经常用于讨论图像 alt 文本,因此搜索变得有些复杂。甚至 Discourse AI 功能也称为“AI 标题”。这一点在关于手动“标题”(alt 文本)方法的讨论中也有提到。

语法

父主题在 2019 年以以下内容结束:

我在 CommonMark 上找到了一些旧的相关主题,其中提到:

https://talk.commonmark.org/ 目前的横幅是*“请注意,CommonMark 规范目前在功能方面已冻结”*,并且图像规范似乎没有涉及标题的使用。

下一步

在这种情况下,偏离 CommonMark 并实现一些功能来支持图像的通用 <figcaption> 标签,会不会太糟糕?

我不是无障碍方面的专家,但我不太明白这个功能请求。altfigcaption 之间到底有什么区别,为什么你们主张我们偏离 CommonMark?我错过了什么?

当我上传一张照片,比如我猫的照片时,它会附带一个与照片关联的说明。然后我可以编辑说明来分享上下文。

说明在鼠标悬停时(桌面端)显示,并且在你选择放大查看照片时,会显示在照片底部:

Screenshot 2025-06-09 at 7.58.47 AM

1 个赞

你好 Tobias – 回顾时,我夸大了这部分:

alt 文本对视力正常的读者来说是可用的——但它需要鼠标操作,而我通常在滚动浏览主题时不会这样做。如果没有出现“alt”图标,我甚至不会想到将鼠标悬停在图片上来检查是否存在 alt 文本。这实际上是有道理的,因为 alt 文本的目的不是提供额外的信息,对于视力正常的用户来说应该是多余的……

我也不是无障碍专家,但我认为这些功能对视力正常和视力障碍的用户来说,其用途大不相同。

alt 文本:

  • 鼓励为视力障碍用户提供图像的详细描述,作为视觉内容的等效替代。
  • 默认情况下对视力正常的读者隐藏——因为他们可以看到图像。
  • (可能由屏幕阅读器和其他无障碍工具默认处理)

figcaption:

  • 可以为所有用户提供标题、旁注、引语或其他上下文线索——不一定是图像内容的完整描述。
  • 在所有用户的文档/帖子流中显示,无论视力是否正常。
  • 除了正常的浏览和滚动外,无需任何操作即可查看。

本质上,alt 文本会替换图像——准确地告诉你它是什么。figcaption 可以告诉你作者为什么放它在那里。

你图像的 Alt 文本是准确的:“一只灰色的虎斑猫正坐在户外的木栏杆上,看起来警觉而好奇,背景是绿色的叶子。”(无障碍专家可能会建议提供更多细节,减少主观性:“一只灰色的虎斑猫端正地坐在户外的木凳上,占据了画面大部分,看着镜头外的某处。阳光下的叶子背景模糊,而猫处于阴影中,面部清晰对焦。”)

然而,figcaption 可能会写成“猫的 alt 文本示例”——或者“乌鸦爪不在乎你的吹毛求疵。

我无法评论偏离 CommonMark 的更广泛影响——我只是认为,如果 Commonmark 没有计划实施新功能,那么对于一些广泛有用的东西,偏离是可以被证明是合理的。

2 个赞

你好 Tobias,我是新手。我正打算将我的 phpBB 论坛迁移到 Discourse。我非常喜欢悬停在图片上时显示的标题!但是,我不清楚上传时如何添加标题——你能为我澄清一下吗?我尝试在我的测试站点上传时没有成功。

一个相关的问题当然是,修改 import_phpbb3.sh 脚本以将 phpBB 的“文件注释”(在附件上)分配给转换后的上传内容,使其在悬停时显示出来,会有多困难。另外:phpBB 允许对其他 MIME 类型(例如 .mp3 和 .mp4)分配文件注释。Discourse 是否也支持这样做?

谢谢
Dan

1 个赞

感谢您提醒我那张超级可爱的猫咪照片!在我给出的示例中,标题是使用人工智能自动生成的。我相信这在 Meta 上发生的情况也是如此,这也是您在托管在 discourse 上的网站上开箱即用就能做到的。如果您想在自托管的网站上做到这一点,则需要使用人工智能进行设置。

AI 自动字幕功能已在七月被移除。


添加字幕的方式取决于您使用的编辑器。在富文本编辑器中,单击图片,然后单击图片下方的文本并进行编辑。


在 Markdown 模式下,您可以在预览中点击小铅笔图标进行编辑,也可以直接在编辑器中输入。

1 个赞

嗨,Dan,欢迎!

严格来说,那不是图片说明文字,而是图片的替代文本(alt text)——旨在向视障用户描述图片。(我本来正准备一些编辑截图给你,但 Moin 比我快了一步。)

你关于在 phpBB 导入中处理文件注释的问题,最好在新开一个支持主题来提问,因为合适的人可能不会注意到这个帖子里的内容。

1 个赞

Moin,非常感谢!这是一个很棒的功能。Todd,你说得对——我会找个合适的地方询问有关 phpBB 导入的问题。

我注意到,虽然你可以向 gif 添加文本,但悬停时不会显示;不过我的论坛很少使用 gif。phpBB 确实允许你向 .mp3 和 .mp4 添加评论,但在 Discourse 中似乎没有添加文本的选项。我将不得不检查我的 .sql 备份文件中带有评论的附件,并决定如何处理。

我对 Discourse 感到兴奋,并期待我的论坛迈入 21 世纪!:zany_face:

-Dan

感谢 Todd 提供了 CommonMark 的参考——我以前不知道它,现在这个帖子对我来说更有意义了。

我运行 phpBB 论坛已经 22 年了,多年来我对其进行了大量的修改以满足我的需求:图库显示、支持内联 PDF、Litebox 和标题(带/不带 Litebox)。当您提到 figcaption 时,我被触动了。这是我修改过的模板 attachment.html 中的一个片段:

	  <figure>
	  <a data-fancybox="gallery1" href="{_file.U_DOWNLOAD_LINK}" data-caption="{_file.COMMENT}">
	  <img src="{_file.THUMB_IMAGE}" class="postimage" alt="{_file.DOWNLOAD_NAME}"  title="{_file.DOWNLOAD_NAME} ({_file.FILESIZE} {_file.SIZE_LANG}) {_file.L_DOWNLOAD_COUNT}" />
	  </a>
	  <!-- ENDIF -->
	  <!-- IF _file.COMMENT -->
	  <figcaption>{_file.COMMENT}</figcaption>
	  <!-- ENDIF -->
	  </figure>

我们亲爱的 figcaption

是时候我告别 phpBB 了;它已经完成了它的使命,而 Discourse 是一个更强大的平台。但是——虽然我不能权威地谈论 CommonMark,或者为什么应该遵守它——但我可以说,Discourse 中无法为图像、PDF、视频、音频等添加标题对我来说是一个严重的遗漏。无论如何处理,都应该有一些规定。

只是我的一点愚见($0.02)。
-Dan

3 个赞