Meine Standardeinstellungen WordPress Medien

Warum ich diese Standardwerte verwende, ist in dem Bericht Bildgrößen der Mediathek -Grundeinstellungen von WordPress beschrieben

1. Vorschaubild: 150 x 150 px
2. Mittel: 420 x 280 px
3. Groß: 840 x 560 px
4. Vollständige Größe (Full), diese Größe entspricht der Originalgröße des hochgeladenen Bildes. Ich verwende dazu 1600 x 900 px. (Die Originalgröße ist später nur auswählbar, wenn das Bild größer als das „Groß“ Format ist)

Je nach Theme kann es sein, dass zusätzliche Formate gespeichert werden.

Testbild-Bildgrößen im Format 3:2 und die gespeicherten Varianten

An dem Beispiel ist gut zu erkennen, dass zusätzlich zu dem Bild vollständige Größe (Full) weitere 5 Bildgrößen gespeichert wurden, zwei mehr wie durch WP vorgegeben. Das Format 300×200 ist ein von mir hinzugefügtes Format und das Format 135×135 wird von einem Plugin verwendet. Je nach Themes und Plugins können so schnell 10 und mehr Varianten eines Bildes entstehen.

Zusätzliche Bildgrößen hinzufügen

Will man ein zusätzliches Format als Ergänzung zu den Standardeinstellungen nutzen, ist dies kein großes Problem. Grundsätzlich gibt es zwei Möglichkeiten:

1. Mit einem Plugin oder per
2. Codeschnipsel in der function.php des Themes

Beide Varianten werde ich im Folgenden beschrieben

Zusätzliche Bildgrößen per Plugin Simple Image Sizes hinzufügen

Die Lösung Bildgrößen per Codeschnipsel zuzufügen wurde von mir bei der Erstausgabe dieses Berichtes als alleinige Lösung beschrieben. Inzwischen hat sich jedoch einiges getan und wie bei vielen Erweiterungen zu WP gibt es ein Plugin, welches die Aufgabe hervorragend erfüllt. Ich habe deshalb den Bericht komplett überarbeitet und die ursprüngliche Lösung per Codeschnipsel an zweite Stelle gesetzt.

Das Plugin Simple Image Sizes erfüllt alle Anforderungen in einfach zu handhabenden Form und bietet zusätzlich auch noch die Lösung bereits bestehende Bilder um das neue Format zu ergänzen.

Nach der Installation des Plugins werden unter Einstellungen / Medien alle zur Verfügung stehenden Bildgrößen, auch die versteckten, aufgelistet. Hier kann man die Bildgrößen ändern oder neue Bildgrößen hinzufügen. Das Plugin stellt sogar den PHP Code für neue Bildgrößen zur Verfügung, falls man diese direkt im Theme verankern möchte.
Insbesondere bei komplexen Themes, die viele unterschiedliche Bildgrößen haben, hilft das Plugin, einen Überblick über die zur Verfügung stehenden Bildgrößen zu erhalten und hier ohne viel Aufwand, Änderungen vornehmen zu können.

Nach Änderung einer Bildgröße können dann alle oder auch nur einzelne Bilder neu generiert werden. Anschließend steht das Bild oder die Bilder in der neuen Bildgröße in der Mediathek zur Verfügung. Ich denke, die Darstellung ist selbsterklärend.

Fazit
Mit dem Plugin „Simple Image Sizes“ kannst du sehr einfach neue Bildgrößen und Bildformate für deine WordPress Installation anlegen.  Außerdem wird das Plugin vom Entwickler regelmäßig gepflegt und ist damit auch in Zukunft noch nutzbar.

Zusätzliche Bildgrößen per Code hinzufügen

Die dazu benötige Funktion ist im WordPress-Codex beschrieben
Damit diese Bildgröße später ansprechbar ist, ist es erforderlich, ihr einen eindeutigen Namen zuzuordnen. Nicht verwenden darf  die Bezeichnungen „thumb“, „thumbnail“, „medium“, „large“ und „post-thumbnail“, da diese von WordPress bereits reserviert sind.

In meinem Beispiel verwende ich  das zusätzliche Format 300 x 200 px. Der dafür notwendige Codeschnipsel muss in der function.php des Themes aufgenommen werden.

add_image_size('medium-300x200', 300, 200, false); //Bildformat 300x200

WordPress bietet dazu vier Parameter, um das Bild zu konfigurieren (Name, Breite, Höhe und Zuschnitt).
Für den Zuschnitt verwende ich den Parameter false, um das Bild im gleichen Seitenverhältnis zu erhalten. Bei Verwendung des Parameters „true“ wird, falls das Format nicht vorhanden ist, ein Ausschnitt des Miniaturbildes mit dem exakten Format erstellt.
Hinweis: Die zusätzlichen Bilder, bzw. Bildgrößen werden immer dann erzeugt, wenn ein neues Bild hochladen wird. Alte Bilder bleiben von den Veränderungen unberührt.
Mit dem Plugin Regenerate Thumbnails kannst du aber alle bestehenden Bildgrößen, die in deiner Medienbibliothek hochgeladen wurden neu generieren.

Nun ist es zwar schön und gut, dass man die Bilder in der passenden Größe hat, doch man sollte sie auch in der Medienbibliothek, bzw. in den Dialogen beim Artikelschreiben verwenden können. Dazu muss zusätzlich in der functions.php ein Filter hinzufügt werden.

Codeschnipsel des kompletten Beispiels

// Eine neue Bildgroesse hinzufuegen
add_image_size('medium-300x200', 300, 200, false); //Bildformat 300x200
add_filter( 'image_size_names_choose', 'my_custom_sizes' );
function my_custom_sizes( $sizes ) {
return array_merge( $sizes, array(
'medium-300x200' => __('Medium 300x200'),
) );
} 

The post Zusätzliche Bildgrößen der WP Mediathek per Code oder Plugin hinzufügen appeared first on MSR-SUPPORT.

WordPress Standard Bildgrößen (Default Einstellung)

WordPress ermöglicht 4 Bildformate, Vorschaubild (Thumbnail), Mittel (Medium), Groß (Large) und Vollständig (Full). Nach der Neuinstallation von WordPress findest du folgende Defaulteinstellung:

1. Vorschaubild: 150 x 150 px
2. Mittel: 300 x 300 px
3. Groß: 1024 x 1024 px
4. Vollständige Größe: Originalgröße ist nur auswählbar, wenn das Bild größer als das „Groß“ Format ist.

In der Wirkung bedeutet dies, dass zu jedem Original (Web-Bild) zusätzliche Vorschaubilder abgespeichert werden. Diese Bilder sind dann per Link mit dem Original-Bild verknüpft.
Den Unterschied zwischen Origil-Bildern und Web-Bildern habe ich bereits im Bericht „Bilder fürs Web optimieren -Empfehlungen und Tipps“ beschrieben.

Meine Empfehlung zur Einstellung der Bildgrößen der Mediathek

Grundlage meiner Empfehlung ist die Breite des Content des verwendeten Themes, in meiner Seite ist dieser maximal 840 px. Da ich die meisten Bilder im Format 3:2 verwende, ist die Höhe in diesem Verhältnis angepasst.

1. Miniaturbilder 150 x 150 mit der Option „Miniaturbild auf exakte Größe zuschneiden.“
   Die Miniaturbilder werden als Artikelbilder verwendet und sollten möglichst gleich groß sein. Ein Ausschnitt ist bei einem so kleinen Bild zulässig.
   Ich verwende diese Größe auch bei großen Galerien, d.h. bei 4 bis 5 Bildern pro Zeile
2. Mittlere Bildgröße 420 x 280. Diese Größe stellt das Bild schon in guter Qualität dar und kann gut in den Textfluss eingepasst werden. Es empfiehlt sich nicht mehr als die Hälfte des Content-Bereiches zu nutzen.
3. Maximale Bildgröße 840 x 560. Mit dieser Größe wird der Content voll ausfüllt, solche Bilder werden bei Einzelberichten als Kopfbild dargestellt
4. Original Web-Bild 1600 x 900 px. Diese Bild wird mit externen Mitteln, d.h. per Fotosoftware oder mit dem Kompression-Plugin erstellt und wird als Lightbox Bild angezeigt

Zusätzlich zu diesen Standards verwende ich noch das Formate 300 x 200 und für Galeriefunktionen mit 3 bzw. 4 Bildern in einer Zeile. Um dies zu nutzen, muss jedoch etwas Code ein der function.php eingesetzt werden: Siehe WordPress -Neue Bildgrößen hinzufügen.

Galeriedarstellung von zwei Bildern im Querformat (Mittel 420 x 280 px)

Zusätzlich zu diesen Standards verwende ich noch das Formate 300 x 200 und für Galeriefunktionen mit 3 bzw. 4 Bildern in einer Zeile. Um dies zu nutzen, muss jedoch etwas Code ein der function.php eingesetzt werden: Siehe Zusätzliche Bildgrößen der WP Mediathek per Code oder Plugin hinzufügen

Neue Bildformate auf bereits bestehende Bilder anwenden

Alle vor der Umstellung an der Mediathek gespeicherten Bilder bleiben von den Änderungen unberührt, sie sind in den alten Formaten gespeichert und soweit verwendet in den Beiträgen entsprechend gespeichert.
Wird nach der Umstellung in der Mediathek ein älteres Bild zum Beispiel im Format „Medium“ eingefügt, wird es zwar in den neuen Abmessungen eingefügt, der Link verweist aber auf das alte Format. Zur Anpassung wird das Bild skaliert, d.h. Höhe und Breite werden entsprechend definiert.

Wie fast immer gibt es für die alten Formate eine Lösung, das Plugin „Regenerate Thumbnails“ übernimmt die Anpassungen aller Bilder die über die WordPress Mediathek hochgeladen wurden. Für jedes neue Format wird zusätzlich zu dem bestehenden Bild ein weiteres erstellt. Die alten Bilder bleiben aber erhalten, um keine Veränderung in den alten Berichten zu kreieren. Nur die Artikelbilder werden, falls das Miniaturformat geändert wurde angepasst, aus meiner Sicht eine sehr gute Lösung.

The post Bildgrößen der Mediathek -Grundeinstellungen von WordPress appeared first on MSR-SUPPORT.

Die gesamte Problematik muss dazu in zwei Aktionen aufgeteilt werden.

1. Upload von GPX KMZ und KML

Alle drei GPS Dateien werden von WordPress nicht unterstützt. Will man solche Dateien in die Mediathek hochladen kommt die Fehlermeldung:

„Dieser Dateityp ist aus Sicherheitsgründen leider nicht erlaubt.“

Standardmäßig kann man mit dem integrierten Uploader  nur bestimmte Dateitypen hochladen. Welche, das bestimmen die WordPress Mime-Types. Man könnte auch sagen, die Dateiendung muss stimmen, sonst verweigert WordPress den Upload. Das ist eigentlich aus Sicherheitsaspekten gut, denn so können potenziell schädliche Dateien, die beim normalen Betrieb einer Website nicht benötigt werden, gar nicht erst hochgeladen werden. Für Betreiber von Webseiten mit Routenempfehlung ist dies jedoch ärgerlich.

Erlaubte WordPress Mime-Types

Eine Übersicht der erlaubten Dateitypen bzw. Dateiendungen (WordPress Mime-Types gibt es hier. Das sind neben Bilddateien überwiegend  Mediadateien, wie gängige Audio- und Videoformate.

GPX, KMZ und KML Upload per Plugin oder Codeanpassung?

Bei der Suche nach einem entsprechenden Plugin wird man schnell fündig. Das Plugin WP Extra File Types leistet, was der Titel verspricht. Versierte Anwender finden jedoch auch schnell den Code um in der function.php eine Anpassung vorzunehmen.

Da ich bereits ein mächtiges Plugin „Media Library Assistant“ verwende, war dies meine erste Wahl.

Erlaubte Dateitypen für den Upload mit dem  Plugin Media Library Assistant ändern

In der deutschen Ausführung ist das Plugin unter dem Namen Medien-Assitent unter Einstellungen zu finden. Dort findet man unter Uploads alles, um die Mime Typs von WordPress zu erweitern.

Wichtig ist bei den Einstellungen ist, dass die Option Always Use MLA MIME Type aktiviert wird, um die Sicherheitsüberprüfungen vom Typ WordPress MIME zu überschreiben.

Das war’s, einfacher geht nicht. Ein Blick auf die anderen Features des Plugin kann nicht schaden. Ich verwende es zum Beispiel auch dafür IPTC bzw. EXIF Daten beim Hochladen in die Mediathek den WP Bilder zuzuordnen.

2. Download der GPX-Datei 

Nachdem der Upload reibungslos funktionierte musste ich allerdings feststellen, dass man auf die GPX-Datei nicht zugreifen konnte (KML und KMZ funktionierte).

Bei manchen Browsern werden die GPX-Dateien als .txt-Datei heruntergeladen oder als XML direkt im Browser geöffnet.

Die Lösung dafür ist eine Anpassung in der .htaccess Datei welche im  Root-Verzeichnis von WordPress zu finden ist.

Die .htaccess-Datei ergänzt man nun um folgende Code Zeile und speichert die Datei ab:

AddType application/gpx+xml .gpx

Ggf. muss man anschließend noch den Cache vom Browser löschen. Danach sollte es möglich sein, dass GPX-Dateien auch als solche heruntergeladen werden.

The post GPX Up- und Download unter WordPress appeared first on MSR-SUPPORT.

Die WordPress Bildkomprimierung ist ein gutes Tool welches beim Upload von Bildern eine gute Datenreduktion liefert.

Der  Gedanke Bilder  ohne Hilfsprogramme direkt in die Mediathek zuladen  ist sicherlich richtig. Gleichzeitig muss aber beachtet werden, dass Bilder häufig Lustbremsen der Webseite sind. Lange Ladezeiten werden oft maßgeblich durch zu große Bilddateien hervorgerufen.

Letztendlich ist selbst mit diesem Bordmittel die Bildkomprimierung noch nicht ausreichen und der Einsatz eines Plugin wird notwendig. In diesem Bericht möchte ich aber zuerst nur die WordPress Bildkomprimierung in der Standardausführung behandeln. Ein Plugin zur weitergehende Komprimierung habe ich in dem Bericht WordPress -Bilder optimieren für das Web (Optimus) bereits beschrieben, weitere werden folgen.

Bei meiner Recherche zur WordPress Mediathek  und Bildkomprimierung fand ich eine hilfreiche Information.

 Kaum jemand weiß, dass WordPress Bilder im JPEG-Format automatisch auf 82% ihrer ursprünglichen Größe verkleinert!

Dies erklärt, warum in den Optionen der Mediathek keine Einstellmöglichkeit für die Bildkomprimierung zu finden ist.

Standard Bildkomprimierung durch WordPress

Ich habe in Test mit eigenen Bildern die WP Datenreduktion geprüft und das Ergebnis mit externen Kompressionsprogrammen verglichen.  Von  Ergebnis war ich sehr erfreut, die WordPress Datenkompression kam meist, zu besseren Resultaten  wie mit meinen Fotoprogrammen. Teilweise konnte ich deutlich bessere Datenreduktion bei gleicher Bildqualität erreichen.

Für Anwender selbst von hochwertiger Kameras bedeutet dies, dass sie das Originalfoto direkt auf den Server hochgeladen können.  Bei einem Foto  mit 6000×4000 Pixel können dies  aber leicht bis zu 14 MB große Dateien sein. Das Hochladen der Bilder braucht dann je nach Übertragungsrate WLAN, LAN ewig! Da ich keinen Nutzen darin sehe, solche Datenmengen auf meinen Server hochzuladen ist mein Tipp:

Zuerst das Foto im Fotobearbeitungsprogramm auf die Maximalanwendung „Web-Bild“ (1600 x 900 px mit Q=70 %) reduzieren und dann die drastisch verkleinerte Datei  von rund 100 bis 200 KB hochladen. Selbst größere Bildermengen werden dann ratzfatz in die Mediathek geladen.

WordPress Bildkomprimierung von JPEGs anpassen

Falls man mit der Basiseinstellung von WordPress nicht zufrieden ist, besteht die möglich den Wert abzuschalten oder einen anderen Wert zu verwenden.

Dazu  navigiert man in den Ordner des verwendeten Themes und öffnet die Datei functions.php. Dort fügt man folgenden Code ein:
add_filter('jpeg_quality', function($arg){return 100;});
add_filter( 'wp_editor_set_quality', function($arg){return 100;} );

Damit wird die Komprimierung von JPEG-Bildern durch WordPress ausgeschaltet. Die 100 bedeutet, dass die Bildqualität von JPEGs nun bei 100 % liegt. Dementsprechend kann man auch eine höhere Komprimierung als 82 %  einstellen, indem man einen kleineren Wert als 82 wählt.

Aus einem Foto mach viele Fotos

Für den neuen Betrachter ist es oft eine Überraschung. Schaut man per FTP Proramm in den  Ordner „uploads“ so findet man nicht eine Bilddatei, sondern viele verschiedene Varianten.

Beim Hochladen der Bilder werden locker rund 10 verschiedene Bildformate, je nach verwendetem Plugin oder Theme,  produziert. Ich habe für mein Theme auch zusätzliche Formate konfiguriert. Wie man solche zusätzliche Formate konfiguriert habe ich in dem Bericht WordPress -Neue Bildgrößen hinzufügen beschrieben

Der Vorteil der Varianten besteht darin, dass nicht immer das große Bild, selbst beim Betrachten von Minibildern, geladen werden muss. Die Geschwindigkeit der Webseite wird so deutlich verbessert. Der Besucher wird es danken.

The post WordPress Bildkomprimierung ist beim upload sehr gut appeared first on MSR-SUPPORT.

Das Copyrightzeichen © stellt im Urheberrecht ein Symbol zur Kennzeichnung eines bestehenden Schutzes dar. Ich verwende das Zeichen bei meinen Fotos bereits seit langer Zeit in den IPTC Daten. Nicht beachtet hatte ich, dass dieses Zeichen nicht auf allen Systemen zur Verfügung steht. Meist wird in solchen Anwendungen das Zeichen dann nicht dargestellt oder durch andere Hieroglyphen ersetzt. Dies ist zwar nicht schön, damit kann man aber leben.

Ärgerlich wird es wenn das Copyrightzeichen Fehler in der Programmausführung verursacht. In meiner WordPress Version 5.2.4 war dies der Fall.

Fehlerbeschreibung des Copyrightzeichen in der WordPress Installation

• Beim hochladen von Fotos werden allen Foto Varianten (Thumb-Größen) erzeugt. Dies konnte ich per FTP prüfen.
• In der Mediathek wird das kleine Vorschaubild nicht dargestellt. Richtig müsste es lauten, es wird ein Bild mit 1px Größe angezeigt. Alle anderen Informationen funktionieren.
• Das Foto kann über die Menüpunkte Bearbeiten und Anschauen dargestellt und bearbeitet werden und man erhält den Eindruck, dass alles korrekt funktioniert.
• Spätesten wenn man das Bild in einen Bericht einfügen will stellt sich heraus, dass etwas faul ist. Die Option der Bildgrößenauswahl wird nicht angezeigt. Falls man dies übergeht und das Bild in den Bericht einfügt kommt dann die Ernüchterung. Es wird nur ein Bild mit 1 px Größe aktiviert.
• Wird das Bild, ohne das Copyrightzeichen, in den IPTC Daten hochgeladen funktioniert es bestens.

Um es kurz zu fassen, es hat mich einiges an Zeit gekostet den Fehler zu lokalisieren. Ärgerlich war auch, dass nicht in allen von mir untersuchten Webseiten der Fehler auftrat. Ob es an der WordPress Version lag bezweifle ich da ich unterschiedlicher Versionen untersucht habe. Auch der Einfluss von Plugins kann ausgeschlossen werden da ich zuerst alle Plugins im Rahmen der Fehlersuche deaktiviert hatte.

Um in Zukunft solchen Problemen aus dem Weg zu gehen habe ich davon Gebrauch gemacht das Symbol durch Klammern anzudeuten(C).  Laut Wikipedia ist dies eine zulässige Darstellung. Zusätzlich habe ich all meine Fotos per Stapelverarbeitung auf das Zeichen untersucht und ersetzt.

Ich hoffe der Tipp hilft anderen welche in die gleiche Falle tappen. Natürlich brauchen Anwender welche das Copyrightzeichen nicht verwenden sich keine Sorge machen, oder? Auch andere Sonderzeichen sind nach dieser Erfahrung mit Vorsicht zu verwenden. Dies gilt natürlich nicht bei Verwendung des entsprechen Codes im HTML Code.

So erzeugen Sie das Copyright in HTML

HTML ist nicht ganz einfach, wenn es um Sonderzeichen geht. Doch es gibt einen Ausweg: Die so genannten Entities sind zuständig, wenn es um das Anzeigen von Copyright oder anderen Symbolen geht.
In HTML gibt es für das Copyright-Zeichen © ein eigenes Entity. So nennt man spezielle Abkürzungen zum Darstellen von Zeichen, die nicht in allen Zeichensätzen vorhanden sind.
Um in HTML ein Copyright-Zeichen zu erzeugen, geben Sie ein:

©

Alternativ dazu können Sie die Unicode-Nummer des Zeichens verwenden:

©

The post Copyrightzeichen -Fehlerquelle in WordPress Mediathek appeared first on MSR-SUPPORT.

Die Auflösung von Digitalbildern wird immer größer, d.h. Bilder mit 8 bis 10 MB sind heute keine Seltenheit. Bildschirme mit größer 20″ und hochauflösende Mobilgeräte möchten Bilder in guter Qualität abbilden. Im Widerspruch dazu besteht die Forderung nach kurzen Ladezeiten, niemand möchte mehrere Sekunden warten bis sich ein Bild aufgebaut hat.

Die Lösung besteht darin einen guten Kompromiss zu finden.

Maximale Bildgröße für Web-Bilder

Dieses Bild möchte ich im folgenden „Original Web Bild“ (Original) nennen, nicht zu verwechsel mit dem „Original Bild“ auf dem heimischen PC.

Original-Bilder werden je nach Kameratyp und Einstellung in den Formaten 3 : 2, 4 : 3 und 16 : 9 erstellt. Zusätzlich gibt es noch Sonderformate als Panorama. Bei hochwertigen Kameras geht der Trend zum Format 3 : 2, dies entspricht den Sensorformaten und dem alten Negativ Filmformat 24×36. Kleinere Kompaktkameras mit kleinem Sensor tendieren mehr zum Format 4 : 3. Für alle gilt aber, dass eine hohe Auflösung selbstverständlich ist.

Da das Original Web Bild meist erst über ein Kleinbild (Thumbnail) aktiviert und als sogenannte Lightbox im Bildschirm großflächig dargestellt wird, erwartet man relativ große Bilder in guter Qualität.

Leider muss aber auch für dieses Format ein Kompromiss gefunden werden. Es wäre ja ein leichtes das Original-Bild der Kamera mit z.B. 6000×4000 px zu verwenden.  Die damit verbundene Dateigröße von rund 10 MB würde jedoch zu langen Ladezeiten führen. Diese Ladezeit entsteht immer dann, wenn das Minibild vergrößert dargestellt wird.

Meine Empfehlung für die Original-Web-Bilder ist 1600 x 900 px

Änderung Stand Mai 2020: Der von mir ursprünglich verwendete Wert von 1000 x 666 px hat sich überholt. Selbst von Facebook wird inzwischen 1200 px empfohlen. Zusätzlich hat sich die Auflösung der modernen Retsina Displays vergrößert, deshalb habe ich den Wert angepasst.

Das folgende Bild welches im Original 13 MB groß war, wurde beim Upload durch das von mir verwendete Plugin EWWW Image Optimizer auf die dort eingegebene maximale Größe von 1200 x 900 px reduziert und auf 343 KB komprimiert.

Bitte selber mit den folgen Bildern testen!  

Ursprüngliche Testreihe Web-Bilder

Als Beispiel habe ich ein Bild, aufgenommen mit einer Spiegelreflexkamera, als Referenzbild verwendet. Das Original Bild im Format 3 : 2 besitzt 6000 x 4000 Pixel bei einer Dateigröße von rund 8 MB. Wird dieses Bild per Größenänderung in der Fotobearbeitungssoftware auf 1000 x 666 Pixel mit einer JPG Kompression von 60 % reduziert zeigen meine Tests, dass auf den Monitoren das Bild in guter Qualität dargestellt wird. Die Dateigröße wird dabei je nach Fotosoftware auf rund 150 kB reduziert. Bei dieser Anpassung ist zu beachten, dass das Seitenverhältnis unverändert bleibt. Ich denke, dies ist ein guter Kompromiss zwischen Qualität und Dateigröße.

Die Einstellung 1000 x 666 px verwende ich für alle Formate. Dadurch ändert sich zwar die Breite der Bilder, die Höhe bleibt jedoch unabhängig vom Format gleich.

Zusätzlich zu den Original-Web-Bildern werden kleinere Bildformate als Vorschaubilder benötigt. Bei den kleinsten Formaten spricht man von Miniaturbildern bzw. Thumbnails. Zusätzlich zu diesen Bildern in der Größe von 50 bis 150 px kommen weitere Größen je nach Anwendung zum Einsatz.

Bildgrößen der WordPress Mediathek

Bei dem von mir eingesetzten CMS System können die Vorschaubilder unter Einstellungen / Medien für das gesamte System konfiguriert werden. In der Konsequenz bedeutet dies, dass zu jedem Original (Original Web Bild) zusätzliche Vorschaubilder abgespeichert werden. Diese Bilder sind dann per Link mit dem Original-Bild verknüpft.

WordPress Standard Bildgrößen

WordPress ermöglicht 4 Bildformate, Vorschaubild (Thumbnail), Mittel (Medium), Groß (Large) und Vollständig (Full). Nach der Installation stehen diese in den folgenden Größen zur Verfügung:

1. Vorschaubild: 150 x 150 px
2. Mittel: 300 x 300 px
3. Groß: 1024 x 1024 px
4. Vollständige Größe: Originalgröße ist nur auswählbar, wenn das Bild größer als das „Groß“ Format ist.

Die von WP zur Verfügung gestellte Standardeinstellung sollte unbedingt an die jeweilige Anwendung angepasst werden. Die Einstellungen sollten sich dabei stark an dem Layout orientieren. Als Orientierung dient der Content-Bereich. Das „Groß“ Format sollte nicht größer als der Content und das „Medium“ Format maximal die Hälfte des Content-Bereiches nutzen.

Meine Empfehlung zur Einstellung der Bildgrößen in der Mediathek

1. Miniaturbilder 150 x 75 mit der Option „Miniaturbild auf exakte Größe zuschneiden.“
   Die Miniaturbilder werden als Artikelbilder verwendet und sollten möglichst gleich groß sein. Ein Ausschnitt ist bei einem so kleinen Bild zulässig
2. Mittlere Bildgröße 280 x 210. Diese Größe stellt das Bild schon in guter Qualität dar und kann gut in den Textfluss eingepasst werden. Es empfiehlt sich nicht mehr als die Hälfte des Content-Bereiches zu nutzen.
3. Maximale Bildgröße 580 x 435. Damit wird der Content voll ausfüllt und das Bild zentriert verwendet. Ich verwende dieses Format gerne für Panoramabilder.
4. Original Web Bild 1000 x 666 px 1600 x 900 px kommt nur als Lightbox Bild zur Anwendung

Galeriedarstellung von zwei Bildern im Querformat 280 x 210px

Zusätzlich zu diesen Standards verwende ich noch die Formate 135 x 90 und 150 x 150 für Galeriefunktionen mit besserer Darstellung der Vorschaubilder. Um dies zu nutzen, muss jedoch etwas Code ein der function.php eingesetzt werden: Siehe WordPress -Neue Bildgrößen hinzufügen.

Bildformate neu berechnen

Alle vor der Umstellung gespeicherten Bilder bleiben von der Änderung unberührt, sie sind in den alten Formaten gespeichert und soweit verwendet in den Beiträgen entsprechend gespeichert.
Wird nach der Umstellung in der Mediathek ein älteres Bild zum Beispiel im Format „Medium“ eingefügt, wird es zwar in den neuen Abmessungen eingefügt, der Link verweist aber auf das alte Format. Zur Anpassung wird das Bild skaliert, d.h. Höhe und Breite werden entsprechend definiert.

Wie fast immer gibt es für die alten Formate eine Lösung, das Plugin „Regenerate Thumbnails“ übernimmt die Anpassungen aller Bilder die über die WordPress Mediathek hochgeladen wurden. Für jedes neue Format wird zusätzlich zu dem bestehenden Bild ein weiteres erstellt. Die alten Bilder bleiben aber erhalten, um keine Veränderung in den alten Berichten zu kreieren. Nur die Artikelbilder werden, falls das Miniaturformat geändert wurde angepasst, aus meiner Sicht eine sehr gute Lösung.

Wurde zum Beispiel das „Mittel“ Format von 320 x 240 px auf 280 x 210 px geändert so finden wir nun im Upload Ordner zwei Bilddateien:
bildname-320×240.jpg und bildname-280×210.jpg

Anmerkung: Zu den WordPress Bildern der Mediathek, ihrer JPG Kompression und Datengröße werde ich in Kürze noch etwas nachtragen, d.h. einfach wieder vorbeischauen oder abonnieren.

The post Bildgröße und JPG Kompression für Web-Bilder appeared first on MSR-SUPPORT.

Die Bildkomprimierung durch Entfernen der Metadaten wird oft unterschätzt, spielt aber zur Reduzierung der Dateigröße eine wichtige Rolle. Den Einfluss der Metadaten hatte ich bisher noch nicht auf meinem Focus. In den letzten Jahren ging jedoch der Trend zu immer leistungsfähigeren Kameras mit immer größeren Datenmengen. Selbst preiswerte Kompaktkameras liefern Unmengen von Information. Diese versteckten Metadaten (EXIF, IPTC, XMP) können bei hochwertigen Kameras große Datenmengen hervorrufen. Solange man nur das Originalbild betrachtet spielen diese Daten keine große Rolle. Bei kleinen Vorschaubildern wie sie im Web zum Einsatz kommen ist der Overhead dieser Daten jedoch beachtlich.

Als Beispiel habe ich dazu ein Bild, aufgenommen mit einer digitalen Spiegelreflexkamera, analysiert. Das Original-Bild im Format 3:2 besitzt 6000 x 4000 Pixel mit einer Dateigröße von rund 8 MB. Dieses Bild habe ich in einem ersten Schritt, in einer Fotobearbeitungssoftware (ACDSee), auf 1000 x 666 Pixel bei einer JPG Kompression von 80% reduziert. Die Metadaten wurden unverändert mitgeführt. Siehe dazu „Bildgröße und JPG Kompression für Web Bilder„.

Das so generierte Web Bild wurde nun in einer WordPress Applikation in die Mediathek hochgeladen und dabei in die voreingestellten Bildgrößen umgewandelt. (WordPress -Neue Bildgrößen hinzufügen)

Einfluss der Metadaten auf Vorschaubilder unterschiedlicher Größe

Wie anhand der Tabelle zu erkennen ist, steigt der Einfluss der Metadaten bei kleinen Bildern extrem an. Es macht deshalb Sinn, zwecks Optimierung für das Web, überflüssigen Metadaten zu entfernen. EXIF, IPTC und XMP Daten benötigen Speicherplatz, sind aber für die Darstellung von Bildern im Web völlig unnötig und haben keinerlei Einfluss auf die Qualität der jeweiligen Bilder.

Entfernen der Metadaten

Eine Lösung besteht darin, bei der Bildgrößen Reduzierung der Web-Bilder, per Fotobearbeitungssoftware, auch die Metadaten zu entfernen. Teilweise kann man dies in einem Arbeitsschritt erledigen. In einigen Fällen ist auch ein zusätzlicher Arbeitsgang notwendig.

Für bereits nach WordPress hochgeladene Bilder konnte ich keine Lösung finden dies nachträglich zu machen! In diesen Fällen habe ich mir geholfen, indem ich per FTP die Bildverzeichnisse heruntergeladen habe und dann in einem Schritt von allen Bildern die Metadaten entfernt habe. Danach alles wieder per FTP hochgeladen, ein etwas komplizierter Weg. Besser ist der Einsatz von Kompressionstools.

Entfernen der Metadaten per Kompressions-Plugin

Grundsätzliche möchte ich die Metadaten nicht von meinem Web-Bild im Full Format entfernen, da ich die Metadaten z.B. zur Übernahme von Bildbeschreibung, Geodaten usw. nutze. Dieses Bild und seine Informationen möchte ich unverändert im Web speichern. Bei allen zusätzlichen Vorschaubildern sollen jedoch die Metadaten entfernt werden.

Hier drei empfehlenswerte Plugins welche im Rahmen der Bild Kompression auch die Metadaten entfernen, sicherlich eine elegante Lösung:

• Compress JPEG & PNG images -Optimiere deine JPEG- und PNG-Dateien automatisch mit TinyPNG.
• EWWW Image Optimizer -Reduziert Dateigrößen für Bilder innerhalb WordPress
• Optimus -Das Plugin von Sergej Müller komprimiert PNG- und JPG-Dateien automatisch im Hintergrund, wenn sie in die WordPress-Mediathek hochgeladen werden.

Beispiel EWWW Image Optimizer

Wer die Meta-Daten im Full Format des Bildes beibehalten möchte, muss bei den Einstellungen zusätzliche Parameter beachten. Mehr dazu findest du in gesonderten Berichten zu den jeweiligen Plugins.
Alle anderen Anwender müssen nichts beachtet.

The post Bildkomprimierung durch Entfernen der Metadaten EXIF, IPTC und XMP appeared first on MSR-SUPPORT.

Beispiel: JPG Kompression abschalten (100%)

Wer den Parameter JPG Kompression ändern möchte kann mit folgendem Codeschnipsel in der function.php eine Anpassung vornehmen.

add_filter('jpeg_quality', function($arg){return 100;});
add_filter( 'wp_editor_set_quality', function($arg){return 100;} );

Durch Änderung des Wertes 100 kann jeder beliebige Wert der Kompression eingestellt werden.

Wie fast immer gibt es für diese Anwendung Plugins:

• Disable JPEG Compression Deaktivieren der JPEG-Kompression welche standardmäßig aktiviert ist
• WP Resized Image Quality Ändert die JPEG-Kompression hochgeladener Bilder und Miniaturen, per Schieberegler kann unter <Einstellungen/Medien> die Kompression konfiguriert werden.

Wer eine flexible einfache Einstellung sucht wird sicherlich das Plugin WP Resize Image Quality vorziehen!

Hinweis: Durch eine möglichst hohe JPG Kompression bei vertretbaren Bildqualtäten kann die Dateigröße reduziert und damit die Ladezeit der Seite verbessert werden.

Übersicht der Dateigröße in Abhängigkeit von der JPG Kompression

Anmerkung: Bei Q=100% wird die JPG Kompression welche bereits auf das Originalbild angewendet wurde teilweise wieder aufgehoben.

The post WordPress JPG Kompression anpassen appeared first on MSR-SUPPORT.

Bildtexte und deren Upload in die WordPress Mediathek

Rund um die Bilder kommen unabhängig von den EXIF und IPTC Daten vier Texte zur Anwendung. Diese Texte können in der Mediathek manuell eingegeben oder beim upload aus den EXIF bzw. IPTC Daten übernommen werden. Die Übernahme bereits bestehender Texte ist sicherlich die eleganteste Lösung. Profis und ambitionierte Hobbyfotografen haben die Bilder bereits mit Beschreibungen unterschiedlichster Art versehen und es macht keinen Sinn diese Arbeit speziell bei großen Bildermengen doppelt auszuführen (In der WordPress Dokumentation Function Reference/wp read image metadata ist die Übernahme der Metadaten beschrieben).

1) Titel (Title)

In das Feld Titel gehört, die Überschrift des Bildes. Wird in den EXIF bzw. IPTC Daten beim hochladen in die Mediathek keine Information gefunden, wird der Dateiname des Bildes wie z.B. 14033010.JPG verwendet. Diese unschönen Titel sollten unbedingt vermieden werden. Ab WordPress Version 3.5 hat das Textfeld Titel einen Wandel erfahren, früher wanderte dieser Text in das title-Attribut des img-Tags und wurde vom Browser als Tooltip beim überfahren mit der Maus eingeblendet. Dieser Automatismus wird seit WP 3.5 nicht mehr unterstützt. Wer das title-Attribut trotzdem verwenden will kann es sich mit dem Plugin Restore Image Title zurück holen oder nach dem hinzufügen in einen Bericht unter „Erweiterte Optionen“ manuell in das Feld <Bildtitel-Attribut> einfügen. Jürgen Mißfeld empfiehlt in seinem Bericht Bilder: Alt-Text und/oder Title-Text? – Image-Tag Grundlagen es dann zu setzten wenn keine Bildunterschrift angewendet wird.

Reihenfolge der Titeltextes beim hochladen von Dateien (Upload)

Es wird das erste mit Text gefüllte Feld verwendet

1. EXIF Titel
2. IPTC Überschrift
3. IPTC Titel
4. IPTC Bildbeschreibung
5. EXIF Bildbeschreibung
6. Dateiname

2) Beschriftung (Caption)

In das zweite Textfeld gehört die Bildunterschrift. Dieser Text sollte den Bildinhalte beschreiben. Der Text wird je nach verwendetem WordPress-Theme direkt unter dem Einzelbild oder Galeriebild angezeigt, weshalb dieser Text auch nicht zu lang sein sollte. Auch dieses Feld sollte beim Upload in die Mediathek automatisch befüllt werden, falls entsprechende Informationen vorhanden sind. Falls keine Texte gefunden werden bleibt das Feld frei.

Reihenfolge des Beschriftungstextes beim Upload

ACHTUNG: Dies wirkt auf den Beschreibungstext!!!!!

Es wird das erste mit Text gefüllte Feld verwendet

1. EXIF Benutzerkommentar
2. EXIF Bildbeschreibung
3. EXIF Dateikommentar
4. IPTC Bildbeschreibung

ACHTUNG: In der aktuellen WP Version 3.9 funktioniert dieser Upload leider nicht. In der Konsequenz bleibt dieses wichtige Feld leer.

3) Alternativer Text (Alt Text)

Das Attribut alt ist ein Pflichtangabe für jede Grafikeinbindung. Dies ist ein Alternativtext für den Fall, dass die Grafik nicht angezeigt werden kann. Es gibt viele Gründe, warum eine Grafik nicht angezeigt werden kann, z.B. weil der Anwender das Anzeigen von Grafiken in seinem Browser deaktiviert hat, oder weil der Anwender das Laden der Seite abgebrochen hat, bevor die Grafik übertragen wurde. Für diesen Text gibt es keine Übernahmemöglichkeit aus den EXIF/IPTC Daten. Um auch dieses Feld automatisch beim Upload zu befüllen kann man z.B. auf das Plugin Media Library Assistant zurückgreifen. Falls das Feld alt Text nicht befüllt ist wird beim einfügen solcher Bilder in die Berichte automatisch der Text aus Beschriftung bzw. Titel übernommen.

Reihenfolge des Alternativ Textes beim Hinzufügen in den Bericht

1. Beschriftung (caption)
2. Titel (title)

4) Beschreibung (Describtion)

Das Feld Beschreibung ist wohl ein Geheimnis der WP Entwickler! Bei den IPTC Daten gibt es dazu ein Feld mit der Bezeichnung Long Describtion. In dieses Feld können 2000 Zeichen statt 128 Zeichen bei der Beschriftung eingetragen werden. Das longDesc-Attribut wurde im Zusammenhang mit der „Barrierefreiheit für Websites“ eingeführt. Es hat sich allerdings nie durchgesetzt. Es ist bei WP nur relevant falls in den Optionen <Link zur Anhang Seite> gewählt wurde. Statt der Bildunterschrift wird dann die Beschreibung angezeigt. Persönlich kann ich mich damit nicht anfreunden. Ich denke dieses Feld stiftet nur Verwirrung.

Bildtexte optimieren für Suchmaschinen

Wie in der Einleitung schon beschrieben sind Bildtexte für Suchmaschinen wichtig Faktoren. In dem Bericht Bilder optimieren für Google Bildersuche von Matin Mißfeldt wird dieses Thema ausführlich beschrieben. In der von ihm entwickelten Checkliste steht z.B. die Bildbeschreibung auf Rang 1, da die Bildbeschreibung unmittelbar beim <img> Tag platziert ist.

Checkliste von Martin Mißfeldt – Methoden zur Optimierung von Bildern

• 1. keyword vor und nach dem <img> tag.
• 2. keyword in der URL des Bildes
• 3. keyword in Links auf der Seite
• 4. keyword im Titel der Seite
• 5. keyword in der Überschrift (<h1>, <h2> oder <h3>)
• 6. keyword in der URL der Seite
• 7. keyword im <Alt> tag des Bildes
• 8. keyword <strong>

Mehr zu diesem Thema können Interessierte direkt bei Martin Mißfeldt nachlesen.

Bildtexte mit minimalem Aufwand anwenden

Zur Bild bzw. Fotoverwaltung gibt es einige leistungsstarke Fotoprogramme. Lightroom oder ACDSee wären hier als Beispiele zu nennen. Da ich ACDSee wie schon mehrfach beschrieben zu meinem Favoriten auserkoren habe hier meine Empfehlung:

1. Überschrift und Bildbeschreibung der IPTC Daten in ACDSee (oder anderem Fotoprogram) verwalten. Per Stapelverarbeitung können dort z.B. aus den GPS Daten Aufnahmeorte in diese Felder übernommen werden.
2. Da die Beschriftung nicht wie dokumentiert automatische aus den IPTC Daten übernommen wird empfehle ich das Plugin Media Library Assitant zu installieren.
3. In dem Plugin Media Library Assistant IPTC/EXIF, wie im Bild dargestellt, einstellen.
4. Nach dem upload in die WordPress Mediathek wird dann als Titel die IPTC Überschift und Alt-Text, Beschriftung und Beschreibung die IPTC Beschreibung automatisch übernommen.
5. SEO Test mit dem WordPress SEO Plugin von Yoast. Dort wird der alt-text auf richtige Verwendung geprüft.

The post Bildtexte in WordPress richtig anwenden appeared first on MSR-SUPPORT.

Update des Originalberichts

In der Mediathek wurde die Option Upload-Ordner entfernt. Die aktuellen Einstellungen erlauben nur noch den Upload in Jahres/Monats/ Ordner. Persönlich nutze ich dies jedoch nicht da die Ablage im Jahres/Monats Ordner zu unübersichtlich ist. Meine Bilder werden deshalb alle in dem übergeordneten upload Ordner gespeichert. Die Suche nach einzelnen Bilder ist dort einfacher möglich.

Origial-Bericht „WordPress Mediathek –Finger weg vom Uploadordner“

Die Mediathek von WordPress (WP 3.3.1 und älter) ist sicherlich noch nicht das Gelbe vom Ei! Zwar wurde laufend verbessert, von einer guten Datenbasis für Medien ist man leider noch weit entfernt.

Trotzdem ist die Mediathek inzwischen tausendfach eingesetzt und für den Normalanwender zufriedenstellend zu handhaben. Werden jedoch hunderte von Medien, häufig Fotos in einer Webanwendung verwendet ist Vorsicht angesagt.

Ein Beispiel welches mir einigen Ärger eingebracht hatte möchte ich hier darstellen. Hintergrund der Problematik ist, dass ich nicht wie als Standard bei WP vorgesehen meine Medien in monats- und jahresbasierten Ordnern ablegen wollte.
Diese Ablage war mir zu unübersichtlich und ich habe mich zu einer Ablage auf Jahresbasis entschieden. Klingt recht einfach, ist auch in den Einstellungen der Mediathek einfach einstellbar. Dort wird im Feld <Uploads im folgenden Ordner speichern> die Grundeinstellung um das Jahr ergänzt. Beispiel: wp-content/uploads/2011 (zusätzlich die Option Organisation in Jahr und Monat deaktivieren).

In 2011 hatte ich damit auch keine Probleme. Im neuen Jahr aber nun die Überraschung, nach Änderung der Jahreszahl auf 2012 (wp-content/uploads/2012 ) waren alle Miniaturbilder in der Mediathek verschwunden. Bei der weiteren Untersuchung des Fehlers gab es noch eine zusätzliche Überraschung. Die Bild URL der Bilder aus 2011 hatte sich auf 2012 geändert. Da die Bilder aber nach wie vor im Ordner 2011 lagen, hat dies für die alten Verknüpfungen keine Bedeutung. Nur bei Neuverwendung von Bildern aus früheren Jahren stimmt der Link nicht.

Meine Empfehlung: Finger weg von den Einstellmöglichkeiten im Bereich Dateien Hochladen

Darstellung der Fehlerquellen in der Mediathek

The post WordPress Mediathek –Finger weg vom Uploadordner appeared first on MSR-SUPPORT.

ACHTUNG:

• Unschön ist, dass bei der Verlinkung auf das Großformat die dort zu verwendende Bildbeschriftung im Menü <Erweiterte Einstellungen> erst nach dem Einfügen des Bildes in einen Bericht möglich ist. Also nicht vergessen sonst ist das Bild ohne Beschriftung!
• Falls das Feld Beschriftung nicht ausgefüllt wird, wird auch der Rahmen (Caption) nicht dargestellt, also nicht vergessen.
• Zusätzlich ist zu Beachten, das bei Bildern welche mit Meta Daten versehen sind (EXIF, IPTC) Bildinformationen automatisch übernommen werden. Aber auch dort liegt einiges im Argen! Wichtige Informationen für den  Alternativtext und die Bildbeschriftung können nicht übernommen werden und müssen einzeln hinzugefügt werden (siehe auch IPTC Metadaten nützliche Texte in den Bilddateien).

ANMERKUNG:

Das Attribut alt ist Pflichtangabe für jede Grafikeinbindung. Dies ist ein Alternativtext für den Fall, dass die Grafik nicht angezeigt werden kann. Es gibt viele Gründe, warum eine Grafik nicht angezeigt werden kann, z.B. weil der Anwender das Anzeigen von Grafiken in seinem Browser deaktiviert hat, oder weil der Anwender das Laden der Seite abgebrochen hat, bevor die Grafik übertragen wurde. Wenn Sie ihre Grafiken mit erklärenden Tooltips title versehen wollen, nutzen Sie das Attribut title.

TIPP:

• Um es sich einfach zu machen verwende ich für Zeile 1-3 den gleichen Text, den Titel für das Bild. Es sollte kurz und Aussagekräftig sein. Bei längerem Text diesen für die Beschriftung einsetzten. Die Beschriftung und die Bildbeschriftung für das Großformat gleich wählen.
• Beschreibung Zeile 4 kann aus meiner Sicht entfallen, der Sinn ist mir nicht klar

The post WordPress 3.1 Mediathek –Bildtexte sorgen für Verwirrung appeared first on MSR-SUPPORT.