コンテンツデザイナーは、手間なく魅力的なページを作成できる新しいツールです。思い通りにコンテンツを作成・構成できる強力な方法を提供します。

すべてのページは、セクション、コンテナ、そしてコンテンツで構成されています。セクションはページ上の水平エリアを定義し、トピックを分けてコンテンツを整理します。コンテナはそのセクション内にあり、コンテンツのレイアウトを管理します。新しいページはデフォルトのセクションとコンテナから始まります。これが基盤、スタートポイントです。

各要素には独自のコンテキストツールバーがあります。要素を選択したときだけ表示され、関連するオプションのみが表示されます。コンテナ設定では、レイアウト（例：3列や2列など）を調整でき、コンテンツを横並びに配置できます。デザインでは、ブランドカラーから背景色を追加したり、背景画像を選択できます。表示では、誰がどのデバイスで何を見るかを制御でき、同じページ内で特定のグループをターゲットにできます。

コンテンツを追加するには、コンテキストツールバーまたはサイドバーのブロックボタンをクリックします。ページのためのすべてのビルディングブロックが見つかります。クリックまたはドラッグ＆ドロップでブロックをページに追加できます。タイトルブロックやテキストブロックでは、サイズやアラインメントの調整、パーソナライズ用のプロフィールタグの追加、カラーの変更、絵文字の使用が可能です。

タイトルブロックはメイン見出しに、テキストブロックはその後の見出しに推奨されます。これにより、スクリーンリーダーユーザーにもページが分かりやすくなります。テキストブロックは、メンション、ハッシュタグ、斜体などのクラシックな書式設定、リンク、リスト、ブロック引用に対応しています。ニュースブロックなど一部のブロックはレイアウトバリエーションもあります。マイファイルを使って画像などのメディアを追加でき、キャンバス上で直接リサイズやトリミングができ、オリジナルファイルには影響しません。

各コンテナブロックは最大3つまで入れ子にできます。ナビゲーションパネルではドキュメント全体の構造が表示され、大きなページで特に便利です。サイドバーには元に戻す/やり直しボタンや、クイックアクションボックスを開くCommand/Control+Shift+Kなどのヘルプもあります。

ページ作成中は、変更内容を下書きとして保存でき、ユーザーにはまだ表示されません。プレビューパネルで各デバイスでの見え方を確認できます。準備ができたら公開をクリックするとページが公開されます。アクションメニューからは公開済みページの表示、非公開、バージョンの履歴へのアクセス、リンクのコピー、ページの削除ができます。

コンテンツデザイナーを使えば、技術的な知識がなくても、セクション・コンテナ・ブロックを組み合わせて、分かりやすく魅力的なモダンページをすばやく作成できます。

このビデオでは、コンテンツデザイナーを使ってシンプルな部門ページを作成します。ご自身の環境でも再現・アレンジできます。

すべてのページはセクションとコンテナから始まります。セクションは水平エリアを定義し、コンテナはコンテンツを保持・アレンジします。作成中は、任意の要素を選択してコンテキストツールバーから利用可能なオプションにアクセスできます。

部門ヘッダーを作成するには、最初のセクションに背景画像を追加し、タイトルブロックを追加します。ページの一番上にはタイトルブロックを、その後の見出しにはテキストブロックを使いましょう。これにより、スクリーンリーダーでも分かりやすいドキュメント構造になります。タイトルの下に補足テキストを追加し、カラーも試してみましょう。コントラストに問題がある場合は、背景画像にカラーオーバーレイを追加し、不透明度を調整してコントラストを調節します。

ヘッダーの下には、重要なリソースを強調するための3列レイアウトのクイックアクセスセクションを作成します。クイックリンクはドラッグ＆ドロップまたはコンテナ内を直接クリックして追加できます。各リンクのアイコン、レイアウト、スタイルをカスタマイズしましょう。リンクを目立たせるために、コンテナにミュート背景色を追加します。

メインコンテンツエリアには2列セクションを追加します。左側にはニュースブロックを追加し、チャネルを選択します。右側には部門長をユーザープロフィールブロックで紹介し、背景色付きのコンテナにまとめます。グループサブスクリプションボタンでチームグループ用の追加コンテナや、マイファイルやプレースホルダーブロックで主要ドキュメント用のコンテナを作成します。セクション間にはディバイダーを挿入してスペースを調整します。

キャンペーンコンテンツ用にアコーディオンブロックを追加し、ページを構造化して見やすくします。各アコーディオンパネルは公開ページで折りたたまれます。親コンテナを選択して背景画像を追加し、アコーディオンには可読性のためにプレーンな白背景を設定します。

最後のセクションではチームを紹介します。見出しを追加し、4列に分割したコンテナを作成し、各列にユーザープロフィールブロックを追加します。コンテナにはグレー背景色を設定し、ビジュアルの一貫性を持たせます。

これで、明確なナビゲーションエリア、関連コンテンツ、重要なリソースを備えた構造化された部門ページが完成します。ページをプレビューし、準備ができたら公開しましょう。

クラシックページエディターとコンテンツデザイナーを、ページレイアウトから比較してみましょう。

クラシックエディターでは、基盤は1つの直線的なドキュメントです。コンテンツを横並びに配置するには、ツールバーのセクションボタンであらかじめ定義されたレイアウトエリアを追加します。コンテンツデザイナーでは、レイアウトはコンテナ内で管理されます。ページはデフォルトでセクションで構成され、その中にすべてのコンテンツを収めるコンテナがあります。これらのコンテナは設定でさまざまな列レイアウトに分割でき、大きなコンテンツの塊もドラッグ＆ドロップで柔軟に並べ替えられます。

クラシックエディターでコンテンツを追加する場合、キャンバス上に直接段落を追加し、ディバイダーやテーブル、メディア、ウィジェットなどは上部ツールバーから利用できます。表示やスタイルなどの設定は要素追加前に定義し、変更は保存を押したときに初めて反映されます。コンテンツデザイナーでは、コンテンツ要素はブロックに置き換えられ、折りたたみ可能なサイドパネルから利用できます。テキストもブロックであり、キャンバス上に直接入力するのではありません。ブロックを選択するとコンテキストツールバーが表示され、設定変更がWYSIWYGで即座に反映されます。

テキストの書式設定については、クラシックエディターではすべての書式オプションが上部ツールバーに表示されます。コンテンツデザイナーでは、テキストブロックを選択したときだけ書式オプションが表示されます。どちらも太字、見出し、アラインメント変更に対応しています。

コンテンツエリアのスタイリングについては、クラシックエディターは背景スタイルが限定的ですが、ヒーロー画像ウィジェットに対応しています。コンテンツデザイナーでは、セクションやコンテナに背景色や画像を設定でき、より柔軟なデザインが可能です。

公開については、クラシックエディターでは、すでに公開済みのページを保存すると即座に変更が反映されます。コンテンツデザイナーでは、変更内容を下書きとして保存し、準備ができたら「更新する」をクリックして初めて公開ページに反映されます。

まとめ：クラシックエディターはコンパクトで直線的、従来のテキストエディターに近い操作感です。コンテンツデザイナーは広々としてモジュール型で、コンテンツブロックを柔軟なフレームワークで整理し、編集時に即座にビジュアルフィードバックが得られます。

ここでは、クラシックエディター版のページが表示されています。上部に「コンテンツデザイナーに移行」ボタンがあり、これをクリックすると移行プロセスが始まります。ポップアップが表示され、これはプレビューであり、移行完了後はクラシックエディターで編集できなくなることが確認されます。

プレビューでは、コンテンツデザイナーで編集した場合のページの見え方が表示されます。クラシックエディターの内容はすべて引き継がれます。ここで変更を加えたり、下書きとして保存したりできます。その後「移行を完了」をクリックすると、ページがコンテンツデザイナーに移行されます。

ページの概要には「コンテンツデザイナーへの移行準備完了」タブもあり、移行可能なページが一覧表示されるため、対象ページを簡単に特定できます。