アコーディオン

アコーディオンは、見出しを縦に並べ、見出しを操作すると対応する内容パネルを展開又は折り畳むGUI部品です。必要な区分だけを表示して、一画面に複数区分を整理し、縦方向の表示量を抑えます。

■ 試験で押さえるポイント

• 各見出しは内容の名称であると同時に開閉ボタンです。一つだけ展開できる方式と、複数を同時に展開できる方式があり、要件に応じて決めます。

• 開閉状態を矢印だけでなくaria-expanded等でも伝え、見出しをキーボードでフォーカスしてEnter又はSpaceで操作できるようにします。

• 見出しは内容を予測できる具体的な名称にし、展開後のパネルとプログラム上も関連付けます。開閉しても予期せずフォーカスを移動させません。

• 一覧性が必要な比較情報や、全て読むべき重要事項を隠すと見落としを招きます。省スペースの利点と、追加操作・発見性の負担を比較します。

■ 選択肢での判断ポイント

HCI文脈では楽器ではなく、『積み重ねた見出しで内容区分を展開・折畳みする』部品です。タブは通常、同じ領域で横並びの選択を切り替える点が異なります。

例: FAQで質問見出しを選ぶと、その直下に回答が展開され、もう一度選ぶと折り畳まれます。現在の開閉状態は見た目と支援技術の両方へ伝えます。