アクセシビリティの高い画像とメディアを SharePoint Online サイトに追加する
Applies ToMicrosoft 365 の SharePoint 一般法人向け Office

Microsoft 365 の SharePoint を使用すると、すべてのマルチ メディア コンテンツに対して代替テキスト (alt テキストとも呼ばれる) を簡単に追加できます。 代替テキストは、完全なドキュメント アクセシビリティの向上のためにまず使用する手段の 1 つです。 これは、視覚障碍のあるユーザーが、イメージ、スクリーンショット、グラフ、ビデオなどのコンテンツを知るうえで役立ちます。 聴覚障碍のあるユーザーは、ビデオ ファイルやオーディオ ファイルのコンテンツへのアクセスにテキスト トランスクリプトを使用します。

この記事の内容

画像に代替テキストを追加する

写真、イメージ、クリップ アート、またはオーディオを使用するときは、著作権を尊重する責任があります。 イメージの場合は、Bing のライセンス フィルターが役に立ちます。

  1. [編集] リボンを開き、[編集] モードにするには、編集するページで [編集] リンクを選びます。

  2. 画像を表示する場所にフォーカスを移動します。

  3. [イメージのアップロード] ダイアログ ボックスを開くには、[挿入] タブで [画像] グループを開き、[コンピューターから] を選択します。

    SharePoint Online のリボンのスクリーンショット。 [挿入] タブを選択し、[画像] を選択して、ファイルをコンピューター、Web アドレス、SharePoint の場所のいずれからアップロードするかを選択します。

    ヒント: イメージ URL に貼り付けることでインターネットから画像を挿入するには、[アドレスから] を選択します。 Microsoft 365 の SharePoint サイトからイメージを挿入するには、[SharePoint から] を選択します。

  4. ファイルを選択し、Microsoft 365 の SharePoint サイトの移動先フォルダー (既定の選択肢は [サイトのリソース ファイル] フォルダー) を選択して、異なるイメージ バージョンに関する任意のメモを含めます。

  5. 図を挿入し、[イメージ] タブをアクティブ化にするには、[OK] をクリックします。

    [画像] タブが選択された SharePoint Online のリボンと、[選択]、[プロパティ]、[スタイル]、[配置]、[サイズ]、[間隔] の各グループの選択項目が示されているスクリーンショット。

    ヒント: [イメージ] タブは、イメージの選択時にのみ表示されます。

  6. [イメージ] タブの [代替テキスト] ボックスに移動し、イメージの代替テキストを入力します。

  7. 作業が終了したら、[保存] をクリックします。

アクセシビリティに関するヒント   

  • 代替テキストは、簡潔かつわかりやすい必要があります。

  • 適切な代替テキストは、その画像が重要な理由をリスナーに伝えます。

例や詳細情報へのリンクを含む代替テキストの詳細については、「WebAIM Alternative Text (WebAIM 代替テキスト)」を参照してください。

メディア Web パーツにビデオを追加する

ページにビデオを追加するたびに、コンテンツのキャプションおよびオーディオ説明を必ず含めてください。 キャプションを使用すると、聴覚障碍のあるユーザーがコンテンツを知ることができるほか、また、ネイティブ スピーカー以外のビデオの視聴者を支援できます。

聴覚障碍のあるユーザーがオーディオ録音にアクセスできるようにするには、トランスクリプトを作成し、オーディオ ファイルと共に使用できるようにします。

  1. [編集] リボンを開き、[編集] モードにするには、ビデオを表示するページで [編集] リンクを選択します。

  2. ビデオを表示する場所にフォーカスを移動します。

  3. [メディアのアップロード] ダイアログ ボックスを開くには、[挿入] タブで [ビデオとオーディオ] グループを開き、[コンピューターから] を選択します。

    SharePoint Online のリボンのスクリーンショット。 [挿入] タブを選択し、[ビデオと​​オーディオ] を選択して、ファイルをコンピューター、SharePoint の場所、Web アドレス、埋め込みコードのいずれから追加するかを指定します。

    ヒント: インターネットからファイルを挿入するには、[アドレスから] を選択して URL に貼り付けます。 Microsoft 365 の SharePoint サイトからオーディオまたはビデオを挿入するには、[SharePoint から] を選択します。 YouTube や Vimeo などのサイトから埋め込みコードを追加するには、[埋め込み] を選択します。

  4. ファイルを選択し、Microsoft 365 の SharePoint サイトの移動先フォルダー (既定の選択肢は [サイトのリソース ファイル] フォルダー) を選択して、異なるファイル バージョンに関して該当する任意のメモを含めます。

  5. メディア パーツ コンポーネント内にビデオを挿入し、[メディア] タブと [Web パーツ] タブをアクティブ化するには、[OK] を選択します。

    ヒント: [メディア] タブは、メディア ファイルの選択時にのみ表示されます。

  6. [Web パーツ ] タブを開き、[Web パーツのプロパティ] を選択します。 [メディアの Web パーツ ] プロパティ ウィンドウが表示されます。

    メディア ファイルの [外観]、[レイアウト]、[詳細]、[動作] に関する設定を指定するための、SharePoint Online の [メディアの Web パーツ] ダイアログ ボックスのスクリーンショット。 [外観] のオプションとしては、タイトル、高さ、幅、枠の状態と種類などに関するものがあります。
  7. [タイトル] ボックスに、タイトルを入力します。

  8. 下にスクロールし、[詳細設定] パネルを開きます。

  9. [説明] ボックスに、オーディオまたはビデオ ファイルの簡単な説明を入力します。

  10. メディアの Web パーツに変更内容を適用するには、最後までスクロールし、[適用] を選択します。

  11. 完了したら、このページの変更を保存するには [保存] を選択します。

ページにオーディオ ファイルを埋め込む

次の手順では、Web ページに非常に小さくスリムなコントロール バーを配置する方法について説明します。 このコントロール バーは、完全なメディアの Web パーツでは大きすぎる、ポッド キャストなどのオーディオ ファイルで最適に機能します。

  1. オーディオ ファイルおよびトランスクリプト ファイルを [サイトのリソース ファイル] フォルダーにアップロードします。

    1. [設定] メニューを開くには、右上隅にある [設定] アイコンを選択します。

    2. [サイト コンテンツ] リンクを選択します。

    3. [サイトのリソース ファイル] フォルダーに移動します。

    4. オーディオおよびトランスクリプト ファイルをフォルダーにドラッグします。

      sharepoint online の基本サイトの [サイト コンテンツ] ページと、強調表示された [サイトのリソース ファイル] タイル

    5. ファイルの URL を取得します。 ファイル操作メニューを開くには、ファイル名の横にある省略記号を選択します。 操作メニューからリンクをコピーして、別のファイルに貼り付けます。 このリンクは、後でオーディオ埋め込みコードに必要になります。

  2. [編集] リボンを開き、[編集] モードにするには、ビデオを表示するページで [編集] リンクを選択します。

  3. ビデオを表示する場所にフォーカスを移動します。

  4. [埋め込み] ダイアログ ボックスを開くには、[挿入] タブで [ビデオとオーディオ] グループを開き、[埋め込み] を選択します。

    スクリプトを貼り付けるか、ビデオやオーディオ ファイルのコードを埋め込んでからコードを挿入するための、SharePoint Online の [埋め込み] ダイアログのスクリーンショット。
  5. 埋め込みコードをフィールドに貼り付けて、"src =" の後にオーディオ ファイルの URL を引用符で囲んで挿入します。

    <audio src="your-audio-file-URL-here.mp3"controls="controls"></audio>

    このコードにより、ページ上にメディア コントロール バーが配置されます。 ユーザーはこのバーを使用して、再生を開始および停止できます。

    ヒント: 埋め込みコードが正しく書式設定されていないか、または存在しないファイルの場所をポイントしている場合、[挿入] ボタンはアクティブになりません。

  6. 操作が完了したら、[挿入] を選択して、ページにオーディオ コントロールを挿入します。 埋め込まれたオーディオ コントロールは、次のようになります。

    オーディオ ファイルの全時間長が示され、ファイルの再生を開始および停止するコントロールがある、SharePoint Online の [スニペット] オーディオ コントロール バーのスクリーンショット。
  7. オーディオ コントロール スニペットの最後にフォーカスを移動します。次の行に移動するには、Enter キーを押します。

  8. オーディオ トランスクリプト ファイルにリンクを挿入します。

    1. [メディアの選択] ダイアログ ボックスを開くには、[挿入] タブで [リンク]、[SharePoint から] の順に選択します。

    2. オーディオ トランスクリプト ファイルを選択し、Insert キーを押します。 これにより、ファイルの名前がリンクのテキストとなるハイパーリンクが挿入されます。

    3. リンク内のファイル名の最後の文字の直前に、フォーカスを移動します。 Backspace キーをゆっくり押して、ファイル名の最初と最後の文字を除くすべての文字を削除します。

      ヒント: これにより、リンクはそのままの状態で、リンクのテキストを変更するために必要な正確な位置にカーソルを保持できます。

    4. リンクに適切なテキストを入力します。 たとえば、オーディオ トランスクリプトの場合、「オーディオ トランスクリプトを表示する」と入力します。

    5. ファイル名の残りの文字を削除します。

  9. 完了したら、ページの上部にある [保存] をクリックして、すべての変更を保存します。

関連情報

SharePoint Online でアクセシビリティの高いサイトを作成するためのリソース

SharePoint Online のキーボード ショートカット

SharePoint を使用すると、すべてのマルチ メディア コンテンツに対して代替テキスト (alt テキストとも呼ばれる) を簡単に追加できます。 代替テキストは、完全なドキュメント アクセシビリティの向上のためにまず使用する手段の 1 つです。 これは、視覚障碍のあるユーザーが、イメージ、スクリーンショット、グラフ、ビデオなどのコンテンツを知るうえで役立ちます。 聴覚障碍のあるユーザーは、ビデオ ファイルやオーディオ ファイルのコンテンツへのアクセスにテキスト トランスクリプトを使用します。

この記事の内容

画像に代替テキストを追加する

写真、イメージ、クリップ アート、またはオーディオを使用するときは、著作権を尊重する責任があります。 イメージの場合は、Bing のライセンス フィルターが役に立ちます。

SharePoint サイト ページに対して次の手順を実行します。

  1. 編集するページにコンテンツを追加するには、[編集] リンクを選択します。

  2. [新しい Web パーツの追加] ボタンを選択します。

    Sharepoint の [新しい Web パーツの追加] ボタンのスクリーンショット。
  3. [イメージ] Web パーツを選択メニューから選択します。

    Sharepoint のイメージ Web パーツ選択のスクリーンショット。
  4. ファイルの場所の一覧からファイルの場所を選択します。

    Sharepoint のファイルの場所選択のスクリーンショット。
  5. ファイルを選択し、[開く] を選択します。

  6. イメージに代替テキストを追加するには、[Web パーツの編集] リンクを選択します。

    Sharepoint の [Web パーツの編集] ボタンのスクリーンショット。
  7. [代替テキスト] ボックスに代替テキストを入力します。

  8. [X] を選択すると、代替テキストが保存されます。

    イメージのスクリーンショット。SharePoint の [代替テキスト] ダイアログ。

アクセシビリティに関するヒント

  • 代替テキストは、簡潔かつわかりやすい必要があります。

  • 適切な代替テキストは、その画像が重要な理由をリスナーに伝えます。

例や詳細情報へのリンクを含む代替テキストの詳細については、「WebAIM Alternative Text」 (WebAIM 代替テキスト) を参照してください。

SharePoint ページにビデオを追加する

ページにビデオを追加するたびに、コンテンツのキャプションおよびオーディオ説明を必ず含めてください。 キャプションを使用すると、聴覚障碍のあるユーザーがコンテンツを知ることができるほか、また、ネイティブ スピーカー以外のビデオの視聴者を支援できます。

  1. 編集するページにコンテンツを追加するには、[編集] リンクを選択します。

  2. [新しい Web パーツの追加] ボタンを選択します。

    Sharepoint の [新しい Web パーツの追加] ボタンのスクリーンショット。
  3. “埋め込み” を選択します。

    SharePoint の [コンテンツ埋め込み] メニューのスクリーンショット。
  4. 表示するビデオの URL または埋め込みコードを入力します。

    SharePoint の [埋め込みコード] ダイアログのスクリーンショット。

    注: YouTube 動画の場合、ビデオ アドレス情報のすぐ後ろの埋め込みコードに &cc_load_policy=1 という行を追加します (たとえば、<iframe width="560" height="315" src="https://www.youtube.com/embed/7XocqGYt4J4&cc_load_policy=1" frameborder="0" allowfullscreen></iframe>)。

  5. [X] を選択すると、埋め込みビデオが保存されます。

  6. SharePoint の新しい操作環境にサイト アセットのコレクションからビデオを追加するには、[Web パーツ] メニューから [Office 365 ビデオ] を選択します。

    Office 365 のスクリーンショット。SharePoint の [ビデオ メニュー] ボタン。
  7. [ビデオの追加] を選択します。

    Office 365 のスクリーンショット。SharePoint の [ビデオの追加] ダイアログ。
  8. ページに表示する Office 365 ビデオの URL を入力します。

    Office 365 のスクリーンショット。SharePoint の [ビデオのアドレス] ボタン。
  9. アドレスを入力したら、[X] を選択してビデオをページに保存します。

    注:  SharePoint サイト コレクションのビデオのみをここでは選択できます。 YouTube や Vimeo の動画など、外部のアイテムは埋め込む必要があります。

  10. 完了したら、このページの変更を保存するには [保存して閉じる] または [公開] を選択します。

関連項目

SharePoint Online でアクセシビリティの高いサイトを作成するためのリソース

SharePoint Online のキーボード ショートカット

ヘルプを表示

その他のオプションが必要ですか?

サブスクリプションの特典の参照、トレーニング コースの閲覧、デバイスのセキュリティ保護方法などについて説明します。

コミュニティは、質問をしたり質問の答えを得たり、フィードバックを提供したり、豊富な知識を持つ専門家の意見を聞いたりするのに役立ちます。