🦯アクセシビリティのためのライティング
私たちは、コンテンツをより多くのユーザーが利用できるように取り組んでいます。アクセシビリティのためのライティングは、ページ上のすべての要素をテキストとして利用できるようにすることだけではありません。コンテンツを整理し、ページを通じて読者をガイドする方法にも影響します。オーディエンスや国によっては、必要なアクセシビリティのレベルを規定する法律があります。少なくとも、アクセス可能なバージョンを利用できるようにする必要があります。アクセシビリティは、状況的なもの(眼鏡が壊れた!など)、または永続的なものであるかどうかにかかわらず、あらゆる精神的・身体的能力を持つユーザーが対象です。
基本
私たちは、さまざまな方法でMailchimpのコンテンツに触れ ている、多様な読者に向けて記事を書いています。私たちは、スクリーンリーダー、キーボードナビゲーション、点字インターフェースを使用している人や、あらゆる認知能力を持つユーザーがコンテンツにアクセスできるようにすることを目指しています。
記事を書くときは、次のことを考慮してください。
- ここで働いていない人もこの言葉を理解できますか?
- さっと目を通すことで内容を理解できる文書ですか?
- 色、画像、動画を見ることができない人にも、メッセージは明確に伝わりますか?
- マークアップは明確かつ、構造化されていますか?
- アクセシビリティ機能を備えたモバイルデバイスは、ますますコミュニケーションツールの中心になってきていますが、それらのデバイスでうまく機能していますか?
アクセシビリティのためのライティングのベストプラクティスは、その多くが「テクニカルコンテンツを書く」のベストプラクティスとよく似ています。ただしそこに、マークアップ、構文、構造などの複雑な要素が加わってきます。
ガイドライン
方向を表す言葉を使わない
方向を示す言葉や、読者にページのレイアウトやデザインを見てもらうような文言は避けましょう。これは、モバイルでのレイアウト変更があった場合など、多くの場面で役立ちます。
- OK:「これらのオプションから選択してください。」(タイトルの下に手順のリストを入れる)
- NG:「右側のサイドバーからオプションを選択してください。」
ヘッダーを使う
ヘッダーは常に入れ子にし、連続的なものにします。スタイル上の理由でヘッダーを省くことは止めましょう。セクションをグループ化しやすくするために、ページタイトルがH1、トップレベルのセクションがH2、それに続く下位の文章がH3、H4、H5のようになっていることを確認してください。過剰に入れ子にしないようにします。
階層構造を用いる
最も重要な情報を最初に持ってきます。似たようなトピックは同じ段落に収め、異なるトピックは見出しを付けて明確に区切ります。
キーとなるメッセージが含まれた簡単なアウトラインを最初に作ります。それにより階層が作成しやすくなると同時に、自分のアイデアを論理的に整理しやすくなります。また、記事がさっと目を通すだけでもわかりやすくなり、理解も深まります。
段落や改行を使わず、実際のリストを作りましょう。
ラベルフォーム
入力フォームに、わかりやすいラベル名を付け、適切なタグを使用します。どの記入欄が必要か、特にどの記入欄を必須項目としてマークするかについて慎重に検討してください。必須の記入欄にははっきりとラベルを付けます。フォームは短いほど良いです。
説明的なリンクを使う
リンクには、関連アクションやリンク先についての情報を表示します。「click here(こちらをクリック)」や「learn more(詳細はこちら)」といった表現は避けましょう。
わかりやすい言葉を使う
短い文章を書き、なじみのある言葉を使いましょう。専門用語やスラングは避けてください。人々が理解できないかもしれない略語や頭字語を使用しなければならない場合は、その言葉を初めて使う時に意味を説明します。
代替(alt)テキストを使う
altタグは、画像を説明するための最も基本的な形式です。すべての画像に含める必要があります。altタグ内の言葉は、画像の目的に合わせます。
- クリエイティブな写真であったり、ストーリーがある場合は、簡単なキャプションで画像の詳細を説明してください。
- 画像が特定の役割を果たしている場合は、画像の中身を詳しく説明しましょう。そうすることで、画像を見ることができない人でも、画像を見たときと同じ情報を得られます。
- チャートやグラフの場合は、代替テキストにデータを含めて、人々がすべての重要な情報を入手できるようにします。
ブラウザによってaltタ グの扱いは異なります。可能な場合は、標準のキャプションで画像を補足してください。
クローズドキャプションが使用可能であることを確認してください
視覚的な要素について考える
フォントと背景色のコントラスト比が高くなるようにしてください。下記のリソースのセクションにあるツールは、アクセシブルな色を選ぶのに役立つはずです。
画像が読み込まれなかったり、見られなかったりする可能性があるため、画像だけがコミュニケーション方法であってはなりません。同じ情報をテキストで伝えられるのであれば、画像の使用は避けてください。
リソース
Last modified 2yr ago