Bilder

Anwendungen

Bilder im Content-Bereich

Bilder können auf zwei verschiedene Arten mit der Text/Bild-Komponente eingefügt werden.

Bilder im Teaser

Bilder in einem  Teaser stehen immer über dem Teasertitel. Teaser-Komponente

Bild über dem Seitentitel

Das Bild wird im Intro-Bereich definiert.

Bild im Lead-Bereich einer Übersichts-Seite

Das Bild wird im Intro-Bereich definiert.

Bild in der Linkliste einer Übersichts-Seite

Das Bild steht unterhalb des Titels der Linkliste. Linkliste-Komponente

Hintergrundbild im Seitenkopf (key visual)

Ein Hintergrundbilder im Seitenkopf kann nur das ZI-Support-Team einfügen. Erstellen Sie eine Supportanfrage und legen Sie das gewünschte, unbearbeitete Bild bei.

Bildgrössen

Abhängig vom Einsatzbereich gelten folgende maximalen Bildbreiten (die Bildhöhe ist beliebig):

Content Inhaltsseite dreispaltig 460 px
Content Inhaltsseite zweispaltig 700 px
Content Inhaltsseite einspaltig 900 px
Teaser (fix) 200 px
Bild über dem Seitentitel einer dreispaltigen Seite (fix) 460 px
Bild im Leadbereich einer Übersichts-Seite (fix) ohne Text / mit Text 460 px / 220 px
Bild in einer Linkliste einer Übersichts-Seite (fix) 220 px

Hinweis:
Viele Bildschirme haben heute eine sehr hohe Auflösung (> 200 dpi). Damit können Text und Bilder schärfer dargestellt werden. Um dies optimal auszunützen, können Sie Bilder grösser platzieren, als efektiv angezeigt, z.B. in der doppelten Bildbreite: 920 px statt 460 px. Dadurch nimmt aber die Dateigrösse zu.

Bildquellen

Die Abteilung Kommunikation unterhält eine Fotosammlung, v.a. von UZH-Gebäuden und Personen. Dort sind auch weitere Bildquellen aufgeführt.

UZH Fotosammlung und weitere Bildquellen

Bildbearbeitung

Bevor Bilder in Magnolias Asset-Verwaltung hochgeladen werden, sollten sie aufbereitet werden. Mindestens die Bildgrösse in Pixel sollte dem Verwendungszweck entsprechen, also nicht extrem viel grösser sein. Dies machen Sie am besten in einem Bildbearbeitungsprogramm.

Reduzieren Sie die Masse (Breite und Höhe) auf die benötigten Werte (siehe Kapitel «Bildgrössen» weiter oben). Beachten Sie auch den Hinweis auf die hochaufgelösten Monitore.

Bildformate

JPEG (Dateiendung .jpg): das verbreitetste Format, funktioniert auf allen Webbrowsern. Optimal für Bilder mit Farbverläufen, z.B. Fotos. Kann aber auch für alle Bilder verwendet werden, z.B. Grafiken.

GIF (Dateiendung .gif): altes Format, v.a. für Grafiken mit homogenen Flächen geeignet, z.B. Diagramme. Bekannt auch durch die GIF-Animation: mehrere Bilder können hintereinander abgespielt werden, ähnlich zu einem Zeichentrickfilm. Die GIF-Animation funktioniert aber nicht auf allen Webbrowsern.

PNG (Dateiendung .png): neueres Format, gedacht als Ersatz für JPEG. Weit verbreitet, funktoniert aber oft nicht auf älteren Webbrowsern. Es erlaubt Transparenz.