我有一个设置了最大宽度的表格单元格,如果单元格中的文本太长,它会被省略号截断。因此,使用title属性显示全文是否是一个合适的(可访问的)解决方案?
af7jpaap1#
如果文本被CSS的text-overflow: ellipsis截断:* * 是的,title属性是屏幕阅读器的有效解决方案**。即使是由屏幕阅读器读取也没有关系,因为原始(可视截断)文本将被完全读取。另一方面,title attributes are not accessible by keyboard, touch screen and other means。对于您的情况,我会看到以下解决方案:
text-overflow: ellipsis
title
…
在所有情况下,屏幕阅读器用户都可以访问全文,而无需额外的交互。
44u64gxh2#
好吧,在我看来,这将是适当的解决方案,因为用户只是经常采取鼠标在文本上,等待隐藏的文本弹出。我看到他们中的许多人,包括我的妹妹谁是在所有这些类型的事情。她只是悬停在一个文本,然后等待文本出现,当它没有,她只是说:“哦,上帝!为什么???"。所以在我看来这是一个合适的方式。还有一件事,你可以通过设计你的标题属性/工具提示来吸引用户的注意力。
EDIT:@steveax 说title属性不好用,所以我建议你看this问题。这个问题有一种CSS方法,所以你可以更容易地设置它的样式:)
zbq4xfa03#
我会向您推荐https://developer.microsoft.com/en-us/fluentui#/controls/web/tooltip。它可以在所有环境中工作。
3条答案
按热度按时间af7jpaap1#
如果文本被CSS的
text-overflow: ellipsis
截断:* * 是的,title
属性是屏幕阅读器的有效解决方案**。即使是由屏幕阅读器读取也没有关系,因为原始(可视截断)文本将被完全读取。
另一方面,title attributes are not accessible by keyboard, touch screen and other means。
对于您的情况,我会看到以下解决方案:
title
…
这样的切换,使文本可内联扩展在所有情况下,屏幕阅读器用户都可以访问全文,而无需额外的交互。
44u64gxh2#
好吧,在我看来,这将是适当的解决方案,因为用户只是经常采取鼠标在文本上,等待隐藏的文本弹出。我看到他们中的许多人,包括我的妹妹谁是在所有这些类型的事情。她只是悬停在一个文本,然后等待文本出现,当它没有,她只是说:“哦,上帝!为什么???"。所以在我看来这是一个合适的方式。
还有一件事,你可以通过设计你的标题属性/工具提示来吸引用户的注意力。
EDIT:@steveax 说
title
属性不好用,所以我建议你看this问题。这个问题有一种CSS方法,所以你可以更容易地设置它的样式:)zbq4xfa03#
我会向您推荐https://developer.microsoft.com/en-us/fluentui#/controls/web/tooltip。它可以在所有环境中工作。