Herobild Typ 1

scss
Freshpage 2
BRICK

Herobild mit Textbox darüber. 

Das Bild hat grundsätzlich eine fixe Höhe, aber bei kleineren Bildschirmen wächst es, falls zu viel Text hinterlegt ist.

zum Brick

Vorteile

  • als Brick abgelegt unter /templates/entrytypes/Herobild/1/Herobild/ (s. vorherigen Eintrag)
  • responsive optimiert, so dass Text auf Mobile nicht über das Bild lappt
  • responsive optimiert in Bezug auf Bildergrösse
  • Focuspoint berücksichtigt
  • Textbox ist speziell: Die Box beginnt ganz links und passt sich der Textlänge an, der Text beginnt links am Start des üblichen Containers.

Nachteile

  • nicht speziell barrierefrei optimiert
  • Textabstand links vom Rand nicht bei allen Layouts so umsetzbar. 

Herobild Typ 2 mit beschränkter Breite (container) und fixem Seitenverhältnis

scss
Freshpage 1
Freshpage 2
BRICK

Ein Bild mit fixem Seitenverhältnis. Innerhalb eines Containers mit Max-Width.

zum Brick

Vorteile

  • als Brick abgelegt unter /templates/entrytypes/Herobild/2/Herobild/ 
  • responsive optimiert in Bezug auf Bildergrösse
  • Focuspoint berücksichtigt