中外製薬   研修資料のアクセシブル化

写真:社員がパソコンに向かい、資料を元に研修を受けている様子

すべての社員にとってわかりやすく
社内資料をインクルーシブに

中外製薬株式会社様(以下、中外製薬)の 全社員必修の研修資料を、視覚障害がありパソコンの音声読み上げ機能を用いる社員にも理解できるようにしました。また、資料内の図の色使いやコントラスト比(色の明暗差)を見直すことで、視力が低い社員、色を見分けにくい社員も含めた全社員にわかりやすい表現にしました。そして、これらの対応方法を資料作成ガイドラインとしてまとめました。

  • ドキュメント・スライド
  • デザインガバナンス構築支援

[ プロジェクトのポイント ]

  • スクリーンリーダーでの音声読み上げに最適化した資料の制作
  • 「見えにくい」社員にもわかりやすい表現の工夫
  • 長期的な運用を見据えた社内マニュアルの制作
  • WordとPowerPointのアクセシビリティ対応
スライド(5枚中1枚目): 記事内で出てくるガイドラインの抜粋1
スライド(5枚中2枚目): 記事内で出てくるガイドラインの抜粋2
スライド(5枚中3枚目): 記事内で出てくるガイドラインの抜粋3
スライド(5枚中4枚目):記事内で出てくるガイドラインの抜粋4
スライド(5枚中5枚目): 記事内で出てくるガイドラインの抜粋5

プロジェクトの背景

全社員対象の研修をeラーニングで実施していましたが、視覚障害がありスクリーンリーダー*の音声読み上げを利用している社員には受講が困難でした。そのため、eラーニング研修の出典であるPowerPoint資料のスクリーンリーダー対応を検討する必要がありました。また社内での継続的な運用を前提に、図を文章で説明するためのノウハウや、視力が低い社員、色を見分けにくい社員も含めた全社員にとって見やすい図の作成方法をまとめたガイドライン制作のご要望もいただきました。

*スクリーンリーダーとは、画面に表示されるテキスト情報を音声で読み上げ、点字として出力するソフトウェア。画面の情報を音声で読み上げる機能に加え、パソコンのキーボード操作を補助する機能ももっています。対応するOSやブラウザによって複数の種類があります。

問題解決までのアプローチ

実際にWindows対応のスクリーンリーダーで検証をしながら、PowerPoint資料の内容を読み上げに最適化したWord原稿として再構成しました。

Word原稿に置き換えず、PowerPoint資料固有のスクリーンリーダー対応も可能です。ただ専門的な機能を使って設定する必要があるため、今後の社内運用を踏まえた学習コスト軽減の観点から、今回は一般的な機能を用いて設定できるWord原稿の利用を選択しました。

Wordにはメリットが2つあります。

1つ目のメリットは、スタイル機能を使用して見出しレベルを設定することによって、スクリーンリーダーで情報構造を読み取れるという点です。スクリーンリーダーには、特定のレベルの見出しをジャンプして読み上げる機能があります。この機能を用いることで、より構造的に研修内容を把握できると考えました。また晴眼者による内容更新作業時も情報構造を把握しやすいよう、視覚的に整理されたデザインにカスタマイズしました。

スライド:スクリーンリーダーに対応したWord原稿の作り方。元となるPowerPoint資料の情報構造を整理してWord原稿に書き起こした後、スタイル機能を使ってスクリーンリーダー対応の設定をするという全体の手順説明。

納品した資料作成ガイドラインより一部抜粋

スライド:見出しレベル1〜6、本文、箇条書き、番号付きリスト

Word原稿用のカスタムスタイル

2つ目のメリットは、専門用語・社内略語などの誤読防止に対応しやすい点です。研修資料には一般的な読み方とは異なる専門用語が頻出します。例えば「中外」を「ナカソト」と読み上げないよう、「チュウガイ」と読み仮名で書くことで誤読を防止できます。

スライド:納品した資料作成ガイドラインより一部抜粋。読み上げに適した文章の書き方として、発音を指定したい単語や略語は読み仮名で書くことを推奨。アルファベットの略語はローマ字読みで読み上げられる可能性が高いため、社内で通用している発音をカタカナで書くこと、略語の初出時には正式名称も併記すること、漢字は「詳細読み」で意味を推測することができることを説明している。

クリエイティブのポイント

研修資料のスクリーンリーダー対応に当たって、内容に集中できるように原稿そのものも工夫しました。「赤い点線」や「こちらをクリック」といった見た目に頼った表現は、別の説明に言い換えました。赤字・太字による強調や注釈表現など見た目のわかりやすさが優先されている部分は、耳で聞いた時にわかりやすいよう、要点や結論を先に示すなど構造自体を見直しました。スクリーンショットで示された手順や概念図などは、画像と同じ意味が文章でも伝わるよう、簡潔な代替テキストに書き起こしました。

スライド:納品した資料作成ガイドラインより一部抜粋。読み上げに適した文章の書き方として、見た目に頼った表現をしないことを推奨。位置や配置だけで表現することを避けるため、ハイパーリンクには「英語版はこちらへ」ではなく、「英語版ログイン画面」という遷移先がわかりやすい文言を用いることを説明している。

また、視力が低い社員、色を見分けにくい社員には、画像が示す内容が正しく伝わっていない可能性があったため、研修資料内の複雑な図も修正しました。色や細かい形など、見た目だけに頼った表現やコントラスト比を見直し、伝えたい情報を簡潔に整理しました。このような対応は障害の有無にかかわらず、すべての社員にメリットがあります。例えばモノクロ印刷でも内容が把握しやすくなったり、遠くのスクリーンに写した際に近眼の社員でも見やすくなったりするからです。スクリーンリーダー対応だけではなく、一人でも多くの社員にとってわかりやすいインクルーシブ(包括的)な資料を目指しました。

スライド:納品した資料作成ガイドラインより一部抜粋。わかりやすい図の作り方として、色だけで表現しないことを推奨。色分けに頼った説明が多用されていたベン図の修正前と修正後の比較。
スライド:納品した資料作成ガイドラインより一部抜粋。わかりやすい図の作り方として、地色と文字にコントラストをつけることを推奨。白抜き文字のコントラストが不足していた図の修正前と修正後の比較。

そして、上記の対応意図や設定方法、資料作成の上で考慮すべき点を資料作成ガイドラインとしてまとめました。運用担当者にアクセシビリティの知識がなくても、本ガイドラインを見ながら修正・更新作業ができるよう、修正例や対応理由を交えて説明しています。

スライド:納品した資料作成ガイドラインの表紙と目次。タイトルは「アクセシブルな資料作成のガイドライン」。目次の項目は6つ。はじめに、用語解説、スクリーンリーダーに対応したWord原稿の作り方、読み上げに適した文章の書き方、わかりやすい図の作り方、スクリーンリーダーに対応したPowerPoint資料の作り方。

お客様の声

2月末に、作成にご協力いただいたスクリーンリーダー対応版資料で研修を実施いたしました。スクリーンリーダー対応版の受講者に聞き取りを行ったところ、以下のような趣旨のコメントがありました。

「これまでのeラーニングはスクリーンリーダーに対応していなかったため他の方に内容をすべて読み上げてもらう必要があり、予定を合わせたり、そのための会議室を確保したりする手間も時間もかかっていた。スクリーンリーダー対応版では、都合が良い時に一人で半分の時間で受講することができ、復習もしやすく内容がよく理解できた」。

また、eラーニング版の受講者からも「資料が見やすくなった」とのコメントが複数届いております。ご担当の皆様に細部まで丁寧に作成いただいたおかげです。本当にありがとうございました。

[ プロジェクト概要 ]

クライアント名 中外製薬株式会社 様
発行日 2019年12月11日

お仕事のご相談やお見積もり、ご不明な点など、お気軽にお問い合わせください。

お問い合わせ
ページの先頭に戻る