9 einfache Ideen für individuelle Bildmotive, die keinen mehr langweilen.

Letztes Artikel-Update:
15. September, 2019

Standard-Agenturstock-Fotos kennt und hat jeder schoin zur Genüge. Die Herausforderung sind individuelle, noch nicht „ausgelutschte“ Motive zu finden. Dieser Artikel zeigt dir 9 Ideen für individuelle Bildmotive im Webdesign.

Ich kann es nicht mehr sehen.

Ich kann nicht mehr sehen, wie sich Geschäftsmänner die Hände schütteln, glückliche Familien um die Wette strahlen und junge gutaussehende Angestellte in einer total entspannten Büro-Atmosphäre ein total lockeres Meeting halten.

Diese Bilder sehe ich täglich auf Webseiten.
Auf zu vielen Webseiten.

Aber eigentlich ein verschenktes Potential.

Zu den Fakten:

Standard Agenturstockfotos im Wedesign

Bilder sprechen uns emotional an. Bilder sagen uns mehr, als es tausend Worte tun können. Bilder bleiben lange im Gedächtnis. Bilder wirken in Sekundenbruchteilen.

Alles richtig und auch gute Gründe, warum Bilder auf Webseiten gerne eingesetzt werden.

Zu oft sind Bilder aber auf Webseiten austauschbar geworden, gerade wenn – oder besser: weil – sie aus Bildkatalogen stammen. Für wenig Geld bekommt man hier professionelle Fotos ohne groß eingeschränkte Nutzungsrechte.

Eine Folge ist aber, dass viele dieser Bilder nun auf vielen Webseiten (oder auch anderen Kommunikationsmedien) im Einsatz sind:

Familien-Klischeebild
Ein typisches Klischeebild, wie ich es zu oft sehe.

Fast jedes Unternehmen hat die Idee von Bildern „mit jungen fröhlichen gutaussehenden Menschen, die nett zuammen vor dem Laptop sitzen und gemeinsam surfen oder ein entspanntes Meeting halten“ – oder so ähnlich. Das mag nicht nur oft fernab jeglicher Realität sein, es ist auch zu oft erkennbar, dass diese Bilder nicht authentisch sind.

Mit Eigenständigkeit und einem Wiedererkennungeffekt haben diese Bilder nichts gemein. Schade eigentlich.

Was bei kleineren Vorschaubildern für Artikel oder Unterseiten und vor allem bei Newsportalen noch nachvollziehbar sein mag, ist gerade auf Unternehmensseiten und Online-Shops ein verschenktes Potential.

Was für Möglichkeiten gibt es aber aus diesem Stockfoto-Trott auszubrechen? Wie können individuelle Bildmotive und -formate gelingen, die sich aus dem täglichen Bildereinerlei hervorheben?

Im folgenden habe ich ein paar Möglichkeiten zusammengestellt, samt gelungenen Beispielen für individuelle Umsetzungen, die zeigen, dass es auch anders geht:

Individuell und persönlich

Ok, das ist die Variante für das größere Budget.

Es werden extra eigene Fotos erstellt. Ein Fotograf (oder ein sehr sehr talentierter Mitarbeiter, Freund, Bekannter…) nimmt Bilder des Unternehmens und der Mitarbeiter auf. Oft sind die Fotografen-Kosten im Kundenbudget nicht vorhanden. Dann sollte sich der Kunde aber diese trotzdem noch gönnen.

Warum?

Weil der Mehrwert eigener individueller Bilder rießig ist. Kein anderes Gestaltungsmittel kann ein Design so abheben lassen von den Webseiten der Konkurrenz und für so eine hohe Wiedererkennung sorgen wie markante Bilderwelten.

Die folgenden Beispiele verdeutlichen dies sehr gut:

Screendesign Greenfort
Die Anwälte haben sich nicht Lumpen lassen und in unterschiedlichsten Locations in Szene setzen lassen. Das Ergebnis kann sich sehen lassen – eitel Sonnenschein.
greenfort.de
Screendesign Mittwald
Etwas bodenständiger kommt Mittwald daher. Die Mitarbeiter standen Pate und wurden oft in ähnlichen Situationen aufgenommen wie es sie auch bei den klassichen Business-Stockfotografien gibt. Aber die Bilder sind eben nicht mit den typischen Fotomodels gemacht, sondern mit „echten Menschen“. Dadurch verleihen die Bilder der Seite einen große Portion Authentizität und Menschlichkeit.
mittwald.de
Screendesign AC Tischendorf
Sorry, noch einmal Rechtsverdreher, äh, Anwälte. Prominent in Szene gesetzt auf einer ansonsten eher spartanischen Seite.
ac-tischendorf.com
Screendesign kotlett
Noch einen Schritt weiter: Eine gelungene Produktinszenierung, die sogar auf das Medium Video setzt. Einzig dieser Hipster stört etwas…
kotelett.info

Das Team, einzelne Mitarbeiter, aber auch die Räumlichkeiten des Unternehmens oder Produkte können durch eigene, extra erstellte Bilder regelrecht inszeniert werden und so der ganzen Seite eine individuelle und persönliche Note geben.

Bildausschnitt

Eigene Fotos oder Bilder aus Fotoagenturen müssen nicht in voller Breite eingesetzt werden. Ein veränderter Bildausschnitt kann manchmal eine ganz andere Aussage bewirken. Oder viel mehr Spannung erzeugen.

Und mit ungewöhnlichen Ausschniten lässt sich Aufmerksamkeit und Individualität erreichen.

alt
Ups, eigentlich sind doch Portraits so emotional. Hier wird der Kopf einfach abgeschnitten und das Bild gewinnt gerade dadurch an Spannung.
agentur-loop.com

Die unterschiedlichen Wirkungen unterschiedlicher Bildausschnitte zeigen die beiden folgenden Beispiele gut auf:

Verschiedene Bildausschnitte

Montagen

Warum nicht aus mehreren Bildern eines machen?

Mit Bildmontagen lassen sich ganz neue Motive und Aussagen gestalten, die mit „normalen“ Bildern nicht möglich wären.

Screendesign Bildmontage
Witzig, kreativ und vor allem individuell. Aus mehreren Bildern wird eine Gesamtkomposition.
andreasfretz.de
Screendesign Bildmontagen
Das wächst was aus dem Kopf. Nicht eine nur einfache Bildmontage, sondern auch noch interaktiv.
robinizer.de

Illustrationen

Es müssen nicht immer fotorealistische Bilder sein.

Mit Illustrationen lässt sich häufig ein individueller Stil umsetzen, mit dem man sich gut von anderen Webseiten abgrenzen kann. Die Vielfalt der Illustrationsmöglichkeiten ist dabei schier unerschöpflich.

Screendesign Illustration
Illustrationen im Zusammenspiel mit Farbe:
Markant und individuell und ein hoher Wiederekennungseffekt.
legworkstudio.com
Screendesign Illustrationen
Ähnlicher Effekt, aber anderer Illustrationsstil.
martin-walker.de
Webdesign Illustration
Wirkt wie gezeichnet, ausgeschnitten und aufgeklebt.
2create.bg

Farbfilter

Zurück zu den fotorealistischen Motiven.

Wenn man – aus welchen Gründen auch immer – doch an den Standardbildern nicht vorbei kommt, steht einem immer noch das Bildbearbeitungsprogramm seiner Wahl zur Verfügung.

Warum also nicht einmal an den Farbreglern drehen?

Aber die Bilder nicht so verfremden, dass die Farbebung wie ein LSD-Rausch wirkt. Eher der gezielte Einsatz von Farbverläufen, die die gewünschte Stimmung wiedergeben, bzw. die Kontraste auch abschwächen, damit Text auf dem Bild besser wirken kann.

Webdesign Farbfilter
Sehr markant und auffällig. Und einprägsamer als die „normalen“ fotorealistischen Farben.
ingramcoleland.com.au
Webdesign Farbfilter Effekt
Farbverläufe funktionieren auch im Video.
camps.winshape.org
Screendesign Farbfilter Effekt
Der Gelbstich als Teil des Corporate Designs passend zum Screendesign.
lobagola.com
Screendesign Farbfilter
Hier wurde nicht viel verändert. Aber manchmal reicht ja schon ein bisschen…
joycevherck.com

Duplexfarben

Etwas konsequenter als die Farbfilter ist der Duplexton.

Duplexbilder sind Fotos, die nur aus zwei Farben bestehen (meistens Schwarz und ein weiterer Farbton). Hierdurch lässt sich eine sehr hohe Wiedererkennung erreichen wie die folgenden Beispiele zeigen:

Duplexbild
Zwei Farben: Schwarz und Orange erzeugen hier ein markantes Duplexbild mit hoher Wiedererkennung.
rocketandwink.com
Screendesign Duplexbilder
Auch auf Webseiten lässt sich dieser Duplex-Effekt gut anwenden.
mybootcamp.at
Screendesign Duplexton
Ein sehr dezentes Duplexbild.
spotify-tasterewind.com
Website Duplexton
Funktoniert mit so ziemlich jedem Farbton: Duplexbilder.
underbelly.is

Graustufen

Man kann auch gleich jeden Farbton weglassen und auf Schwarz-Weiß-Bilder setzen. Diese fallen gerade durch die Abwesenheit jeglicher Farbe so auf.

Zusammen mit ein, zwei markanten Farbtönen bei anderen Gestaltungslementen heben sich diese gegenseitig hervor.

Graustufen Webdesign
Was für eine Wirkung! Ein Graustufenbild und der markante Gelbton.
vibrantcomposites.com
Graustufen Screendesign
Graustufenbilder passen zu minimalistischen Screendesigns.
praesens.co

Freie Formen

Bilder sind ja per se rechteckig. Alleine schon von dieser vorgegebenen Form abzuweichen sorgt für Abwechslung. Das können andere typische geometrische Formen sein wie Kreise oder Dreiecke oder auch völlig freie Formen. Auf jeden Fall brechen diese freien Formen das übliche Gestaltunsgraster, dass sich eben auch aus horizontalen und vertikalen zusammensetzt.

Webdesign Freie Form
Statt der üblichen waagerechten Trennung, einfach eine senkrechte umgesetzt – erzeugt Spannung.
socia.li
Screendesign Freie Form
Eine freie Form aus vielen Geraden. So kommt Dynamik ins Design.
fe-gruppe.de
Screendesign Form Hexagon
Warum nicht einmal ein Hexagon. Passt doch gut ins Layout.
thorstenbreyer.de
Screendesign Form Dreieck
Es kann so einfach sein, Statt geraden einfach eine schräge Kante eingesetzt – dynamisch und individuell.
dmdii.uilabs.org
Webdesign Form Kreis
Freigestelltes Objekt und eine Kreisform – markant auffällig.vnstar.com.ua

Freisteller

Eine weitere Möglichkeit Bilder attraktiv zu machen, ist es die Bildmotive freizustellen. Also die Hintergründe „wegzuschneiden“. Dies ist besonders hilfreich, wenn diese störend bzw. unattraktiv sind.

Das mag zwar manchmal aufwendig sein, aber der Effekt kann sich lohnen, wie diese drei Seiten zeigen:

Portrait Freisteller
Gerade Portraits bieten sich an: Freigestellt stört kein Hintergrund mehr und sie lassen sich besser, bzw. individueller in das Design intregrieren.
scicaster.de
Webdesign Freisteller
Auch eine Möglichkeit der Portfolio-Präsentation. Freigestellte Bildausschnitte der Referenzen.
neiouma.com
Screendesign Freisteller
Der Lehmann ist Trainer? Habe ich wohl irgendwas verpasst!
Egal, auf jeden Fall wurde er einige Male freigestellt und macht zumindest im Webdesign eine gute Figur. (Hätte er sich damals beim Schuß von Fabio Grosso mal so gestreckt…)
jenslehmann.com

Fazit

Individuelle Bilderwelten sorgen für eine hohe Wiedererkennung und Differenzierung von der Konkurrenz.

Es muss nicht immer der rechteckige Stockfoto-Einheitsbrei sein!

Die vielen Beispiele zeigen, dass mit etwas Kreativität sich recht einfach besondere Bildmotive und -formate erstellen lassen.

Individuelle Bilderwelten sorgen für eine hohe Wiedererkennung und Differenzierung von der Konkurrenz.

Das kann mal eine bildübergreifende bestimmte Farbgebung sein, mal eine andere Form und manchmal reicht ein besonderer Ausschnitt.

Kennst du noch erwähnenswerte Beispiele? Erzähle es uns in den Kommentaren!

Artikel als Präsentation:

Die Kurzfassung dieses Artikels gibt es auch als Präsentation auf slideshare – 9 einfache Ideen für individuelle Bildmotive.

Individuelle Bildmotive Webdesign

Hole dir die Webdesign-CHECKLISTE
mit über 90 Checkpunkten für Dein nächstes Projekt &
den monatlichen Webdesign-NEWSLETTER:

Schließe dich über 2.560  Newsletter-Abonnenten an!

Keine Sorge, Spam gibt es hier nicht, stattdessen regelmäßig Webdesign-Tipps, -Links und -Angebote von mir! Du kannst den Newsletter auch jederzeit problemlos abbestellen. Mehr Infos dazu:
(Beispiele, Datenschutz, Analyse und Widerruf)

Kommentare zum Artikel

10 Kommentare zu „9 einfache Ideen für individuelle Bildmotive, die keinen mehr langweilen.“

  1. Interessante Liste. Gleichmal ein paar Ideen für unsere Webseite erhalten, um ein paar neue Möglichkeiten auszuprobieren. Mal sehen ob es mit Tieren genauso gut wirkt. Wie wäre es mal mit gezeichneten Bildern, wie unser Gravatar.

    1. Dann bin ich gespannt, was demnächst auf eurer Seite zu sehen ist…
      Und der Gravatar hat natürlich auch eine hohe Wiedererkennung!

  2. Hallo Martin,
    vielen Dank für die coolen Beispiele. Ich hoffe, hier etwas Inspiration zu finden für unser neues Logo. Die Grafik steht schon fest, nur mit der Farbgebung tue ich mich noch schwer.
    VG, Thomas

  3. Pingback: 9 einfache Ideen für individuelle Bildmotive - Freakinthecage Webdesign Stuttgart - Der Blog

  4. Pingback: Fallstudie Webdesign – So einfach habe ich zwei Webdesigns optimiert - Webdesign Journal

  5. Pingback: Bilder optimieren fürs Web – Tools zur Bildoptimierung - Webdesign Journal

  6. Sehr, sehr chice Liste. Vor allem die Auftritte der Kanzlei und des FKK/2-Knäckebrot. Der Bart ist allerdings echt zu viel 🙂
    Jetzt komme ich mir mit meiner eigenen Seite total schäbig vor.

  7. Pingback: 12 „beliebte“ Designfehler, und wie Du sie vermeidest - Webdesign Journal

  8. Pingback: ➡ 32 Webdesign Trends im Überblick - Webdesign Journal

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Über den Autor

Martin Hahn ist Webdesigner, Dozent, Fachbuchautor und dreifacher Papa.
Seit vielen Jahren hilft er anderen effektivere Webdesigns zu erstellen – in Schulungen und mit Artikeln auf dieser Website.

Mehr über diese Website
und den Autor erfahren   →

Ähnliche Artikel

12 „beliebte“ Designfehler, und wie Du sie vermeidest

Webdesign ist schon durchaus eine komplizierte Angelegenheit. Es gibt selten klare Regeln und jeder mag „gutes Design“ etwas anders beurteilen. Auf dem Weg zu einem effektiven Webdesign liegen daher einige Fallstricke aus. Dieser Artikel zeigt 12 häufige Designfehler auf.

Bilder optimieren fürs Web – Tools, Dateiformate & Plugins

Bilder sind ein essentieller Bestandteil der Webseiten-Inhalte. Und spätestens seit die Ladezeit ein Rankingfaktor für die Suchmaschinen ist, gilt es auf optimierte Bilder zu achten.
In diesem Artikel erfährst du, welche vielfältigen Möglichkeiten es gibt Bilder für Webseiten zu optimieren und die Ladezeit und Nutzungserlebnis damit zu verbessern.

Bilde dich weiter

Scroll to Top

Hole dir die Webdesign-CHECKLISTE mit über 90 Checkpunkten für Dein nächstes Projekt & den monatlichen Webdesign-NEWSLETTER:

Schließe dich über 2.560 Newsletter-Abonnenten an

Keine Sorge, Spam gibt es hier nicht, stattdessen regelmäßig Webdesign-Tipps, -Links und -Angebote von mir! Du kannst den Newsletter auch jederzeit problemlos abbestellen. Mehr Infos dazu:
(Beispiele, Datenschutz, Analyse und Widerruf)