• Skip to main content
  • Skip to primary sidebar
  • Skip to footer

Awantego

  • Unique Content
  • Lead Pilot
  • Websites
  • Blog
  • Kontakt
You are here: Home / Lexika / Webdesign

17. März 2020 by Claudia Rothenhorst

Webdesign

Der Begriff Webdesign bzw. Webgestaltung bezieht sich als eine Disziplin des Mediendesigns auf die visuelle und strukturelle Gestaltung von Webseiten für das World Wide Web. Die technische Implementierung von Webpräsenzen wird dagegen mit dem Begriff Webentwicklung bezeichnet.

Inhalt

  • Historische Entwicklung
  • Was ist Webdesign?
  • Webdesign-Elemente im Überblick
  • Webdesign-Tipps für die perfekte Homepage

Historische Entwicklung

Nach einigen anfänglichen Schwierigkeiten veröffentlichte Microsoft 1996 seinen ersten Webbrowser für die breite Öffentlichkeit, der mit eigenen Eigenschaften und Elementen versehen war. So war der Internet Explorer der erste Internetbrowser, der volle Unterstützung für Formatvorlagen (HTML-Programmierung) mit sich brachte, die zu dieser Zeit eine exotische Funktionalität darstellten. Man begriff binnen kurzer Zeit das Potenzial der HTML-Programmierung, die es ermöglichte, komplexe Layouts zu erzeugen, die sonst nicht realisiert werden konnten.

Zu dieser Zeit hatten schönes Design und gute Ästhetik im Webdesign Vorrang, weswegen keine Aufmerksamkeit auf eine gute User Experience und Webzugänglichkeit gelegt wurde. HTML-Webseiten waren jedoch durch die Grenzen des HTML-Standards in ihren Designoptionen ziemlich beschränkt. Um komplizierte und ansprechende Designs zu entwickeln, mussten Webdesigner komplizierte Tabellenstrukturen einsetzen, die für diese Einsatzszenarien überhaupt nicht vorgesehen waren. Um dieses Problem zu lösen und um Webdesignern ein performantes Tool für die optische Gestaltung von Webseiten zur Verfügung zu stellen, wurde im Dezember 1996 von der W3C CSS (Cascading Style Sheets) eingeführt. Lesen Sie hier alles zu CSS.

Web Design
HTML oder CSS?

CSS ermöglichte, das volle Potenzial des World Wide Web für die Webgestaltung zu nutzen, ebenso wurden noch im selben Jahr ebenso allgemeine Protokolle eingeführt, die eine Standardisierung des World Wide Web vorantrieben. Durch diese Entwicklung wurden jedoch weiter Unternehmen davon abgehalten, neue Webbrowser und Websprachen zu entwickeln, was das WWW eventuell als Ganzes verändern hätte können.

Was ist Webdesign?

Webdesign ist das, was das ganzheitliche Design erzeugt, wenn Sie eine Webseite benutzen. Im weiten Sinne handelt es sich dabei um den Prozess der Planung und des Aufbaus aller Elemente einer Webseite, von dem Layout (Struktur) bis hin zu Schriftarten, Farbkombinationen, Bildern, Videos und Grafiken. Webdesign setzt sich aus unterschiedlichen Komponenten zusammen, die als eine Einheit fungieren, um das fertige Erlebnis einer Webpräsenz zu erzeugen, hierzu gehören:

  • Grafikdesign
  • User Experience Design
  • Interface Design
  • Content Erstellung
  • Suchmaschinenoptimierung (SEO)

Diese einzelnen Elemente bestimmen, wie eine Webpräsenz auf verschiedenen Geräten aussieht und sich anfühlt.

Die Webgestaltung unterscheidet sich von der Webentwicklung, die das eigentliche Programmieren darstellt und festlegt, wie eine Website funktioniert. Wenn Sie eine Webseite erstellen möchten, dann benötigen Sie in der Regel sowohl Webdesigner als auch Webentwickler, denn diese beiden Gebiete haben dennoch viele Gemeinsamkeiten, sodass es auch Webdesigner gibt, die sowohl Designer als auch Entwickler sind und somit verschiedene Fertigkeiten beherrschen.

Webdesign-Elemente im Überblick

Web Design
Was gehört alles zum Web Design?

Die Gestaltung und der Nutzen von Webseiten werden an entsprechende Zielgruppen ausgerichtet. Im Mittelpunkt aller Aktivitäten steht das Ziel, das der Kunde mit seinem Online-Angebot erreichen möchte. Je nach Zielgruppe, benötigter Usability und gewünschtem Effekt entsteht so ein individuelles Design, das die Geschäftsprozesse des Kunden unterstützt. Die wichtigsten Elemente bei der Erstellung des passenden Webdesigns sind:

  • Konzeption
  • Gestaltung
  • Technik
  • Inhalte
Diese Elemente muss man nicht unbedingt in dieser Reihenfolge realisieren. Es kommt immer wieder vor, dass die Bearbeitung vieler Aspekte parallel oder auch asynchron läuft.
  • Konzeption
    Im Rahmen der Konzeptionsphase muss man den Zweck einer Webpräsenz genau definieren, des Weiteren wird die Zielgruppe festgelegt und das weitere Vorgehen definiert. In diesem Zusammenhang wird auch ein Zeitplan erstellt, in dem die Meilensteine festgehalten werden.
  • Gestaltung
    Die Gestaltung bezieht sich nicht nur auf das visuelle Design der Webpräsenz, sondern auch auf Funktionalität und Effekte. Eine besonders bedeutende Rolle kommt der Usability (Benutzerfreundlichkeit) zu. Sowohl in der visuellen als auch in der technischen Gestaltung des Webauftritts muss darauf geachtet werden, dass sich die Benutzer wohlfühlen und alle Informationen und Funktionalitäten schnell und unkompliziert erreichen.
  • Technik
    Im Rahmen der technischen Gestaltung definieren sich sämtliche Funktionalitäten, welche die Webseite bieten soll. Zum Grundgerüst der Webpräsenz gehört auch der HTML-, CSS- und JavaScript-Code. Die Struktur und das Layout der Webseite werden in diesem Schritt so umgesetzt, dass diese Version bereits nahe am Endergebnis ist, oftmals fehlen jedoch noch textuelle und visuelle Inhalte, wie beispielsweise Texte und Inhaltsgrafiken.
  • Inhalte
    Inhalte der Webseite sollten verständlich sein und dem Besucher einen Mehrwert bieten, zudem können die Texte können auch ruhig umfassend sein. Textuelle Inhalte lassen sich mit Videos und Bildern hervorragend hervorheben und benutzerfreundlich gestalten. Nichtssagende Texte, die mit Füllwörtern angehäuft sind, sollte unbedingt vermieden werden.
Mehr zum Thema:
Was ist Content Marketing?

Webdesign-Tipps für die perfekte Homepage

  1.  Aufräumen
    Einer der häufigsten Anfängerfehler im Webdesign ist ein unordentlicher Bildschirm. Viele Webdesigner haben eine Liste mit all den Funktionen und Features, die sie in ihre Webseite einbauen möchten. Weil sie es oft nicht besser wissen, werfen sie all diese Dinge auf dieselbe Seite. Dies führt jedoch in 99 Prozent der Fälle zu einem schlechten Nutzererlebnis und einer minderwertigen Benutzerfreundlichkeit der Website, weil alles unübersichtlich und kontraintuitiv erscheint, daher sollten Sie Ihre Designs auf die essenziellen Dinge prüfen. Falls ein Element oder Feature nichts Positives zum Gesamterlebnis führt, entfernen Sie es.
  2. Ausreichend Weißräume nutzen
    Web Design
    Die perfekte Homepage

    Der Begriff Weißraum (auch Negativraum) wird in der bildenden Kunst als Fachbegriff für Bereiche verwendet, die keine Aufmerksamkeit erregen sollen. Auch im Webdesign lässt sich der Negativraum äußerst effektiv einsetzen. So sollten Sie beispielsweise Ihre wichtigsten Elemente mit Weißraum einschließen, denn je mehr Negativraum sich um ein Element befindet, desto mehr Aufmerksamkeit erhält es.

  3. Leiten Sie den Blick Ihres Besuchers durch visuelle Hierarchie
    Der Begriff “visuelle Hierarchie” bezieht sich auf die verschiedenen visuellen Elemente wie Größe oder Platzierung. Sie lassen sich verwenden, um die Aufmerksamkeit des Besuchers gezielt zu lenken. Ein großer Titel oben auf einer Seite und winzige Warnhinweise am Ende sind ein treffliches Beispiel dafür, um visuelle Hierarchie optimal zu nutzen, um bestimmte Seiten-Elemente vor anderen vorzuziehen.
  4. Wählen Sie gezielt FarbenErzeugen Sie ein Ihrem Webdesign eine harmonische und klar strukturierte Farbhierarchie. Nutzen Sie jeweils verschiedene Farben für Ihre primären Elemente, sekundären Elemente und die Highlights. Des Weiteren sollten Sie bei einheitlichen Motiven bleiben. Sobald Sie sich für eine Farbpalette entschieden haben, nutzen Sie sie kontinuierlich.
  5. Fotos und Bilder sind erwünscht
    Nutzen Sie echte Menschen, denn Erfahrungen haben gezeigt, dass Bilder von Menschen dazu neigen, Besucher mehr einzubeziehen, insbesondere Bilder Ihrer Mitarbeiter oder Ihrer Kunden.

Ähnliche Artikel

  • Die Rolle von Unique Content in der Content… 12. Dezember 2019
  • Wie wirken sich Produkteigenschaften auf… 18. Oktober 2019
  • 7 visuelle Techniken und Strategien für wirksame… 15. April 2019
  • So treffen Kunden Kaufentscheidungen 21. August 2019

Filed Under: Allgemein, Webdesign Tagged With: Benutzer, Design, Gestaltung, Grafiken, Homepage, Inhalte, Text, Webseite

Primary Sidebar

Neueste Artikel im Blog

Produktsuche online

Produktsuche im E-Commerce: So suchen Kunden nach Produkten

29. Oktober 2020

Was sind Produktkategorien im Marketing, wie werden diese erstellt und zu welchem Zweck?

8. Oktober 2020

Produktpräsentation im Online Shop

Produktpräsentation für E-Commerce: So verkaufen Sie online richtig

2. Oktober 2020

AXCD 2020: Die Content Konferenz

AXCD 2020: Wir sind dabei. Und Sie?

25. September 2020

Wirkungsvolle Tipps, um die Konversionsrate in Ihrem Online Shop zu steigern

11. September 2020

7 Tipps für professionelle Produktbeschreibungen

14. August 2020

Produktvorteile

So bringen Sie Produktvorteile in Ihren Produktbeschreibungen auf den Punkt

5. August 2020

So erstellen Sie Texte für Ihre Produktpalette

31. Juli 2020

5 Regeln einer erfolgreichen Produktpräsentation im Online Shop

24. Juli 2020

Kontakt zur Agentur

Agentur Awantego
Tel.: +49(0)711/48890-50
E-Mail: info@awantego.com

Anschrift
Breitscheidstraße 65
70176 Stuttgart

Traumjob bei Awantego:

  • Vertriebs-Mitarbeiter Online Marketing
  • Online-Marketing Spezialist (m/w/d)
  • Student / Praktikant (m/w/d)
  • Software-Entwickler php/Javascript (m/w/d)
  • Praktikant Online-Marketing (m/w/d)

Downloads / Tutorials

  • Downloads
  • Tutorials

Weitere Anleitungen und Tutorials finden Sie im Blog von Awantego.com

Am meisten gelesen

  • Unique Content – Die Technik dahinter
  • Marketing Lexikon
  • Marketing Automation
  • Mehr Kunden mit Newsletter-Marketing
  • Was kostet Ihre neue Website?
  • Was ist WordPress?

Weitere Beiträge im Blog

Online Shops und Corona Krise: Welche Inhalte kommen gut an?

6. Mai 2020

Produktbeschreibungen für Online Apotheken erstellen

Produktbeschreibungen für Online Apotheken

30. April 2020

Amazon_SEO_Produktbeschreibungen Amazon

Produktbeschreibungen für Amazon: So erstellen Sie ansprechende Produkttexte

18. April 2020

5 Express Tipps für Online Shops in der Corona Krise

7. April 2020

Vorteile der automatischen Texterstellung für Unternehmen

1. April 2020

automatische Texte für E-Commerce

So schreiben Sie gute Kategorietexte für Ihren Online Shop

26. März 2020

automatische Texte erstellen

Automatische Texterstellung: Schreiben Sie Ihre Texte immer noch selbst?

20. März 2020

WooCommerce Tutorial: Produktseiten mit Elementor erstellen

2. März 2020

Konsumentenverhalten wirs immer mehr digitalisiert

Konsumentenverhalten 2020: Neuste Erkenntnisse aus der Konsumentenforschung

24. Februar 2020

KI

Wie können Online Händler von KI profitieren?

30. Januar 2020

Retouren

Tipps zur Senkung der Retourenquote

20. Januar 2020

automatische Textgenerierung

Automatische Textgenerierung für natürlich wirkende Texte aus Daten

3. Januar 2020

Die Rolle von Unique Content in der Content Marketing Strategie

12. Dezember 2019

Aktuelle Tutorials

  • Yoast nutzen – So nutzen Sie Yoast für Ihren Text

  • Ahrefs Tutorial

  • Tutorial: Tablepress – einfach eine Tabelle erstellen

  • PDFs und Lead-Magnete mit ActiveCampaign versenden

  • WordPress umziehen

Footer

Kontakt

Digital-Agentur Awantego
Tel.: +49 (0)711/48890-50

E-Mail: info@awantego.com
Web: www.awantego.com

Anschrift
Breitscheidstraße 65
70176 Stuttgart

Jobs bei Awantego

Offene Stellen bei Awantego

  • Vertriebs-Mitarbeiter Online Marketing
  • Online-Marketing Spezialist (m/w/d)
  • Student / Praktikant (m/w/d)
  • Software-Entwickler php/Javascript (m/w/d)
  • Praktikant Online-Marketing (m/w/d)

Jetzt bewerben

E-Mail: jobs@awantego.com
Tel.: 0711-4889050

Gastautoren

Informationen für Gastautoren

Online Marketing Lexikon

Im Marketing-Lexikon von Awantego erläutern wir alle wichtigen Begriffe zum Thema Online-Marketing kompakt und verständlich.

Die wichtigsten Themen:

Automated Unique Content

Websites

Lead Pilot

Was kostet eine Website?

Online Marketing Downloads

Online Marketing Tutorials

Wichtige und anspruchsvolle Aufgaben beschreiben wir in der Rubrik
WordPress Tutorials .

Downloads & Anleitungen

Im Download-Bereich von Awantego.com finden Sie Anleitungen, Tutorials und eBooks rund um das Thema Marketing und WordPress

Neueste Beiträge im Blog

Mit diesen Tipps verhindern Sie den Kaufabbruch

Warum ist USP so wichtig für Ihr Marketing?

So erstellen Sie Produktbeschreibungen für erklärungsbedürftige Produkte

Machen Sie Ihren Online Shop bekannt: 5 wirkungsvolle Tipps für mehr Kunden

Produktnutzen beschreiben: Tipps für gute Produktbeschreibungen

Darum geht’s im Blog

Automatic Unique ContentAutomatische TexteContentContent-MarketingE-CommerceFacebookKunden gewinnenMarketingOnline-MarketingOnline ShopProduktbeschreibungenSEOSocial MediaSuchmaschinenoptimierungTextUnique ContentUnternehmenWebsiteWerbungWordpress
  • Jobs
  • Blog
  • Datenschutz
  • Disclaimer
  • Impressum
  • Awantego.com in English

© 2021 · Awantego.com ·