Header
Headerレスポンシブ対応コンポーネントは、コンテキストに関連が高い情報をスキルに常に表示するために使用します。これには、タイトル、サブタイトル、スキルアトリビューション（テキスト、アイコン）、戻るボタンといったナビゲーション情報が含まれます。
このガイドでのデザイン推奨事項は、Layoutsパッケージを参照しています。Layoutsパッケージとは、スキルで使用するために読み込みが必要な追加のプロパティセットのことです。詳細については、Alexa Layoutsパッケージを参照してください。
Headerコンポーネントの使用方法
スキルにタイトルとサブタイトルを表示する場合、その他のアトリビュートを使わないとしても、必ずHeaderレスポンシブ対応コンポーネントを使ってください。小さな画面の場合は、画面の領域を最大限使えるよう、スクロールするコンテンツの内側にヘッダーを配置できます。中型または大型画面で全画面表示する際は、ヘッダーをスクロールするコンテンツの外側に配置します。こうすると、コンテンツのほかの部分がスクロールしても、ヘッダーは固定されます。
ヘッダーをカスタマイズするには、以下のプロパティを使います。
Title
Titleは、アクション（タスクなど）に対するAlexaの音声応答を補助するか、画面上の項目について知らせる目的で使用します。
Subtitle
タイトルに対応する追加情報をSubtitleとして含めることができます。Subtitleはアルファベットを使用し、単語の先頭文字を大文字で記述する必要があります。
Attribution
Attributionは、スキル名、アイコンまたは関連する画像を表示します。Headerでは、画像またはテキストをAttributionとして表示できます。両方ある場合は、画像が表示されます。小さなディスプレイには、タイトルとサブタイトルではなく、画像またはスキルアイコンが表示されます。タイトルとサブタイトルを表示するには、Attribution iconを「true」に設定します。
Navigation
よく使われるのは戻るボタンですが、エクスペリエンスで「アレクサ、戻って」などのリクエストをサポートしている場合は、Navigation要素を表示する必要があります。 ユーザーが任意のタイミングで前の画面に戻れるようにしたり、発話にリンク付きのタッチターゲットを追加したりする場合にのみ、戻るボタンを表示させなければなりません。
ベストプラクティス
- Headerはコンテキストに対応するもので、ほかの視覚を使用した応答と関係のあるタイトルおよびサブタイトルを表示していなければなりません。
- Headerはスクロール表示（レイアウトまたはコンポーネント）の外側に配置し、固定表示されるようにします。Headerが固定されていると、表示中のコンテンツのコンテキストの管理がしやすくなるとともに、ユーザーのナビゲーションがスムーズになります。