12

電話番号は通常、括弧、ダッシュ、プラスなどを無視してすべて数字であるため、電話番号の入力フィールドは通常数値です。

スクリーン リーダーが数値入力フィールドに遭遇すると、値を整数として読み取ります。たとえば、米国の電話番号に 3 つの入力フィールドがあり、最初が市外局番 (3 桁)、次に交換局 (3 桁)、次に回線 (4 桁) で、フィールドが 123, 456 の場合、7890 (それぞれ)、通常、数は「1 2 3」、「4 5 6」、「7、8、9、0」と言う方法です。

しかし、スクリーン リーダーがこれらのフィールドに遭遇すると、「123」、「456」、「7,890」と表示されます。

スクリーン リーダーのユーザーは、電話番号を大きな数字として聞くことに慣れていると思います (少なくとも、私が話した人たちはそれを期待しています)。私がこれらの人に電話番号を尋ねるとしたら、彼らは大きな数字ではなく、個々の数字を使用するでしょう.

さまざまな <input> タイプを試し、すべての役割、状態、およびプロパティを調べましたが、数字を強制的に読み取ることができるものは組み込まれていません。

私が考えることができるのは、数字を別々の数字 <span id='foo'>1 2 3</span> として含む視覚的に隠されている <span> を持ち、次に <input aria-labelledby= 'フー'>.

より良い方法はありますか？

4

2 に答える 2

9

With limited browser support, you can try CSS3 property:

speak:spell-out;

Best way is to use aria-label to give a convenient reading format with the sufficient pause:

<span aria-label="1 2 3. 4 5 6. 7 8 9 0">123 456 7890</span>

You can also use a hCard microformat which can be interpreted by some technologies and use a phone number in international format (which can be used by other) combined with the previous method

<p class="h-card">
  <span class="p-tel" aria-label="1 2 3. 4 5 6. 7 8 9 0">+123 456 7890</span>
</p>

TL;DR: use international format, aria-label, hCard microformat and speak:spell-out CSS property

于 2015-12-04T15:42:45.460 に答える