このページでは特別にスクリーンリーダーモードへの変更ボタンを見えるようにしています。是非Voiceoverで聴き比べてみてください。
アイコンボックス
ここは説明用の段落です。「アイコンボックス」というパーツを使うと、アイコンを用いた直感的なメッセージ内容を伝えることができます。アイコンは画面の幅によって左または上に表示されます。「おすすめリンク集」ページや「学びのナビゲーター」ページなど、様々なところで使われています。
ここは段落です。上で紹介したものを含め、アイコンボックスには以下の種類があります。
- インフォメーションマーク
- クエスチョンマーク
- エクスクラメーションマーク
- 鉛筆のマーク
- 吹き出しのマーク
- OKを表すマルのマーク
- NGを表すバツのマーク
- GOODを表す、親指を立てたマーク
- BADを表す、親指を下げたマーク
- プロフィールを表す、人のシルエットマーク
見出しボックス
ここは説明用の段落です。「見出しボックス」というパーツを使うと、見出しと本文がセットになったエリアを作ることができます。ボックスは色付きの線で区切られ、見出し部分は線と同じ色で塗られています。更に、見出し文字の左側にアイコンを置くことができます。色による区切り・アイコン・見出しの三要素で情報のかたまりを表すことができます。「サイトマップ」や「学びのナビゲーター」ページで使われています。
見出しボックスの見出しです。
見出しボックスの本文です。見出しの左側には本のアイコンを置いてみました。
ここは段落です。見出しボックスにつけられるアイコンは52種類あったので、個別の解説は省略します。