Das kommt Dir sicher bekannt vor…
Du kennst sicher Webseiten, wo Du auch nach einigen Durchklicken immer noch nicht sicher bist, was genau angeboten wird. Weder der Text noch die dargestellten Fotos sind ausreichend informativ und so verlässt Du die Webseite ratlos und leicht genervt.
Oder Du landest bei Deiner Suche auf einer vermeintlich informativen Seite, die schon mal ewig lädt, um Dich dann allerdings mit wahllos arrangierten und unpersönlichen Fotos erwartet, die Dir das Gefühl geben, dass man sich bei der Gestaltung der Website nicht sehr viel Mühe gemacht hat.
Du fragst Dich unwillkürlich, ob sich der Website-Besitzer bei seiner Dienstleistung auch so wenig Mühe gibt, wenn seine Website – also sein “Schaufenster” – schon so wenig ansprechend ist.
Das sind zwei kleine Beispiele, wo die falschen oder falsch eingesetzte Fotos eventuelle Kunden eher abschrecken als anziehen.
Und natürlich möchtest Du das nicht! Denn das schon zu Tode gepredigte Zitat “Du hast keine zweite Chance für einen ersten Eindruck” passt genauso auf Webseiten, wie auf ein erstes persönliche Treffen.
Damit Du die kleineren und größeren Hürden in Deiner Webpräsenz umgehen kannst, habe ich Dir hier einen Artikel mit 7 Fails zusammen gestellt, mit welchen Du Deine Wunschkunden sicher vergraulst – und natürlich, wie Du es besser machen kannst.
Alles Liebe
Wenn ich Dich bei Deinen Fotos unterstützen kann, dann melde Dich gerne. Buche Dir gerne ein kostenfreies Kennenlergespräch in welchen wir besprechen, wie und womit ich Dir helfen kann.
Inhaltsverzeichnis
1.) Setze auf Stockfotos – ohne Bezug zu Deiner Marke
2.) Verwende nur (unprofessionelle) Handy-Fotos
3.) Zeige irrelevante Bilder
4.) Zeige möglichst viele Bilder auf eine Seite
5.) Wähle die falschen Bildformate
6.) Ignoriere die lange Ladezeit Deiner Website
7.) Lass die mobile Ansicht komplett außer Acht!
Fazit
Buche einen Website-Check
Weiterführende Links
FAQs
1.) Setze auf Stockfotos - ohne Bezug zu Deiner Marke
Auf Stockplattformen wie z.B Depositphotos, Shutterstock oder iStockphoto findest Du tausende Fotos zu einem bestimmten Thema, sortiert nach Format, Farbe und vielen weiteren Filtermöglichkeiten.
Gerne werden auch generische Fotos wie z.B. Glastische mit Büchern und Laptops oder sonstige allgemeine Fotos als Eyecatcher verwendet. Natürlich passen sie optisch auf Deine Seite, aber sie unterstützen meist weder den Text, sagen nichts über Deine Business-Geschichte aus und passen selten farblich noch stilmässig zu den restlichen Fotos.
Besser: Verwende stattdessen Fotos mit Persönlichkeit
Zeige Fotos, die etwas von Dir und Deinem Business darstellen. Zeig dabei Persönlichkeit. Und nein, das heißt nicht, dass Du Privates teilen musst!
Zeige Dich bei einer Tätigkeit, die Du sowieso ausführst und lass Dein Publikum ein wenig hinter die Kulissen schauen:
- Du bist Tischler? Dann zeig Dich an der Hobelbank. Dort kannst Du einige Fotos aus verschiedenen Perspektiven vom gleichen oder verschiedenen Werksstücken fotografieren.
- Du bist Maklerin? Zeig Dich mit einer Mappe vor einem schönen Hauseingang oder im Gespräch mit (Pseudo-)Kunden, …
Wähle aussagekräftige Fotos, welche die Botschaft und die Werte des Unternehmens klar kommunizieren.
- Du erstellst aus alter Kleidung Neues? Zeig Dich vor einem Kleiderberg mit Schere “bewaffnet”, in weiterer Folge, was Du daraus gezaubert hast.
Versuche eine fortlaufende Geschichte mit den Fotos zu finden. Menschen lieben Geschichten!
- Kleiderberg → Hand mit Schere → Dich an der Nähmaschine → neues Kleidungsstück (getragen z.B. von einem lächelnden Mädchen beim Spielen)….
2.) Verwende nur unprofessionelle Handy-Fotos
Kameras von Handys sind mittlerweile großartig und können relativ hochauflösende Fotos erstellen. Mit der integrierten KI kann man gleich direkt noch etwas zaubern (z.B. die nachträgliche Änderung der Schärfentiefe bei Portraits am iPhone).
Da die Hauptkameras (die auf der Rückseite) immer noch die bessere Auflösung als die Frontkamera hat, ist das Handling für ein gutes Portrait allerdings nicht immer ganz einfach. Weder mit Stick, noch mit einem Stativ.
Man kann wirklich gute Portraits mit dem Handy erstellen, viele Aufnahmen sind aber auch mit Selbstauslöser nicht machbar. Glaub mir, ich hab schon ganz vieles ausprobiert und bin dabei oft an meine Grenzen gestossen.
Zudem finde ich die Auflösung beim Export der Datei einfach nicht ausreichend, eventuell, weil ich durch meine Kameras bessere gewöhnt bin 😉
Was kannst Du also machen, damit auch Deine Websites mit Handyfotos professionell aussehen?
- Weniger ist mehr! Erstelle auch mit dem Handy Aufnahmen mit einer ruhigen Komposition.
- Spiele mit der Schärfentiefe: Fotos mit verschiedener Schärfentiefe und auch verschiedenen Ebenen (Vorder- und Hintergrund, sowie Motiv) sind ebenfalls perfekt, da diese das Auge führen. Wenn Du Fotos mit einem Smartphone machst, verwende dazu den Portrait-Modus bzw. achte auf eine möglichst kleine Blendenzahl.
- Licht ist das Wichtigste! Achte auf die Lichtverhältnisse - je heller es ist, desto weniger rauschen die Fotos. Und durch den kleineren Kamera-Chip rauschen Fotos am Handy schneller als von einer Kamera. Mit div. KI-Tools kannst Du das Rauschen bis zu einem gewissen Grad entfernen, allerdings verliert man dabei immer noch Feinheiten.
- Wenn Du doch nicht zufrieden bist: Überlege, ob ein Handy-Foto-Kurs etwas für Dich wäre und schau Dir dort ein paar Tricks ab. Schließlich kann man immer etwas Neues lernen. 😁
3.) Zeige irrelevante Bilder
Bilder, die im Widerspruch mit Deinem Text und Deinen Werten stehen, verwässern Deine Botschaft und hinterlassen den Betrachter ratlos zurück. Im schlimmsten Fall ist es ein Grund, warum sie die Seite verlassen, weil sie unbewusst spüren, dass hier etwas nicht zusammen passt.
Besser: Wähle Fotos und Bilder sorgsam!
- Mache neugierig! Fotos sollen den Text unterstreichen und nicht ablenken, im besten Fall machen Bilder neugierig, sodass man den Text unbedingt lesen möchte.
- Verwende konsistentes Material: Verwende Fotos und Bildmaterial im selben Stil und Farblook! (Moody/Dunkel, Hell oder Bunt, …) - eine Mischung verwirrt oft nur und sieht nicht sehr professionell aus. (Was eine weiterer Grund GEGEN Stockfotos ist, da Du nie ausreichend Fotos im passenden Material und Inhalt von einem Fotografen bekommst.) Eine Konsistenz können auch immer das gleiche Bildformat (z.B. nur quadratische Fotos) oder die ausschließliche Verwendung von Schwarz-Weiß-Aufnahmen sein.
- Nutze den Negativraum als Gestaltungselement: … und manchmal ist weniger auch einfach mehr - wenn ein Foto keinen Mehrwert liefert, lass es weg! Auch Weißraum (sogenannter Negativraum) hilft bei der Orientierung und lockert Seiten auf!
BleibUp-to-date!
Du erhältst in unregelmäßigen Abständen meinen Newsletter mit:
- Tipps und Infos zur Fotografie,
- Infos zu meinen Aktionen,
- spezielle Rabatt-Aktionen
4.) Zeige möglichst viele Bilder auf eine Seite
Bilder sollen den Text unterstützen (außer Du bist Fotograf:in, dann ist es meist eher umgekehrt) und nicht verwirren oder sich in den Vordergrund spielen. Sind zu viele Fotos auf einer Seite, verliert man schnell mal den Faden beim Lesen.
Besser: Professionelle Bildkomposition
- Zuallerst sollte auf Deiner Webseite immer die Kundenreise stehen: Hole Deine (Wunsch-)Kundinnen dort ab, wo sie gerade sind. Skizziere dazu gerne vorab den Inhalt und schreibe dann die Texte und erstelle Deine Seite. Am Schluss füge die Fotos ein.
- Hilfreich dabei sind die Gesetze der Gestaltungsprinzipien ⤴︎ und wenn Du den Weißraum beachtest. Beides sind wichtige Gestaltungselemente und helfen bei der Blickführung.
5.) Wähle die falschen Bildformate
Canva oder auch Photoshop geben Dir meist zuerst die Möglichkeit vor, erstellte Bilder im Format PNG zu exportieren. Was aus der Sicht der Programme wohl Sinn macht, allerdings auch dazu führt, dass die Bilddatei extrem groß wird und sich somit die Ladezeit extrem erhöht (siehe Punkt 6.)
Nachfolgend ein paar Tipps zu den einzelnen Formaten
- JPEG für fotografische Bilder: Wenn es um fotorealistische Bilder geht, ist das JPEG-Format oft die beste Wahl. Es bietet eine ausgezeichnete Kompression bei minimalen Qualitätsverlusten. Dies ist besonders wichtig, um die Ladezeit der Webseite zu optimieren, ohne die Bildqualität erheblich zu beeinträchtigen.
- PNG für Transparenz und Grafiken: PNG eignet sich hervorragend für Bilder, die Transparenz erfordern, wie Logos oder Grafiken mit klaren Hintergründen. Es ist ein verlustfreies Format, das eine hohe Bildqualität beibehält. Beachte jedoch, dass PNG-Dateien tendenziell größer sind als ihre JPEG-Äquivalente.
- GIF für einfache Animationen: Wenn Du einfache Animationen in Deine Webseite integrieren möchtest, ist das GIF-Format die richtige Wahl. Es unterstützt Animationen mit begrenzter Farbpalette und ist ideal für kleine, wiederholte Bewegungen oder Effekte.
- Vermeide BMP und TIFF: BMP- und TIFF-Dateien sind zwar qualitativ hochwertig, jedoch auch sehr groß. Diese Formate sollten vermieden werden, da sie die Ladezeit der Webseite erheblich beeinträchtigen können. Es ist effizienter, auf die genannten komprimierten Formate zurückzugreifen.
Wenn Du mehr darüber lesen möchtest, findest Du hier eine gute Zusammenfassung: https://www.advidera.com/glossar/bildformate/
6.) Ignoriere die lange Ladezeit Deiner Website
Nichts ist für Website-Besucher nerviger, als verpixelte Bilder oder Seiten, die ewig laden, weil die Fotos viel zu groß sind.
Was kannst Du dagegen tun?
Bild-Auflösung
Lade Dein Bildmaterial nur in der maximalen Bild-Auflösung hoch, die benötigt wird:
- Headerbilder, die über die gesamte Breite geht, können größer ausfallen (HD besser Full-HD-Größe)
- für alles andere reicht zumeist 300-800 px (längste) Seitenlänge aus.
Datei-Größe:
Achte darauf, dass die Dateigröße der Bilder möglichst klein ist. Kleine Bilder sollten um die 100-250 Kb und Headerbild so max. 500 Kb groß sein. Denk einfach daran, je mehr Kilobyte pro Seite geladen werden müssen, desto geduldiger muss Dein Besucher sein!
Tools:
Auch wenn Du mit Programmen wie Photoshop oder Canva arbeitest, sind diese nicht unbedingt darauf spezialisiert die Datei-Größe klein zu halten. Hier können Dich zum Beispiel nachfolgende Tools unterstützen.
Achte bei der Komprimierung vorallem auf den Unterschied bei verlustbehaftet (lossy) und verlustfrei (lossless):
- lossy - hier wird die Datei wirklich sehr klein, was sich meist auf die Qualität der Bildqualität niederschlägt. Bei einer größeren Wiedergabe wird das Bild schnell sehr verpixelt und es ist auch eher flau, weil die Zwischenfarben ersetzt werden.
- lossless - Bei einer verlustfreien Komprimierung werden vorallem unnötige Meta-Infos entfernt, dafür wird die Datei weniger stark komprimiert.
- https://tinyjpg.com/
- https://imagify.io/
- https://www.jpegmini.com/ (Kann auch die Auflösung ändern)
7.) Lass die mobile Ansicht komplett außer Acht!
Laut diverser Statistiken greifen mittlerweile 80% der Besucher per Handy auf Webseiten zu. Umso erschreckender ist es, dass immer noch Seiten überhaupt keine mobile Ansicht integriert haben.
In einer mobilen Ansicht muss der Text und die Bilder so hinterlegt sein, dass sie
- immer gut zu erkennen / lesbar sind
- nichts verzerrt oder gestaucht wird.
Das macht bei nicht dafür eingestellten Webseiten Probleme:
- Große Bilder werden nicht ganz angezeigt - je nach Theme wird meist nur der linke Bereich gezeigt. Wenn rechts etwas wichtiges zu sehen ist, kann man das am Handy nicht sehen.
- Tabellen werden meist gestaucht (und somit unlesbar) oder ebenfalls abgeschnitten, wobei meist nach rechts gescrollt werden kann. Was es aber für den Leser unnötig kompliziert werden lässt und schnell mal die Seite verlässt.
- Und nur zu oft bin ich schon auf die komplette Seite überdeckende PopUps gestolpert, ohne dass man das Schließen-Zeichen erreichen konnte. Super nervig!
Mobile Ansicht überprüfen:
Überprüfe am Desktop im Entwicklermodus Deines Browser (Chrome oder Safari) Deine Seite auf die mobile Tauglichkeit. Mach das auch bei neu erstellten Seiten oder PopUps!
Hier findest Du dazu z.B. eine Anleitung für Chrome ⤴︎ und für Safari⤴︎.
Sollte Deine Website am Smartphone nicht lesbar sein, hilft leider nur eines: Wechsle auf ein mobiltaugliches Theme (Stichwort „Responsive Webdesign“). Wenn Du Deine Website sowieso überarbeiten wolltest, ist das der perfekte Zeitpunkt!
BleibUp-to-date!
Du erhältst in unregelmäßigen Abständen meinen Newsletter mit:
- Tipps und Infos zur Fotografie,
- Infos zu meinen Aktionen,
- spezielle Rabatt-Aktionen
Fazit
Es geht nicht darum, was Du alles falsch machen kannst, sondern wie Du Deine Seite und die Inhalte verbessern kannst.
Versuch möglichst persönliche und vorallem professionelle Fotos einzusetzen. Übertreib es mit den visuellen Elementen nicht und achte beim Hochladen vorallem auf die Formate und eine passende (geringe) Auflösung.
Wenn Du dann auch noch ein mobiles Web-Theme einsetzt, hast Du schon sehr viel ein positives Kundenerlebnis getan.
Du bist jetzt nicht ganz sicher, was Du alles zuerst tun sollst oder hast generell Fragen zu Deine Website? Dann kann ich Dir folgendes anbieten:
Buche einen Website-Check
- Professionelles Design: Ich sorge nicht nur für ansprechende Fotos, sondern biete auch Unterstützung bei der Optimierung deiner Webseite. Ein harmonisches Gesamtbild, das zu deinem Business passt. Du kannst beides getrennt buchen oder als Gesamtpaket.
- Persönliche Beratung: Gemeinsam gehen wir durch deine Fragen und Anliegen rund um deine Webseite. Mit meiner Erfahrung als Webdesignerin bin ich Deine verlässliche Ansprechpartnerin.
- Praktische Umsetzung: Konkrete Schritte und Handlungsempfehlungen, um Deine Webseite auf das nächste Level zu heben. Vom Bild zum Klick – eine rundum professionelle Präsenz im Netz.
- Preiswertes Angebot: Du bekommst ein persönliches Beratungsgespräch über eine Stunde für nur 100 Euro. Dein Investment in ein erfolgreiches Online-Image.
Kontaktiere mich gerne für deine Webseiten-Fragen und vereinbare Dein Beratungsgespräch! 💬✨
Weiterführende Links
- Gestaltungsprinzipien: https://www.bley-stift.at/gestaltungsprinzipien-von-werbemitteln/
- Gesetz der Ähnlichkeit und Nähe: https://verdino.com/blog/gesetz-der-aehnlichkeit-und-der-naehe/
- Gestaltungsprinzip: https://de.wikipedia.org/wiki/Gestaltpsychologie
- Weißraum in der Mediengestaltung: https://www.hcg-corporate-designs.com/weissraum-in-der-mediengestaltung
FAQs
Ein professioneller Fotograf oder Web Designer können Dir sicher hilfreiche Tipps geben.
Als ausgebildete Internetentwicklerin helfe ich Dir auch gerne weiter. Dazu biete ich ein einstündiges Online-Gespräch an, bei dem wir Deine Website durchgehen und ich Dir Tipps zur Verbesserung gebe. Melde Dich gerne bei mir.
Achte vorallem auf eine klare Bildsprache, hochwertige Auflösung und professionelle Beleuchtung. Vermeide Handy-Schnappschüsse und unscharfe Bilder.
Authentizität ist entscheidend!
Zeige immer wieder echte „Momentaufnahmen“ aus Deinem Unternehmen sowie etwas Persönliches.
Vermeide aber übermäßige Bearbeitung (oder Filter!) der Bilder, um die Natürlichkeit zu bewahren.
Ja, regelmäßige Aktualisierungen halten Deine Website frisch und zeigt Google, dass es sich lohnt öfter einen Bot vorbeizuschicken. Achte darauf, dass Fotos aktuell sind, um Vertrauen und Relevanz zu vermitteln. (Ich biete immer wieder günstige Refresher bzw. Mini-Shootings an, bei denen Du „frisches“ Material für Deine Website an. Alternativ kannst Du Dir ein Abo buchen, wo wir regelmäßig ein kurzes Shooting haben, sodass Du immer neue Fotos hast. Interessiert? Melde Dich einfach bei mir und ich schick Dir alle Unterlagen zu!)
Zeige Dein Team, den Arbeitsprozess und echte Kundeninteraktionen. Emotionen und Menschlichkeit schaffen eine Verbindung zu Deinen Kunden.
Vermeide unscharfe, pixelige oder übermäßig bearbeitete Bilder. Achte darauf, dass die Fotos zu Deiner Marke passen und eine konsistente Bildsprache wiedergeben.
Professionelle Fotos sind ideal, aber qualitativ hochwertige Handyfotos können auch gut funktionieren. Achte auf gute Belichtung und Schärfe.
Verwende Bilder, die Deine Zielgruppe ansprechen. Berücksichtige Alter, Geschlecht und Interessen, um eine Verbindung herzustellen.
Fotos ergänzen Texte. Setze aussagekräftige Bildunterschriften ein und erkläre, was die Fotos über Dein Unternehmen aussagen sollen.