注音标注

为汉字或外来词标注读音而在目标文字上方 (横排) 或右侧 (竖排) 附加的小号文字。在 HTML 中通过 <ruby> 元素实现。

注音标注 (ruby annotation) 是为汉字标注读音的辅助文字。其名称源自活版印刷中的活字尺寸,5.5 磅的活字被称为「ruby」。在日文出版物中,这种标注被称为「振り仮名」(furigana),广泛用于书籍、报纸和教科书。在中文语境中,类似的功能用于标注拼音,尤其在儿童读物和语言学习材料中不可或缺。

在 HTML 中实现注音标注使用 <ruby> 元素。例如 <ruby>汉字<rt>hànzì</rt></ruby> 会在「汉字」上方小号显示「hànzì」。为兼容不支持 ruby 的浏览器,还可以用 <rp> 元素添加括号作为回退方案。目前所有主流浏览器均已支持 <ruby> 元素。

注音标注有「单字注音」和「词组注音」两种方式。单字注音为每个汉字逐一标注读音,如「běijīng」,每个字的读音一目了然。词组注音则为整个词语统一标注,如「北京běijīng」。在中文教育类内容中,单字注音更为常见,因为它有助于学习者逐字掌握发音。

在字符计数中,注音标注的处理比较复杂。注音文字 (标注部分) 是否计入字符数,取决于具体用途。在稿纸的字符计数中,注音不计入字数。但在 HTML 源码层面,<rt> 内的文本也作为字符串存在,获取 DOM 的文本内容时会得到「汉字hànzì」这样本文与注音连接在一起的结果。要实现准确的字符计数,需要排除注音部分的逻辑。

CSS 中注音标注的样式控制包括 ruby-position (上方/下方)、ruby-align (对齐方式)、ruby-overhang (溢出处理) 等属性。注音的字号标准为父字符的 50%,但在 Web 上为了可读性,有时会设为 60%-70%。当注音较长时 (如「薔薇」标注「ばら」),会超出父字符的范围,需要调整前后字符的间距。

从无障碍访问的角度看,屏幕阅读器会朗读注音文本,使视觉障碍用户也能获知汉字的读音。不过,不同屏幕阅读器的朗读方式有所差异,有的会读出「汉字,hànzì」,有的则只读「hànzì」。

分享这篇文章