Bildgrössen und ihre Verwendung

Bildgrössen werden in Breite x Höhe und mit einer Anweisung zum Zuschneiden (crop) versehen.

  • Sind beide Werte über 0, so sind beides Maximalwerte und das Bild wird über das Zentrum in den Vorgegebenen Rahmen eingepasst. Beispiel mit den Werten 1024 x 1024:
    • Ein Photo 5184 x 3456 wird zu 1024 x 683
  • Ist ein Wert mit 0 belegt, so wird der andere fixiert und die Seite mit 0 wird im Grössenverhältnis des Bilds angepasst. Beispiel mit den Werten 1200 x 0:
    • Ein Photo 3456 x 5184 wird zu 1200 x 1800
  • Der Crop-Wert kann neben genaueren Anweisungen vor allen folgende Werte umfassen:
    • false: Das Bild wird nicht beschnitten. Beispiel mit 300×300:
      • Ein Photo 5184 x 3456 wird zu 200 x 300
      • Ein Photo 3456 x 5184 wird zu 300 x 200
    • true: Das Bild wird über das Zentrum in den Ausschnitt eingepasst. Beispiel mit 300×300:
      • Ein Photo 5184 x 3456 wird in der Höhe auf 300px verkleinert und rechts und links abgeschnitten.

Die verschieden Arten des Verkleinerns und Beschneidens bedeuten, das Bilder, welche mit 300,300,false erzeugt wurden, nicht zwingend im Dateinamen -300×300.jpg stehen haben. Es ist nicht zielführend, nicht verwendete Bildgrössen vom Server zu löschen da:

  • alle Grössen auch in der Datenbank vermerkt sind.
  • all diese Grössen auch bei jedem Bild im Frontend mit angegeben werden um adaptiv auf die Bildschirmgrösse regieren zu können. Darüber entscheidet der Browser via die srcset-Angaben beim Bild.

WordPress Standardbildgrössen

Diese werden unter Settings/Media (Einstellungen/Medien) eingestellt. Bei Veränderung keine rückwirkende Erzeugung neuer Grössen. Die Standardwerte sind:

  • 150 x 150, true
    • Einsatz in Medien Listenvorschau, tatsächlich als Quadrat.
  • 300 x 300, false
    • Einsatz in Medien Grid-Vorschau. Jedoch sind due 300px nur Maximalwerte, bei Standard 4×3-Bildern ist es 200×300 für Portrait und 300×200 für Landscape. Andere Werte bei anderen Verhälnissen!
  • 768 x 0, false
    • Bild wird erzeugt, erscheint in keiner Auswahl und auch nicht unter Einstellungen/Medien. Einsatz für adaptive Bildgrössen.
  • 1024 x 1024, false
    • Maximalgrösse, 1024px ist nur der Maximalwert für die längere Seite, der andere Wert ist proportional kleiner.

CleanBlogg Standardbildgrössen

Diese werden in functions.php eingetragen und auch immer für alle Bilder mitgeneriert nachdem das Design/Thema installiert wurde. Die Verkleinerungen werden aber nicht rückwirkend erzeugt.

  • 1050 x 0, true
    • Bilder für grossen Slider oben, wobei auch machmal die Breite 1024 eingesetzt wird (ungeklärt).
  • 820 x 530, true
    • ungeklärt
  • 400 x 270, true
    • Liste der Blog-Beiträte im Grid-Format
  • 300 x 200, true
    • ungeklärt
  • 100 x 80, true
    • Posts Tab Widget

Eigene Bildgrössen

Ich setze diese ein, um eine bessere Gallery zu erzeugen, vgl. CleanBlogg Thema und Bildplatzierung.

  • 1200 x 0, false
    • In einigen WordPress-Instanzen die Maximalgrösse überhaupt. Kann den CleanBlogg-Slider ersetzen
  • 794 x 0, false
    • Maximale Bildbreite
  • 392 x 0, false
    • Zwei Bilder nebeneinander samt Abstand
  • 258 x 0, false
    • Drei Bilder nebeneinander samt Abstand
  • 200 x 0, false
    • Kleines Bild im Text links- oder rechtsbündig

Um ein wenig die Flut an Formaten (und dem Plattenplatz am Server) reduzieren zu können, könnte man die eigenen Bildgrössen in jenen der Standardbildgrössen von WordPress und des Designs/Themas einbauen.

Bildbearbeiten unter WordPress

Dort wo man Titel usw. festlegt, befindet sich ein Edit-Button unter dem Bild. Dabei kann man Bilder drehen, spiegeln und beschneiden. Letzteres geht nur bedingt, weil nur fixe Pixelwerte hart beschnitten werden können. Das heisst, dass man unter Umständen ein einzelnes Pixel in der Breite nicht abschneiden kann. Manchmal wird auch ein 1 Pixel breiter Rand generiert. Dies scheint von den Graphic Librarys am Server abzuhängen. Ein generelles Problem dieser Berarbeitungen ist, dass die Dateinen dupliziert werden und die Dateinamen verändert werden. Aus zum Beipsiel mein_bild.jpg wird mein_bild-e1602655384666.jpg und nur letztes erscheint mit eben diesem namen in der Mediathek. Benennt man es unter WordPress um (eigenes Plugin), so geht das nicht, weil ja mein_bild.jpg noch am Server liegt, es wird also mein_bild-1.jpg draus. Natürlich gilt dieses Beispiel auch für alle generierten Thumbnails.

Wurden Bilder zuvor mit Wasserzeichen versehen, sind diese in den neuen Bildern weg.

No Comments

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.