IMAREAL + MEMO WIKI

Medienbibliothek

In der Medienbibliothek verwaltet WordPress Bilder, PDFs und andere Dateien, die auf der Website verwendet werden. Sie ist im Backend unter Medien erreichbar.

Einmal hochgeladene Medien können anschließend an verschiedenen Stellen der Website verwendet werden. Deshalb sollte bereits vor dem Hochladen auf geeignete Dateinamen, Abmessungen und Dateigrößen geachtet werden.

Hinweis: Dateinamen sind insbesondere auch in der Google Bildersuche von Bedeutung und daher ein relevanter Faktor für Suchmaschinenoptimierung (SEO).

Medien hochladen#

Neue Dateien können unter Medien → Datei hinzufügen hochgeladen werden. Alternativ können Bilder und andere Medien auch direkt beim Bearbeiten eines Inhalts ausgewählt und hochgeladen werden. Bereits vorhandene Dateien sollten nach Möglichkeit wiederverwendet und nicht ein zweites Mal hochgeladen werden.

Bilder vorbereiten#

Bilder sollten vor dem Hochladen in einem geeigneten Grafikprogramm für die Verwendung im Web vorbereitet werden.

Insbesondere hochauflösende Fotos von Kameras oder Smartphones sind für eine Website häufig wesentlich größer als notwendig. Eine unnötig große Bilddatei benötigt mehr Speicherplatz und verlängert vor allem die Ladezeit der Website.

Entscheidend sind dabei zwei Größen:

Bildabmessungen
Die Breite und Höhe des Bildes in Pixel, beispielsweise 1600 × 900 Pixel.

Dateigröße
Der tatsächlich benötigte Speicherplatz der Datei, beispielsweise 250 KB oder 2 MB.

Ein Bild sollte nicht wesentlich größer gespeichert werden, als es für die Darstellung auf der Website benötigt wird. Gleichzeitig sollte die Qualität ausreichend hoch bleiben, damit keine sichtbaren Kompressionsartefakte entstehen. Die nachfolgende Empfehlungen stellen eine gute Basis für die Aufbereitung von Bildern dar:

  • Großformatige Bilder, die über die gesamte Browser-Breite dargestellt werden soll, sollten auf maximal 2.000 Pixel Breite skaliert werden
  • Bilder, die Content-Bereich eingebracht werden und die etwa die halbe Breite einnehmen, sollten auf 1.000 Pixel Breite skaliert werden.
  • Dementsprechend sind für kleinere Darstellung Skalierungen auf 300, 500 oder 800 Pixel Breite empfehlenswert.
  • Die Kompression (Qualität) für JPG-Bilder sollte auf 80% bis 90% eingestellt werden.

Auf der Website wurden insbesndere die Formate verwendet:

Team: 600 × 450 Pixel (Breite x Höhe)
Aktuelles: 770 x 420 Pixel (Breite x Höhe)
Research: 2000 Pixel (Breite)

Bildformate#

Für normale Fotos eignet sich in der Regel JPEG/JPG. Dieses Format ermöglicht bei Fotos ein gutes Verhältnis zwischen Bildqualität und Dateigröße.

PNG eignet sich insbesondere für Grafiken, bei denen Transparenz benötigt wird. Bei Fotos entstehen damit meist unnötig große Dateien.

Moderne Formate wie WebP können bei vergleichbarer Qualität kleinere Dateien ermöglichen. Welches Format verwendet wird, sollte sich jedoch auch an den bereits auf der Website verwendeten Medien orientieren.

Andere Grafikformate (zum Beispiel GIF) sollten nicht verwendet werden.

Dateinamen#

Dateien sollten bereits vor dem Hochladen einen verständlichen und eindeutigen Dateinamen erhalten.

Statt beispielsweise:

IMG_8472.jpg

ist ein beschreibender Name wie:

workshop-krems-2026.jpg

sinnvoller.

Empfohlen werden kurze Dateinamen mit Kleinbuchstaben und Bindestrichen. Leerzeichen, Umlaute und Sonderzeichen dürfen nicht verwendet werden. Das gilt ebenso für PDFs und andere Dokumente.

PDFs und Dokumente#

Neben Bildern können über die Medienbibliothek auch PDFs und andere unterstützte Dateitypen bereitgestellt werden.

Auch hier sollte vor dem Hochladen geprüft werden:

  • Ist die Datei tatsächlich für die Veröffentlichung bestimmt?
  • Ist der Dateiname verständlich?
  • Ist die Dateigröße angemessen?
  • Enthält das Dokument die richtige und aktuelle Version?

Bei einer aktualisierten Version eines bereits veröffentlichten Dokuments sollte nicht automatisch eine zusätzliche Datei hochgeladen werden. Je nach Anwendungsfall kann die bestehende Datei ersetzt werden, damit vorhandene Verknüpfungen weiterhin funktionieren.

Titel und Beschriftung#

Nach dem Hochladen können für ein Medium zusätzliche Informationen hinterlegt werden.

Der Titel dient zur Bezeichnung des Mediums innerhalb von WordPress und kann – abhängig von der jeweiligen Verwendung – auch an anderer Stelle ausgegeben werden.

Eine Beschriftung (Caption) ist ein Text, der zusammen mit einem Bild auf der Website angezeigt werden kann. Sie eignet sich beispielsweise für eine kurze Bildbeschreibung oder einen Bildnachweis. Ob und wo eine Beschriftung tatsächlich angezeigt wird, hängt davon ab, wie das Bild auf der jeweiligen Seite eingebunden ist. Auf der Seite der Inhalts-Berbeitung kann man bei Beiträgen ein Beitragsbild hochladen bzw. aus der Medienbibliothek hochladen. Zu diesem Bild lässt sich eine Bildbeschreibung ausgeben, die entweder vom Bild selbst stammt, oder aber auf der entsprechenden Beitrags-Bearbeitungs-Seite bei der Auswahl des Bildes angegeben werden kann.

Alt-Texte#

Für Bilder sollte ein sinnvoller Alternativtext (Alt-Text) eingetragen werden. Der Alt-Text beschreibt den relevanten Inhalt bzw. Zweck eines Bildes. Er ist insbesondere für die Barrierefreiheit wichtig, da Screenreader diese Information verwenden können, wenn das Bild selbst nicht wahrgenommen werden kann. Ein guter Alt-Text ist kurz und beschreibt, was für das Verständnis des Inhalts relevant ist.

Bei einem Porträt könnte beispielsweise der Name der abgebildeten Person ausreichen. Bei einem inhaltlich relevanten Foto sollte beschrieben werden, was darauf zu sehen ist. Rein dekorative Bilder benötigen nicht zwingend eine inhaltliche Beschreibung.

Medien ersetzen#

Auf der IMAREAL-Website kann eine bereits vorhandene Mediendatei mithilfe des Plugins Admin and Site Enhancements (ASE) ersetzt werden. Das ist besonders praktisch, wenn beispielsweise eine aktualisierte Version eines PDFs oder Bildes bereitgestellt werden soll. Statt eine neue Datei hochzuladen und anschließend alle Verknüpfungen auf der Website zu ändern, kann die bestehende Mediendatei ersetzt werden. Dabei ist besondere Vorsicht geboten: Wird eine Datei ersetzt, betrifft dies grundsätzlich alle Stellen der Website, an denen diese Mediendatei verwendet wird.

Aufgerufen wird die Funktion nach Auswahl der Media-Datei in der Medienbibliohek, die ersetzt werden soll > Weitere Details bearbeiten.

Medien löschen#

Nicht mehr benötigte Dateien können aus der Medienbibliothek gelöscht werden.

Vor dem Löschen muss jedoch sichergestellt werden, dass die Datei nirgendwo mehr auf der Website verwendet wird. Das Löschen eines Mediums kann ansonsten dazu führen, dass auf bestehenden Seiten Bilder fehlen oder Links zu Dokumenten nicht mehr funktionieren.

Im Zweifel sollte eine bestehende Datei daher nicht gelöscht werden.

Captions bei Beitragsbildern#

Für die Ausgabe von Beschriftungen bei Beitragsbildern (Featured Images) wird auf der IMAREAL-Website zusätzlich das Plugin FSM Custom Featured Image Caption verwendet.

Damit können auch für Beitragsbilder entsprechende Bildinformationen bzw. Captions hinterlegt und auf der Website ausgegeben werden. Bei Bildern, für die ein Bildnachweis oder eine andere Beschriftung erforderlich ist, sollte daher darauf geachtet werden, dass die entsprechenden Angaben vollständig eingetragen sind. (Medien > Bild auswählen > Bildbeschriftung)