Zum Inhalt wechseln
dr. web Logo mit Maus und Hand, die sich den Finger blutig geklickt hat.
  • Beste Agentur finden
    • 3D-Animationsagentur
    • Designagentur
    • Digitalagentur
    • Drupal Agentur
    • Internetagentur
    • Joomla Agentur
    • Marketing Agentur
    • Online-Marketing-Agentur
    • PR Agentur
    • SEO Agentur
    • Shopware Agentur
    • Social Media Agentur
    • TYPO3 Agentur
    • Webagentur
    • Webdesign Agentur
    • Werbeagentur
    • WordPress Agentur
  • Magazin
    • Bloggen
    • Buchhaltung
    • Büro
    • Content Marketing
    • E-Commerce
    • Finanzen
    • Freelancer
    • Green Revoluzzer
    • Hardware
    • Künstliche Intelligenz (KI)
    • Marketing
    • Marktübersichten
    • Online-Marketing
    • Schrift & Grafik
    • Selbstständigkeit
    • Social Media
    • SEO
    • Software
    • UX Design
    • Webdesign
    • WordPress
  • Newsletter
  • Kontakt
Menü
  • Beste Agentur finden
    • 3D-Animationsagentur
    • Designagentur
    • Digitalagentur
    • Drupal Agentur
    • Internetagentur
    • Joomla Agentur
    • Marketing Agentur
    • Online-Marketing-Agentur
    • PR Agentur
    • SEO Agentur
    • Shopware Agentur
    • Social Media Agentur
    • TYPO3 Agentur
    • Webagentur
    • Webdesign Agentur
    • Werbeagentur
    • WordPress Agentur
  • Magazin
    • Bloggen
    • Buchhaltung
    • Büro
    • Content Marketing
    • E-Commerce
    • Finanzen
    • Freelancer
    • Green Revoluzzer
    • Hardware
    • Künstliche Intelligenz (KI)
    • Marketing
    • Marktübersichten
    • Online-Marketing
    • Schrift & Grafik
    • Selbstständigkeit
    • Social Media
    • SEO
    • Software
    • UX Design
    • Webdesign
    • WordPress
  • Newsletter
  • Kontakt

< dr. web > » Webdesign » So verbessern Sie mit Bildern und Grafiken das Webdesign Ihrer Website (5 Tipps)

So verbessern Sie mit Bildern und Grafiken das Webdesign Ihrer Website (5 Tipps)

  • Aktualisiert am 16. Februar 2023
  • von Michael Dobler
  • Webdesign
  •  

Haben Sie schon einmal eine Webseite mit einem schlichten Design besucht und gedacht: „Kein Problem! So etwas bekomme ich auch selbst im Handumdrehen hin. Die Webdesign Bilder? Einfach nur klasse!“? Pustekuchen…

WordPress selbst aufsetzen und das Standard-Theme „Twenty“ auswählen schaffen Sie vielleicht noch selbst. Doch viel weiter kommen Sie vermutlich nicht.

Denn Webentwicklung und Webdesign will wie jedes Handwerk gelernt sein. Mit wenigen Mausklicks ist da nichts zu holen. Hinter dem vermeintlich schlichten Design steckt mehr als Sie das in Ihrer ersten Euphorie geglaubt haben.

Trösten Sie sich. So geht es vielen Menschen. Denn professionelle Webdesigner haben ein paar Tricks auf Lager. Die erstellen eine schlichte und gut zu bedienende Website. Aber bis die live geht, ist einiges an Handwerksarbeit nötig. Trotzdem gibt es ein paar Tricks, die jeder Seitenbetreiber beherzigen sollte und relativ einfach erlernen kann.

In diesem Artikel erfahren Sie, wie Sie mit einfachen 5 Tipps ähnlich gute Ergebnisse wie die Pros erzielen. Denn mit Bildern und Grafiken lässt sich Ihre Webseite extrem aufwerten.

Es kam zu einen Fehler. Wahrscheinlich ist das unsere Schuld. Schreiben Sie uns gerne an hallo@drweb.de
✓ Sie haben sich erfolgreich zum Dr. Web Newsletter angemeldet

Dr. Web Newsletter

Tipps, Tricks, Tools und Ratgeber. Einmal im Monat frisch gedruckt in deinem Mail-Postfach.
Webdesign: Digitales Handwerk
Webdesign: Digitales Handwerk. Quelle Bild: Freepik

Tipp 1 Webdesign Bilder & Grafiken: Verwenden Sie Stock-Medien

Das Budget für die Erstellung der Website ist knapp. Für individuell erstellte Grafiken und ein Fotoshooting ist kein Geld eingeplant. Talentierte und altruistische Grafikdesigner und Fotografen zählen meistens nicht zum engsten Freundeskreis.

Ebbe in der Budgetkasse? Dagegen schafft nur der Besuch einer Plattform für Stock-Medien Abhilfe.

Betreiber von Stock-Medien-Sammlungen wie Shutterstock, Adobe oder Freepik bieten Bilder und Grafiken Ready To Go. Und diese Stockmedien sind im Vergleich zu Individualarbeit preisgünstig.

Der Webdesigner muss nicht nur im Budget bleiben, sondern hat auch eine Deadline einzuhalten.

Individuelle Grafiken und Fotos kosten mehr Zeit und Geld. Eigentlich sind die Einzelanfertigungen das Optimum für Ihre Website. Denn nur so strahlt Ihre Website einen wirklich „uniquen Touch“ aus.

Doch leider müssen wir im Webdesign wie in anderen Branchen auch mit Budget- und Zeitzwängen leben und Kompromisse eingehen. Und weil das Leben einer Webdesign Agentur kein Wunschkonzert ist, wenden wir uns den so genannten Stock-Medien zu:

Bilder von Freepik sind z.B. eine gute Kompromisslösung. Dort finden Sie auch sogar kostenlose Ressourcen. Und die kostenpflichtigen Illustrationen, Grafiken und Vektoren sind billiger als das Handgestrickte.

Alle Anbieter unterziehen ihre Lieferanten einer Qualitätskontrolle. Sie kaufen also Qualität zu relativ günstigen Preisen ein.

Die Ressourcen sind in der Regel lizenzfrei. Was heißt das? Lizenzfrei meint, dass Sie nur einmalig für ein Bild bezahlen und im Gegenzug ein dauerhaftes Nutzungsrecht erhalten.

Für alle, die eine Website Marke Eigenbau betreiben: Mit einem Bildbearbeitungsprogramm, etwas Geschick und Frustrationstoleranz, können Sie viele lizenzfreie Bilder von Freepik selbst individualisieren. Wir bei Dr. Web benutzen für die Bildbearbeitung häufig Photopea, und zahlen den Entwicklern gerne etwas dafür.

Die getunten Bilder, Grafiken und Ressourcen führen idealerweise zu einer höheren Verweildauer und einem verbesserten Nutzerlebnis. Das wiederum honoriert der sagenumwobene Google-Algorithmus, und lässt Ihre Inhaltsseiten vielleicht höher ranken. Webdesign ist also auch ein Faktor, der gutes SEO ausmacht.

Tipp 2 Webdesign Bilder & Grafiken: Setzen Sie immer auf die gleichen Farben

Leider erscheinen die Bild- und Grafikwelten nicht aus einem Guss. Auch das mag dem Zeitdruck geschuldet sein (oder schrägen Vorlieben der Auftraggeber). Die für das Websiteprojekt verwendeten Ressourcen sollten jedoch eine große visuelle Klammer bilden und die Marke konsistent nach außen kommunizieren. Oft reichen schon zwei Primärfarben/Farbfilter aus, damit ein stimmiges, visuelles Gesamtbild entsteht.

Webdesign: Farbwahl
Webdesign: Farbwahl.  Quelle Bild: Freepik

Tipp 3 Webdesign Bilder & Grafiken: Achten Sie auf den Kontrast

Der Kontrast ist einer der Aspekte, der im Grafikdesign am meisten kontrolliert werden muss. Der Kontrast sollte Lesbarkeit und Persönlichkeit verleihen und dazu beitragen, dass eine klare Struktur hervorsticht.
Wählen Sie eine kontrastierende Farbpalette für Text, Schriftarten und Grafiken. Dank des Kontrasts können Sie dafür sorgen, dass das gesamte Webdesign Aufmerksamkeit erregt.

Kontrastieren Sie immer dunklen Text auf hellem Hintergrund. Wenn Sie einen langen Text haben, ist es immer besser, helle Hintergründe zu verwenden.
Sie erleichtern ihren Besuchern das Lesen und verhindern außerdem, dass das Auge müde wird. Dies bedeutet nicht, dass Sie keine dunklen Hintergründe verwenden können, aber es ist angemessener, sie unter Überschriften oder kürzeren Texten zu verwenden.

Tipp 4 Webdesign Bilder & Grafiken: Arbeiten Sie mit Weißraum

Viele Webseiten wirken schon in den ersten Sekunden des Betrachtens überladen und überfordern viele Besucher. Das Ergebnis können Sie sich vorstellen, die Besucher verlassen die Webseite schnell wieder und suchen nach einer Webseite, die ihren Vorstellungen entspricht.
Mit der Schaffung von Weißraum können Sie Überlagerung verhindern und die Elemente auf Ihrer Webseite „atmen lassen“.

Das Umgeben der Texte, Bilder und Grafiken mit Weißraum kann dazu beitragen, ein fließendes und elegantes Design zu schaffen. Gratis Fotos aus Stock-Archiven integrieren häufig Weißraum im Hintergrund.

Tipp 5 Webdesign Bilder & Grafiken: Vereinfachen Sie im Zweifelsfall immer

Einfachheit ist die größte Raffinesse. Beginnen Sie mit einfachen, geradlinigen Bildern und Grafiken. Es wird Ihnen helfen, Ihren eigenen Stil zu finden. Wenn Sie an Leichtigkeit gewinnen, können Sie mehr Fotos und Grafiken verwenden, ohne dass Ihre Seite überfüllt wirkt.

Halten Sie das Design einfach. Stellen Sie sicher, dass jede Ressource einen Grund hat,
warum sie in Ihrem endgültigen Webdesign enthalten ist.

Webdesign: das fertige Endprodukt.
Webdesign: das fertige Endprodukt. / Quelle: Freepik

FAQ Webdesign Bilder:

Auch wenn dieser Artikel viele Aspekte des Themas behandelt, können Fragen offen sein. Deshalb sehen kommen hier nun einige häufig gestellte Fragen und Antworten.

Sind Stock-Fotos für Webseiten kostenlos?

Sie finden in Stock-Archiven sehr viele kostenlose Fotos, Grafiken, Videos und Audios. Bei der Verwendung von kostenfreien Stock-Medien ist jedoch anzugeben, woher das Foto oder die Grafik kommt. Am besten gelingt dies, indem Sie die Quelle direkt unter dem verwendeten Stock-Medium auf Ihrer Webseite angeben.

Welche Bilder verwende ich am besten auf meiner Webseite?

Am besten verwenden Sie auf Ihrer Webseite Bilder, Grafiken, Illustrationen und Animationen, die Ihr Unternehmen und Ihre Produkte optimal repräsentieren. Keine bahnbrechende Erkenntnis, oder? In Stock- Archiven finden Sie eine große Auswahl an Medien, die auch zu Ihrer Marke und Ihren Vorstellungen passen. Nutzen Sie aber auch eigene Medien, sodass Ihre Webseite authentisch wirkt und die Besucher Ihre Produkte kennenlernen können.

Wie groß sollte ein Bild oder eine Grafik für Webseiten sein?

Grafiken und Fotos für Webseiten sollten auf keinen Fall zu groß sein, denn sonst werden viele Speicher-Kapazitäten belegt und die Webseite könnte zu langsam laden. Es ist zu empfehlen, Fotos, Grafiken und Illustrationen zu komprimieren, um so wenig Speicherplatz wie möglich zu belegen. Mit entsprechenden Online-Diensten oder Bildbearbeitungsprogrammen gelingt Ihnen die Komprimierung in wenigen Minuten.

Michael Dobler

Michael Dobler

Ich bin der Herausgeber von Dr. Web. Um praxisfit zu bleiben, unterstütze ich darüber hinaus Kunden bei der digitalen Kundengewinnung und Kundenbindung. Erste eigene Gehversuche im Internet unternahm ich 1999 mit einem Kinomagazin. Nach 15 Jahren in Lohn und Brot, u.a. als Projektmanager für digitale Medien, machte ich mich schließlich Ende 2005 selbständig. Das war die beste berufliche Entscheidung meines Lebens.

Inhaltsverzeichnis

Agenturpartner in München

Edit Content

WebOptimizer

Kunden kommen nicht von selbst – auch nicht im Internet. Wir arbeiten schnell und effektiv: Während andere noch reden, erobern wir für Sie schon neue Kunden.

— Dr. Heiner Etzler,
Inhaber
Alle Webdesign-Agenturen →

Lust auf mehr?

14 Best Practices, die Sie für einen erfolgreichen Internetseite Relaunch beachten sollten

Was bewegt einen Unternehmer dazu, seine Internetseite von Grund auf neu auszurichten? Nun, die Gründe für einen Internetseite Relaunch einer können sehr vielfältig sein. Oft spielt ein veraltetes Design eine Rolle. Dieser Grund ist nicht so trivial, wie er vielleicht erscheint. Denn ein unmodernes Aussehen der Webseite kann Besucher und damit potenzielle neue Kunden abstoßen.

KI GPT-4: werden Webdesigner und sonstige Erdlinge ihren HAL-Moment erleben?

Wo ist dieser verdammte Aus-Schalter?” Dies waren die letzten Worte von David Bowman, dem Anführer einer Widerstandsgruppe Webdesigner, denen es gelang zum vermeintlichen WDN-Zentralcomputer vorzudringen, bevor sie von Wächterdroiden eliminiert wurden.

Microsoft Designer to the people: KI Power Webdesign und Grafikdesign?

Ein Webdesign selbst erstellen? Ist bei mir schon ewig her. 2006 muss das gewesen sein. Ich durfte für eine Rechtsanwaltskanzlei ran. Typische Erstaufträge. Freundes- und Bekanntenkreis abgrasen eben. Der damalige Freund einer Freundin arbeitete dort und brachte mich ins Spiel.

Schreibe einen Kommentar Antworten abbrechen

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

Fachmagazin für Online-Marketing. Seit 1997. Wissen, Software, Dienstleister: Wir bringen die Digitalisierung Ihres Unternehmens praxisnah voran. ✅

Für Unternehmer: Finden Sie Ihre Agentur in…

  • Augsburg
  • Basel
  • Bayreuth
  • Bergisch-Gladbach
  • Berlin
  • Bern
  • Bielefeld
  • Bonn
  • Bremen
  • Chemnitz
  • Darmstadt
  • Dortmund
  • Dresden
  • Duisburg
  • Düsseldorf
  • Essen
  • Esslingen
  • Flensburg
  • Frankfurt
  • Freiburg
  • Gelsenkirchen
  • Goslar
  • Hamburg
  • Hamm
  • Hannover
  • Heidelberg
  • Innsbruck
  • Karlsruhe
  • Kassel
  • Köln
  • Leipzig
  • Leverkusen
  • Mainz
  • Mannheim
  • München
  • Münster
  • Nürnberg
  • Offenburg
  • Osnabrück
  • Passau
  • Potsdam
  • Regensburg
  • Reutlingen
  • Rosenheim
  • Rostock
  • Salzburg
  • Starnberg
  • Stuttgart
  • Wien
  • Wiesbaden
  • Wuppertal
  • Zürich
  • Augsburg
  • Basel
  • Bayreuth
  • Bergisch-Gladbach
  • Berlin
  • Bern
  • Bielefeld
  • Bonn
  • Bremen
  • Chemnitz
  • Darmstadt
  • Dortmund
  • Dresden
  • Duisburg
  • Düsseldorf
  • Essen
  • Esslingen
  • Flensburg
  • Frankfurt
  • Freiburg
  • Gelsenkirchen
  • Goslar
  • Hamburg
  • Hamm
  • Hannover
  • Heidelberg
  • Innsbruck
  • Karlsruhe
  • Kassel
  • Köln
  • Leipzig
  • Leverkusen
  • Mainz
  • Mannheim
  • München
  • Münster
  • Nürnberg
  • Offenburg
  • Osnabrück
  • Passau
  • Potsdam
  • Regensburg
  • Reutlingen
  • Rosenheim
  • Rostock
  • Salzburg
  • Starnberg
  • Stuttgart
  • Wien
  • Wiesbaden
  • Wuppertal
  • Zürich

Agentur nach Schwerpunkt finden

  • Beste Agentur finden
  • Designagentur finden
  • Digitalagentur finden
  • Drupal-Agentur finden
  • Online Marketing Agentur finden
  • SEO Agentur finden
  • Webdesign-Agentur finden
  • Werbeagentur finden
  • WordPress Agentur finden
  • Beste Agentur finden
  • Designagentur finden
  • Digitalagentur finden
  • Drupal-Agentur finden
  • Online Marketing Agentur finden
  • SEO Agentur finden
  • Webdesign-Agentur finden
  • Werbeagentur finden
  • WordPress Agentur finden

Aus unserem Magazin

  • Buchhaltung
  • Content Marketing
  • Design
  • Digitalisierung
  • E-Business
  • E-Commerce
  • E-Mail-Marketing
  • Finanzen
  • Freelancer
  • Hosting
  • HTML/CSS
  • Inspiration
  • IT Sicherheit
  • Jobs & Karriere
  • Online-Marketing
  • Programmierung
  • Public Relations
  • Rechtliches
  • Responsive Design
  • SEA – Suchmaschinenwerbung
  • SEO
  • Showcases
  • Social Media
  • Tipps, Tricks & Tutorials
  • Tools
  • UX Design
  • Webdesign
  • WordPress
  • Buchhaltung
  • Content Marketing
  • Design
  • Digitalisierung
  • E-Business
  • E-Commerce
  • E-Mail-Marketing
  • Finanzen
  • Freelancer
  • Hosting
  • HTML/CSS
  • Inspiration
  • IT Sicherheit
  • Jobs & Karriere
  • Online-Marketing
  • Programmierung
  • Public Relations
  • Rechtliches
  • Responsive Design
  • SEA – Suchmaschinenwerbung
  • SEO
  • Showcases
  • Social Media
  • Tipps, Tricks & T