HTML 语言切换器的可访问性
HTML language switcher accessibility
是否有任何 aria-something 或角色可以添加到语言切换中 link?
例如,我在页脚中放了两个 link 来更改当前语言。
<a href="/language/switch/fr">Fr</a>
<a href="/language/switch/uk">Uk</a>
我有任何语义标签可以添加到这个 link 吗?
示例:
<a href="/language/switch/fr" lang="fr" hreflang="fr">Fr</a>
有关详细信息,请参阅 https://www.nomensa.com/blog/2010/7-tips-for-multi-lingual-website-accessibility。
The lang
global attribute helps define the language of an element: the
language that non-editable elements are written in, or the language
that the editable elements should be written in by the user.
Hints at the human language of the linked URL. No built-in functionality. Allowed values are the same as the global lang
attribute.
不确定您的代码的其余部分是什么,但是如果您在这些 link 之前没有任何像 Choose language
这样的文本,那么建议为每个 link 描述 link 正在做什么,例如:
<a href="/language/switch/fr" aria-label="Visit our perfect site in French">Fr</a>
这样屏幕阅读器将覆盖 link 文本并大声读出 aria-label,这对盲人用户或有视觉障碍的用户非常有帮助。
一条建议:使用语言的全名而不是首字母可以帮助在自动翻译开启的用户的情况下清楚地传达语言是什么。查看 this article 了解更多。
是否有任何 aria-something 或角色可以添加到语言切换中 link? 例如,我在页脚中放了两个 link 来更改当前语言。
<a href="/language/switch/fr">Fr</a>
<a href="/language/switch/uk">Uk</a>
我有任何语义标签可以添加到这个 link 吗?
示例:
<a href="/language/switch/fr" lang="fr" hreflang="fr">Fr</a>
有关详细信息,请参阅 https://www.nomensa.com/blog/2010/7-tips-for-multi-lingual-website-accessibility。
The
lang
global attribute helps define the language of an element: the language that non-editable elements are written in, or the language that the editable elements should be written in by the user.
Hints at the human language of the linked URL. No built-in functionality. Allowed values are the same as the global
lang
attribute.
不确定您的代码的其余部分是什么,但是如果您在这些 link 之前没有任何像 Choose language
这样的文本,那么建议为每个 link 描述 link 正在做什么,例如:
<a href="/language/switch/fr" aria-label="Visit our perfect site in French">Fr</a>
这样屏幕阅读器将覆盖 link 文本并大声读出 aria-label,这对盲人用户或有视觉障碍的用户非常有帮助。
一条建议:使用语言的全名而不是首字母可以帮助在自动翻译开启的用户的情况下清楚地传达语言是什么。查看 this article 了解更多。