Egal, ob es um einen Blog, einen Content-Hub oder um die Online-Ausgabe einer Zeitung geht: Bilder sind wichtig. Sie lockern Texte auf, können komplexe Sachverhalte anschaulich darstellen und sogar SEO-Vorteile bringen. Die folgenden Tipps vereinfachen die effiziente Verwendung von Bildmaterial - online:
1. Bildgröße, Part I
Gemeint ist die Dateigröße, also das, was wirklich Ladezeit kostet. Sagenhaft große und hochauflösende Displays machen´s möglich: Auf fast jeder Webseite wird mit Großformatigem hantiert. Schnell werden ein paar Megapixel dann plötzlich zu Megabyte. GrafikerInnen, die aus dem Printbereich kommen, können vielleicht nicht alle etwas mit "Webausrichtung" anfangen, daher lohnt es sich häufig, eine spezielle Schulung zu spendieren. Obacht! Komplexer Prozess, simplifiziert: Geringe Dateigröße sorgt für geringe Ladezeit sorgt für glückliche Suchmaschine sorgt für besseres Ranking.
2. Bildgröße, Part II
"Dein Profilbild sollte idealerweise Maße von 500 x 500 px aufweisen." Das ist zwar eine Empfehlung, an die zu halten sich jedoch lohnt. Bilder, die in einer höheren Auflösung als benötigt hochgeladen werden, müssen vom Browser skaliert werden. Das kostet nicht nur Rechenleistung und Zeit, sondern kann auch seltsame Nebenwirkungen haben (Stichwort: Eierkopf). Aus dpi (dots per inch - Print) werden auf dem Bildschirm nähmlich ppi (pixel per inch - Display) und darüber können mächtig Bytes gespart werden.
3. Dateiformat
Das Format sollte, je nach Bildinhalt, passend gewählt werden. Logos können meist als PNG oder GIF gespeichert und hochgeladen werden, während bei Fotos meist JPG das Format der Wahl ist. Beim Speichern der Bilder kann mit professionellen Tools die Kompressionsstufe gewählt werden, was, richtig geraten, wieder die Dateigröße beeinflusst.
4. Dateiname
Dieser sollte möglichst beschreibend sein, und dabei auf Sonderzeichen verzichten.
5. Alt-Attribut
Dieses sollte ebenfalls eine Kurzbeschreibung dessen beinhalten, um was es auf dem Bild geht. Das "Alternative"-Attribut wird in diversen Situationen herangezogen, z.B. von Screenreadern für Blinde, aber auch von Suchmaschinen. Umgangssprachlich auch gern "Alt-Tag" genannt.
6. Bildunterschriften (Captions)
Suchmaschinen können Bilder nicht "lesen". Sagt man so. Korrekterweise müsste es heißen: Sie wollen es nicht - aus Ressourcen-Gründen. Daher vergibt man Bildunterschriften, die das Geschehen den Suchmaschinen "erklären" können.
7. GIFs
Durchaus eine nette Abwechslung zu Standard-Bildern, GIFs sind extrem populär, warum also nicht davon profitieren. Trotzdem sollte man es nicht übertreiben: Denn GIFs können durch ihre Bewegungen den Lesefluss stören und, bei großen Dateien, die Ladezeit der Seite verlängern.
1. Bildgröße, Part I
Gemeint ist die Dateigröße, also das, was wirklich Ladezeit kostet. Sagenhaft große und hochauflösende Displays machen´s möglich: Auf fast jeder Webseite wird mit Großformatigem hantiert. Schnell werden ein paar Megapixel dann plötzlich zu Megabyte. GrafikerInnen, die aus dem Printbereich kommen, können vielleicht nicht alle etwas mit "Webausrichtung" anfangen, daher lohnt es sich häufig, eine spezielle Schulung zu spendieren. Obacht! Komplexer Prozess, simplifiziert: Geringe Dateigröße sorgt für geringe Ladezeit sorgt für glückliche Suchmaschine sorgt für besseres Ranking.
2. Bildgröße, Part II
"Dein Profilbild sollte idealerweise Maße von 500 x 500 px aufweisen." Das ist zwar eine Empfehlung, an die zu halten sich jedoch lohnt. Bilder, die in einer höheren Auflösung als benötigt hochgeladen werden, müssen vom Browser skaliert werden. Das kostet nicht nur Rechenleistung und Zeit, sondern kann auch seltsame Nebenwirkungen haben (Stichwort: Eierkopf). Aus dpi (dots per inch - Print) werden auf dem Bildschirm nähmlich ppi (pixel per inch - Display) und darüber können mächtig Bytes gespart werden.
3. Dateiformat
Das Format sollte, je nach Bildinhalt, passend gewählt werden. Logos können meist als PNG oder GIF gespeichert und hochgeladen werden, während bei Fotos meist JPG das Format der Wahl ist. Beim Speichern der Bilder kann mit professionellen Tools die Kompressionsstufe gewählt werden, was, richtig geraten, wieder die Dateigröße beeinflusst.
4. Dateiname
Dieser sollte möglichst beschreibend sein, und dabei auf Sonderzeichen verzichten.
5. Alt-Attribut
Dieses sollte ebenfalls eine Kurzbeschreibung dessen beinhalten, um was es auf dem Bild geht. Das "Alternative"-Attribut wird in diversen Situationen herangezogen, z.B. von Screenreadern für Blinde, aber auch von Suchmaschinen. Umgangssprachlich auch gern "Alt-Tag" genannt.
6. Bildunterschriften (Captions)
Suchmaschinen können Bilder nicht "lesen". Sagt man so. Korrekterweise müsste es heißen: Sie wollen es nicht - aus Ressourcen-Gründen. Daher vergibt man Bildunterschriften, die das Geschehen den Suchmaschinen "erklären" können.
7. GIFs
Durchaus eine nette Abwechslung zu Standard-Bildern, GIFs sind extrem populär, warum also nicht davon profitieren. Trotzdem sollte man es nicht übertreiben: Denn GIFs können durch ihre Bewegungen den Lesefluss stören und, bei großen Dateien, die Ladezeit der Seite verlängern.
