このトピックでは、Sway をアクセシビリティ対応にし、障がいのあるユーザーを含むすべてのユーザーがコンテンツのロックを解除できるようにする方法について段階ごとの手順を説明します。 包括性を念頭に置いて Sway を作成すると、誰もがその概念やアイデアを読んで理解できます。
このトピックでは、障碍のあるユーザーにとって Sway の使用が困難になる可能性があるアクセシビリティの問題に対処するために、アクセシビリティ チェックの使用方法を学習します。 また、画像や図形に代替テキストを追加して、スクリーン リーダーを使用しているユーザーが画像や図形を聞くことができるようにする方法についても説明します。 さらに、他のユーザーと共有する前に、テンプレート、フォント、色を使用して Sway の包括性を最大限に高める方法について読むことができます。
この記事の内容
- Sway のアクセシビリティを向上させるためのベスト プラクティス
- アクセシビリティ チェックで Sway を確認する
- 組み込みの見出しスタイルを使用する
- アクセシビリティの高いテキストとフォントの形式と色を使用する
- アクセシビリティ対応のハイパーリンクを作成する
- 画像や動画の代替テキストを追加または編集する
- クローズド キャプションを使用してオーディオおよびビデオのアクセシビリティを向上させる
- イマーシブ リーダーでアクセシビリティをテストする
Sway のアクセシビリティを向上させるためのベスト プラクティス
次の表は、障碍のあるユーザー向けのアクセシビリティの高い Sway コンテンツを作成するための主なベスト プラクティスを示しています。
| 修正する内容 | 修正が必要な理由 | 解決方法 |
|---|---|---|
| 代替テキストが表示されない、色のコントラストが低いなど、一般的なアクセシビリティの問題を回避します。 | すべてのユーザーが簡単に Sway を理解して使用できるようにします。 | アクセシビリティ チェックで Sway を確認する |
| テキストと背景の色に十分なコントラストを付けます。 | 弱視または色覚異常の People は、コンテンツを表示して使用するためにテキストと背景の強いコントラストが必要です。 |
アクセシビリティの高いテキストとフォントの形式と色を使用する アクセシビリティ対応の Sway スタイルを使用する |
| 組み込み見出しを使用します。 | 正しいナビゲーション順序を保持し、スクリーン リーダーが Sway を読みやすくするには、論理的な見出し順序と Sway の組み込み見出しカードを使用します。 | 組み込みの見出しスタイルを使用する |
| 使い慣れたフォント形式を使用します。 | 弱視や読解障害のある People は、セリフ フォントや斜体などの重い書式を使用するテキストを読むのが難しい場合があります。 |
アクセシビリティの高いテキストとフォントの形式と色を使用する アクセシビリティ対応の Sway スタイルを使用する |
| わかりやすいハイパーリンク テキストを追加します。 | リンク先についての明確で正確な情報を伝えるリンク テキストにより、スクリーン リーダーを使用するユーザーがテキスト内のリンクに目を通して簡単になります。 | アクセシビリティ対応のハイパーリンクを作成する |
| すべてのビジュアルに代替テキストを含めます。 | 代替テキストは、画面を見ることができない、画像や他のビジュアルで何が重要であるかを確認できないユーザーの役に立ちます。 オーディオおよびビデオのコンテンツの場合は、代替テキストだけでなく、聴覚に障碍のあるユーザーのためにクローズド キャプションを追加します。 |
画像や動画の代替テキストを追加または編集する クローズド キャプションを使用してオーディオおよびビデオのアクセシビリティを向上させる |
アクセシビリティ チェックで Sway を確認する
アクセシビリティ チェックは、コンテンツを確認し、発生したアクセシビリティの問題にフラグを設定するツールです。 各問題が障碍のあるユーザーにとって潜在的な問題になる理由について説明します。 アクセシビリティ チェックでは、問題の解決方法も提案されます。 組み込みのアクセシビリティ チェックを使用すると、Sway がアクセシビリティ対応かどうかを簡単に確認できます。
- Sway で、[
(利用可能なオプションを検索)] > [アクセシビリティ チェック] を選択します。
- [ アクセシビリティ チェック ] ウィンドウで、[ すべて確認] を選択します。 最初の問題が表示されます。
- 問題を修正し、[
] を選択して次の問題に進みます。 - 報告されたすべての問題を修正したら、[ 完了] を選択します。
組み込みの見出しスタイルを使用する
方位は、視覚と支援技術の両方を使用してスキャンすることを目的としています。 見出しは、カードまたはセクションが何であるかを説明するのが理想的です。 組み込みの見出しスタイルを使用し、説明的な見出しテキストを作成して、スクリーン リーダー ユーザーがメッセージの構造を簡単に判断し、見出しをナビゲートできるようにします。
規定された論理的順序で見出しを並べます。 たとえば、 見出し 1 の後に見 出し 2 を使用します。 さらに、情報を小さなチャンクに整理します。 理想的には、各見出しに含まれる段落が 2、3 個だけになるようにします。
次のいずれかの操作を行います。
- 新しい見出しを挿入するには、
![Sway ストーリーラインの [コンテンツの挿入] ボタンを選択します。](../media/insert-content-button-in-sway.png)
([コンテンツを挿入]) をクリックします。 [ テキスト] タブを選択し、使用可能な見出しレベルのいずれかを選択します。 - 既存のテキスト カードを見出しに変換するには、テキスト内にカーソルを置き、ツール バーから 見出し を選択します。
- 新しい見出しを挿入するには、
アクセシビリティの高いテキストとフォントの形式と色を使用する
アクセシビリティ対応のテキスト形式は、弱視や読み取り障碍のあるユーザー、視覚障碍のあるユーザーなど、Sway を読むすべてのユーザーの読み取り速度を除外したり遅くしたりすることはありません。 適切なフォント形式と色を使用すると、Sway コンテンツの読みやすさと読みやすさが向上します。
視覚障害のある人は、特定の色が伝える意味を見逃す可能性があります。 たとえば、色覚障碍のある方が、色がわからない場合でも、リンクされたテキストがあることがわかるように、色が使用されたハイパーリンク テキストに下線を追加します。 見出しについては、[太字 を強調] を使用することを検討してください。
見出しやテキスト カードの アクセント 形式は慎重に使用します。 People with reading disabilities (読書障碍のある人) は、斜体が多すぎたり、単語がすべて大文字で、下線が使われたりするテキストを読むのが難しい場合があります。
フォントの形式と色を変更する方法については、「 アクセシビリティ対応の Sway スタイルを使用する」を参照してください。
アクセシビリティ対応の Sway スタイルを使用する
Sway では、事前にデザインされたスタイルとデザインを見つけたり、スタイルをカスタマイズして、背景色、フォントの書式、色がすべてのユーザーに包括的であることを確認できます。
読み取りの負荷を軽減するには、Arial などの使い慣れたサンセリフ フォントを選択します。 すべて大文字にしたり、過剰な斜体または下線を使用したりしないでください。
Sway のテキストは、ハイ コントラスト モードでも読み取り可能である必要があります。 たとえば、明るい色、または色スペクトルの反対側にある高コントラストの配色を使用します。 白黒のスキームを使用すると、色覚特性のあるユーザーでもテキストと図形を簡単に区別できます。
[デザイン>スタイル] を選択します。
次のいずれかの操作を行います。
- 目的のスタイル (白黒など) を選択します。
- 事前にデザインされたスタイルをニーズに合わせて変更するには、[ カスタマイズ] を選択します。 [ カラー パレット] で、ハイ コントラスト パレット (背景は黒、テキストは黒など) を選択します。 [ フォントの選択] で、たとえば Arial Nova を選択します。
![使用可能なスタイルの一覧と Sway の [カスタマイズ] ボタンを表示する [スタイル] ウィンドウ。](../media/styles-pane-in-sway.png)
アクセシビリティ対応のハイパーリンクを作成する
スクリーン リーダーを使用するユーザーがコンテンツ内のハイパーリンクを簡単にスキャンできるようにするには、説明的なリンク テキストを使用します。
理想的には、ハイパーリンク テキストは、リンク先ページに関する明確で正確な情報を伝える必要があります。 リンク先ページのタイトルがページ コンテンツを要約している場合は、ページ全体のタイトルをハイパーリンク テキストとして使用します。 たとえば、次のハイパーリンク テキストは、リンク先ページのタイトルと一致します。 Microsoft テンプレートを使用してさらに作成します。 "ここをクリック"、"このページを参照"、"ここに移動"、"詳細情報" などのリンク テキストの使用は避けてください。
- ハイパーリンクに変換するテキストを選択します。
- ツールバーで、[ リンク] を選択します。
- [ リンク ] ダイアログ ボックスで、[ 表示テキスト] フィールドのテキストを確認し、必要に応じて変更します。
- [Web リンク] テキスト フィールドに、リンク先ページの URL を入力するか貼り付け、[OK] を選択します。
画像や動画の代替テキストを追加または編集する
代替テキストは、スクリーン リーダーを使用するユーザーが画像やビデオの重要な内容を理解するのに役立ちます。 スクリーン リーダーは代替テキストを読み取り、表示できないユーザーに視覚エフェクトを説明します。
代替テキストでは、画像またはビデオに表示されている内容と、画像またはビデオの目的を簡単に説明します。 代替テキストの書き方の詳細については、「 効果的な代替テキストを記述するために必要なすべての情報」を参照してください。
重要な情報を伝達する唯一の方法として、画像にテキストを使用するのは避けてください。 テキストを含む画像を使用する必要がある場合は、コンテンツ内でそのテキストを繰り返します。 代替テキストで、画像について簡単に説明し、テキストがあることとその目的を説明します。
ストーリーラインの代替テキストを確認できます。 Sway は、ファイル名に基づいて画像やビデオの代替テキストを作成します。 また、Web のアセットなど、代替テキストが既に含まれている画像またはビデオを使用している場合、Sway はそのテキストを含めます。 見つからない代替テキストを検索するには、 アクセシビリティ チェックを使用します。
イメージ カードまたはビデオ カード上で、画像またはビデオを選択します。
[詳細] を選択します。
代替テキスト カードで、画像または動画の代替テキストを入力または編集します。
ヒント
視覚効果が純粋に装飾的であり、視覚的な興味をそそるものの、背景画像などの情報的ではないものである場合は、代替テキストを記述することなく、そのようにマークしてください。 スクリーン リーダーを使用している People は、これらのビジュアルが装飾的であると認識し、重要な情報を見逃しているわけではないことがわかります。 ビジュアルを装飾としてマークするには、代替テキスト カードで [装飾] を選択します。
クローズド キャプションを使用してオーディオおよびビデオのアクセシビリティを向上させる
クローズド キャプションを使用すると、聴覚や学習に障碍のあるユーザーにとってオーディオとビデオ コンテンツのアクセシビリティが向上します。 また、音声が不便な場合にも使用されます (たとえば、空港のような騒がしい環境や、図書館のような静かな環境など)。
アカウントの種類とファイルのアップロード方法に基づいて、ファイルにクローズド キャプションを追加できます。
| 次の種類のアカウントでアップロードしたファイルの場合 | 次の場所からアップロードしたファイルにクローズド キャプションを追加できます |
|---|---|
| 職場または学校のアカウントでアップロードしたオーディオ ファイル |
|
| Microsoft アカウント (個人) でアップロードしたオーディオ ファイル |
|
| 職場または学校のアカウントでアップロードしたビデオ ファイル |
|
| Microsoft アカウント (個人) でアップロードしたビデオ ファイル | 現在サポートされていません |
Sway のオーディオ ファイルまたはビデオ ファイルにクローズド キャプション ファイルを追加する
- コンピューターからコンテンツをアップロードして録画するか、OneDrive または職場や学校向けの OneDrive からコンテンツを追加して、新しいビデオまたはオーディオ カードを Sway に追加します。
- カードを展開するには、[詳細] を選択します。
- 展開されたカードの下部にある [クローズド キャプションの追加] を選択します。
- エクスプローラーで、クローズド キャプション ファイル (.vtt 形式、最大サイズ 1MB) を選択し、[開く] を選択します。
- クローズド キャプションの言語を選択します。
イマーシブ リーダーでアクセシビリティをテストする
Sway の準備が整い、アクセシビリティ チェックを実行してコンテンツが包括的であることを確認したら、たとえば、イマーシブ リーダーで Sway を読み取り、視覚障碍のあるユーザーにとってどのように聞こえるかをチェックしてみてください。
- Sway で、[デザイン] を選択します> (利用可能なその他のオプションを見る) >アクセシビリティ ビュー。
- アクセシビリティ ビューで、F9 キーを押すか、Sway を右クリックして、[イマーシブ リーダーで開く] を選択します。
- イマーシブ リーダー ビューで、[音声読み上げ] を選択します。 テキストがどのように流れ、イマーシブ リーダーがどのように Sway の要素を読み上げるかを聞きます。 アクセシビリティの問題を見つけた場合は、Sway を共有する前に必ず修正してください。
関連項目
Microsoft 365 アプリでアクセシビリティの高いコンテンツを作成する
障碍のある方のためにアクセシビリティの高い Word 文書を作成する
障碍のある方のためにアクセシビリティの高い Excel 文書を作成する
障碍のある方のためにアクセシビリティの高い PowerPoint プレゼンテーションを作成する
障碍のある方に対する、Outlook メールのアクセシビリティを高める
障碍のある方向けのテクニカル サポート
Microsoft は、すべてのお客様に最適な操作性を提供することを目指しています。 障碍をお持ちの場合、またはアクセシビリティに関する質問がある場合は、 Microsoft Disability Answer Desk に技術サポートを依頼してください。 Disability Answer Desk サポート チームは、一般的なユーザー補助技術を駆使するトレーニングを受けており、英語、スペイン語、フランス語、および米語の手話でサポートを提供することができます。 お住まいの地域での連絡先の詳細については、Microsoft Disability Answer Desk サイトを参照してください。
政府機関、商用、または企業のユーザーの場合は、 Enterprise Disability Answer Desk にお問い合わせください。