Template:Accessible URL
これはURLについてのアクセシビリティの改善を図るものです。
多くの場合、URL文字列はそれ自体では可読性に劣るため、自然言語表記のラベルで代替されます。スクリーン表示型のユーザーエージェントの場合、クリック(またはタップ)できればよいので、URL文字列が表示されていなくても問題ありません。
しかし、ウィキペディア記事の閲覧する方法として、記事を印刷したものを読んだり、画面キャプチャや(ハイパーリンクが無効の)PDF形式に変換したものを読むことがあります。このような閲覧者にとっては代替ラベルだけではURLが分からないことになります。そのため、これらの閲覧者のためにはURL文字列はそのまま表示させなければなりません。
その一方で、音声読み上げ式ユーザーエージェントにとっては、URL文字列の読み上げは閲覧の障害でしかありません。
このテンプレートはこれらの事情を考慮して、URL文字列を表示しつつ、音声読み上げ式ユーザーエージェントが読み上げないようなHTMLマークアップを生成します。
使い方
[編集]
{{Accessible URL|URL|ラベル}}
使用例と技術的解説
[編集]
{{Accessible URL|http://www.fujio-pro.co.jp/|フジオ・プロ}}
この記述で、下記のHTMLコードが生成されます。
<span style="speak:none" aria-hidden="true"><a rel="nofollow" class="external free" href="http://www.fujio-pro.co.jp/">http://www.fujio-pro.co.jp/</a></span> — <a rel="nofollow" class="external text" href="http://www.fujio-pro.co.jp/">フジオ・プロ</a>
一つ目のa
要素を包むspan
要素の属性style="speak:none" aria-hidden="true"
がURL文字列(http://www.fujio-pro.co.jp/
)の音声読み上げを抑止するマークアップになっています。二つ目のa
要素内のラベル(フジオ・プロ
)にはこの属性指定がされておらず、ここは音声読み上げの対象になります。
これはこのようにレンダリングされます。
—
関連項目
[編集]- {{URL}}
- {{Official URL}}
- {{Official Website}}