Ein Accordion – manchmal auch „Akkordeon-Menü“ genannt – ist ein interaktives Element auf einer Website, das Inhalte platzsparend darstellt. Per Klick oder Tippen lassen sich einzelne Textbereiche auf- und zuklappen, ähnlich wie bei einem Musikinstrument.
Was ist ein Accordion?
Stellen Sie sich eine Liste mit häufig gestellten Fragen (FAQ) vor. Statt alle Antworten dauerhaft anzuzeigen, verbirgt ein Accordion sie hinter aufklappbaren Überschriften. Erst bei Interaktion öffnet sich der zugehörige Inhalt.
Das Ergebnis: Die Seite bleibt übersichtlich und wirkt nicht überladen – besonders auf mobilen Geräten.
Wann sind Accordions sinnvoll?
Ein Accordion eignet sich besonders für:
- FAQ-Bereiche mit vielen Fragen und Antworten
- Technische Beschreibungen, die nicht sofort sichtbar sein müssen
- Produktdetails in Online-Shops
- Filterfunktionen in Seitenleisten
Wichtig: Inhalte, die aus SEO-Sicht relevant sind, sollten trotzdem im sichtbaren Bereich oder zumindest nicht dauerhaft verborgen sein. Google bewertet versteckte Inhalte unter Umständen weniger stark.
Vorteile eines Accordions
- Bessere Usability, da Nutzer gezielt Inhalte öffnen können
- Ideal für Mobile First-Designs mit wenig Platz
- Strukturiertes Layout, das große Textmengen organisiert
- Kann barrierefrei gestaltet werden, z. B. mit ARIA-Attributen
Der Klicklounge-Tipp:
Ein gut programmiertes Accordion steigert die Nutzerfreundlichkeit – aber Vorsicht bei Page Buildern. Viele Theme– oder Page Builder-Accordion-Module sind nicht barrierefrei. Achte daher auf semantisches HTML und Tastaturbedienbarkeit.