Webkit Vorgaben Guidelines für Bilder
Die Bildsprache ist ein zentrales Element von Webseiten in den universitäteren Webkits . Dabei sollten bei der Bildauswahl und -gestaltung einige wichtige Aspekte beachtet werden.
Bildnachweise
Vor der Verwendung eines Bildes auf den Webseiten der Universität ist zu klären, ob es für diesen Zweck verwendet werden darf. Wurde das Foto von Angehörigen der Universität im Auftrag der Einrichtung erstellt, ist die Nutzung erlaubt und kein Bildnachweis notwendig. Wurde das Bild hingegen bei externen Fotograf:innen beauftragt, oder stammt es aus einer externen Quelle, müssen die Nutzungsrechte geklärt sein. In den meisten Fällen ist hier ein Bildnachweis zwingend erforderlich.
Die Angabe des Bildnachweises erfolgt im Bildelement des Webkits in den Feldern Bildnachweise (Credits) und ggf. Link zum Bildnachweis. Die Inhalte dieser Felder werden automatisch auf allen Webseiten, die das Bild verwenden, direkt unterhalb des Bildes sowie im schwarzen Footer angezeigt.
Bildbeschreibungen
Bildbeschreibungen setzen Bilder in einen Kontext und ermöglichen es Besucher:innen der Webseiten, den Bildinhalt auch inhaltlich zu erfassen. Daher sollten für alle Bilder Bildbeschreibungen verfasst werden. Diese werden beim Bildelement selbst im Feld Bildbeschreibung eingefügt und automatisch auf allen Webseiten unterhalb des Bildes angezeigt. Ausnahme bilden dabei Verwendungen des Bildes als Schmuckelement (z.B. in Heros, Teasern, Maxi-Bannern, etc), in denen das Bild keinen Inhalt, sondern einen ersten Eindruck eines Themas vermitteln soll, welches dann im Verlauf der Seite bzw. auf der verlinkten Seite genauer behandelt wird.
Realbild und Qualität
Die Universität Heidelberg verwendet vornehmlich Realbild-Aufnahmen, da diese die universitären Einrichtungen authentisch darstellt. Auch als „Schmuckbild“ oder „Symbolbild“ lassen sich in der Regel passende Fotos finden oder herstellen. Ausnahmen gibt es natürlich, wenn wichtige Aufnahmen aus Software übernommen werden, etwa aus elektronenmikroskopischen Aufnahmen bei Forschungsergebnissen oder wenn ausdrücklich zur Wiedererkennung eine bestimmte Grafik im Bild gefordert ist. Selbstverständlich sollten für Realbilder grundsätzlich gut erkennbare Aufnahmen verwendet werden - die Qualität des Fotos ist hier also entscheidend. Folgende Empfehlungen gelten für Bilder im Webkit:
- Format 16:9 - 1920 x 1080 px, 300 dpi
- Format 21:9 - 2520 x 1080 px, 300 dpi
- Format 3:4 - 750 x1000 px, 300 dpi
Responsivität
Grundsätzlich muss bei der Auswahl von Bildern an den Fokuspunkt gedacht werden. Die Uni-Webkits sind responsiv, d.h. Bildausschnitte und Textbreiten passen sich automatisch an das Endgerät an, mit dem Nutzende die Seite aufrufen. Mit dem Hochladen der Bilddatei und der Eingabe der Metadaten (Admin-Titel, Bildbeschreibung, Credits etc.) muss der Fokuspunkt des Bildes sowohl für Quer- als auch für Hochformat passend festgelegt werden. In der Bearbeiten-Ansicht des Bildes lässt sich eine Vorschau anzeigen, in der geprüft werden kann, ob der zuvor festgelegte Fokuspunkt für alle möglichen Formate im Webkit passend ist. Nach jeder Fokuspunkt-Verschiebung ist das Abspeichern des Bildes erforderlich, um die Vorschau zu aktualisieren.
Bildcollagen
Insbesondere das Hero-Bild ist der wichtigste „Eyecatcher“ auf der Startseite einer Einrichtung, also auf der digitalen Visitenkarte. Bildsprachlich steht hier die Authentizität im Vordergrund, daher sollte auf zusammengefügte Bilder verzichtet werden. Außerdem kann eine Bildcollage oft nicht vollständig dargestellt werden, wenn der Bildausschnitt je nach Endgerät und Browserfenstergröße automatisch verändert wird (Responsivität). Manchmal gibt es Ausnahmen: Die Abbildung von Bildcollagen, welche in identischer Fassung ursprünglich als Printprodukt hergestellt wurden (Plakat, Flyer, Titelblatt), können mitunter eingesetzt werden, um z.B. im Rahmen von Veranstaltungsankündigungen einen Wiedererkennungswert zu schaffen. Hier wird dann das Ursprungsbild referenziert. In Einzelfällen sollten Bildredaktion und Webkit-Team zurate gezogen werden, um zu klären, welches Bild im Webkit sinnvoll erscheint.
Grafiken
Für manche Themen eignen sich Grafiken am besten, um Informationen zu illustrieren (z.B. in den Naturwissenschaften). Dabei sind einige Aspekte zu beachten: Detailreiche Bilder können auf den (informationslastigeren) Contentseiten verwendet, aber nicht in Teaserbildern oder im Hero genutzt werden. Zudem sind Beschreibungstexte innerhalb von Bildern nicht empfehlenswert, da die entsprechenden Bilder die Anforderungen an die Barrierefreiheit nicht mehr erfüllen. Sollte es unabdingbar sein, Schrift im Bild zu übernehmen, so muss die barrierefreie Bildbeschreibung ausführlich die Inhalte erklären. Für Grafiken gilt außerdem: Die Bildqualität muss stimmen, und die Grafik sollte in sich klar aufgebaut sowie gut erkennbar sein und professionell wirken.
Stockbilder
Bei der Nutzung von Stockbildern ist zu bedenken, dass diese häufig im Netz auf verschiedensten Webseiten in sehr unterschiedlichen Kontexten genutzt werden. Das bedeutet, das ein Stockfoto, welches ggf. von einer universitären Einrichtung genutzt wird, zugleich von jeder beliebigen Person oder durch ein Unternehmen auf anderen Internetseiten verwendet werden kann. Das kann in Einzelfällen zu Irritationen oder auch unbeabsichtigten Kontexten führen. Weiterhin ist bei Stockbildern die rechtliche Komponente nicht immer eindeutig, es sollte in jedem Fall der Kontakt zur Rechtsberatung im Dezernat 1 der Universität Heidelberg gesucht werden.
KI-generierte Bilder
Soweit möglich sollte auf KI-generierte Bilder verzichtet werden, da diese häufig eine nicht-authentische Anmutung haben oder sogar fehlerhaft sind. Außerdem ist die Generierung und Verwendung dieser Bilder rechtlich unsicher, da KI-Trainingsbilder meist ungeklärter Herkunft sind und ohne Absprache mit dem Urheber verwendet werden. In Ausnahmefällen können durch KI verfremdete Bilder verwendet werden, für deren Original die Universität oder eine Einrichtung die Rechte besitzt. Dann ist im Titel des Bildes zu vermerken, dass es sich um ein KI-generiertes Bild handelt, etwa mit dem Zusatz „KI-generiert“. Sollten Zweifel bestehen, ob ein ausgewähltes Bild dem Corporate Design der Universität Heidelberg entspricht, setzen Sie sich bitte mit der Bildredaktion in Verbindung.
