ACHTUNG! Wenn Sie Fehler in einem Element finden, legen Sie bitte davon keine weiteren an, solange der Fehler nicht gefixt wurde. Melden Sie ihn uns gern an ejf@undkonsorten.com
Eine barrierefreie Überschriftengliederung sieht wie folgt aus:
Hero Image Claim
Hinweis zur den Überschriften
Im obigen Beispiel wurden die Überschriften direkt im RTE - Rich Text Editor - gesetzt, aber in der Regel setzt man sie separat im Feld “Überschriften: Typ”. Hier können sie auch auf “versteckt” gesetzt werden, wenn sie nur zur internen Orientierung im Backend diesen sollen.
Der “Hero Image Claim” ist keine Überschrift im technischen Sinne, sondern regulärer Text, der im Dropdown “Stile → Claim” gesetzt wird.
Im Feld “Überschrift Aussehen” kann man eine Überschrift optisch auch auf einen anderen Typ setzen - so behält sie ihre barrierefreie Semantik.
Im Feld “Ausrichtung” kann sie mittig gesetzt werden.
Elemente können in verschiedenen Breiten und mit verschiedenen Hintergrundfarben gesetzt werden. Dies wird im Reiter “Erscheinungsbild” gesetzt. Lange Fließtexte sollten nicht breiter als 80% sein.
Im Reiter “Erscheinungsbild” besteht außerdem die Möglichkeit, die Abstände nach einem Element zu verringern.
Um die Farbe über die volle Breite zu legen, muss ein Haken bei “Hintergrund volle Breite” gesetzt werden.
100% Contentbreite: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
80% Contentbreite: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
60% Contentbreite: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et.
Lorem ipsum. Dolor sit amet.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt.
Hinweise zum Akkordeonelement:
Barrierefreiheit: Im Feld “Header Layout auf nächster Ebene (im Plugin)” muss immer die nächste Ebene im Vergleich zum Feld “Überschriften: Typ”, d.h. wenn Typ = H2, dann nächste Ebene = H3.
Design: Ein Akkordeonelement ist im Design aktuell nur auf weißem Hintergrund in der Breite 60% vorgesehen. Auch wenn Sie im Backend weitere Möglichkeiten zur Auswahl haben, wurden diese nicht fürs Frontend gestyled.
Hinweis zur den Gallerien:
Design: EDie Gallerien sind im Design aktuell nur auf weißem oder hellgrünem Hintergrund für volle 100% Contentbreite vorgesehen. Auch wenn Sie im Backend weitere Möglichkeiten zur Auswahl haben, wurden diese nicht fürs Frontend gestyled.
Du hast Fragen? Unser Recruiting-Team beantwortet sie gern unter recruiting@ejf.de oder wende dich telefonisch an einen unserer Ansprechpartner:innen.
Zuständigkeit
QA
QA
QA