Bilder und Grafiken

Auf dieser Seite finden Sie Informationen zu Seitenverhältnissen und Besonderheiten von Bildern und Grafiken. Für den neuen Webauftritt der FAU werden die Bilder hauptsächlich in den Seitenverhältnissen 3:2 (<1094 x 729 px) oder 16:9 (<1920 x 1080 px) abgebildet. Die Auflösung der Bilder sollte zwischen 72 bis 150 dpi liegen und die Dateigröße von 350 kb nicht überschreiten.

Zulässige Dateiformate

.jpeg, .webp, .png, .svg

Speichern Sie Fotos grundsätzlich im JPEG- oder WebP-Format.

WebP ist ein modernes Bildformat, das kleinere Dateigrößen bei hoher Qualität ermöglicht. Es unterstützt Transparenz und Animationen und sorgt für schnellere Ladezeiten ohne sichtbare Qualitätsverluste.

Infografiken und ähnliche Grafiken speichern Sie im PNG-Format, Logos möglichst im SVG-Format.

Seitenverhältnisse für Bilder und Header

Header/Hero für Fakultäten, Departments, Lehrstühle, Institute und Kooperationen

  • Seitenverhältnis 16:9
  • Für das Format 1:1 in Mobile und Desktop wird automatisch ein Ausschnitt des Bildes ausgegeben. Der Fokuspunkt für den gewünschten Bildausschnitt wird in WordPress manuell festgelegt.

Header Inhaltsseiten

  • Seitenverhältnis 16:9
  • Im Desktop wird automatisch ein Ausschnitt dieses Bildes im Format 2,35:1 ausgegeben.

Header Beiträge

  • Seitenverhältnis 3:2 für alle Endgeräte

Bilder

  • Seitenverhältnis 3:2
  • Für eine optimale und ansprechende Darstellung sollen alle Bilder in diesem Format angelegt werden.
  • Bisher angelegte Bilder, die diesem Format nicht entsprechen, werden mit einem grauen Hintergrund ausgefüllt und können weiterhin verwendet werden.
  • Inhaltsbilder können auch im Hochformat ausgegeben werden, mit einer maximalen Breite von 355 px.

Galerien

  • Seitenverhältnis 3:2
  • Bei Bildern, die dem Format nicht entsprechen, wird ein neutraler grauer Hintergrund hinzugefügt.

Teaser Grid

  • Seitenverhältnis 3:2 bei allen Endgeräten
  • Die Bilder werden automatisch aus dem hinterlegten Headerbild des jeweiligen Beitrags gezogen.

Portalmenü

  • Seitenverhältnis 3:2 auf einer Inhaltsseite
  • Die Bilder werden automatisch aus dem hinterlegten Headerbild des jeweiligen Beitrags gezogen.

Listen

  • Seitenverhältnis 16:9 auf allen Endgeräten
  • Die Bilder werden automatisch aus dem hinterlegten Headerbild des jeweiligen Beitrags gezogen.

Kontakte und Zitate

  • Mobil: Seitenverhältnis 4:3
  • Desktop und Tablet: Seitenverhältnis 1:1

Handlungsaufforderung (CTA)

  • Mobil: Seitenverhältnis 4:3
  • Desktop und Tablet: Seitenverhältnis 1:1

Tipps für bessere Bilder

  1. Stellen Sie sicher, dass Ihnen Bilder in einem bereits ausreichend großen Format und geeigneter Auflösung bereitgestellt werden!
  2. Wenn Sie nach geeignetem Bildmaterial für Ihre Website suchen, schauen Sie sich doch einmal auf Picdrop um.
  3. Sie können die Bilder anschließend in einem Bildbearbeitungsprogramm, wie zum Beispiel GIMP, oder direkt in der Mediathek über den Button „Bild bearbeiten“, herunterskalieren.
  4. Skalieren Sie kleine Bilder nicht hoch, es kommt sonst zu Qualitätsverlust.