@ COPYRIGHT www.mein-webauftritt.de

Individuelle Gestaltung von Webauftritten Mein Webauftritt

Themen

Einsatz von Bilder und Grafiken im Web

"Ein Bild sagt mehr als 1000 Worte" (P. J. Reuter)

Diese Metapher für den Mehrwert von Bildern oder Grafiken gegenüber textlichen Erläuterungen gilt insbesondere für das Internet. Sehr oft bleiben Internetnutzer nur für wenige Sekunden auf einer Webseite: Es sei denn, der Besucher findet in dieser kurzen Zeit ihn interessierte Informationen. Gleichzeitig darf er aber auch nicht den Eindruck gewinnen, dass die Seite nicht sorgfältig zusammengestellte Informationen enthält: „One Picture is Worth A Thousand Words” (Fred R. Barnard) heißt im Gegenschluss: “Ein nicht geeignetes Bild kann die wichtige Aussage von 1.000 Worten verderben.” Ob ein Bild geeignet ist oder nicht, das ist zunächst eine sehr subjektive Frage. Es gibt Situationen, in denen ein unscharfes Handybild geeigneter ist als ein professionelles Foto! Worauf kommt es technisch bei Bildern an? Auch wenn ich auf diesen Seiten kein einziges Bild eingesetzt habe, so bin ich mir der besonderen Bedeutung von „guten“ Bildern überaus bewusst. Und Fotografieren und semi-professionelle Nachbearbeitung von Bildern ist mein liebstes Hobby. In den Anfängen der Webseitenerstellung war es entscheidend, möglichst wenige Kilobyte grosse Bilder in der kompromissweise gerade noch akzeptierbaren Qualität zu liefern. Oft mussten dafür eingescannte Bilder intensiv nachbearbeitet werden. Heute kann fast jeder technisch hochwertige Fotos erstellen, selbst gute Handys erreichen inzwischen eine Qualität und hohe Auflösungen, so dass die technischen Aspekte nur dann eine Rolle spielen, wenn die Lichtverhältnisse schwierig waren oder dem Bild eine besondere Aussage gegeben werden soll. Und da sind wir bei der schwierigen Aufgabe, vor der Webseitenersteller heute stehen: Wie komme ich zu Bildern, die die Aufmerksamkeit meiner Kunden erregen und die die erwünschte Wirkung erreichen.

Generelle Alternativen

Kaufen von lizensierten Bildern

Man kann auch für wenig Geld passende hochwertige Bilder von Profifotografen im Internet käuflich erwerben. Bei meinen letzten Projekten kamen Bilder zum Beispiel von Adobe Stock zum Einsatz. Zwar werden immer wieder im Internet kostenlos Bilder und Grafiken angeboten, aber in der Regel besteht das Risiko, dass man ungewollt gegen Lizenz- oder Personenrechte verstößt. Daher empfehle ich immer, hier auf kostenlose Inhalte möglichst zu verzichten.

Eigene Bilderstellung und Bearbeitung

Eigentlich wissen Sie als künftiger Webseitenbetreiber am besten, welches Bild Sie für die gewünschte Aussage brauchen. Wenn Sie selbst kein Talent zum Fotografieren haben, vielleicht gibt es einen talentierten Fotografen in Ihrem Umfeld, der für wenig Geld oder als Freundschaftsdienst ihnen die richtigen Fotos schiesst.

Nachbearbeitung der Bilder

Was ich komischerweise sogar bei professionellen Webseiten immer wieder feststelle: Es wird immer wieder vergessen, die Bilder auf das richtige Maß zu komprimieren. Natürlich passiert im VDSL- oder Glasfaser-WLAN nicht viel, wenn ich mehrere große Bilder auf meiner Seite habe, aber viele gehen mit ihrem Handy auch ohne WLAN ins Internet. Und da machen dann die Ladezeiten Ihrer Seite keinen Spaß mehr. Und für das Datenvolumen Ihres Kunden ist das auch nicht förderlich. Beispiel: Ich habe nicht einmal ein Vollformatkamera. Trotzdem ist ein mit meiner Kleinbildkamera oder meinem Handy erstelltes JPG-Bild in der Regel 6 - 8 MB groß und hat eine Auflösung von 6.000 * 4000 bzw. 4608 * 3456 Pixel. Wenn auch nur ein solches Bild so auf meine Webseite bringe, dann wird die Ladezeit selbst unter LTE nicht toll und die Bildqualität wird wahrscheinlich schlechter als erwartet sein. Auch wenn es komisch klingt: Ist die Auflösung des Handys / Tablets kleiner als die Auflösung der darzustellenden JPG- oder PNG-Datei, dann wir die Darstellung Ihres Bild auf dem Handy / Tablet um so schlechter, je höher die Auflösung des Bildes ist. Nur beim Einzoomen kann eventuell die höhere Auflosung Vorteile bringen. Hintergrund: Mit einem guten Bildbearbeitungstool auf Ihrem PC wird ein Bild um ein vielfaches qualitativ besser komprimiert, als das selbst ein gutes Handy „on the flight“ leisten kann. Ein unbedingtes Muss ist es also, das Bild auf die geeignete Auflösung und Größe zu bringen: d. h. bei der Handy/Tablet-Variante reichen in der Regel maximal 1.920 * 1080 Pixel (für Full HD, nur bei besonderer Anforderung) oder 1.280 * 720 Pixel (für HD). d. h. selbst für die PC-/Notebook-Variante reichen in der Regel maximal 1.920 * 1080 Pixel, denn der Upscale der Monitore ist inzwischen so gut, dass der Qualitätsgewinn selbst bei einem hochwertigen UHD-Monitor trotz der 4-fachen Auflösung der UHD-Datei gegenüber einer hochgerechneten HD-Auflösung vernach lässig bar ist. In der Regel benötigt man eine geringere Auflösung für das Bild auf der Webseite und verweist lediglich bei der Verlinkung ggf. auf ein hochaufgelöstes Bild. Bei guten Webdesignprogrammen macht die Software dies in der Regel selbstständig. Ausnahme: Als Hobbyfotograf stelle ich gerne die Bildergalerien von besonderen Events (z. Bsp. Hochzeit oder Jubiläum) als Webpräsentation in geschützten Internet-Bereichen bereit. Die Bilder haben dann in der Regel 3 Auflösungen (HD, FULL-HD und UHD). Die Größe reduziere ich bei HD-Übersichtsbildern auf maximal 150 KB.

Empfehlung

Nehmen Sie sich Zeit, die richtigen Bilder in der richtigen Qualität auszusuchen und aufzubereiten. Ziel ist es nicht, die tollste Designer-Webseite zu erstellen, sondern die Seite, die Ihre potentiellen Kunden anspricht und neugierig macht.

@ COPYRIGHT www.mein-web-auftritt.de

Individuelle Gestaltung von Webauftritten Mein Webauftritt
Einsatz von Bilder und Grafiken im Web

"Ein Bild sagt mehr als 1000 Worte" (P. J. Reuter)

Diese Metapher für den Mehrwert von Bildern oder Grafiken gegenüber textlichen Erläuterungen gilt insbesondere für das Internet. Sehr oft bleiben Internetnutzer nur für wenige Sekunden auf einer Webseite: Es sei denn, der Besucher findet in dieser kurzen Zeit ihn interessierte Informationen. Gleichzeitig darf er aber auch nicht den Eindruck gewinnen, dass die Seite nicht sorgfältig zusammengestellte Informationen enthält: „One Picture is Worth A Thousand Words” (Fred R. Barnard) heißt im Gegenschluss: “Ein nicht geeignetes Bild kann die wichtige Aussage von 1.000 Worten verderben.” Ob ein Bild geeignet ist oder nicht, das ist zunächst eine sehr subjektive Frage. Es gibt Situationen, in denen ein unscharfes Handybild geeigneter ist als ein professionelles Foto! Worauf kommt es technisch bei Bildern an? Auch wenn ich auf diesen Seiten kein einziges Bild eingesetzt habe, so bin ich mir der besonderen Bedeutung von „guten“ Bildern überaus bewusst. Und Fotografieren und semi-professionelle Nachbearbeitung von Bildern ist mein liebstes Hobby. In den Anfängen der Webseitenerstellung war es entscheidend, möglichst wenige Kilobyte grosse Bilder in der kompromissweise gerade noch akzeptierbaren Qualität zu liefern. Oft mussten dafür eingescannte Bilder intensiv nachbearbeitet werden. Heute kann fast jeder technisch hochwertige Fotos erstellen, selbst gute Handys erreichen inzwischen eine Qualität und hohe Auflösungen, so dass die technischen Aspekte nur dann eine Rolle spielen, wenn die Lichtverhältnisse schwierig waren oder dem Bild eine besondere Aussage gegeben werden soll. Und da sind wir bei der schwierigen Aufgabe, vor der Webseitenersteller heute stehen: Wie komme ich zu Bildern, die die Aufmerksamkeit meiner Kunden erregen und die die erwünschte Wirkung erreichen.

Generelle Alternativen

Kaufen von lizensierten Bildern

Man kann auch für wenig Geld passende hochwertige Bilder von Profifotografen im Internet käuflich erwerben. Bei meinen letzten Projekten kamen Bilder zum Beispiel von Adobe Stock zum Einsatz. Zwar werden immer wieder im Internet kostenlos Bilder und Grafiken angeboten, aber in der Regel besteht das Risiko, dass man ungewollt gegen Lizenz- oder Personenrechte verstößt. Daher empfehle ich immer, hier auf kostenlose Inhalte möglichst zu verzichten.

Eigene Bilderstellung und Bearbeitung

Eigentlich wissen Sie als künftiger Webseitenbetreiber am besten, welches Bild Sie für die gewünschte Aussage brauchen. Wenn Sie selbst kein Talent zum Fotografieren haben, vielleicht gibt es einen talentierten Fotografen in Ihrem Umfeld, der für wenig Geld oder als Freundschaftsdienst ihnen die richtigen Fotos schiesst.

Nachbearbeitung der Bilder

Was ich komischerweise sogar bei professionellen Webseiten immer wieder feststelle: Es wird immer wieder vergessen, die Bilder auf das richtige Maß zu komprimieren. Natürlich passiert im VDSL- oder Glasfaser-WLAN nicht viel, wenn ich mehrere große Bilder auf meiner Seite habe, aber viele gehen mit ihrem Handy auch ohne WLAN ins Internet. Und da machen dann die Ladezeiten Ihrer Seite keinen Spaß mehr. Und für das Datenvolumen Ihres Kunden ist das auch nicht förderlich. Beispiel: Ich habe nicht einmal ein Vollformatkamera. Trotzdem ist ein mit meiner Kleinbildkamera oder meinem Handy erstelltes JPG-Bild in der Regel 6 - 8 MB groß und hat eine Auflösung von 6.000 * 4000 bzw. 4608 * 3456 Pixel. Wenn auch nur ein solches Bild so auf meine Webseite bringe, dann wird die Ladezeit selbst unter LTE nicht toll und die Bildqualität wird wahrscheinlich schlechter als erwartet sein. Auch wenn es komisch klingt: Ist die Auflösung des Handys / Tablets kleiner als die Auflösung der darzustellenden JPG- oder PNG-Datei, dann wir die Darstellung Ihres Bild auf dem Handy / Tablet um so schlechter, je höher die Auflösung des Bildes ist. Nur beim Einzoomen kann eventuell die höhere Auflosung Vorteile bringen. Hintergrund: Mit einem guten Bildbearbeitungstool auf Ihrem PC wird ein Bild um ein vielfaches qualitativ besser komprimiert, als das selbst ein gutes Handy „on the flight“ leisten kann. Ein unbedingtes Muss ist es also, das Bild auf die geeignete Auflösung und Größe zu bringen: d. h. bei der Handy/Tablet-Variante reichen in der Regel maximal 1.920 * 1080 Pixel (für Full HD, nur bei besonderer Anforderung) oder 1.280 * 720 Pixel (für HD). d. h. selbst für die PC-/Notebook-Variante reichen in der Regel maximal 1.920 * 1080 Pixel, denn der Upscale der Monitore ist inzwischen so gut, dass der Qualitätsgewinn selbst bei einem hochwertigen UHD-Monitor trotz der 4-fachen Auflösung der UHD-Datei gegenüber einer hochgerechneten HD-Auflösung vernach lässig bar ist. In der Regel benötigt man eine geringere Auflösung für das Bild auf der Webseite und verweist lediglich bei der Verlinkung ggf. auf ein hochaufgelöstes Bild. Bei guten Webdesignprogrammen macht die Software dies in der Regel selbstständig. Ausnahme: Als Hobbyfotograf stelle ich gerne die Bildergalerien von besonderen Events (z. Bsp. Hochzeit oder Jubiläum) als Webpräsentation in geschützten Internet-Bereichen bereit. Die Bilder haben dann in der Regel 3 Auflösungen (HD, FULL-HD und UHD). Die Größe reduziere ich bei HD-Übersichtsbildern auf maximal 150 KB.

Empfehlung

Nehmen Sie sich Zeit, die richtigen Bilder in der richtigen Qualität auszusuchen und aufzubereiten. Ziel ist es nicht, die tollste Designer-Webseite zu erstellen, sondern die Seite, die Ihre potentiellen Kunden anspricht und neugierig macht.