ガイド付きチュートリアル: 組織用のトレーニングサイトの作成

この記事では、トレーニングサイトの例の要素を紹介し、自分の組織に類似したサイトを作成する方法について説明します。 この例のサイトでは、特定のイベントに関する情報を提供し、ユーザーに学習と登録を指示します。 これは、訪問者が協力して、ユーザーを動機付けするための視覚的なインパクトに依存します。

まず、通信サイトを作成していない場合は、この記事の「 サイトを作成 する」セクションをご覧ください。  サイトでページを編集して発行する方法については、この記事の「 編集、セクションと web パーツの操作 」をご覧ください。

サイトを作成してページの編集方法を確認したら、次のガイダンスを使用して、表示されている要素を追加できます。

トレーニングサイトの例

SharePoint Online の最新のワークショップサイトの例
  1. ロゴとサイトの分類

    ロゴをカスタマイズしてサイトを分類します。 詳細情報

  2. 影響の作成

    ヒーローを使って、値を視覚的に伝えることができます。 詳細情報

  3. ユーザーが主要な操作を行うためのガイド

    訪問者を登録したり、他のユーザーを見つけたりします。 詳細情報

  4. イベントについて説明する

    テキストを使用して、イベントの "what" と "理由" を説明します。 詳細情報

  5. リンク付きの画像を使用する

    視程を上げて、議題の詳細ページへのリンクを設定します。 詳細情報

  6. 詳細情報を強調表示する

    画像は重要な情報の領域を定義できます。 詳細情報

  7. イベントの日付を表示する

    ユーザーがスケジュールを計画できるように、イベントカレンダーを提供します。 詳細情報

  8. 地図を追加する 

    地図を使用して、ユーザーが必要な場所にアクセスできるようにします。 詳細情報

  9. ページの登録を行う

    簡単に登録するためのフォームを追加します。 詳細情報

サイトを作成する

次のようなサイトを作成するには、 コミュニケーションサイトを作成します。 この操作を行うには、 SharePoint のスタートページから [ サイトの作成 ] をクリックします (または、このサイトをハブサイトに関連付ける場合は、ハブサイトに移動し、[ サイトの作成 ] をクリックして、コミュニケーションサイトが自動的にそのハブサイトと関連付けられるようにします)。

サイトのコマンドを作成する

次に、[ コミュニケーションサイト] を選択してから、 トピック のレイアウトを選びます。 サイト名、説明、その他の情報を入力し、[ 完了] をクリックします。 その後、この記事の例と同じ種類のレイアウトのテンプレートが表示されます。

SharePoint コミュニケーションサイトを作成する

詳細については、「 SharePoint Online でコミュニケーションサイトを作成する」を参照してください。

ページのトップへ

ロゴとサイトの分類

この例では、ヘッダー領域にナビゲーションが含まれていないのは "スタンドアロン" ページであるためです。 ただし、ヘッダー領域にはカスタムロゴが含まれており、サイトが "内部専用" として分類されていることを示すラベルが表示されています。 サイトの分類では、内部、社外秘、ビジネスへの大きな影響、業務への影響が小さいなどの値が使用されます。 これらの値は、情報の機密性または情報のライフサイクルに関連する可能性があります。

ヘッダーの例

ロゴを変更してサイトを分類する方法については、「 SharePoint サイトの設定を管理する」を参照してください。

ページのトップへ

セクションと web パーツを管理する

ページの右上にある [ 編集 ] をクリックして編集を開始します。

ページのトップバーの [編集] ボタン

編集中は、左側のヘッダーの下にある下書きは、後で保存するか、破棄することができます。

ページのトップバー

セクションの前または後にある + 記号は、いくつかのレイアウトのいずれかを使用してセクションを追加します。

セクションレイアウト

セクションによってページが構成され、1つまたは複数の web パーツを配置します。 ページの編集中、各セクションには、レイアウトの編集、移動、または削除を行うためのコントロールが表示されます。 セクションの操作方法について詳しくは、「ページにセクションと列を追加または削除する」をご覧ください。

コントロールを追加してセクションを追加します。

セクション内のプラス記号の SPO 正符号 をクリックすると、セクション内の web パーツの前または後に表示されることがあります。これは、利用可能なさまざまな種類の web パーツを表示するために使用されます。 すべての web パーツの詳細については、「 SharePoint ページで web パーツを使用する」を参照してください。

Web パーツツールボックス

セクション内で Web パーツを編集、移動、または削除することができます。 [ Web パーツの編集 ] アイコンを開くと、各 web パーツの種類に固有の詳細コントロールが表示されます。

Web パーツツール。

ページの更新が完了したら、[ 発行 ] をクリックして、組織全体に表示されるようにします。

ページのトップバーの [発行] ボタン

ヒント: サイト上のすべてのページを管理するには、トップメニューの [ ページ ] をクリックします。

ページの使用方法の詳細については、「 SharePoint サイトでモダンページを作成して使用する」を参照してください。

ページのトップへ

ヒーロー web パーツを使用した影響の作成

ヒーロー web パーツを使用して、訪問者がワークショップの焦点を知っていることを知らせます。 この例で使用されているレイアウトは、 2 つのタイルです。

ヒーローレイアウト: タイルまたはレイヤー

Web パーツの編集では、[レイアウト] オプションが表示されます。 [ タイル ] オプションでは、1つのタイルと5つのタイルの間にレイアウトが表示されます。 [ レイヤー ] オプションでは、タイトルの横に画像があるレイヤーとして各イメージを設定します。 1つの web パーツでページ全体を作成できるようにするには、最大5つのレイヤーを使用できます。

各タイルを編集できます。

左側の [ アイテムの移動 ] コントロールを使用して、ヒーロー web パーツ内のタイルを再配置します。 右のコントロールでは、使用されているテキストと画像を調整したり、ホバーアニメーションの焦点を設定したり、ズームインして画像を縮小したりすることができます。

この例では、ヒーロー web パーツが完全幅のセクションにあります。

SharePoint Online の最新のワークショップサイトのサンプルのヒーロー web パーツ

ヒーロー web パーツの使用方法の詳細については、「 ヒーロー web パーツを使用する」を参照してください。

ページのトップへ

イベントの日付を表示する

イベントの web パーツには、イベント情報が自動的に表示されます。 表示されるイベントは、 ソースイベントリストカテゴリ日付範囲のフィルターによって制御されます。 イベントは、[ 写真 表示または コンパクト 表示で詳細な概要を表示することができます。

このワークショップサイトの例では、この web パーツで [ 写真 ] レイアウトを使用しています。

SharePoint Online の最新のワークショップサイト用のイベントの web パーツ入力の例

イベント web パーツの使用について詳しくは、「 イベント web パーツの使用」をご覧ください。

ページのトップへ

テキスト web パーツを使ってイベントについて説明する

リーダーシップのドロップダウンと1月の Q&a&説明では、テキスト web パーツを使用します。 この web パーツでは、書式設定されたテキストの固定セクションを作成するための基本的なテキスト書式設定を行うことができます。

テキストを編集する場合、この web パーツには、スタイルを設定し、 太字斜体などの拡張機能を追加するための基本的な書式設定ツールが用意されています。 書式設定ツールバーの右端にある [.. . ] コントロールをクリックすると、web パーツの右側に追加オプションが表示されます。

このワークショップサイトの例では、上に示した web パーツは1列のセクションにあります。

SharePoint Online の最新のワークショップサイト用のサンプルテキスト web パーツ入力

テキスト web パーツの使用方法の詳細については、「テキストweb パーツを使用してページにテキストと表を追加する」を参照してください。

ページのトップへ

クイックリンクを使用して重要な操作をユーザーに導く

クイックリンク web パーツには、他のページまたはサイトへのリンクを一覧表示するための、使いやすいメニュー形式がいくつか用意されています。

このサイトの例では、web パーツは ボタン レイアウトを使ってすばやく簡単に参照できます。

SharePoint Online の最新のワークショップサイト用のクイックリンク web パーツ入力の例

クイックリンク web パーツの使用方法の詳細については、「 クイックリンク web パーツを使用する」を参照してください。

ページのトップへ

リンク付きの画像を使用する

イメージ web パーツによって、ページに固定画像が配置されます。 画像には、画像、図、テキストへの影響を与えることができます。 キャプションと代替テキストは、画像のアクセシビリティを維持します。

SharePoint Online の最新のワークショップサイト用のイメージ web パーツ入力の例

イメージ web パーツの使用方法の詳細については、「 イメージ web パーツを使用する」を参照してください。

ページのトップへ

Bing Maps web パーツと共に地図を追加する

Bing Maps web パーツには、訪問者がワークショップに対してルートを計画できる簡単な視覚的マップのリファレンスとクイックリンクが用意されています。

SharePoint Online でのモダンなワークショップサイト用の Bing Maps web パーツ入力の例

Bing Maps web パーツの使用方法の詳細については、「 Bing maps web パーツを使用する」を参照してください。

ページのトップへ

登録用のフォームを追加する

Microsoft formsを使用して登録用のフォームを作成した場合、そのフォームを microsoft forms web パーツを含むページに直接配置することができます。 これにより、出席者が情報を入力して簡単に収集することができます。 

SharePoint Online の最新のワークショップサイトのサンプルのフォーム web パーツ

Microsoft Forms web パーツの使用方法の詳細については、「 Microsoft forms web パーツを使用する」を参照してください。

ページのトップへ

さらに詳しく

SharePoint Look Bookでその他の例を活用してください。

ヘルプを表示

Office のスキルを磨く
トレーニングの探索
新機能を最初に入手
Office Insider に参加する

この情報は役に立ちましたか?

ご意見をいただきありがとうございます。

フィードバックをお寄せいただき、ありがとうございます。Office サポートの担当者におつなぎいたします。

×