Wikipedia:アクセシビリティ

出典: フリー百科事典『ウィキペディア(Wikipedia)』
移動: 案内検索

アクセシビリティでは、記事を読みやすく、ブラウズしやすくするために考慮すべきことを説明します。アクセシビリティについて考慮されたページは、視覚色覚四肢などの障碍を持つ人たちにとっても利用しやすいだけでなく、一般の健康な人にも読みやすいものになるでしょう。

近年では、パソコンのみではなく、携帯電話タブレットなどの小型端末などを使ってウェブサイトを読むことも一般的になっています。同時に、古くからある機器やソフトウェアによってウィキペディアを閲覧している人も沢山います。文章のみで閲覧するテキストブラウザの愛好者も存在します。さらに、サーチエンジンのbotや自然言語処理のプログラムからウィキペディア上の文章が理解されうる必要もあります。ウィキペディアを見るのに使用される装置やソフトウェアの環境、例えばウェブブラウザの種類・ウィンドウの大きさ、機種依存文字・表示可能な色・装置の性能、さらには装置に限らず印刷された用紙の紙幅なども様々に異なることに注意してください。 障碍のあるなしに関わらず全てのウィキペディアンにとって読みやすく、編集しやすい記事を執筆できるように、以下のガイドラインを考慮してください。

記事の構造[編集]

導入部[編集]

スタイルマニュアルに説明があるように、導入部では必要な要素を以下の順番で提示します。あいまいさ回避のリンク(dablinks)、メンテナンスタグ、インフォボックス、画像、ナビゲーションボックス(またはナビゲーション用テンプレート)、導入文、目次、そして最初の節のヘッダ、という順番です。

以下は、ウサギ [1]の冒頭から引用した例です。上記の順番になっていることを確認してください。

{{Redirect|兎|麻雀を題材にした漫画|兎-野性の闘牌-}}
{{Redirect|うさぎ|漫画『[[美少女戦士セーラームーン]]』の登場人物|月野うさぎ}}
{{告知|提案|大幅削除と内容の厳選について}}

{{生物分類表  (一部省略)
...
|名称 = ウサギ
|画像=[[ファイル:Oryctolagus cuniculus Tasmania.jpg|250px|アナウサギ]]
|画像キャプション = '''アナウサギ''' ''Oryctolagus cuniculus''
...
}}

'''ウサギ'''('''兎''')は、'''ウサギ科'''に属する草食[[哺乳類]]の総称。

見出し[編集]

見出しを読んだだけで節(セクション)の内容が分かるように、見出しを付けるべきです。強調(''')を見出しとして使ったり、逆に見出しを強調として使わないでください[2]

節の構造[編集]

導入部の説明にもあったように、それぞれの節はある決まった構造を持ちます。

<!-- CORRECT CODE -->
== Foo bars ==
{{main|Foo bar}}
{{cleanup-section}}

[[Image:...|Typical Foo bar]]

'''foo bar''' は...

また、画像は関係した節の中に配置してください(節のヘッダや他記事へのリンク、タグなどの後です)。ヘッダの前には置かないでください。

解像度[編集]

ウィキペディアの記事は、携帯電話のように小さな画面や、低い解像度しかないディスプレイでも見られるようにすべきです。一般ユーザに影響を与えることなくサポートできる最低の解像度は800×600と考えられます。すべての記事はこの解像度で、水平方向のスクロールなしに読めなければなりません。800×600の解像度では、画面の両側に画像や表が複数並んだ記事の閲覧には問題が生じることがあります。低い解像度しかない装置でも、段落を縦に引き伸ばしたり画像を違う位置へ移動させたりする機能を持つものもありますが、記事両側の同じ場所へ同時に画像や移動できるコンテンツを追加するときには注意してください。 同様に、大きな表や画像も問題を引き起します。水平方向へのスクロールが避けれらない場合もありますが、その時にも表を横へ広げるよりは、下へ伸ばして構築し直せないか考えてみてください。

文章[編集]

  1. 誤字・脱字には注意してください。視覚障碍者向けのスクリーンリーダーなどがうまく働かない可能性もあります。また、誤字・脱字のある文章は健常者にも読みにくいものです。
  2. 打消し線(これは例です。)を使って、記事中の議論のある記述を修正しないこと。"<!--" と "-->"によるコメントアウトを使うか、完全に除去してしまってください。普通、スクリーンリーダーは文章の強調(イタリックや太字、下線など)を無視します。そのため打消し線の引かれた文章も、他の文と同じく読み上げられてしまいます。(Editors who participate in Wikipedia policy and XfD debates are advised to turn on the sounding of text attributes when doing so, as struck text is very common in Wikipedia-internal discussions.)
  3. 日本語ラテンアルファベットに無い文字は、カタカナ表記するか翻字してください。ユニコードをサポートしていないスクリーンリーダーは、これらの文字を読みあげられないことがあります。Provide a transliteration for all text in a non Latin writing system. Screen readers without Unicode support will read a character outside Latin-1 as a question mark, and even in the latest version of JAWS, the most popular screen reader, Unicode characters are very difficult to read.
  4. ツールチップなど、情報を得るためにマウスの動きなどの物理的な動作を必要とする技術を使わないこと。
  5. スクリーンリーダーを用いた編集では、1行ごとに編集するのが普通なので、どうしても必要な場合を除いてウィキペディアのソースに改行を入れないこと。

リンク[編集]

  1. リンクしすぎないこと。多くのスクリーンリーダーには、リンクのみを抽出して読み上げる場合があります。
  2. リンクには内容に沿った説明を付けること。特に外部へのリンクの場合は注意。(ここをクリックここ あるいは「もっと読む」といったリンクを避けること。)
  3. できる限り少ないコードを使うこと。編集画面での文章が読みやすくなります。(たとえば、"[[日本]]的"で済むところを"[[日本|日本的]]"としないこと)
  4. 記号やユニコード文字をアイコンとして使わないこと。代替テキスト付きの画像のアイコンを使うべきです。例えば、"→"(「右」を意味する記号)のような記号はスクリーンリーダーが読まないことがあります。

[編集]

同じように主に文字を用いたユーザーインターフェースの2つのスクリーンショット。上のものは赤、緑、青を使用している。下のものは赤と緑にほぼ同じ色を使用しているもので、赤い文字は緑の背景の中でほとんど見えなくなっている。
赤緑色覚異常が視認性にどう影響するかを示しているスクリーンショット

はウィキペディアの記事ではテンプレートで最もよく使われています。使用できる色についてはウェブカラーをご覧ください。

記事に色を使用する場合には、以下のようにアクセシビリティに留意しなければなりません――

  • 色が重要な情報を伝達する唯一の方法にならないようにしてください。たとえば、「表中の赤字部分は○○」といった方法を取ってはいけません。そういった場合は、斜体や太字を併用する、脚注を付ける、その「○○」を併記する、あるいは記号(※印や三角など)で表現する、などの方法を取るべきです。色だけで情報を表現しようとすると、盲目の利用者や、モノクロ印刷やモノクロ画面でウィキペディアを閲覧する読者にはその情報が伝わりません。
  • ウィキペディアの読者には部分的もしくは完全な色覚異常を持つ人も多くいます(日本人男性には特に多く、軽度のものを含めると20人に1人が該当します)。ウィキペディアで用いられる色の組み合わせ(インフォボックス、ナビゲーションボックス、グラフなど)には適切なコントラストを確保するようにしてください。色の選択にカラースキームジェネレータを用い、色覚異常をシミュレートするツール(vischeck.comもしくはcolorfilter.wickline.orgなど)で結果を確認しましょう。
  • リンクの色をデフォルトから(特に赤へと)変更することは混乱を招くので避けるべきです。
  • 普通のテキストと青リンクのテキストの両方について、背景色とのコントラストに留意し、できるだけ衝突を避けてください(赤い背景に青い文字など)。
  • 色を過度に使用している記事には、{{色の過剰使用}}テンプレートを記事の冒頭に貼付してください。次のように表示されます。
  • AccessColorで、HTMLソースと関連するCSSを解析し、文字と背景色との間の色のコントラストと明度を計算し、ページがWCAG 1.0に準拠しているかをオンラインで点検できます。
  • World Wide Web Consortiumの草案アルゴリズムを使用しているColour Contrast Analyserや、専用のFirefox extensionを用いて、色盲を含む視覚障害のある人に適切な色のコントラストになっているかをテストできます。

ブロック要素[編集]

箇条書き[編集]

Help:箇条書きも参照。

リストに1行以上の改行を入れないこと。もしリストが1行以上離れてしまうと、HTMLのリストタグはそこで終わってしまいます。

[編集]

Help:表の作り方も参照。

スクリーンリーダーや他のウェブブラウザは、表に含まれるデータをユーザが見やすい(あるいは聴きやすい?)ように、一部のHTMLのテーブルタグを特別な方法で使うことがあります。

単にレイアウトのためだけに表を使うことは避けてください。

外国語[編集]

日本語(ラテン文字も含む?)以外の語句には、{{lang}}タグを用いるべきです。

{{lang|fr|Assemblée nationale}} (国民議会)

は、

Assemblée nationale (国民議会)

と表示されます。

画像[編集]

  1. 画像には代替テキストを付けましょう。代替テキストは、盲目のユーザやサーチエンジンのボットに対して、または画像が表示されないとき、画像の代わりとなる文章です。
  2. 画像にはキャプションも付けましょう。Help:画像の表示も参照。画像のキャプションは、なるべく画像の意味を正確に説明し、単独で読んでも意味が理解できる文にするべきです。
  3. 可能ならば、画像を見られないユーザにも理解できるように、全ての図表やグラフにはテキストによる内容の説明を付けるべきです。
  4. 本文中に加えるのが適切ではない、画像の詳細な説明は画像の説明ページに移動させるべきです。
  5. 画像は関係する節内に置くべきです。
  6. 可能ならば、デフォルトのユーザ設定を上書きするほどに画像しないでください。文字を大きく表示するよう設定している閲覧者も居ます。大きな画像のサムネイルは、文字を表示するスペースを奪ってしまうかもしれません。

動画と音声[編集]

記事の理解を助けるために、動画や音声が使われることがあります。この場合も、画像や色に関する注意と同様に、動画や音声が情報を得る唯一の手段とならないように注意してください。

スタイルとマークアップについて[編集]

一般的には、許容されたHTML要素よりはウィキのマークアップを用いるべきです。特に、<i>(イタリック)や<b>(太字)を文章の整形に使わないでください。それらの代わりに''や'''、または論理的なスタイルタグを使いましょう。もちろんこれには例外もあります。<u></u>は、たとえばクリックできないリンクの例を作るなどの利用方法があるかもしれません。<font>タグは記事に使わないほうが良いでしょう。そのかわりに、意味の違いを強調するためには、論理的なスタイルタグ、(<em>、<code>や<strong>)といったタグを使ってください。

スタイルシートやJavaScriptの制限された利用者への配慮[編集]

ウィキペディアの記事は、CSSJavaScriptを部分的にしかサポートしていない機器からもアクセスできるべきです。しかしそれと同時に、CSSJavaScriptをサポートした最新のブラウザと、機能の制限されたブラウザで同じ体裁を整えようとするならば、多くのユーザにとって有用な機能を制限せざるを得ない、という事実も知っておくべきです。CSSやJavaScriptを使えない環境で、コンテンツが見えなくなったり、崩れてしまうような機能は使ってはなりません。これにはen:Wikipedia:HiddenStructureのような機能によってテーブルの中身を隠す方法[3]や、また、ダイナミック・ナビゲーション・ボックスの畳み込みなどJavaScriptを使用できなければ内容が分からないような実装も含まれるかもしれません。しかし互換性を考慮するあまり一般的なユーザが不便を感じることのないように、機能に制約のあるブラウザへの考慮は「最低限読める」ということが確かなレベルで良いです。

これらの配慮に慣れておくために、大きな変更を起こす可能性のある編集の前には、JavaScriptやCSSを無効にしてテストすべきです。Firefoxでは、WebDeveloperという拡張を用いれば簡単にテストできます。その他のブラウザでも設定で無効にできます。また、インラインCSSは、いくつかのブラウザ、メディア、XHTMLのバージョンによってはサポートされていないことに少し注意してください。

キーボードショートカット[編集]

ウィキペディアにはキーボードショートカットがあります。これらは無効にできます。

関連項目[編集]

脚注[編集]

  1. ^ 「ウサギ」2009年10月28日 (水) 20:25(UTC)の版
  2. ^ たとえばモバイル版のウィキペディアでは、見出しごとに文章が折り畳まれて表示されます。読者が見出しを見ただけで、記事を読むべきか判断できるべきです。
  3. ^ この機能は2006年以降もはや使われていません。