6.14. Akkordeon

Akkordeon Menü

Ein Akkordeon hat aufklappbare Inhalte, die Texte, Bilder oder Videos enthalten können. Es ist ideal, um zusätzliche Informationen platzsparend zu präsentieren und bei Bedarf sichtbar zu machen. Komplexe Inhalte können somit übersichtlich und klar strukturiert wiedergegeben werden.

Quelle: UdK Berlin

Das Akkordeon wird gerne für Erklärtexte, FAQs und Glossare verwendet.

  • Teile des Inhalts werden in zugeklappter Form dargestellt.
  • Die anklickbaren Überschriften stehen wie eine Liste untereinander.
  • Wird eine Überschrift angeklickt, klappt der Inhalt des Akkordeonelements auf.
  • Es können mehrere Inhalte gleichzeitig aufgeklappt werden.
  • Inhalte in den einzelnen Akkordeonelementen sollten nur einen geringen Umfang haben, damit die Informationen schnell erfasst werden können. Das fördert ein positives Nutzungserlebnis.

Anleitung Akkordeon

Erstellen Sie ein neues Inhaltselement und wählen Sie unter dem Reiter "Typischer Seiteninhalt" den Inhaltstyp "Akkordeon".

Erstellen Sie ein neues Inhaltselement und wählen Sie unter dem Reiter „Typischer Seiteninhalt“ den Inhaltstyp „Akkordeon“.

 Quelle: UdK Berlin

Vergeben Sie bei Bedarf eine Überschrift, die über dem Akkordeon stehen soll. Ob Sie eine Überschrift benötigen, hängt davon ab, wo Sie das Akkordeon platzieren.

 Quelle: UdK Berlin

Klicken Sie auf „+ New Tab Content“, um neue Akkordeonelemente zu erstellen. Hier sollten Sie unbedingt eine Überschrift wählen. Sie erscheint als anklickbarer Titel, den die Nutzer*innen öffnen können. Anschließend füllen Sie das Akkordeonelement mit Text, Bildern oder Videos.

 Quelle: UdK Berlin

Befüllen Sie Ihr Akkordeonelement ganz nach Ihren Wünschen: Text ergänzen Sie im Reiter „Allgemein“. Passende Bilder laden Sie im Reiter „Bilder“ hoch. Ansprechende Medien fügen Sie im Reiter „Medien“ hinzu. Unter „Erscheinungsbild“ legen Sie fest, wo Ihre Bilder und Medien erscheinen sollen – wahlweise über, unter, links oder rechts vom Text. Denken Sie daran, Bilder und Medien mit den entsprechenden Metadaten zu versehen. Zum Schluss speichern Sie alles ab.

 Quelle: UdK Berlin

Beispiel Akkordeon

Klicken Sie hier, um ein Beispiel für das Akkordeon und Akkordeonelemente zu sehen.