アコーディオン

解説

アコーディオンは、質問や項目の見出しだけを一覧に並べておき、利用者が見出しを押したときに、その下に本文を展開して表示するWebページの部品です。楽器のアコーディオンの蛇腹のように開閉することから、この名で呼ばれます。

実務での使われ方

アコーディオンは、回答が短い質問を多数並べる場面に向いています。一覧性を保ちながら、利用者が必要な回答だけを開いて読めるためです。

一方で、回答が長い質問や、詳しく読まれることを前提とする内容は、アコーディオンに収めるより、独立した記事ページにしたほうが適しています。

注意点

クリック後に本文を読み込む実装にすると、アコーディオンの中身が検索エンジンに拾われない場合があります。Googleは、アコーディオンやタブで折りたたんだコンテンツの利用を認めています。ただし、Googleはクリックなどのユーザー操作を必要とするコンテンツを読み込まないと説明しています。したがって、中身を検索結果に反映させたい場合は、最初からHTMLに本文を含め、表示だけをCSSなどで切り替える実装にします。