【问题标题】:Talkback not announcing dates in the correct format when in a range在一个范围内时,对讲没有以正确的格式宣布日期
【发布时间】:2022-02-23 06:07:26
【问题描述】:

似乎在使用android对讲时,当dd/mm/yyyy - dd/mm/yyyy格式的范围内有2个日期时,它并没有正确说出日期

如果我有一个简单的日期,例如 2017 年 1 月 6 日,它会正确显示为“6 月 1 日,27 日”。但是,如果我有一个日期范围,例如 01/06/2017 - 01/06 /2018,它会说它是“一月六点二十七到一月六点二十八”,有什么想法吗?

我的语言设置为en-AU

这是 HTML 结构:

<p>01/06/2017 - 01/06/2018</p>

但是,如果我将两个日期都放在 <time> 元素中,那么它会正确读取每个日期,但要分开读取,例如<p><time>01/06/2017</time> - <time>01/06/2018</time></p> 被读作“六月一号,二十七号”,“破折号”,“六月一号,二十八号”,整个事情是支离破碎的,所以不是将它读成一行,而是每个元素都必须分开阅读。但是,如果我将整个内容包裹在 <time> 中,则它不起作用,即 <p><time>01/06/2017 - 01/06/2018</time></p> 将不起作用。

【问题讨论】:

    标签: html date accessibility talkback


    【解决方案1】:

    日期范围总是一件棘手的事情,因为没有比您正在使用的更好的方法 (<p><time>01/06/2017</time> - <time>01/06/2018</time></p>)

    但是,有一种方法可以强制它说“to”,但需要注意的是: 如果您使用此方法,那么如果有人使用自动翻译或您在某些时候将网站国际化,可能会导致翻译质量不佳/将“to”转换为其他语言的大量工作。

    除了免责声明,诀窍是使用实际的“to”一词:<p><time>01/06/2017</time> to <time>01/06/2018</time></p>

    但我知道你在想什么,我不想让“to”这个词可见,我想在视觉上使用破折号。

    所以现在我们引入visually hidden textaria-hidden 来显示一个东西但读出另一个:

    <p>
      <time>01/06/2017</time>
      <span aria-hidden="true">-</span>
      <span class="visually-hidden">to</span>
      <time>01/06/2018</time>
    </p>
    

    我们所做的是对屏幕阅读器隐藏破折号,然后提供一些仅屏幕阅读器的文本来替换它(“视觉隐藏”的另一个名称是“仅屏幕阅读器”)

    这是一个小提琴演示:

    .visually-hidden { 
        border: 0;
        padding: 0;
        margin: 0;
        position: absolute !important;
        height: 1px; 
        width: 1px;
        overflow: hidden;
        clip: rect(1px 1px 1px 1px); /* IE6, IE7 - a 0 height clip, off to the bottom right of the visible 1px box */
        clip: rect(1px, 1px, 1px, 1px); /*maybe deprecated but we need to support legacy browsers */
        clip-path: inset(50%); /*modern browsers, clip-path works inwards from each corner*/
        white-space: nowrap; /* added line to stop words getting smushed together (as they go onto seperate lines and some screen readers do not understand line feeds as a space */
    }
    <p>
      <time>01/06/2017</time>
      <span aria-hidden="true">-</span>
      <span class="visually-hidden">to</span>
      <time>01/06/2018</time>
    </p>

    注意:试图说服屏幕阅读器以某种方式说出事情几乎总是引入可访问性问题而不是修复它们的方法。在这种情况下,我认为你很好(因此我给出了答案),但要谨慎使用这种技术,大多数时候屏幕阅读器用户会习惯于奇怪的发音,而“修复”它们实际上会更加混乱。

    虽然我已经向您展示了如何“解决”这个问题,但我个人认为它不需要任何干预,读出“破折号”是有道理的,但我也认为在这种情况下您不会造成任何伤害如果您真的想尝试这种技术,那么我将由您决定。

    【讨论】:

    • 谢谢你,我已经做了类似的事情来让它使用aria-label,即&lt;p&gt;&lt;time&gt;01/06/2017&lt;/time&gt; &lt;span aria-label="to"&gt; - &lt;/span&gt; &lt;time&gt;01/06/2018&lt;/time&gt;&lt;/p&gt;,将破折号读取为'to',这样做与方法相比有什么缺点吗你提供的?
    • 另外,另一个问题是它会分段读取它而不是一行。用户必须物理地点击每个部分才能让屏幕阅读器读出它,而像&lt;p&gt;01/06/2017 - 01/06/2018&lt;/p&gt; 这样的东西会一口气读出,尽管是错误的。有没有办法让屏幕阅读器将其作为单行而不是片段读出?就像你说的,做不到也不是什么大问题。
    • 在非交互式项目上使用 aria-label 不一致(在静态内容上)。至于片段,恐怕一旦您开始使用&lt;span&gt;s,您将无能为力,因为“修复”将是:隐藏带有破折号的整个句子并将其替换为带有“to”的整个句子" 在其中(在带有破折号的第一句中使用 aria-hidden="true" 并在带有“to”的句子中使用 &lt;span class="visually-hidden"。),但是在那个阶段,您可能会回到第一格!我会说这很好,或者在我的回答中使用上述技术。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多