Bildformate fürs Web

Es gibt unendlich viele verschiedene Bildschirmformate und Auflösungen.

• Zwei der gebräuchlichsten sind 1920×1080 bzw. 1920×1440 und 1280×960.
• Die Höhe kann man ignorieren, aber die Breite ist ausschlaggebend. 
• Ich habe hier unten Standardgrößen für Formate angefügt.

BILDER KOMPRIMIEREN

• Ich empfehle diesen Artikel zu lesen: Bilder komprimieren – Ladezeit reduzieren: So geht’s!
• https://de.ryte.com/magazine/bilder-komprimieren-ladezeit-reduzieren-gehts
• Am besten ist, du entscheidest dich für eine Methode, die dir am besten passt. Wenn du mit Photoshop die Bilder sowieso bearbeitest, ist es am einfachsten, die Komprimierung da gleich als eine weitere Version mit anzulegen.
• Als Auflösung immer 72dpi angeben, oder maximal 96dpi, alles andere vergrößert die Datenmenge unnötig.
  Im Dateinamen immer ‘web’ am Ende dranhängen. Dann weisst du auch später noch, das ist die fürs Web komprimierte Version. 

DATEINAMEN:

• Am Besten ist, du benennst du Fotos nach einem System:
• Ich würde z.B den Projektnamen oder Kunden immer am Anfang in Großbuchstaben schreiben, dann Titel normal und dann bei verschiedenen Versionen auch das Format. Dann sieht man gleich was man hat.

 Also z.B. 

TIAN_nachspeise_770x400_web.jpg

TIAN_nachspeise_400x400_web.jpg

RECHEIS_nudeln1_770x770_web.jpg

Die Formatvorlagen

1. sind in der Divi-Bibliothek abgespeichert.
2. Regulären Abschnitt (blauer Kreis mit Kreuzchen) einfügen > Zeile Einfügen > Divi Bibliothek > Vorlage auswählen
3. Bilder auf das richtige Format zuschneiden, in die Medien-Bibliothek hochladen > Bilder austauschen.

Formatvorlage für Breite 1280px

Jedes Bild mit hellgrauem Rahmen 8px

Image sizes Aspect Ratio 16:9 as recommended by Elegant Themes the-ultimate-guide-to-using-images-within-divi

Weitere Formatvorlagen für Layouts 1

Formatvorlagen mit hellgrauem Schatten 0,0,0, Schattengröße 8px:

Formatvorlage für Layouts 2

Formatvorlagen mit hellgrauem Schatten 0,0,0, Schattengröße 8px:

Formatvorlage für Layouts 3

Formatvorlagen mit hellgrauem Schatten 0,0,0, Schattengröße 8px:

Formatvorlage für Layouts 4

Formatvorlagen mit hellgrauem Schatten 0,0,0, Schattengröße 8px:

Formatvorlage für Layouts 5

Formatvorlagen mit hellgrauem Schatten 0,0,0, Schattengröße 8px:

Formatvorlage für Layouts 1280 Aspect Ratio 4:3

Formatvorlagen mit hellgrauem Schatten 0,0,0, Schattengröße 8px:

Image sizes Aspect Ratio 3:4 as recommended by Elegant Themes the-ultimate-guide-to-using-images-within-divi