Web 可访问性 - 图像按钮的描述 - 过时的解决方案？
Web accessibility - description for image button - outdated solution?
我得到了一个客户网站的某种可访问性测试（针对盲人、聋人用户等），还有如何提高可访问性的提示。
其中一个提示是针对图像按钮的：
Additionally, the buttons should get a short and meaningful description, e.g. with an invisible text. The invisible text should not be
marked with the attributes display:none and visibility:hidden.
Instead the text should be moved out of the viewport:
<a href=”...”>[Font-Icon] <span class=“invisible“>Delete</span></a>
.invisible { position:absolute; left:-10000px; overflow:hidden;}
我想问一下这是否仍然是推荐的解决方案。这对我来说似乎已经过时了。我应该使用某种 aria 标签而不是不可见元素，还是建议的解决方案可以？
the buttons should get a short and meaningful description, e.g. with an invisible text.
It seems outdated to me.
你说得对，这不是解决方案。
在谈论可访问性时，我们不必只关注使用屏幕阅读器的盲人，而是关注所有类型的残障人士。将文本移出视口完全是胡说八道。对于不支持 ARIA 时使用屏幕阅读器的一小部分人来说，这曾经是一个 （不好） 的解决方案，但这不再是一个真正的解决方案。
最好的解决办法显然还是写全文:
<a href="...">[Font-Icon] Delete</a>
是的，显而易见，但值得一提。
第二种解决方案是使用title 属性。如果屏幕阅读器不支持，为什么要使用它？因为 99% 的人不使用屏幕阅读器。而“[Font-Icon]”应该有一个替代品。 （为了更好的辅助功能支持，这个 title 属性应该有一种在键盘焦点上可见的方式。）
<a href="..." title="Delete">[Font-Icon]</a>
最终解决方案是为屏幕阅读器用户添加 aria-label，为其他人留下 title 属性。
<a href="..." title="Delete" aria-label="Delete">[Font-Icon]</a>
我得到了一个客户网站的某种可访问性测试（针对盲人、聋人用户等），还有如何提高可访问性的提示。
其中一个提示是针对图像按钮的：
Additionally, the buttons should get a short and meaningful description, e.g. with an invisible text. The invisible text should not be marked with the attributes display:none and visibility:hidden. Instead the text should be moved out of the viewport:
<a href=”...”>[Font-Icon] <span class=“invisible“>Delete</span></a>
.invisible { position:absolute; left:-10000px; overflow:hidden;}
我想问一下这是否仍然是推荐的解决方案。这对我来说似乎已经过时了。我应该使用某种 aria 标签而不是不可见元素，还是建议的解决方案可以？
the buttons should get a short and meaningful description, e.g. with an invisible text.
It seems outdated to me.
你说得对，这不是解决方案。
在谈论可访问性时，我们不必只关注使用屏幕阅读器的盲人，而是关注所有类型的残障人士。将文本移出视口完全是胡说八道。对于不支持 ARIA 时使用屏幕阅读器的一小部分人来说，这曾经是一个 （不好） 的解决方案，但这不再是一个真正的解决方案。
最好的解决办法显然还是写全文:
<a href="...">[Font-Icon] Delete</a>
是的，显而易见，但值得一提。
第二种解决方案是使用title 属性。如果屏幕阅读器不支持，为什么要使用它？因为 99% 的人不使用屏幕阅读器。而“[Font-Icon]”应该有一个替代品。 （为了更好的辅助功能支持，这个 title 属性应该有一种在键盘焦点上可见的方式。）
<a href="..." title="Delete">[Font-Icon]</a>
最终解决方案是为屏幕阅读器用户添加 aria-label，为其他人留下 title 属性。
<a href="..." title="Delete" aria-label="Delete">[Font-Icon]</a>