Professionelles Webdesign: Wie Sie Websites gestalten, die überzeugen!

Viele denken bei „Webdesign“ nur an die visuelle Darstellung einer Website. Doch vor allem auch die Funktionalität und strukturelle Gestaltung einer Internetseite sind wichtige Kriterien für einen erfolgreichen Webauftritt.

Themen in diesem Artikel:

• Meilensteine bei der Entwicklung des Webdesign
• Aktuelle Entwicklungen in Sachen Webdesign
• Trends im Überblick
• Professionelle Websites im Check – was gibt es zu beachten?

Meilensteine bei der Entwicklung des Webdesign

• 1991 – 1993: Geburt des World Wide Web (WWW)
• 1993: Die meisten Browser am Markt basieren auf Unix, was das Lesen von Texten erschwert. Einheitliche grafische Designelemente, z.B. Bilder, existieren nicht.
• 1994: Das World Wide Web Consortium (W3C) entsteht, wenig später stellt Netscape Communications den Browser Netscape Navigator vor. Netscape entwickelt eigene HTML-Elemente, z.B. um selbstständig Hintergrundfarben zu ändern und Texte auf Webseiten zu formatieren.
• 1996 – 1999: Beim „Browser-Krieg“ kämpfen Microsoft und Netscape um die Vorherrschaft ihrer Browser. Es entstehen neue Technologien wie das dynamische HTML, JavaScripte und Formatvorlagen. Das Webdesign gewinnt an Fahrt.
• 1996: Microsoft bringt seinen ersten wettbewerbsfähigen Browser auf den Markt, der hinsichtlich HTML-Programmierung ein hohes Potenzial bietet und z.B. komplizierte Mehrsäulenlayouts ermöglicht. Design und Ästhetik stehen beim Webseitenauftritt im Vordergrund, Funktionalitäten wie schnelle Ladezeiten und Nutzerführung sind zweitrangig. Mit komplexen Tabellenstrukturen und Tricks aller Art wird das Layout aufpoliert.
• 1996: Das W3C führt Cascading Style Sheets (CSS) ein – eine Gestaltungssprache für elektronische Dokumente, die Präsentationen und Layouts unterstützt. Die Webzugänglichkeit verbessert sich erheblich. Auch Flash, eine Software für Animationen, wird entwickelt.
• 2000: Der Internet Explorer von Microsoft ist der erste Browser, der vollständig HTML 4.01 und CSS 1 sowie das PNG-Format unterstützt. Nach dem Verkauf von Netscape geht Microsoft im Browser-Krieg in Führung.
• Ab 2000: Die Browser-Kriege finden mit dem Markteintritt neuer Open Source Browser ein Ende. Diese Browser entwickeln sich in den folgenden Jahren sehr schnell und unterstützen immer mehr Standards.

Aktuelle Entwicklungen in Sachen Webdesign

In den letzten Jahren hat sich sehr viel auf dem Gebiet der Webgestaltung getan. Das wird uns besonders bewusst, wenn wir ältere Webseiten – die es immer noch gibt – mit modernen Internetauftritten vergleichen.

Sowohl bei der Architektur als auch Bedienbarkeit fallen zum Teil gravierende Unterschiede auf.

Und natürlich lassen sich auch jedes Jahr neue Trends ausmachen.

Allerdings sollten Unternehmen nicht alle hippen Neuerungen einfach übernehmen, sondern sich genau überlegen, ob sie tatsächlich einen Mehrwert für ihre Website bieten.

Trends im Überblick

• Moderne Webtechnologien wie HTML5 und CSS3 sorgen für strukturierte Websites. So bietet HTML5 neue Funktionen, z.B. Audio, Video, lokale Speicher, dynamische 2D- und 3D-Grafiken, die sich ohne HTML5 nur mit Plug-ins realisieren lassen. In CSS3 kann man jetzt unter anderem Elemente transformieren, d.h. verschieben, skalieren, krümmen und drehen.
  Beispiel: http://www.species-in-pieces.com
• Auch das Flat Design, ein grafisch minimalistischer Gestaltungsstil mit reduzierten Formen und klaren Farben, wird immer populärer. Googles Material Design baut auf diese Ästhetik auf. Das Motto lautet hier: Weniger ist mehr.
  Beispiel: http://www.beoplay.com/products/beoplayh6#at-a-glance
• One Page Design und Infinite-Scrolling stehen hoch im Kurs. Da es sich mit Touchscreens viel schneller scrollen lässt und die Buttons komfortabel betätigt werden können, laufen die Einseiter den mehrseitigen Webauftritten den Rang ab.
  Beispiel: http://www.onepager.de
• Auch Parallax-Scrolling (Scrolling-Effekt mit unterschiedlich schnell animierten Hintergründen) gehört zu den Megatrends. Die „Bewegungsparallaxe“ nutzt komplexe Animationen zur Benutzerführung und unterstützt wirksam das Storytelling. Die Technik wurde in der Vergangenheit schon bei Videospielen und 2013 von Nike eingesetzt. HTML 5 und CSS 3 begünstigen beim Parallax-Scrolling die Entwicklung von Animationen und Übergängen.
  Beispiel: http://www.dangersoffracking.com
• Responsive Webdesign gehört inzwischen zu unserem Alltag. Unternehmen, die ihre Seiten noch nicht für Smartphone, Tablet & Co. optimiert haben, sollten sich schnell überlegen, wie sie diese für mobile Geräte userfreundlich aufbereiten können.
• Weiterhin erregen auch vollflächige Fotos und Videos viel Aufmerksamkeit bei den Usern. Besonders gut machen sich diese Eyecatcher auf einseitigen Websites bzw. als Start-Screen für komplexere Websites.
  Beispiel: http://www.uvex-sports.de/de

Professionelle Websites im Check – was gibt es zu beachten?

• Bei Ihrem Internetauftritt sollten Sie checken, ob das Layout zeitgemäß ist und wirklich zu Ihrem Unternehmen passt. Seiten, die schon seit zehn Jahren nicht mehr gewartet wurden, sind eher kontraproduktiv und werfen ein schlechtes Licht auf die Firma.
• Auch schnelle Ladezeiten sind sehr wichtig. Muss der Besucher ewig warten, bis sich die Seite geladen hat, ist er ganz schnell wieder weg …
• Des Weiteren sorgt eine übersichtliche Navigation dafür, dass die Nutzer Ihre Produkte und Dienstleistungen schnell finden und nicht gleich wieder abspringen.
• Wenn dann noch die Inhalte, z.B. Produktbeschreibungen, informativ und allgemeinverständlich aufbereitet sind, repräsentative Bilder den Content bereichern und die Inhalte regelmäßig upgedatet werden, ist das schon die halbe Miete.
• Bauen Sie aber auch zu Ihren Usern / Kunden eine persönliche Beziehung auf, indem Sie ihnen ihre Ansprechpartner vorstellen (am besten mit Foto).
• Der Nutzer muss außerdem die Möglichkeit bekommen, von jeder Seite aus Kontakt zu Ihrem Unternehmen aufzunehmen und z.B. per Call-To-Action-Button aktiv zu werden: Er sollte in der Lage sein, mit wenigen Mausklicks ein Produkt zu kaufen, eine Dienstleistung zu buchen, mehr Infos anzufordern etc.
• Die fortlaufende Optimierung einer Website für die Suchmaschinen ist eigentlich heutzutage schon fast selbstverständlich, denn wem nützt der modernste, trendigste Webauftritt, wenn er von den potenziellen Kunden nicht gefunden wird? Diese Prozesse erfordern viel Zeit und es lohnt sich, einen externen Dienstleister für diese wichtige Aufgabe ins Boot zu holen.
• Last but not least: Setzen Sie sich mittel- bzw. langfristige Ziele: Was wollen Sie mit Ihrer Website erreichen (Marke stärken, mehr Anfragen, höhere Umsätze etc.)? Checken Sie in regelmäßigen Abständen, ob Sie noch auf dem richtigen Weg sind oder die Seite weiter verbessert werden muss.
  Natürlich brauchen Sie sich nicht um all diese Punkte alleine zu kümmern. Wenn Sie professionelle Unterstützung bei der Erstellung Ihrer Website benötigen, stehen Ihnen zum Beispiel die Mitarbeiter von weissblau media sehr gern zur Verfügung!