Allgemeine Informationen zu Highlightboxen
Definition

Eine Highlightbox in TYPO3 ist ein spezielles Gestaltungselement, das verwendet wird, um bestimmte Inhalte hervorzuheben und die Aufmerksamkeit der Benutzer auf wichtige Informationen zu lenken. Im Wesentlichen sind Highlightboxen flächige, farbige Hinterlegungen, die über die gesamte Breite gehen können oder innerhalb des Rasters platziert werden. Highlightboxen sind besonders nützlich, um Nutzer*innen in Aktionen zu lenken, wichtige Hinweise hervorheben zu können und definierte Inhaltsmodule abzugrenzen von anderen Inhalten.

Merkmale

Visuelle Hervorhebung:

  • Highlightboxen sind oft mit auffälligen Farben, Rahmen oder Hintergründen gestaltet, um sich vom restlichen Inhalt abzuheben. Diese visuelle Differenzierung zieht die Aufmerksamkeit der Benutzer an.

Flexibilität in der Gestaltung:

  • Redakteure können Text, Bilder oder Icons innerhalb der Highlightbox platzieren. Dies ermöglicht die Anpassung an verschiedene Inhalte und Themen, sodass die Box vielseitig eingesetzt werden kann.

Einfache Integration:

  • Highlightboxen können in TYPO3 einfach als Inhaltselement erstellt und in bestehende Seiten integriert werden. Sie sind in der Regel leicht zu bedienen und benötigen keine umfangreiche technische Kenntnisse.

Responsive Design:

  • Highlightboxen sind oft responsiv gestaltet, sodass sie sich an verschiedene Bildschirmgrößen anpassen. Dies sorgt für eine konsistente Benutzererfahrung auf Desktop- und Mobilgeräten.

Optionen zur Interaktivität:

  • Einige Highlightboxen können interaktive Elemente wie Buttons oder Links enthalten, die den Benutzern ermöglichen, weitere Informationen zu erhalten oder Aktionen auszuführen, wie z. B. das Abonnieren eines Newsletters oder den Zugriff auf spezielle Angebote.
Anwendungsbeispiele
  • Wechsel zwischen Elementen: Bei Seiten mit langen Texten kann zwischen inhaltlichen Absätzen ein Wechsel zwischen hellgrauem Hintergrund (Highlightbox) und Weiß erfolgen, um die Seite aufzulockern.
  • Call-to-Action: Ermutigung der Benutzer*innen, eine bestimmte Aktion auszuführen. Beispiele: sich zu bewerben, zu informieren oder Kontakt aufzunehmen. Die Call-To-Action Highlightboxes sind sonnengelb.
  • Kleine Highlightboxen: Innerhalb des Rasters können wichtige Informationen, Ankündigungen, Änderungen u.ä. in farblichen Boxen hervorgehoben werden. Starke Hervorhebung sind in der Primärfarbe (Hauptseite Petrol), dezente Kennzeichnung in dem Hellgrau.
  • Aufzählungen/Zusammenfassungen: Am Ende eines Absatzes oder Textes kann eine Zusammenfassung grau hinterlegt werden.
  • Ansprechpersonen: Die Personen-Cards werden auf einer Highlightbox in Primärfarbe (Hauptseite Petrol) dargestellt.
  • Schritte-Element: Um Prozesse/Abläufe wie beispielsweise Bewerbungsverfahren darzustellen, gibt es ein Schritte-Element. Dieses Element mit einer sonnengelben Highlightbox hinterlegt. 

     

Erstellen einer Highlightbox
  1. Um ein neues Inhaltselement hinzuzufügen, klicken Sie im Hauptbereich der Seite auf das Symbol "Inhaltselement hinzufügen" (in der Regel ein "+" oder ein entsprechender Button). Im Anschluss öffnet sich ein Dialogfenster mit den verfügbaren Inhaltselementen.
  2. Suchen Sie in der Liste der Inhaltselemente nach der Option “Highlight-Box”. Wählen Sie dieses Element aus.
  3. Einstellungen: Um die Hintergrundfarbe einer Highlightbox zu ändern, wählen Sie Im Reiter “Erscheinungsbild” einen Eintrag im Dropdown “Hintergrundfarbe”
  4. Vorschau und Speichern: Klicken Sie auf "Speichern", um die Änderungen zu sichern. Überprüfen Sie die Highlight-Box in der Vorschau. Falls notwendig, passen Sie die Inhalte an und speichern Sie erneut.