Sie sind auf Seite 1von 58

Zum Inhalt springen

WEBDESIGN
JOURNAL
 Artikel
o
o
o
o
 Angebote
o
o
 Ressourcen
o
o
o
o
o
 Über

o
o
o
o

o
o

o
o
o
o
o

 Inspirationen

Aktuelle Webdesign-Trends im
Überblick
Letztes Artikel-Update:
24. November, 2019
Wer eine moderne Website gestalten will, sollte sich auch mit aktuellen
Webdesign-Trends auseinandersetzen. Dieser Artikel präsentiert dir über 32
aktuelle Webdesign-Trends – mit Beispielen und Tipps zur Umsetzung.
Ein zeitgemäßes Webdesign setzt die passenden Trends gekonnt ein.
Oder sollte man lieber darauf verzichten? Trends sind vergänglich und die
Website soll ja auch nach der Hochphase des Trends noch zeitgemäß wirken.
Aber geht das überhaupt?
In diesem Artikel beleuchte ich die wichtigsten Webdesign-Trends der letzten
Jahre.

Und (er)kläre, wie und wo ein Einsatz dieser Trends noch sinnvoll sein kann.

Inhaltsverzeichnis [Anzeigen]
Trends – Kombination aus Design & Technik
Trends im Webdesign beschränken sich nicht nur auf Gestaltungsthemen,
sondern gehen meistens mit der technischen Umsetzung einher. Möchte man es
etwas weiter fassen, dann könnte man auch Marketing-/Kommunikations-
Aspekte dazu nehmen.

In diesem Artikel möchte ich mich aber rein auf die Design-Technik-
Trends beschränken. Denn diese gehören oft zusammen.
Als beispielsweise vor ein paar Jahren die CSS3-Eigenschaft gradient von den
Browsern flächendeckend unterstützt wurden, kamen großflächige Verläufe auf
Websites (wieder) in Mode. Man kann daher oft sagen:
Die technischen Möglichkeiten bringen Gestaltungstrends hervor.
So sind in den letzten Jahren einige Trends entstanden. Einige haben ihren
Höhepunkt schon hinter sich, andere befinden sich gerade auf diesem.

Den Lebensyzklus eines Trends beschreibt Jonas Hellwig ganz treffend:


Der Webdesign-Trend ist auf seinem Höhepunkt
angekommen, wenn Profis sich am Effekt bereits satt
gesehen haben, Kunden aber unbedingt genau diesen
Stil wünschen. Wenn der Trend seinen Zenit
überschritten hat, erfolgt häufig ein krasser
Gegentrend. Der Skeomorphismus wurde vom Flat
Design abgelöst, abgerundete Ecken vom Metro UI
usw.
Sollte man Webdesign-Trends folgen?
Liest man die jährlich erscheinenden Artikel in den Fachblogs zu den
kommenden Trends stellt man fest, dass sich diese oft über Jahre gleichen oder
„Trends“ erwähnt werden, die eigentlich keine sind wie bspw. „Responsive
Webdesign“. Denn „Trend“ klingt – zurecht – wie eine Entwicklung, die wieder
verschwinden wird. Und manchmal ist es ja auch gar nicht so einfach: Waren die
Verläufe im Webdesign denn überhaupt verschwunden? Sind sie nun zurück?
Werden Sie wieder gehen? Oder waren, sind und werden sie nicht einfach nur ein
möglicher Bestandteil eines Designs, eine mögliche von mehreren Optionen sein
– nicht mehr und nicht weniger.

Und doch: Webdesign-Trends gibt es aus gutem Grund.


Sie beeinflussen das aktuelle Erscheinungsbild vieler Websites. Gerade daher
sollte ein Webdesigner wissen, was gerade „angesagt“ ist und diese
Entwicklungen beobachen und bei Bedarf auch selber einsetzen können.

Einem Trend zu folgen, heißt ja vor allem auch sich der aktuellen Mode, dem
Zeigeist anzupassen. Eine Website, die Trends befolgt, wirkt modern und eckt
nicht an. Sie provoziert nicht und fällt nicht aus dem Rahmen – positiv wie
negativ nicht.

Ich mag das ungern bewerten.


Einem Trend zu folgen, schafft unter Umständen eine zeitgemäße Website. Es
beinhaltet aber irgendwie auch schon, dass die Website in vielleicht schon
wenigen Jahren eben gerade deswegen nicht mehr zeitgemäß aussieht. Aber
wenige Jahre im Webdesign, in der digitalen Welt, das sind viele Jahre im realen
Leben! Und da sich eine Website sowieso ständig weiterentwickeln sollte mit
regelmäßigen größeren Relaunches, ja, da lässt sich dann auch die Umsetzung
eines Design-„Trends“ nach wenigen Jahren anpassen.

Um beim „Verlaufsbeispiel“ zu bleiben:


Wer heute vermehrt Verläufe auf einer Website einsetzt und in einigen Jahren
Verläufe quasi verpönt sind, ja dann kann lässt sich beim Relaunch in drei, vier
Jahren wieder auf einfarbige Flächen (oder was sonst gerade angesagt ist)
umsteigen.

Denn eine zeitlose Website zu gestalten, dessen Design die nächsten zehn,
zwanzig Jahre „überlebt“ – naja, merkt ihr selber…

Der Mehrheit zu folgen, kann für den Webdesigner Sicherheit bringen, dass er
nicht zu viel „falsch“ machen kann. Klar, es ist kein kreative Meisterleistung
aktuelle Gestaltungstrends zu übernehmen. Aber einen eigenen Stil um- und
durchzusetzen (gegenüber dem Kunden) braucht auch Mut (auf beiden Seiten).

Folgend nun der Überblick über die aktuellen Webdesign-Trends:

Aktuelle Webdesign-Trends
Standard-Layouts / Design-Templates
Beginnen möchte ich mit einer Entwicklung, die durch einen veränderten
Workflow aufkam. (WordPress-)Themes, Coding-Bibliotheken und Frontend-
Frameworks haben dazu geführt, dass Websites oft sehr einheitlich aussehen.

Es hat sich ein Standardlayout durchgesetzt, das viele Websites inzwischen


kennzeichnet:

So sind viele moderne Websites aufgebaut:


Eine Website in voller Breite, mit einem Foto- oder Videohintergrund in voller
Breite, zentriertem H1-Text und Call-to-Action-Button, die auf dem
(emotionalen) Bildmotiv stehen.
Oft auch mit Hamburger-Button auf der rechten Seite (mit einem Overlay-Menü
im Vollbildmodus).
Darunter drei Spalten, die jeweils von einem Icon eingeläutet werden und
zentriertem kurzem Fließtext. Darunter im Wechsel Parallax-Effekte und/oder
sich smooth einblendende Texte usw. und so fort fort.
Was natürlich auf der einen Seite einen Einheitsbrei darstellt, hat sich auf der
anderen Seite eben bewährt. Nicht nur, dass die User damit vertraut sind. Diese
Layout-Anordnung hat sich ja nicht ohne Grund durchgesetzt.

Sie verfolgt einige Gestaltungsprinzipien, die für eine gute Bedienbarkeit und
User Experience sorgen. Z.B. gleich mit einer markanten aussagekräftigen
Headline auf einem emotionalen (Hintergund-)Bild anzufangen. Diese Art
des Elevator Pitches zeigt dem Besucher gleich, was er auf dieser Site erwarten
kann. Es fesselt ihn im besten Falle also zugleich rational (Headline) und
emotional (Bild).
Seit einigen Jahren ist dieser visuelle Trend zu
einheitliche(re)n Layouts stark zu beobachten.
Und die Design-Templates helfen auch technisch und/oder gestalterisch nicht
ganz so Begabten eine zeitgemäße Website zu erstellen. Dazu ist die
Umsetzungsdauer (deutlich) schneller, als bei einer individuellen
Programmierung.

Die Templates sind also gewissermaßen Fluch und Segen zugleich. Man
könnte noch einige Vor- und Nachteile aufzählen, das soll aber nicht Thema
dieses Artikels sein. Auf jeden Fall lassen sich so Wiedererkennung und
Individualität schwerer herstellen.
Aber statt es nur als Einheitsbrei zu sehen, könnte man auch sagen, dass der
Durchschnitt der Websites in den letzten Jahren wesentlich attraktiver geworden
ist – eben auch und vor allem durch diese Templates!

Sie wirken wie Kopien voneinander – die Webdesign Standard Layouts.


Und das Vorhandensein solcher fertige Design-Lösungen und Trends schließt ja
nicht aus, dass du es anders (besser?) machen kannst – ohne Templates.

Tipps für den Einsatz von Design-Templates:


 Wer eher auf der sicheren Design-Seite sein will, setzt solche Templates ein.
 Individualtiät ist dann zwar schwieriger herzustellen, aber nicht unmöglich.
 Umso mehr kommt es auf eine markante, individuelle Farb-, Schrift- und
Bildauswahl an.
 Der Gestaltungs- und Umsetzungs-Aufwand lässt sich mit Templates (enorm)
reduzieren.

Aktualtität:
Verbreitung:
Zukunft:
Experimentelle Layouts – Aus dem Raster gefallen
Kein Trend ohne Gegentrend, könnte man hier sagen. Vielen einheitlichen
Layouts stehen wenige innovative(re) Designs entgegen. Ja, der Template-Trend
ist nicht zwingend. Es gibt noch genügend mutige Webdesigner und
experimentelle Layouts.

Die einfachste Methode, um experimentelle(re) Webdesigns zu gestalten, ist es


sprichwörtlich aus dem Raster zu fallen. Das Grid bietet Inhalten eine Struktur
und Webdesignern einen Rahmen, um ausbalancierte Layouts umzusetzen, die
harmonisch wirken.
Einzelne – oder gar mehrere – Elemente aus diesem Raster ragen zu lassen,
lockert nicht nur das ganze Design auf, sondern ist ein tolles Mittel, um sich aus
dem Einheitsbrei der Websites hervorzuheben.

Ein gern genommenes Stilmittel, um aus dem Raster zu fallen, sind große
Textblöcke. In sehr heller oder sehr dunkler Schriftfarbe und ausreichend
Freiraum als Kontrast zu den anderen Inhalten liegen diese zum Teil über Bildern.
Die visuelle Hierarchie wird hierbei oft gestört, bzw. der Lesefluss beeinträchtigt.
Bei sehr text- / inhaltslastigen Websites ist das eher ungünstig. Hier ist eine klare
Struktur förderlich und notwendig, um Benutzer durch die Seite zu führen und
eine klare Inhalts-Hierarchie zu vermitteln.

Für traditionelle Unternehmen, bzw. Unternehmen, die eher klassisch auftreten


wollen, werden innovativere Layouts eher weniger eine Alternative sein.
Für alle anderen aber schon. „Experimenteller“ können ja schon kleinere Out of
the Box-Elemente sein, die nur dezente Highlights setzen. Der Reiz
asymmetrischer Layouts liegt darin, dass sie unverwechselbar, markant und
manchmal experimentell sind.
So richtig innovative Websites suchen aber nach neuen Lösungen bzgl. der
Inhaltsdarstellung, der Benutzerführung und der Navigation.

Viele Anregungen für experimentelle(re) Layouts bietet siteinspire.com.


Tipps für den Einsatz von experimentellen Layouts:
 Schon kleine „Rasterbrecher“ können das Layout aufbrechen und Akzente
setzen.
 Klar festlegen: Soll eine übliche Bedienung und Struktur gegeben sein, dann
nur dezente Layout-Experimente wagen.
 Soll es ein bewusst innovatives Layout werden, dann vorher gut mit dem
Kunden besprechen/abstimmen.
 Sich bewusst sein, dass die Inhaltsaufnahme unter solchen Layouts leiden
kann.
 Und dann: experimentieren und Geduld haben. Denn hier gibt es eben keine
Templates, die einen schnell(er) zum Ziel führen.

Aktualtität:
Verbreitung:
Zukunft:
Modulare Denkweise: Patterns und keine Pages
Eine Website ist im Grunde ein System aus vielen unterschiedlichen
Einzelteilen. Diese können auf jeder (Unter-)Seite neu zusammengesetzt sein,
bleiben aber in ihrem Kern gleich.
Es werden also im Grunde keine fertigen Seiten gestaltet, sondern Systeme mit
immer wieder kehrenden Komponenten, also sowas wie Inhalts-
/Funktionsbereiche. Im angelsächsischen Sprachraum wird
von Patterns gesprochen.
Denn gerade bei größeren umfangreicheren Seiten lässt sich nicht im voraus
immer genau festlegen, welches Element wo genau erscheinen wird.
Typische Elemente/Module einer Website wären beispielsweise:
 Navigationen (Haupt-, Meta-, Footer-Navigaton)
 Logo
 Kontaktblock
 Teaserblöcke (Text mit oder ohne Bild)
 Slider
 Bildergalerie
 Und sonstige Arten von Inhaltsdarstellungen

Der modulare Aufbau der Microsoft-Website


(Quelle: http://daverupert.com/2013/04/responsive-deliverables)
Gerade bei Websites mit umfangreicheren Inhalten und Seiten und bei Websites,
die auf einem CMS beruhen, ist dieser Ansatz sehr sinnvoll. Denn hier wird selten
jede einzelne Seite „durchdesignt“.

Sinniger ist es hier eben solch einzelne Module unabhängig von einander zu
gestalten, die dann flexibel eingesetzt und angeordnet werden können.

Frontend-Styleguides dokumentieren dann diese Module mit Beispielen und


den entsprechenden Codes.

Beispiel für einen Frontend-Styleguide, https://lightningdesignsystem.com


Brad Frost sorgte schon 2013 für Aufsehen mit seinem Artikel Atomic Design, in
dem er diese Vorgehensweise bekannt machte.

Nach dem Prinzip des Atomic Designs sind die Seiten aus einzelnen
Elementen, den Atomen, zusammengesetzt.
(Quelle: http://bradfrost.com/blog/post/atomic-web-design)
Tipps für den Einsatz von modularen Layouts:
 Kurz gesagt geht es darum keine vollständigen Seiten mehr zu entwerfen,
sondern einzelne Module.
 Bei größeren umfangreichern Websites ist dieses Vorgehen vorteilhaft, fast
zwingend.
 Ebenso bei CMS-gestützten Websites.
 Nicht mal eben so damit beginnen, sondern vorher gut mit dieser (neuen) Art
des Ablaufs auseinandersetzen.

Jens Grochtdreis hat zur modularen Webentwicklung eine ausführliche


Anleitung geschrieben: Erst lesen, dann modular arbeiten!
Aktualtität:
Verbreitung:
Zukunft:
Card Design
Durch die Denkweise die Inhalte als Module zu betrachten, ergeben sich im
Grunde viele einzelnen Blöcke, die variabel angeordnet werden können.

Diese Blöcke können natürlich auch optisch als solche gestaltet werden, so dass
klar ist, dass dies eine optische und inhaltliche Einheit ist.
Diese Design-Entwicklung nennt man Card-Design. Die Blöcke/Module werden
wie einzelne „Karten“ gestaltet. Vorstellbar wie „Spielkarten“ auf einem Tisch,
die sich beliebig verschieben und neu anordnen lassen.

Durch das Card Design werden die Informationsblöcke sauber getrennt und
übersichtlich dargestellt.

Typisches Card Design bei dribbble.com und awwwards.com/blog.


Tipps für den Einsatz von Card Designs:
 Ist der Block ein Hinweis auf eine Unterseite, sollte der komplette Block
verlinkt sein.
 Bei Websites mit vielen Informationseinheiten lohnt sich die optische
Gestaltung als Cards.

Aktualtität:
Verbreitung:
Zukunft:
Mobile First
Das Web ist mobil geworden. Und es wird nicht mehr „stationär“ werden.
Insofern bewegen wir uns erst am Anfang der mobilen Entwicklung und – wenn
man den Prognosen trauen darf – größeren Umwälzungen in vielerlei Hinsicht,
die vermutlich auch das Webdesign und die Webentwicklung verändern wird.

Spätestens aber nach den letzten Google Updates sollte jedem klar sein: Eine
Website sollte nicht „irgendwie auch“ mobil sein, sie sollte zuerst mobil sein!
Dank des responsiven Webdesigns ist und sollte eine Website für alle möglichen
Ausgabegeräte anpassungsfähig sein. Von kleinen Ausgabegeräten wie auf
(älteren) Smartphones oder Smart Watches bis zu großen Bildschirmen, die eher
Leinwänden gleichkommen.

Sicher, von Website zu Website, mag die mobile Nutzungsintensität noch sehr
unterschiedlich sein. Eine Beachtung des mobile first-Prinzips hat aber einige
Vorteile. Der Pagespeed und die Konzentration auf die wirklich wichtigen
Inhalte sind nur zwei der bedeutendsten.

Beim Mobile first-Prinzip wird zuerst für „kleine“ Geräte und Auflösungen
optimiert und dann nach und nach für größere.
Tipps für den Einsatz von mobile first-Websites:
 Gekommen, um zu bleiben: Mit dem mobile first-Ansatz auf jeden Fall
auseinander setzen. Selbst wenn es nicht im nächsten Projekte zum Einsatz
kommt, verschiedene Ansätze werden dir auch jetzt schon hilfreich sein.
 Ladezeit, Inhaltsdarstellung, Navigationsmöglichkeiten, Interaktionen – vieles
ist mobil (deutlich) anders als stationär.
 Was auf kleinen Bildschirmen funktioniert, läuft meistens auch auf größeren
gut.

Aktualtität:
Verbreitung:
Zukunft:
„Aggressive“ Pop-ups
Oh ja, sie nerven uns alle: Diese uns anspringenden Info-Boxen aller Art: Mal
wollen Sie uns einen Newsletter andrehen (haha, ja, auch auf dieser Seite hier,
aber der lohnt sich, wirklich!), mal wird nach Cookies gefragt, mal nach …
Am störendsten sind die ganzseitigen Pop-ups, an denen man gar nicht vorbei
kann. Hier musst du irgendwas anklicken.
Warum Pop-ups so penetrant sind? Man orientiert sich gerade auf der Website
oder hat sich schon zurecht gefunden und will etwas lesen und dann
… Bäähhmmm.
Erscheint eine „Info“, die man so nicht wollte.

Sie leuchtet nicht nur am Rand einer Website und von uns schon geistig
automatisch ausgeblendet – wie ein Werbebanner. Nein, ein Pop-up beraubt uns
unserer Aufmerksamkeit, lenkt ab und zwingt uns zu einer Handlung.

Ein vollflächiges Pop-up lässt die Seite nicht weiter bedienen. Es muss
geklickt werden – in diesem Beispiel alles für einen kostenlosen Font zum
Download… Wow!
Viel abwertender kann man mit seinen Website-Besuchern eigentlich gar nicht
umgehen. Und doch: Immer mehr Websites setzen auf Pop-ups.
Warum? Vermutlich weil der Erfolg ihnen recht gibt.

Erfolg? Soweit er sich messen lässt, also z.B. werden die Abonnentenzahlen für
einen Newsletter erhöht. Besucher, die vorher nicht auf den Newsletter
aufmerksam geworden wären, abonnieren diesen nun. Und wenn es nur wenige
Prozent von denen sind, die das Newsletter-Pop-up zu Gesicht bekommen
haben, kann es sich sehr schnell lohnen.

Es soll wohl sogar Studien geben, die den Erfolg von Pop-ups bestätigen.

Was sich halt schlechter messen lässt: Wie genervt der Besucher von dem Pop-up
ist. Und das die User Experience darunter leidet. Unwahrscheinlich, dass viele
Besucher die Website gleich verlassen, sobald ein Pop-up erscheint. Aber genervt
sind sie…

Tipps für den Einsatz von Pop-Ups:


 Wenn es geht, besser darauf verzichten, bzw. sparsam einsetzen. Ein Pop-up
mindert eigentlich immer die Benutzerfreundlichkeit.
 Wenn du jedoch ein so tolles Angebot hast, das du deinen Besuchern einen
enormen Mehrwert bringt, dann nutze sie und werte den „Erfolg“ aus.
 Wenn schon, dann besser „dezentere“ Pop-ups einsetzen, als ganzflächige (für
diese Variante habe ich mich auch entschieden. Die Konversionsrate des Pop-
ups hat mich überzeugt, es am unteren rechten Rand eingeblendet zu lassen).
 Liefere einen Grund für dein Pop-up! Ein einfaches „Newsletter abonnieren“
ist keine ausreichende Begründung. Erkläre die Vorteile für den User.
 Und mache das Schließen des Pop-ups einfach, also kein kleines verstecktes
„X“, sondern groß und offensichtlich. Wenn der User kein Interesse hat, dann
hat er keines!

Aktualtität:
Verbreitung:
Zukunft:
Responsive Logos
Klar, bezüglich responsiven Webdesigns könnte man viele unterschiedliche
Aspekte als „Trend“ hier einzeln auflisten. Exemplarisch sollen die responsiven
Logos stehen. Ein Unternehmenslogo ist ja an sich eine „empfindliche“ Stelle. Im
Design-Styleguide festgezurrt – Abstände, Größen usw. fix vorgegeben und
wehe dem, der davon abweicht.

Responsive Logo heißt aber nicht nur, Logos bei kleineren Bildschirm-
Auflösungen entsprechend kleiner darzustellen. So flexibel wie Websites werden
langsam auch die Unternehmen und ihre Designs. Anpassungsfähig an das
Medium.

Responsive Logos heißt bei Bedarf eben auch nur eine angepasste Logo-Variante
anzuzeigen. Also unter Umständen eben nicht mehr das komplette Logo.

Responsive Logos wie sie auf der Website responsivelogos.co.uk demonstriert


werden.
Tipps für den Einsatz responsiver Logos:
 Überprüfen, ob ein skalierbares Logo überhaupt benötigt wird.
 Ein responsives Logo zu schaffen, ist keine Sache des Webentwicklers
(Wuaaahhhh, Entwickler, die gestalten…), sondern Sache eines Designers.
 Mit dem Unternehmen zuerst klären, ob ein responsives Logo überhaupt
möglich/gewünscht ist.

Aktualtität:
Verbreitung:
Zukunft:
Ein Hamburger Menü auf dem Schreibtisch
Ein Trend, der sich von mobilen Versionen auf die größeren Auflösungen
ausgebreitet hat: Die Navigation hinter einem Hamburger Icon zu “verstecken“.

Auf mobilen Geräten ist das Hamburger Menü ja sehr sinnvoll. Um Platz zu
sparen, werden die Menüpunkte nicht einzeln angezeigt, sondern erst nach Klick
auf das drei-strichige-Icon, dessen Bedeutung inzwischen auch der letzte User
gelernt haben sollte.

Und was mobil gut funktioniert, muss auch bei Desktop-Varianten funktionieren
– dachten sich wohl ein paar findige Designer. Und schwups, schon ist das Icon
auf vielen Webseiten und zwar immer, egal bei welcher Auflösung.

Klar, es macht eine Website schlanker, großzügiger, wenn viele kleine


Navigationspunkte nicht angezeigt werden müssen. Das lässt mehr Raum für die
wesentlicheren Inhalte.

Äh, Moment, die „wesentlicheren“? Was ist denn wesentlicher für die Bedienung
einer Website als die Hautpnavigation? Überall da, wo genügend Raum
vorhanden wäre, alle Navigationspunkte anzuzeigen, ist das Hamburger Icon für
die Usability einer Website ungünstig.

Das Hamburger Icon im Einsatz auf Desktop-Websites, obwohl genug Raum


für einzelne Navigationspunkte vorhanden wäre.
Tipps für den Einsatz von Hamburger Menüs:
 Auf Desktop-Varianten weglassen!
 Oder zumindest gute Gründe dafür finden, warum es hier eingesetzt werden
sollte.
Aktualtität:
Verbreitung:
Zukunft:
Experimentelle Navigation
Das Thema passt zu den Standard-Layouts vs. Experimentelle Layouts. Der
Klassiker ist ja folgender: Die Hauptnavigation steht oben rechts. Evtl. darüber
noch dezenter eine Metanavigation. Soweit bewährt und konventionell. Das
kennen die User, da finden sie sich schnell zurecht.
Immer häufiger erscheinen aber in den letzten Jahren experimentelle
Navigationsmuster, die komplett mit dieser klassischen Navigation brechen und
innovativere Wege der Navigation begehen.

Solche Experimente können natürlich sehr reizvoll sein und spielerisch den User
„herausfordern“ und die Interaktion verstärken. Dazu müssen Sie aber auch
intuitiv bedienbar sein, denn ansonsten leidet die Benutzerfreundlichkeit oder –
im schlimmsten Falle – weiß der User gar nicht mehr, wo und wie er navigieren
soll.

Daher werden diese Navigationen eher bei innovativeren Themen/Projekten


eingesetzt, bei denen es nicht so sehr auf die klassische Inhaltsaufnahme
ankommt.

Experimentelle Navigationen im Webdesign, wie hier


bei hawraf.com und badesaison.ch.
Tipps für den Einsatz experimenteller Navigationen:
 Nur einsetzen, wenn Thema und Zielgruppe dies zulassen.
 Versuchen trotzdem noch eine intuitive Bedienung zu ermöglichen.

Aktualtität:
Verbreitung:
Zukunft:
Bringe dein Webdesign-Business voran!
Mit den Webdesign Journal Angeboten:
Startseiten-Slider/-Karussels
Zum Glück sind sie fast wieder verschwunden: Die Startseitenslider. Es ist noch
gar nicht so lange her, da wollte jeder Kunde diese auf der Startseite haben. Klar,
auf einmal war die Gelenheit dar, so viele wichtige Informationen gleich
prominent als erstes auf der Startseite zu erzählen.
Das Problem war nur: Keiner schaute sich die Slider an.
Das, was man an sich selber gut beobachten konnte, haben auch Studien belegt.
Daher heißt es nun in der Nach-Startseiten-Slider-Ära die Inhalte zu gewichten.
Nicht mehr alles ist wichtig und wird in Slides gepackt, sondern Schwerpunkte zu
schaffen.

Nach wie vor sind Slider – ob auf der Startseite oder an anderer Stelle – mit
Vorsicht zu genießen. Zu wenige klicken sich durch die Slides.
Meistens wird, wenn überhaupt, nur der erste Slide angeklickt. Der Anreiz muss
schon sehr groß sein, die folgenden Slides-Inhalte auch sehen zu wollen.

Bilder-Slider sind da schon eher im Einsatz und werden auch genutzt.


Beispielsweise auf Sport-Seiten Fotos des letzten Spiels zu zeigen. Oder eine
Bildergalerie aller Fußball-WM-Teilnehmer. Hier klickt man sich schon eher
durch, und ist als Besucher evtl. auch „glücklicher“, als wenn die Bilder alle
untereinander im Inhaltsbereich stehen würden.

Der Header Slider – zum Gülck verschwindet er nach und nach von
Unternehmens-Websites.
Tipps für den Einsatz von Slider:
 Auf Inhalts-Slider verzichten.
 Als Alternative für Bildergalerien kann es sinnvoll sein.
 Wenn sie eingesetzt werden, die Klickraten kontrollieren und daraus Schlüsse
ziehen.

Aktualtität:
Verbreitung:
Zukunft:
Parallax Scrolling
Was wäre eine moderne Website ohne Parallax. Ich kann mich gut erinnern, wie
wir vor den ersten Parallax-Seiten saßen und, ob der „Dreidimensionalität“
staunten. Haha, ok, die Aufregung hat sich inzwischen gelegt…

Dank der Parallaxtechnik werden Vordergrund- und Hintergrundinhalte mit


unterschiedlichen Geschwindigkeiten gescrollt. Dadurch entsteht die Illusion
von Tiefe. Und es bringt eben gefühlte „Lebendigkeit“ auf die Website.
Auch heute werden Parallaxeffekt noch gerne eingesetzt und haben sich bei den
modernen Layouts und Templates (siehe Punkt 3.1 Standard-Layouts / Design-
Templates) etabliert.

Websites mit Parallaxeffekt wirken sicherlich unterhaltsamer, die Gefahr besteht


aber, dass die Ablenkung zu groß wird.
Und bei Smartphones wird der Effekt unbedeutend, bzw. störend aufgrund der
kleineren Fläche.

Der Parallax Scrolling Effekt


Tipps für den Einsatz von Parallax Scrolling:
 Einfache Möglichkeit die Website interessanter zu gestalten.
 Übermäßiger Einsatz lenkt zu sehr ab, irritiert.
 Kann die Wahrnehmung der Inhalte beeinträchtigen, daher nicht bei/unter
relevanten Inhalten einsetzen.

Aktualtität:
Verbreitung:
Zukunft:
Long-Pager / Scrolling
Es gibt einen klaren Trend zu inhaltlich umfangreicheren Seiten. Also statt
mehrere inhaltlich kürzere Seiten zu erstellen, wird eine längere eingesetzt.

Ein Hauptgrund liegt darin, dass User allgemein lieber scrollen (wollen), anstatt
auf die nächsten Seiten zu klicken, was eine deutliche größere kognitive
Anstrengung bedeuten würde (Wo muss ich klicken, was erwartet mich da, lohnt
sich der Klick, welche der Navigationspunkte klicke ich überhaupt an?)

Lange galt der Grundsatz, das wichtige Inhalte „above the fold“ erscheinen
sollten, also unmittelbar ohne scrollen sichtbar sein sollten. Von diesem
„Mythos“ ist man inzwischen abgerückt.

Längere umfangreichere Inhalte ermöglichen dem Designer auch mehr


Gestaltungsspielraum. Teilweise geht es dann schon in „Storytelling“ über, so
dass die Inhalte beim Scrollen quasi einem roten Faden folgen.

Der Trend geht zu längeren Seiten im Webdesign.


Tipps für den Einsatz von Long-Pagern:
 Gut überprüfen, ob die Inhalte wirklich auf eine Seite passen oder doch besser
in mehrere unterteilt werden sollten.
 Es muss eindeutig verständlich sein, wo sich die gesuchten Inhalte befinden.
Ein Long-Pager bringt nichts, wenn der Besucher die gesuchten Inhalte dort
nicht erwartet, also gar nicht erst weit(er) scrollt.
 Zwei weitere Effekte werden bei Long Pagern gerne ergänzt, um die
Bedienbarkeit deutlich zu erhöhen: Die Fixed Navigation (siehe Punkt 3.14)
und ein „nach oben“-Link/Button.

Aktualtität:
Verbreitung:
Zukunft:
Infinite Scrolling
Ist der User am Ende einer Seite angelangt, dann werden weitere Inhalte
automatisch nachgeladen – dieses Prinzip nennt sich Infinite Scrolling.

Das unendliche Scrollen ist schnell und benutzerfreundlich, denn der User muss
nicht klicken, um weitere Inhalte zu sehen. Und es wird keine neue Seite geladen.

Seiten wie Pinterest und Facebook setzen dieses Prinzip ein. Hier geht es um
viele Inhalte, die der Besucher in schneller Abfolge sehen will/soll.

Die Schwierigkeit besteht bei dieser Methode darin, sich noch orientieren zu
können oder später einmal bestimmte Inhalte wiederzufinden. Denn nach
langem Scrollen sind die Seiten seeehr lang und umfangreich geworden.

Infinite Scrolling im Webdesign, wie hier am Beispiel von pinterest.de.


Tipps für den Einsatz von Infinite Scrolling:
 Infinite Scrolling kann die Benutzerfreundlichkeit stark erhöhen.
 Sinnvoll ist der Einsatz aber nur auf Seiten, mit unglaublich großem
Informationsumfang.
 Selbst bei Blogs, wo man weitere Artikelvorschauen nachladen könnte, ist der
Einsatz schon kritisch, da der User nur schwer noch den Überblick behalten
kann.

Aktualtität:
Verbreitung:
Zukunft:
Fixed Navigation
Ein typischer Bestandteil der modernen Standard-Layouts ist die fixe Navigation,
die am oberen Browserrand auch während des Scrollens stehen bleibt. Sie wird
also nicht weggescrollt, sondern ist immer sichtbar.

Manchmal verringert sich die Höhe der Navigation beim ersten Scrollen. Logo
und Navigationspunkte bleiben aber stehen und sind so jederzeit erreichbar.

Da einzelne Seiten immer länger/umfangreicher werden, liegt der Vorteil klar auf
der Hand: Die User können sich schnell neu orientieren, müssen nicht erst wieder
ganz nach oben zur Hauptnavigation scrollen, um weitere Unterseiten besuchen
zu können.

Als Nachteil könnte man es sehen, dass durch die fixe Navigation am oberen
Rand immer ein paar Pixel „reserviert“ sind, die eben nicht für andere Inhalte zur
Verfügung stehen.

Und die Navigation ist dann eben immer Bestandteil des Screendesigns. Also
selbst wenn man sich Mühe gemacht hat mit der Gestaltung der Inhalte, oben
drüber steht immer die Navigation.

Wird häufig eingesetzt: Die Navigationsleiste bleibt am oberen Browserrand


fix stehen, wie hier bei 99u.com.
Tipps für den Einsatz von Fixed Navigations:
 Die Navigation ist immer präsent, was viele User mögen.
 Gerade bei inhaltlich längeren Seiten wird die Usability erhöht.
 Bei eher kurzen Seiten liefert die Methode eher keinen Mehrwert.

Aktualtität:
Verbreitung:
Zukunft:
Hero-Bilder / großformatige Bilder / Video
Backgrounds
Kaum eine moderne Website, die nicht zuerst ein großformatiges Bild
präsentiert.

Die Templates unterstützen diesen Trend, indem sie Platzhalter und


umfangreiche Gestaltungsmöglichkeiten für solche Bilder bereithalten.

Im Grunde wird hier ein bisschen die Wirkung einer Werbeanzeige


übernommen: Emotionales Bild plus rationaler Text, die sich im Idealfall
gegenseitig ergänzen und verstärken.
Da wir von Textinhalten überflutet und oft schon übersättigt sind, sind Bilder
„schnelle Schüsse ins Gehirn“. Dazu wirken sie emotional, während ein Text erst
lange erklären muss.

Manchmal werden statt Hero-Bilder auch (kurze) Videosequenzen im


Hintergrund abgespielt, die der Seite natürlich noch eine ganz andere
Lebendigkeit vermitteln und unterhaltsamer sind als ein statisches Bild.

Nicht nur im oberen Bereich einer Website kommen die großformatigen Bilder
zum Einsatz, auch im weiteren Inhaltsbereich findet sich diese immer häufiger.

Großformatige Bilder im Header der Startseite erscheinen auf sehr vielen


Websites.
Tipps für den Einsatz von großformatigen Bildern:
 Ein gut gelungenes großformatiges Bild kann eine tolle Wirkung erzeugen.
 Standard-/Klischeebilder eher nicht.
 Auf das Datenvolumen und die Ladezeit achten. Zu große/zu viele
großformatige Bilder wirken sich hier negativ aus.
 Videos beeinträchtigen umso mehr die Ladezeit.
 Sollte das Video dann nur im Hintergrund eingesetzt werden und gar nicht den
Hauptinhalt darstellen, ist das beanspruchte Datenvolumen umso kritischer zu
sehen.
 Der Einsatz von (Hintergrund-)Videos lenkt stark von den eigentlich
relevanten Inhalten ab.
Damit das Dateivolumen bei (mehreren) großformatigen Bildern nicht zu hoch
wird, sollten diese optimiert werden. Hierbei hilft die Anleitung Bilder optimieren
fürs Web.
Aktualtität:
Verbreitung:
Zukunft:
Spilt-Screen Design
Ein noch recht junger Trend ist die Teilung des Bildschirms in zwei vertikale
Hälften, was wie zwei Seiten eines Magazins wirken kann.

Da es für diese Gestaltungstechnik keinen Standard gibt, sind die


Umsetzungsarten sehr unterschiedlich.

Manchmal steht in der einen Hälfte die aktuellen Navigationspunkte optisch


hübsch ausgestaltet. Und in der anderen Hälfte dann die Inhalte.

Oder – ähnlich einer Werbeanzeige – präsentiert die eine Seite ein


großformatiges Bild und die andere erklärenden Text.

Der Split Screen Webdesign Trend, wie hier bei denkwerk.com und renaterechner.at.
Tipps für den Einsatz von gesplitteten Bildschirmen:
 Die Möglichkeiten/Ideen sind hier enorm, so dass es schwierig ist, eine zu
finden, die zu den Inhalten passt UND bei der die Benutzerführung nicht
leidet.
 Passt generell eher auch zu innovativeren Themen/Projekten.
 Eine minimalistische Gestaltung der Inhalte kann helfen, die User bei diesem
Nutzungskonzept nicht zu überfordern.
 Was bei größeren Bildschirmen gut funktioniert, wird bei kleineren
Auflösungen eventuell schnell kritisch, weil sich die Inhalte nicht mehr passend
nebeneinander, sondern untereinander anordnen.

Aktualtität:
Verbreitung:
Zukunft:
Non-Rectangular Headers
Ein notwendiges „Übel“ der Webgestaltung ist die Rechteckform, die sich aus
den HTML-Containern zwangsläufig ergibt – Kästchen, Rechtecke überall.

Lange war es nur möglich, diese „Rechteckigkeit“ mit Hilfe von Bildern zu
umgehen. Dank CSS3 und SVGs gibt es nun aber neue Möglichkeiten und dieser
werden immer wieder gerne genutzt.

Gerade für die Gestaltung eines aufmerksamkeitsstarken Headers ist die Abkehr
von der geraden horizontalen Kante eine tolle Möglichkeit sich visuell
abzuheben.

Es muss nicht immer horizontal sein – so kommt dann auch Spannung ins
Webdesign.
Tipps für den Einsatz von Non-Rectangular Headers:
 Vertikale und horizontale Linien lenken den User und geben dem Design
Orientierung und Stabilität.
 Daher Non-Rectangular Headers nur mit Bedacht einsetzen. Also, nicht noch
vermehrt weitere Inhaltsbereiche damit ausgestalten.

Creating Non-Rectangular Headers ist eine umfangreiche Anleitung über


verschiedene Möglichkeiten Non-Rectangular Headers zu erstellen.
Aktualtität:
Verbreitung:
Zukunft:
Animationen & Microinteractions
Früher sorgten Flash-Animationen für Unterhaltung und Effekte auf Websites.
Als diese Technologie aus der Mode kam, waren auch Animationen größtenteils
verschwunden. Dann kamen langsam die JavaScript-Bibliotheken wie jQuery auf
und mit Ihnen auch wieder Bewegung. Inzwischen lassen sich schon mit CSS3
schöne Effekte erzielen.

Auch große Animationen von Illustrationen lassen sich, z.B. mit JavaScript
und SVGs gut umsetzen.
Inzwischen sind Animationen von modernen Websites kaum mehr wegzudenken.
Das müssen gar nicht groß animierte Abläufe sein, oft sind es nur kleinere
Effekte, die aber für die Benutzerführung einen tollen Effekt haben.
Gern genommen sind hover-Animationen, die bei Mouseover über ein Element
ablaufen. Das kann ein einfacher Farbwechsel sein, der dann leicht animiert
abläuft und nicht mehr schnell und hart.
Oder das mobile Menü, das bei Klick auf das Hamburger Icon „herein geflogen“
kommt.

Oder Textblöcke und Bilder, die sich beim scrollen erst smooth einblenden,
sobald sie in den sichtbaren Bereich kommen.

Teilweise werden die Animationen auch „Microinteractions“ genannt. Also


dezente Effekte, die die User Experience erhöhen, indem Sie dem Benutzer
die Bedienung vereinfachen.

Mit kleineren dezenten Animationen lässt sich die User Experience steigern.
Tipps für den Einsatz von Animationen & Microinteractions:
 Microinteractions erhöhen die Benutzerfreundlichkeit überall da, wo der User
mit der Seite interagieren kann und dort sollten sie auch zum Einsatz
kommen, z.B. Navigation, Links, Buttons, Formulare.
 Dezente, kleine Animationen reichen hier aus.
 „Größere“ Animationen sollten mit Bedacht eingesetzt werden. Z.B. sind die
Slider, bei denen Bilder und Texte unterschiedlich animiert werden, oft schon
zu viel Effekt.
 Dagegen kann dezentes ein- und ausblenden von Inhalten auch die
Benutzungserfahrung erhöhen.

Aktualtität:
Verbreitung:
Zukunft:
Animierte GIF-Bilder
Sie waren ja eigentlich schon verschwunden: GIF-Bilder. Dank der sozialen
Medien sind sie wieder zurück, stärker als je zuvor.
Kleine animierte Sequenzen, die in den sozialen Netzwerken kurze Ausschnitte
oder Loops von Filmen oder Videos zeigen.

Genau, dank animierter GIF-Bilder kann man schon mal ausflippen…


Wie eine Animation, so fällt auch ein GIF-Bild aufgrund der Bewegung sofort ins
Auge. Und das GIF-Format braucht auch nicht viel Speicherplatz.

Tipps für den Einsatz von GIF-Bildern:


 Für sehr kurze (fotorealistische) Animationen sind GIF-Bilder gut geeignet.
 Da sich ein GIF-Bild nicht stoppen lässt, kann es schnell nerven. Daher nur
gezielt einsetzen.

Aktualtität:
Verbreitung:
Zukunft:

Einfacher lässt es sich kaum erklären. Animated GIFs eigenen sich gut, um
bestimmte Sachverhalte zu verdeutlichen.
Erst Flat-Design, dann Material Design
Vor einigen Jahren kam das sogenannte Flat-Design auf. Nach Jahren des
Skeuomorphismus mit seinen realitätsnahen Designs wurden die Elemente
wieder deutlich reduzierter. Keine Schatten, keine Verläufe, keine Texturen,
keine Verzierungen – nur noch schlichte einfarbige Flächen blieben am Ende
übrig.
Das Flat Design folgte einer minimalistischen Entwicklung, bei der schlichte
Ästhetik angesagt war. Gleichzeitig war der Vorteil, dass sich die Ladezeit der
Websites reduzierte, da auf aufwendige Bilder verzichtet wurde.

Der Unterschied zwischen Skeuomorphismus und Flat Design: vom


realistischen Design zum flachen minimalistischen Design.
Dann kam das sogenannte Material Design auf. Auch hier sind große einfarbige
Flächen sehr präsent, aber es kamen wieder (dezente) Schatteneffekte und
Verläufe dazu. Ebenso wie die oben beschriebene Microinteractions.
Die dadurch erreichte Tiefenwirkung erhöht die User-Experience.

Viele Frameworks und Templates haben das Flat und/oder Material-Design auch
als Vorbild.

Material Design: Ähnlich wie Flat Design, aber wieder mit mehr „Tiefe“ durch
bspw. Schatten und Verläufe, dazu noch Animationen.
Tipps für den Einsatz von Material Design:
 Schatten, Verläufe und Microinteractions sind (oft) Bestandteil einer
modernen Website.
 Dezent eingesetzt, kann man damit nicht viel falsch machen.
 Baut man seine Website nach dem Material Design-Prinzip auf, hat man eine
moderne Gestaltung, hebt sich aber dadurch auch nicht besonders ab.

Aktualtität:
Verbreitung:
Zukunft:
Minimalismus
Flat Design wurde eben schon als minimalistisches Design beschrieben. Man
kann es aber noch weiter treiben, indem auch schon Farbflächen als „zu viel“
angesehen werden.

Das Weglassen (fast) aller (Gestaltungs-)Elemente, bis nur noch das Wichtigste
übrig bleibt: Es zwingt einen, klare (inhaltliche) Prioritäten zu setzen.
Minimalistische Designs lenken nicht vom Inhalt ab, sondern sie unterstützen
diesen. Dazu ist die Ladezeit bei minimalistischen Websites sehr gut, da keine
unnötigen Elemente und Codes geladen werden müssen.

Das Mobile First“-Prinzip unterstützt daher den minimalistischen Ansatz.

Minimalismus im Webdesign.
Tipps für den Einsatz von minimalistischen Designs:
 Was einfach klingt, ist oft sehr schwierig: „Reduce to the max“.
 Wenn man alles „Unwichtige“ weglässt, erlaubt das Design keine
„Unsauberkeiten“, da sich nichts mehr durch „überflüssige“ Gestaltung
kaschieren lässt.
 Bei Kundenprojekten zuerst das „ok“ einholen. Nicht selten, dass diese sich
„mehr Gestaltung“ wünschen, wenn sie eine minimalistische Website
ansehen.

Aktualtität:
Verbreitung:
Zukunft:
Web Brutalism
Kein Trend ohne Gegentrend könnte man meinen, wenn man sich die
brutalistischen Websites anschaut. Statt auf cleane, schicke, morderne Designs
zu setzen, geht hier die Entwicklung quasi „back to the roots“:
Design-Elemente der 90er kommen bei diesem Gestaltungstrend zurück. Klar,
der erste Gedanke wäre: wie häßlich…

Und gerade darin liegt für manchen Betrachter die Schönheit. Es vergleichbar
mit der Architektur, an die sich der Name anlehnt: Brutalism meint in etwa roher
Beton, im Volksmund Betonbauten genannt. Also Gebäude, die nicht künstlich
verschönert werden durch besondere Fassaden und weiterer schmückender
Elemente, sondern sich in ihrer puren Form mit ihren reinen Materialien
präsentieren.
Eine brutalistische Website erscheint auch oft „roh“, reduziert, wenig
Gestaltungselemente, kaum CSS-Gestaltung.

Brutalistische Websites, eine große Auswahl findet sich


unter brutalistwebsites.com.
Tipps für den Einsatz von brutalistischen Webdesigns:
 Einsatz eigentlich nur bei „kreativen“ Themen sinnvoll. Daher sind
brutalistische Websites oft Portfolios von Designern.
 Wer also gegen den aktuellen Gestaltungstrend sein will, findet hier eine
Alternative (die inzwischen aber auch schon fast wieder als Trend zu
verzeichnen ist).
 Oft sind brutalistische Websites schwierig zu bedienen, da die
Navigationselement nicht eindeutig/intuitiv erkennbar sind.
 Wer aber nur teilweise „anders“ sein will, findet im brutalistischen Design
zumindest Anregungen.

Aktualtität:
Verbreitung:
Zukunft:
Stockfotos
Bildern sind emotional und gehören daher eigentlich auf (fast) jede
Website. Erste Anlaufstelle dabei: Stockfoto-Agenturen.
Die Auswahl ist hier beinahe unendlich. Bilder in Quantität und Qualität, die man
so selber kaum umsetzen in der Lage wäre – und schon gar nicht zu den Preisen
der Stock-Agenturen.

Für viele Einsatzzwecke sind die Stockbilder absolut in Ordnung. Das Problem
dabei ist meisten nur: Stockbilder sehen eben aus wie Stockbilder!
Extrem gekünstelt, „überprofessionell“ – direkter ausgedrückt: wie
austauschbare Klischeeebilder.

Typisches Stockfoto. Typ Modell sieht in unterschiedlichen Posen immer


extrem freundlich und gut gelaunt aus.
Tipps für den Einsatz von Stockfotos:
 Klar, Stockfotos haben nicht den besten Ruf.
 Nicht immer sind Stockfotos aber schlecht.
 Bei bestimmten Einsatzzwecken (z.B. kleine unterstützende Artikelfotos in
News-Portalen) sind sie definitiv wirtschaftlicher als eigene Fotos zu machen.
 Oder bei mangelndem Budget für einen Fotografen können sie eine sinnvolle
Alternative sein.

Mehr zu Stockfotos gibt es im Artikel Klischeebilder.


Aktualtität:
Verbreitung:
Zukunft:
Authentische Fotografie
Wer nicht in die „Stockfoto-Falle“ tappen möchte, sollte eigene authentische
Fotos erstellen, die „echte“ Menschen in „echten“ Situationen zeigen und nicht
diese gekünstelten.

Klar, dafür braucht es ein nicht zu knappes Budget.

Individuelle Bilder wirken natürlich authentischer als die üblichen Stockfotos.


Tipps für den Einsatz authentischer Fotografien:
 Individuelle Fotos sind immer Stockfotos vorzuziehen.
 Klar ist: der Aufwand eigene und professionelle Fotos zu erstellen ist deutlich
größer, als Stockfotos in den Portalen zu suchen.
 Sollte man sich aber dafür entscheiden, dann einen professionellen Fotografen
wählen.

Mehr Anregungen zu individuellen Bildideen findest du im Artikel


über individuelle Bildmotive.
Aktualtität:
Verbreitung:
Zukunft:
Monochrome Icons & Illustrationen im Flat Look
Zusammen mit dem Flat-Design sind zwei Arten von Icons aufgekommen:

Die einfarbigen „Strich-“Icons und die schlichten aus wenigen Farbflächen


bestehenden Icons.

Kaum ein modernes Template, dass nicht die monochromen Icons im Repertoire
hat.

Typische monochrome Icons & Icons im Flat-Stil.


Tipps für den Einsatz monochromer Icons:
 Diese Art der Icons sind die Stockfotos unter den Illustrationen. „Kurzweilig“
und Standard – eben ein Einheitslook.
 Sie lassen sich bei sehr vielen Website-Themen einsetzen, Akzente setzt man
damit aber weniger.
 Vorlagen gibt es für die Art der Icons genug, so dass man hier auch nicht
besonders kreativ werden muss.

Aktualtität:
Verbreitung:
Zukunft:
Individuelle Illustrationen
Nicht nur mit individuellen Fotos kann man dem allgemeinen Stockfoto-Trend
entgegentreten – mit individuellen Illustrationen kann man den Standard-Icons
und -Illustrationen entkommen.

Individuelle Illustrationen helfen dabei, eine eigene visuelle Sprache zu erzeugen


und eine hohe Wiedererkennung zu erreichen und sich von anderen Websites
abzusetzen.

Mit eigenen Illustrationen lässt sich auch ein hohe Wiederkennung und
Individualität erreichen.
Tipps für den Einsatz individueller Illustrationen:
 Der Spielraum bei Illustrationen ist riesig, wie die Beispiele oben zeigen.
 Und damit sind auch die Möglichkeiten gewünschter Eigenschaften,
Wirkungen und Umsetzungsstile enorm.
 Einen charakteristischen Stil zu entwickeln braucht viel Zeit und kann oft nur
ein Designer/Illustrator umsetzen.

Aktualtität:
Verbreitung:
Zukunft:
Fette Typografie
Wird eigentlich seit Jahren immer wieder in den Webdesign-Trends erwähnt. Von
daher würde ich kaum sagen wollen, ob es gerade Mode ist oder schon wieder
vorbei oder eigentlich erst richtig aufkommt.

Aber große markante Typografie ist auf jeden Fall immer eine
Gestaltungsoption.
Dank der großen Auswahl an Webfonts und dem Aufkommen hochauflösender
Displays ist der Einsatz vieler Serifen-Schriften inzwischen gut möglich ohne dass
die Lesbarkeit leidet. So lassen sich auch Trends und Gestaltungen umsetzen, die
man bisher nur aus dem Printbereich kannte. Die große markante typografische
Gestaltung gehört dazu.

Große markante Typografie als Gestaltungsmerkmal.


Tipps für den Einsatz fetter Typografie:
 Typografie ist ein mächtiges, visuelles Werkzeug, das aber viel Feinarbeit und
gute Designkenntnisse erwartet.
 Mit großer fetter Typografie lassen sich tolle Akzente setzen und eine hohe
Wiedererkennung erreichen.
 Der Auswahl der Schriftart(en) sollte ausreichend Raum gegeben werden.

Hier findest du Anregungen für typografische Gestaltungen.


Aktualtität:
Verbreitung:
Zukunft:
Ghost-Buttons
Buttons sind – eigentlich – die markanteren Links. Größer und bunter kommen
sie daher und animieren zum klicken.

Und dann gibt es die Ghost-Buttons, die unscheinbarer sind, wie ein „Geist“ auf
der Website erscheinen.

Ghost Buttons sind unaufdringlich und einfach gestaltet. Sie sind präsent und
nehmen sich trotzdem zurück. Sie fordern zum Klicken auf, halt nur dezenter.

Ghost Buttons im Einsatz – markant, aber doch dezent.


Tipps für den Einsatz von Ghost-Buttons:
 In modernen Designs wird gerne auf Ghost-Buttons zurückgegriffen.
 Ein dezenter Rahmen um den Linktext, fertig ist der Button.
 Wer einen klaren Call-to-Action-Button braucht, der sollte nicht auf Ghost-
Buttons setzen, sondern diese lieber markant gestalten.
 Ist der Button „nur“ ein Element unter mehreren, dann kann es auch mal
Ghost-Button sein.

Aktualtität:
Verbreitung:
Zukunft:
hover-Effekte
Klar, Links und andere Interaktions-Elemente sollten eine oder mehrere visuelle
Kennzeichen beim Mouseover verändern.

Es gibt aber auch andere Elemente, bei denen ein hover-Effekt die
Benutzerfreundlichkeit erhöht, indem das Element optisch hervorgehoben wird.

Bei Preistabellen kann zum Beispiel die aktuelle Spalte, die der User mit der Maus
überfährt, hervorgehoben werden.

Tipps für den Einsatz von hover-Effekten:


 Sollte nur dezent eingesetzt werden, da oft mit einem hover-Effekt ein Link
assoziiert wird.
 Wird ein hover-Effekt außerhalb eines Links eingesetzt, dann sollte er die
Nutzbarkeit / Lesbarkeit erhöhen.

Aktualtität:
Verbreitung:
Zukunft:
Duotone-Effekt
Ein monochromes Bild ist ein einfarbiges Bild, zum Beispiel ein Graustufenbild.
Beim Duotone-Effekt kommt eine zweite Farbe hinzu, ähnlich dem Duplexdruck.

Meistens werden die Bilder großflächig eingesetzt und zusammen mit den
eingesetzten Farben ergibt sich durch den Effekt eine große Wiederkennung
und Emotionalität.
Inzwischen werden gerne nicht nur zwei Farben, sondern die Bilder gerne auch
mit mehreren Farbtönen eingefärbt oder gleich ganze Farbverläufe eingesetzt.

Duotone im Webdesign – eingefärbte Bilder haben ihr eigene Ästhetik.


Tipps für den Einsatz von Duotone-Effekten:
 Mit dem Duotone-Effekt lässt sich recht simpel ein markantes und
wiedererkennbares Design schaffen.
 Die Individualität ist zwar eventuell durch die eingesetzten Farben recht hoch,
der Effekt selber ist es aber nicht.
 Mit Hilfe des Duotone-Effektes lassen sich Bilder auch großflächig als
Hintergrund einsetzen und der Text ist darauf trotzdem gut lesbar.
 Durch den Duotone-Effektes wirken emotionale Bilder nicht mehr so auffällig.
 Stehen einem nur typische Stockfotos zur Verfügung, ist der Duotone-Effekt
oder ein Farbverlaufsfilter eine gute Gelegenheit, das Bild interessant zu
machen.
 Das gleiche gilt für Bilder, die aufgrund der Farben unpassend für das
Screendesign sind oder mehrere Bilder, die farblich nicht zusammen passen.
Hier kann der Duotone-Effekt diese vereinheitlichen.

Aktualtität:
Verbreitung:
Zukunft:
Farbverläufe
Ich hatte es zu Beginn des Artikels schon als Beispiel erwähnt: Zu Zeiten des Flat-
Designs galten sie als verschollen.

Und nun sind die Farbverläufe mit Macht zurückgekommen.

Buttons, Hintergründe, Duotone-Bilder, große Texte – nichts ist vor Verläufen


mehr sicher.

Dabei kommen dezente, kleine Farbverläufe ebenso vor, wie markante Verläufe
zwischen sehr unterschiedlichen Farbtönen.

Verläufe im Webdesign sind wieder salonfähig geworden.


Tipps für den Einsatz von Farbverläufen:
 Dezente Farbverläufe geben einem Design Tiefe und können die Benutzung
erleichtern, weil beispielsweise Inhaltsbereiche optisch klarer getrennt sind.
 Markante Verläufe sollten mit Bedacht gewählt werden und passen eher zu
innovativeren, kreativen Themen.
 Sind keine Bilder vorhanden, können Farbverläufe eine schöne Alternative
sein.

Viele Anregungen für Farbverläufe findet du bei coolhue, Gradient


Buttons oder WebGradients.
Aktualtität:
Verbreitung:
Zukunft:
Bunte kräftige Farben
Und es wird „buntisch“…
Die Zeiten des minimalistischen dezenten Designs sind vorbei, zumindest bei
einigen Websites. Hier kommen die farbenfrohen, aufmerksamkeitsstarken
Töne zum Einsatz.
Vielleicht so etwas wie der Gegentrend zum Minimalismus. Nicht mehr dezent,
eintönig und langweilig.

Mutiger, extrovertierter, innovativer – so ließe sich die neue Farbgebung


beschreiben.
Im Web 2.0-Design waren kräftig leuchtende Farben schon einmal angesagt.
Danach wurden die Farben dezenter, oft auch pastellener (siehe die Farbtrends
im Webdesign). Und nun sind sie häufig wieder gesättigter, die auch gerne mal
als grelle Farbverläufe daher kommen.

Mut zur Farbe: Kräftige, leuchtende Töne im Einsatz.


Tipps für den Einsatz von bunten Farben:
 Leuchtende, kräftige Farben eignen sich vor allem für gewichtige Elemente
wie Buttons, Links oder Überschriften.
 Ihr übermäßiger Einsatz sollten vermieden werden – oder gut begründet sein.
 Zu viele unterschiedliche kräftige Farben irritieren eher und erschweren die
Benutzbarkeit.
 Zusammen mit neutralen Farbtönen kommen kräftige Farben noch besser zur
Geltung.
Aktualtität:
Verbreitung:
Zukunft:

Aktuelle Webdesign-Trends
im Überblick
Fazit der Webdesign-Trends
Als ich mit dem Artikel anfing, hätte ich nicht gedacht, dass am Ende so viele
Webdesign-Trends zusammen kämen. Und vermutlich habe ich doch noch den
ein oder anderen übersehen (dann ab in die Kommentare damit).

Zwei Dinge fielen mir beim Schreiben aber auf:

Kein Trend ohne Gegentrend!


Entweder kommt der Gegentrend zeitversetzt (auf Skeuomorphismus folgte
Flat-Design) oder sie existieren parallel (Stockfotos und authentische
Fotografien).

Was mir aufzeigt:

Es gibt nicht den oder die Trends, die man auf jeden
Fall einsetzen sollte!
Vorsichtig sollte man nur mit extrem kurzzeitigen Trends sein, aber eigentlich
sind alle hier vorgestellten schon viel Jahre zu sehen und/oder sie werden noch
viele Jahre zum Einsatz kommen. Insofern kann man mit einem der vorgestellten
Trends zuerst einmal nichts grundsätzlich falsch machen.

Wichtiger ist es zu schauen, welcher Trend zur jeweiligen Website passt.


Lohnt es sich einen der Trends einzusetzen, zumindest teilweise? Kann man so
die gewünschte Wirkung der Website verstärken und passt er zu den Inhalten?
Eventuell lohnt es sich auch Trends neu zu kombinieren. Wie wäre es mit
einem minimalistischen Design und Ghost-Buttons? Oder fetter Typografie auf
Duotone-Bildern?
Das schöne an den Webdesign-Trends ist: Du kannst sie – so wie hier im Artikel –
kennen lernen, analysieren und selber anwenden. Sie aber auch ignorieren in der
eigenen Arbeit oder eben neu remixen. Ein falsch oder richtig gibt es nur im
Zusammengang mit dem Thema der Website.
Nicht selten ist die goldene Mitte ja ein guter Weg: Also ein paar moderne
Webdesign-Trends aufnehmen, aber nicht zu viele, sondern mit zeitlosen
Gestaltungs-Elementen kombinieren.

Und jetzt bist du dran:


Welche Webdesign-Trends setzt du ein? Habe ich wichtige vergessen? Was für
Trends siehst du im Webdesign kommen?
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


1. Wolfgang Männel
6. Februar 2018 um 11:21
Hervorragend recherchiert und sehr informativ. Danke!
1. Martin
6. Februar 2018 um 11:22
Danke 🙂
2. Christian
7. Februar 2018 um 10:40
Danke für diese sehr ausführliche Zusammenstellung! Da hat man alle Trends auf einen
Blick und auch gleich einige Ideen wie man seine eigene Seite aufhübschen kann.
1. Martin
7. Februar 2018 um 10:45
Bitte gerne 🙂
3. Lutz Thiel
10. Februar 2018 um 14:09
Ich denke du sprichst einem mit diesem Artikel – oder ist es schon eine Abhandlung – aus
der Seele. Viele Punkte angesprochen und man kann sich dazu seine Meinung bilden oder
auch nicht. Ich finde es gut auf den Punkt gebracht und lese deine Artikel immer wieder
gern. Gruß Lutz
1. Martin
10. Februar 2018 um 15:14
Danke Lutz, freut mich, wenn dir der Artikel gefällt 🙂
4. Daniel Bertacchi
11. Februar 2018 um 02:08
Hallo Martin
ich finde Deinen Weblog sensationell und sehr informativ. Ich habe von Dir schon sehr viel
gelernt und es hat dazu geführt, dass ich wieder viel mehr Energie habe sehr schöne
Webseiten zu gestalten. Ich warte immer wieder gespannt darauf wenn neue Artikel von
Dir kommen. Meine Kunden sind super zufrieden mit meinen Webseiten.
Besten Dank für Deine göttlichen Artikel.
Gruss aus der Schweiz
Danny
1. Martin
11. Februar 2018 um 10:14
Hallo Danny,
danke für deine Worte 🙂
Ansporn für mich fleißig weiter Artikel zu schreiben…
5. Pixelschubser
19. Februar 2018 um 22:40
Sehr schöner Artikel, der es auch gleich in die Lesezeichen geschafft hat. Hier kann ich
denke ich noch einiges an Informationen und Inspiration mitnehmen. Vielen Dank!
1. Martin
20. Februar 2018 um 08:55
Gerne, freut mich!
6. Erik
22. Februar 2018 um 01:53
Sehr toll dargestellt, dem ist nichts mehr hinzuzufügen und einen regelmäßigen Leser
mehr hast Du damit mit Sicherheit auch gewonnen 🙂
1. Martin
22. Februar 2018 um 08:50
Danke, dann willkommen in meiner Leserschaft 🙂
7. Gudrun
18. März 2018 um 11:24
Lieber Martin,
vielen vielen Dank!! für deine sehr hilfreiche ausführliche Zusammenstellung der
Webdesign-Trends.
Folgende Frage habe ich: Was hälst du eigentlich von der neuen CSS-Technologie der
Designgrids (display:grid) und sollte/kann man sie aktuell schon einsetzen?
1. Martin
18. März 2018 um 11:43
Halllo Gudrun,
auf jeden Fall kann man sich mit den Grids schon auseinandersetzen. Über den
aktuellen Stand verweise ich einfach mal auf folgende beiden Artikel:
http://maddesigns.de/css-grid-layout-
2764.html und https://blog.kulturbanause.de/2013/12/css-grid-layout-module/
Gruss
Martin
8. Jari
12. Juli 2018 um 18:42
Guten Abend Martin 🙂
vielen lieben Dank für diesen super Artikel. Ich finde Ihn wirklich sehr informativ… Einfach
ausgezeichnet. Generell habe ich hier schon viele Infos mitnehmen können, die mir und
meiner Agentur zu Gute kommen. Deshalb dachte ich, dass ich auch einfach mal DANKE
sage. DANKE für diese regelmäßigen tollen Infos.
Auf viele weitere Artikel.
Best regards
Jari
1. Martin
13. Juli 2018 um 06:41
Hallo Jari,
vielen Dank für dein nettes Feedback.
Das freut mich sehr und ist Bestätigung und Ansporn zugleich!
Gruss
Martin
9. Elisabeth Hamerle-Brandstetter
16. August 2018 um 16:27
Hallo Martin,
bin gerade durch Google auf Deine Website gestoßen und finden diesen Artikel super
spannend und toll auf den Punkt gebracht. Ich erstelle gerade ein Konzept zur Relaunch
unserer Website und bin beim Punkt „Redesign“ angelangt. Hab mit einigen Stunden
Recherche diesbezüglich gerechnet – aber siehe da: da hast Du schon für mich erledigt!
Vielen Dank für Deinen tollen Artikel. Kann jetzt super argumentieren bei der Präsentation
meines Konzepts.
Liebe Grße aus dem sonnigen Österreich
Lisa
1. Martin
16. August 2018 um 16:41
Hallo Lisa,
freut mich, dann viel Erfolg beim Relaunch!
Gruss
Martin
10. Carl Krauch
23. September 2018 um 10:23
Hallo Martin,
Dein Artikel ist so gut, dass ihn sogar Menschen die nicht vom Fach sind, gut verstehen
können!
Die Welt der Internetseitengestaltung, bisher für mich immer böhmische Dörfer, wird nun
übersichtlich und klar.
Endlich kann ich mich mit den Webgestaltern „auf Augenhöhe“ unterhalten und kann viel
besser erkennen, was wir für die Neugestaltung unserer Firmenseite benötigen.
Hast Du auch schon Artikel darüber verfasst, wie man spezielle Zielgruppen gut erreicht
und welche Möglichkeiten es gibt, die Herzen der Menschen über eine entsprechende
Gestaltung anzusprechen?
In diesen Punkten und vor Allem bei Letzten sehe ich bei der Betrachtung fast aller
Internetseiten Defizite.
Falls Du nicht selbst dazu etwas geschrieben hast, aber eine Abhandlung darüber kennst,
freue ich mich sehr über einen Hinweis!
Herzliche Grüße
Carl
1. Martin
23. September 2018 um 18:27
Hallo Carl,
danke für deinen Kommentar.
Vielleicht helfen dir diese beiden Artikel bzgl. der Zielgruppe weiter:
https://www.webdesign-journal.de/webdesign-strategie/
https://www.webdesign-journal.de/elevator-pitch-webdesign/
Gruss
Martin
11. Barbara
28. Oktober 2018 um 08:09
Hallo Martin,
Vielen Dank für diesen informativen Artikel!
Besonders der Hinweis auf die innovative Seite von Renate Rechner hatte für mich so einen
WOW Effekt, der mir gleich ein paar kreative Ideen, Impulse schenkte.
Die Seite ist zwar ein echter Eye-catcher, aber ein wenig umständlich zu bedienen. Aber
man muss es ja nicht so kompliziert machen.
Dein Schreibstil und dein Wissen überzeugt – ich hab gleich mal den Newsletter abonniert –
auch ohne nerviges Pop-Up 🙂
1. Martin
28. Oktober 2018 um 10:10
Hallo Barbara,
danke für deinen Kommentar.
Ja, die „Rechner“-Seite ist sehr spannend und individuell – und gerade deswegen auch
nicht so intuitiv zu bedienen.
Gruss
Martin
12. Gerald L.
1. November 2018 um 20:07
wow, sehr ausführlich und interessant geschriebener Artikel! Also ich denke in erster Linie
sollte der Trend die Auffindbarkeit bei Suchmaschinen unterstützen wie auch die Usablity
für die Besucher. Was nützt einem die schönste Seite, wenn der Inhalt nicht an die Besucher
transportiert werden kann…
13. Leon G.
5. November 2018 um 12:28
WOW! Ich bin überwältigt von diesem ausführlichen Artikel. Alle trends des Webdesign auf
einen Blick. Man merkt, dass „mobile first“ bald wahrscheinlich kein Trend mehr ist sondern
komplett ausschlaggebend für ein perfektes Webdesign.
14. Esther Norman
17. Dezember 2018 um 22:59
Super! Bin gerade im Prozess einer neuen Website-Gestaltung, wollte mir mal Anregungen
holen/Überblick verschaffen, bin gleich als 1. auf Deinem Artikel hier gelandet – und habe
das Gefühl gar nicht weiter wühlen zu brauchen – you said it all! DANKE DIR, Martin – ganz
klasse.
1. Martin
19. Dezember 2018 um 16:03
Hallo Esther, bitte gerne, freut mich 🙂
15. Felix Thönnessen
3. Januar 2019 um 18:41
Klasse Beitrag mein Lieber. Als Startup Coach lege ich auch sehr viel Wert auf die Optik
meiner Webseite. Dank Dir konnte ich wieder etwas lernen und werde mir 2-3 Punkte
definitiv umsetzen.
Liebe Grüße aus Düsseldorf
16. Stephan
4. Januar 2019 um 12:18
Danke für diese wunderbare umfangreiche Übersicht. Ein wahrer Fundus an Anregungen!
Werde den Beitrag gerne weiterempfehlen.
1. Martin
8. Januar 2019 um 19:18
Hallo Stephan,
prima, freut mich doppelt !
Gruss
Martin
17. Gustav Sucher
14. Januar 2019 um 06:20
Hallo, die ganzen Templates sehen für ein unerfahrenes Auge sehr gut aus. Allerdings gibt
es so einiges, was diese fertigen Templates nicht beachten. Es gibt einige Regeln im
Design. Wenn man diese Beachtet, dann sieht es umso besser aus. Danke für den tollen
Blog Beitrag!
18. Martin
31. Januar 2019 um 13:57
Hallo Namensvetter 🙂
super schöner und umfangreicher Blog Beitrag. Die Templates finde ich persönlich Zeitlos
und schön. Ich finde Webdesign sollte mit der Zeit gehen… Es ist super wichtig ein Zeitloses
Design zu erstellen, da viele „Kunden“ nicht jedes Jahr Ihre Webseite erneuern.
„Einfachheit“ lautet hier das Stichwort! Die Webseite oder den Blog sollte so gestaltet
werden, dass Elemente einfach und ohne viel Aufwand ersetzt werden können.
Ich werden den tollen Blog auf jeden Fall Teilen und weiterempfehlen. Macht weiter so.
LG
Martin
19. Tim
9. März 2019 um 09:43
Hallo Martin, wow super Artikel und vor allem sehr umfangreich. Wie Du oben schon richtig
schreibst ist der Spagat zwischen neuen Ideen im Webdesign und alt bewährtem eine der
schwierigsten Hürden. Meist beschneidet ja grade auch die Vorstellung des Kunden die
Kreativität am meisten und Überzeugung kostet auf Dauer auch viel Kraft. Mit Deinem
Artikel hab ich aber mal wieder neuen Input um vielleicht in der ein oder anderen Richtung
neue Argumente gegenüber dem Kunden zuhaben das man doch nicht immer zu sehr an
bestehenden Trends festhalten muss, solange es dabei nutzerfreundlich bleibt.
Ich wünsche Dir ein schönes Wochenende
Gruß Tim
20. Webdesign Oldenburg
25. März 2019 um 12:42
Wirklich ein sehr ausführlicher und guter Artikel. Vielleicht kann ich den oder anderen
Trend für meine Projekte nutzen.
21. Sertac
17. April 2019 um 10:30
Super content danke dafür.
22. Benny
17. Mai 2019 um 11:49
Geile Auflistung 🙂 Klar muss man nicht alles irgendwie gut finden aber ein paar Trends sind
schon ganz geil. Vieles davon ist vielleicht in 1-2 Jahren nicht mehr aktuell aber egal.
Webdesign ist im flow und man baut ja sowieso gern um 🙂
23. Webdesign Peine
5. Juni 2019 um 11:04
Irgendwie ist „Einzigartigkeit“ und „Trend“ ja immer so ein Sache. Wenn alle einen Trend
verfolgen bleibt die Einzigartikeit auf de Strecke, aber die braucht es nunmal ja auch um
sich abzusetzten, deshalb ist es natürlich sinnvoller Trends zu setzten als diesen
Nachzueifern. Aber genau da liegt natürlich die Krux, wie so oft. Schöne Aufstellung von
der man sich inspierieren lassen sollte ohne seine eigenen Wege zu vernachlässigen. Danke
und Gruß Mandy
24. Silvester
11. August 2019 um 20:14
Hallo Martin
Durch einen Link auf einer meiner Mitbewerber – Website fans ich den Weg zu Deinem
Artikel.
Dieser ist echt interessant und animiert zum nachdenken 🙂
Beste Grüsse
Silvester
Ü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
Der Status quo im Webdesign
Webdesign ist tot. Lang lebe Webdesign – Ja was denn nun genau? Wie so oft liegt die
Wahrheit dazwischen. Den aktuellen Stand des Webdesigns erklärt dir dieser Artikel.
Diese 7 Klischeebilder wollen wir nicht mehr sehen
Bilder sind gut. Bilder auf Webseiten sind gut. Es gibt aber einige Standard-Bilder, die
„ausgelutscht“ sind. Klischeehaft und zu oft im Einsatz. Setze diesen sieben Klischeemotive
nicht ein.
7 Webdesign-Trends, auf die Du besser verzichten solltest
Man sollte zwar die aktuellen Webdesign-Trends kennen, aber nicht jedem blind
hinterherlaufen. Wie zum Beispiel diesen sieben im Artikel vorgestellten…
Artikel-Kategorien

 Business-Entwicklung
 Designwissen
 Inspirationen
 Web-Entwicklung
Artikel-Schlagwörter
Animation Bilder Blog Branding Content Corporate Design Corporate
Identity CSS DSGVO Farbe Farbkombination Farbschema Fotoagentur Google
Webfonts Icon Icon-
Font jQuery Kommunikation Konzeption Kunde Newsletter Photoshop Plugin Podcast Po
p-Up Positionierung Projektmanagement Responsive
Navigation Schriftart Schriftkombination Slider Social
Media Stockagentur Stockfoto Strategie Style
Tile SVG Template Tools Trends Typografie Webdesign-
Strategie Webfonts Wireframe Zielgruppe
Galerie der schönsten deutschen Websites
creoheat
Theater der jungen Welt
Kiezbett
Museum für moderne Kunst
Hotel Post

Zur Website-Galerie
Bilde dich weiter
Designe.
Entwickle.
Lerne.
Das Webdesign Journal hilft Webdesignern, Agenturen, Selbständigen und generell allen
„Web-Workern“ effizientes Websites zu erstellen.
Effizientes Webdesign =
Das gelungene Zusammenspiel aus Content, Marketing, Technik & Design.

ARTIKEL
Business-Entwicklung
Designwissen
Web-Entwicklung
Inspiration
RESSOURCEN
Checkliste
Webdesign-Tools
designletter
Webdesign Buch
WEBDESIGN GALERIE
Galerie der schönsten deutschen Webseiten
WEITERBILDUNG
Online-Kurs:
Das erfolgreiche Webdesign-Business
Webdesign Survival Kit
 Datenschutz
 Impressum