Accessibility Support – SVG Tiny 1.2

この付録は情報を提供するものである。 This appendix is informative.

F.1 WAI アクセシビリティ指針

この付録では、 W3C の Web Accessibility Initiative（WAI）により公布されたアクセシビリティ指針が SVG にどのように適用されるかについて説明する。 This appendix explains how accessibility guidelines published by W3C's Web Accessibility Initiative (WAI) apply to SVG.

W3C ノート SVG のアクセシビリティ特色機能 [SVG-ACCESS] では、これら３つの指針の要求をどのように SVG へ適用するかについての詳細を説明している。 The W3C Note Accessibility Features of SVG [SVG-ACCESS] explains in detail how the requirements of the three guidelines apply to SVG.

F.2 SVG 内容アクセシビリティ指針

この節では、文書作成者がアクセスし易い SVG 文書をどのように作成し得るかについて、 SVG のアクセシビリティ特色機能 [SVG-ACCESS] の要約に基づいて手短に説明する。 This section explains briefly how authors can create accessible SVG documents; it summarizes and builds upon Accessibility Features of SVG [SVG-ACCESS].

グラフィックには相当するテキストも提供すること。

グラフィックのテキスト内容（例えばテキスト内容要素の中）が自身の役割を説明している場合、代替のテキストは不要になるが、テキスト内容から機能の意味が明らかにならないテキスト内容要素には title 子要素を利用して機能の説明を加えること。 When the text content of a graphic (e.g., in a text content element) explains its function, no text equivalent is required. Use the 'title' child element to explain the function of text content elements whose meaning is not clear from their text content.
グラフィックが説明的テキスト内容を含んでいない場合、代替テキストが必要である。代替テキストが複雑なものであるならば desc 要素を、そうでない場合は title 子要素を利用すること。 When a graphic does not include explanatory text content, it requires a text equivalent. If the equivalent is complex, use the 'desc' element, otherwise use the 'title' child element.
グラフィックが意味を持つ部品から構築されている場合は、説明も意味を持つ部品から構築すること。 If a graphic is built from meaningful parts, build the description from meaningful parts.

色に頼ってはならない。

意味内容のある情報の伝達に色のみを利用しないこと。 Do not use color alone to convey semantic information.
色のコントラストを十分確保すること。 Ensure adequate color contrast.

マークアップを正しく利用すること。

構造を呈示から分離すること。 Separate structure from presentation.
g 要素と豊富な説明を用いて SVG 文書に構造を与えること。オブジェクトに名前を与えて再利用すること。 Use the 'g' element and rich descriptions to structure SVG documents. Reuse named objects.
グラフィックス表現だけでなく高度に構造化された文書を公開すること。構造が豊富な文書はグラフィックスとしても, スピーチとしても, 点字としても出力可能になる。例えば、数式は MathML [MATHML] で表現し、 SVG を注釈的なグラフィックに利用すること。 Publish highly-structured documents, not just graphical representations. Documents that are rich in structure may be rendered graphically, as speech, or as Braille. For example, express mathematical relationships in MathML [MATHML] and use SVG for explanatory graphics.
SVG RelaxNG による妥当性の検証に通る文書を作成すること。 Author documents that validate to the SVG RelaxNG grammar.

テキストにはテキスト、グラフィックにはグラフィックを用いること。

テキストはグリフ, 画像, 曲線ではなく、文字データとして表現すること。 Represent text as character data, not as glyphs, images or curves.
テキストにはフォントでスタイルを付けること。文書作成者は自身のフォントを SVG で記述してもよい。 Style text with fonts. Authors may describe their own fonts in SVG.
小さなグラフィックに 'pi' フォントや絵フォントを利用しないこと。結果の情報として無価値なテキストは [CHARMOD] に適合せず、スピーチエンジンを混乱させる。 Do not use 'pi' fonts or picture fonts to represent small graphics. The resulting garbage text does not conform to [CHARMOD] and confuses text to speech engines.

既定の読み順を用意すること。

ボックス内で折り返すテキストには、スクリプトを用いたテキストの折り返しや関連性の無い text 要素の連なりを用いず、 textArea 要素を用いること。 Use 'textArea' elements to provide text that wraps in a box, rather than using script to wrap the text or using a sequence of unrelated 'text' elements.

自然言語の利用のされ方を明快にすること。

どの自然言語が内容に用いられていて、どこで変更されているかを xml:lang の利用により明らかにすること。これにより、テキスト内容のスペルチェックや合成音声への変換が確実になる。 Use 'xml:lang' to identify the natural language of content and changes in natural language. This ensures that textual content can be spell-checked, or converted to speech.
言語固有の代替テキストやグラフィックには systemLanguage 条件処理属性を用いること。 Use the 'systemLanguage' conditional processing attribute to provide language-specific alternative text and/or graphics.

十分なナビゲーションを用意すること。

すべての機器がポインタ装置を備えているものと見なさないこと。キーボードによるナビゲーションも用意すること。 Do not assume that all devices have a pointer device. Allow for keyboard navigation as well.
リンクには８方向のナビゲーションを用意すること。 Provide links for 8-way directional navigation.

動的内容へのアクセスを確保すること。

動的内容の変化が生じた際は更新を通知する相当のテキストを用意すること。 Ensure that text equivalents for dynamic content are updated when the dynamic content changes.
動的なテキストを ECMAScript 配列や XSLT スタイルシート内に保持することは避けること。これはアクセス性を低下させ、テキストのローカライズや多言語対応も難しくなる。 Avoid storing dynamic text in ECMAScript arrays or in XSLT stylesheets. This makes it less accessible, and also increases the difficulty of localizing the text or providing multilingual alternatives.
スクリプトや他のプログラムオブジェクトの実行が切られているか、またはサポートされていなくても、依然として SVG 文書を利用できるようにすること。 Ensure that SVG documents are still usable when scripts or other programmatic objects are turned off or not supported.

意味内容を持つメタデータを用意すること。

適切な値を与えた role 属性を用いて要素の機能を示すこと。 Use the 'role' attribute with appropriate values to indicate the functionality of elements.
要素間の関係を拡張可能なメタデータ属性により指示すること。 Indicate relationships between elements with extensible metadata attributes.
専断的な値よりもアクセシビリティツールから解釈可能なよく知られた意味内容を持つ構造化されたメタデータを用いること（例えば "btn" ではなく "button" ）。 Use structured metadata with well-known semantics that are understood by accessibility tools, rather than arbitrary values (e.g., use "button" instead of "btn").

F.3 SVG-UA アクセシビリティ指針

この節では、SVG-UA の実装者がソフトウェアを作るにあたり、どのようにアクセス性を高めるかについて説明する。 This section explains how implementors of SVG user agents can make their software more accessible.

色情報へのアクセスを用意すること。

SVG-UA は補助技術が個々の要素の色情報へのアクセスを可能にする API の実装とその仕様の文書化をすべきである。 SVG user agents should implement and document APIs so that assistive technologies can have access to color information on individual elements.
SVG-UA は高コントラストな表示の選択を用意すべきである。 SVG user agents should provide an optional high contrast view.

テキストのみの表示を用意すること。

SVG-UA は補助技術が有用なテキストのみの表示を得られる仕組みを用意すべきである。 Example には DOM 探査, テキストに特化された同期ビュー, テキスト内容を XHTML へ変換する XSLT スタイルシートが含まれている。 SVG user agents should provide mechanisms that allow assistive technologies to achieve a useful text-only view. Examples include a DOM explorer, a synchronized text only view, or an XSLT style sheet to convert the textual content to XHTML.

十分なナビゲーションを用意すること。

リンクには８方向のナビゲーションを用意すること。 Provide links for 8-way directional navigation.

複数の様式のナビゲーションと対話を可能にすること。

SVG-UA はポインタ装置以外のものがあれば、それによるズームとパンへのアクセス方式を用意すべきである。 SVG user agents should provide access to zooming and panning through modalities other than a pointer device, if available
SVG-UA はポインタ装置以外のものがあれば、それによるアニメーション, 音声, 動画の再生開始, 停止, 一時停止を可能にする方式を用意すべきである。 SVG user agents should allow animations, audio, and video to be started, stopped and paused using modalities other than a pointer device, if available.

キーボードによるナビゲーションを可能にすること。

キーボードがサポートされているならば、それによるズームとパン、あるいはアニメーション, 音声, 動画の再生開始, 停止, 一時停止を可能にすべきである。 Where a keyboard is supported, it should be possible to use it to zoom and pan, as well as start, stop, and pause animations, audio, and video.

F アクセシビリティのサポート

目次

F.1 WAI アクセシビリティ指針

F.2 SVG 内容アクセシビリティ指針

F.3 SVG-UA アクセシビリティ指針