Headerbild eingebunden, daher graue Ränder oben und unten!
Bild 3
Headerbild eingebunden, daher graue Ränder oben und unten!
Bild 3
Headerbild eingebunden, daher graue Ränder oben und unten!
Bidl 4
Ich bin ein Blindtext.
Bild 4
Ich bin ein Blindtext.
Bild 4
Ich bin ein Blindtext.
Bild 5
Ich bin ein Blindtext.
Bild 5
Ich bin ein Blindtext.
Bild 5
Ich bin ein Blindtext.
Testbilder
Logos und Illustrationen immer als SVGs!
Headerbild Startseite 2000px Breite x 675px Höhe
Alle anderen Header 1440px Breite x 355px Höhe
Format für Teaser und andere Contentbilder gilt grundsätzlich das Format 16:9
Maße für 50% Teaserbox: 737px Breite x 413px Höhe
Mindestbreite für 25%, 33% Teaser: 545px Breite
Design / Breakpoints
Responsive bis 991px (xs,sm,md)
992px (lg): Content Layout wird zweispaltig
1200px (xl): Mobile Menu wird ausgeblendet
1440px (xl-h): Ausrückung des Headers
1600px (xxl): Widescreen
Allgemeine Benennung für alle Bilder (vbb-oepnv-zug.dateiformat)
Immer in Kleinbuchstaben
Umlaute ausschreiben
keine Unterzeichen
nur Bindestrich
wiedergeben, was auf dem Bild zu sehen ist (SEO-Relevant!)
Daten der Bilder
Die Bilder immer für Web speichern und das Datenvolumen klein halten (300 - 400 kB pro Bild ist super) alles über 800 kB ist ungünstig. Vor allen Dingen, wenn mehr als ein Bild (z.B. Teaser) eingefügt wird.
