Ghost Buttons: Schickes Design-Element oder Usability-Falle?

Schon ein paar Jahre spuken sie im Web – Tendenz steigend – und mischen die Webdesign Trends auf: Die Rede ist von Ghost Buttons. Gerade im Minimalistischen Webdesign, Material Design und Flat Design greift man bevorzugt auf das Element zurück. Doch was genau verbirgt sich hinter dem Ghost Button und welche Vor- bzw. Nachteile bringt er mit sich?

 

Ghost Buttons sind gerade im Flat Design oder bei minimalistisch gestalteten Webseiten beliebt.

Transparent. Prominent. Formvollendet.

Als Ghost Button bezeichnet man einen Button ohne Füllung. In aller Regel besteht der transparente (oder semi-transparente) Button aus einem feinen Rahmen, kurzem und einfachen Text sowie einem Mouse-Over-Effekt, der den Button ausfüllt und die Schrift invertiert. Der Button transportiert einen call-to-action, das heißt im Kern, er fordert den Besucher dazu auf, eine bestimmte Handlung durchzuführen, er gibt ihm zugleich Orientierung und er schafft Vertrauen und Sicherheit. Das Gestaltungsmittel ist auch unter den Begriffen Empty Button, Naked Button oder Hollow Button geläufig.

 

Durchsichtige Hingucker

Ghost Buttons stechen durch Ihre Transparenz hervor. Auf ein Minimum reduziert treten sie einerseits in den Hintergrund, sodass die zentrale Botschaft im Fokus bleibt und große Bilder sich in ihrer vollen Wirkungskraft entfalten können. Zugleich nehmen sie den User dezent, unaufdringlich und ohne überladene Effekthascherei bei seinen folgenden Schritten an die Hand.

Aktuell erfreuen sich Ghost Buttons auch in unserem Webdesign Berlin großer Beliebtheit. Gerade auf schlicht designten Webseiten machen sie sich gut und fügen sich ideal in die Gesamtharmonie der Seite ein. In Kombination mit Hero Images oder Blurry Background Bildern kommen sie besonders gut zur Geltung.

Der Ghost Button im Überblick:

  • transparent / hat keine Hintergrundfarbe
  • von einem schmalen Rahmen umrandet
  • enthält einen einfachen kurzen Text
  • Text & Rahmen sind meist schwarz oder weiß gehalten
  • besitzt gegenüber traditionellen Buttons ein etwas größeres Format
  • prominente Platzierung
  • call-to-action Funktion
  • beliebte Anwendung im Flat-Design, Material-Design, UX-Design & Minimalismus-Design

 

Zwischen Blickfang und Diffusion

Wie jedes andere (Trend-)Design-Element bringt der Ghost Button seine Vorteile genauso mit sich wie seine Nachteile. Richtig eingesetzt wirkt er wie ein eleganter Eye-Catcher, der die Seite zusätzlich ordnet und ihr einen harmonischen letzten Schliff gibt. Unbedarft eingefügt hingegen, kann er den Besucher verwirren oder einfach nur untergehen.

Geistreicher Minimalismus

Was vermeintlich einfach aussieht, kann große Wirkung haben: Bedacht implementiert und harmonisch eingebettet schafft der Naked Button es, nicht von den Bildern abzulenken, sondern dem Besucher vielmehr visuelle Anhaltspunkte mit Ordnungscharakter zu geben. Das Gestaltungselement verleiht der Seite so eine aufgeräumte und edle Ästhetik. Die Handlungsaufforderungen, die der Button transportiert, sind dabei ganz klar ohne aufdringlich zu wirken.

Der Ghost Button fügt sich ideal in das Konzept Minimalistisches Webdesign ein: Im Fokus stehen hier Funktionalität sowie eine klare Nutzeroberfläche mit wenigen, dafür aber besonders akzentuierten Elementen. Minimalismus-Webseiten arbeiten mit flachen Texturen, eingeschränkten Farbpaletten und viel negativem Raum. Das sorgt für kurze Ladezeiten und bietet viele Vorteile im Hinblick auf responsive Design.

Zudem lassen sich die transparenten Buttons vergleichsweise einfach mit HTML oder CSS kreieren (hierfür kann man im Netz sogar Tutorial-Anleitungen finden). Trotz der Schlichtheit wirken sie nicht trivial, sondern vielmehr ausgefeilt. Da sie größtenteils aus leerem Raum bestehen, lassen sie sich simpel mit anderen Gestaltungsmitteln und jedem Style verbinden. Auch in Sachen Versatilität können Ghost Buttons punkten: Im Prinzip können sie in jedem Farbschema zum Einsatz kommen. Schließlich gehören Ghost Buttons aktuell zu den angesagtesten (UI) Trends, die jeder Page einen modernen Look verleihen.

Die Vorteile des Ghost Buttons bei richtiger Anwendung im Überblick:

  • schlichtes und modernes Design
  • anspruchsvoller & raffinierter Look
  • eindeutiger aber unaufdringlicher call-to-action
  • Web Design Element, das nicht ablenkt; Hintergrundbild bleibt sichtbar
  • einfaches Design und Implementierung
  • vielfältige Einsatzmöglichkeiten

 

Den Geist (über)sehen?

Crowded out: Die Einfachheit und Durchsichtigkeit der Buttons kann ihnen aber genauso zur Falle werden. So könnten Besucher einer Seite die transparenten Knöpfe (gerade auf kontrastreichem Hintergrund) erst gar nicht als solche identifizieren. Hierbei ist es wichtig, wo der Ghost Button auf der Seite platziert wird, sodass er nicht untergeht, sondern die Aufmerksamkeit des Benutzers auf sich zieht.

Essenziell ist außerdem die Entscheidung bezüglich der Farbgebung: Photographische Hintergründe und eine ungünstige Farbwahl für die Buttons resultieren schnell in Unübersichtlichkeit und Unlesbarkeit. Gerade bei Nicht-Technikaffinen sorgt die Suche nach einer Möglichkeit sich weiterzuklicken dann nur für Verwirrung.

Die Nachteile, wenn Ghost Buttons ungünstig platziert werden, im Überblick:

  • Hintergrundbild kann den Button u.U. übertönen
  • Button kann Hintergrundbild überwältigen
  • schlechte Lesbarkeit
  • Button kann verwirren
  • könnte in ein paar Jahren veraltet sein

Navigation + Usability = beliebt bei Besuchern & Suchmaschinen

Es gibt die tollsten Designs für das Navigationsmenü - so zahlreich, fantasievoll und innovativ, dass häufig einer der zentralsten Punkte vergessen wird: Eine Navigation ist der wichtigste Bestandteil einer Website und muss in erster Linie intuitiv, logisch und einfach zu nutzen sein.

Die Aufgabe des Navigationsmenüs

Unabhängig vom äußeren Erscheinungsbild besteht die Hauptaufgabe einer Website-Navigation darin, den Besucher schnell und gezielt zu dem gesuchten Inhalt bzw. Informationen zu führen. Zusätzlich kann die Navigation durch bestimmte Hervorhebungen dem User zeigen, wo er sich gerade befindet.

Die Gestaltung einer guten Navigation

Vorüberlegungen - Bestandsaufnahme

Bevor Sie sich daran machen, das Navigationsmenü zu gestalten oder animieren, sind Vorüberlegungen zum Inhalt unabdingbar.

  • Welche Arten von Content haben/planen Sie auf Ihrer Seite?
  • Soll die Startseite ins Menü integriert werden?
  • Welche Arten von Unterseiten haben Sie? Gibt es Info-, Produkt-, Blogseiten?
  • Welche Themen lassen sich zusammenfassen, welche nicht?
  • Wohin mit den Service-Seiten wie Kontakt, Anfahrt, Impressum, AGB, Downloads usw.?

 

unlogische Hauptnavigation
Hauptnavigation eines Tapetenshops (zur besseren Ansicht zerschnitten), Themenbereiche vermischt

 

logische Hauptnavigation
Hauptnavigation eines anderen Tapetenshops, Themenbereiche klar getrennt

Das A und O - Konzeption und Ordnung

Nachdem eine Übersicht über die existierenden Inhalte erstellt ist, muss eine Gliederung angelegt werden. Dafür müssen Sie Ihre Inhalte ordnen. Dabei können Sie unterschiedlich vorgehen. Hier liegt oft der Pfeffer im Hase begraben - oder war das der Hund…? Häufig werden Dinge zusammengebracht, die eigentlich nicht zusammengehören oder an ihrem Platz nicht von Besuchern erwartet werden. Trennen Sie Ihre Inhalte wohl durchdacht. Überlegen Sie, welche Menüpunkte auf jeden Fall in die erste Ebene gehören, welche in die zweite und ggf. dritte Ebene.

Unser Tipp: Verfolgen Sie ein klares und einheitliches Navigationskonzept. Die Navigation sollte auf allen Seiten Ihrer Webseite gleich sein - d.h., nicht etwa plötzlich auf Seite A andere Hauptmenüpunkte vorweisen als auf Seite B. Ihre Besucher finden sich auf diese Weise bestens zurecht, ganz nebenbei erleichtert die Navigation die Indexierung Ihrer Webseite durch Suchmaschinen.

 

servicemenü-navigation
Servicemenü im Top-Bereich, klein und minimalistisch

 

servicemenü-footer
Große Servicemenü-Navigation im Footer

Die Bezeichnung - kreativ oder konventionell?

Sobald Ihre Gliederung in den letzten Zügen ist und allmählich handfeste Gestalt annimmt, können Sie anfangen, die Benennung der Menüpunkte zu planen. Sie möchten gerne Ihre Kreativität in die Menübezeichnungen einfließen lassen? Zum Beispiel “Zum Glück” anstelle von “Kontakt”? Bei aller Originalität - hilfreich bei der Umsetzung eines nutzerfreundlichen Navigationsmenüs ist es, wenn Sie sich an bestimmte Konventionen halten. Viele Nutzer verbinden mit den “einfallslosen” Begriffen “Kontakt”, “Home” bzw. “Startseite”, “Blog”, “Shop”, “Portfolio” uvm ganz bestimmte Inhalte. Auch haben die meisten User gelernt, dass sie über einen Klick auf das Logo wieder auf die Startseite gelangen. Bauen Sie althergebrachtes ein und Ihr Webseitenbesucher wird sich auf Anhieb zurecht finden!

Fazit

Egal wie ausgefallen und auffällig Ihr Design und Ihre Navigation am Ende wird - denken Sie an Ihre Besucher! Lassen Sie bestenfalls einen Usability-Test durchführen!

Minimalistisches Webdesign: Das Mehr im Weniger

Die Idee vom Verzicht auf Überfluss bzw. die Besinnung auf das Wesentliche kam in den vergangenen Jahrzehnten immer wieder auf, mal mehr mal weniger stark ausgeprägt. Spätestens seit Anfang der 2000er Jahre entwickelt sich diese Strömung nun (erneut) zum regelrechten Trend. Getreu dem Motto “Simplify your life” entrümpeln Menschen nicht nur ihre Wohnung, sondern das gesamte Leben vom “Zuviel”. Weg vom Komplizierten. Weg vom Konsum. Hin zu Klarheit, zu Objektivität und zu Einfachheit.

 

Diese Sehnsucht nach schlichten Strukturen, die sich auf das Nötigste beschränken, kennt die (Angewandte) Kunst bereits seit den frühen 1960er Jahren unter der Stilrichtung Minimalismus. Einst insbesondere ein Konzept der Bildenden Künste und der Architektur, weitet sich der Minimalismus-Stil kräftig auf andere Bereiche wie Musik, Mode oder Mediendesign aus. So wundert es nicht, dass in dieser Welle des Anklangs für das Schlichte ebenso die digitale Welt auf Vereinfachung setzt und Trends wie “Minimalistisches Webdesign” in aller (Blog-)Munde sind.

Schlichtes Webdesign richtig ins Szene gesetzt

Simplify your Homepage

Die Trendbewegung für schlichtes Webdesign entwickelte sich etwa um die Jahrtausendwende als direkte Reaktion auf den Trend für überladene und pompöse UI-designte Websites, deren Fokus auf Flash Intros und (allzuoft überflüssige) Animationen lag. Auf dieses Maximum – an Ablenkung und insbesondere an Ladenzeiten – will der schlichte Webstyle gerade verzichten: Bezeichnenderweise steht Minimalismus für die Konzentration auf das Wesentliche, Designelemente werden reduziert. Die Form wird der Funktion angepasst: Das Nötigste an Formen, Farben und Grafiken, soll den Blick des Users auf die Botschaft der Website lenken, indem das Design elegant in den Hintergrund tritt.

 

Die große Kunst besteht darin, Botschaft, Form und Funktion so in Einklang zu bringen, dass eine Seite nicht langweilig, gesichtslos oder plump wirken. Unser Webdesign Berlin setzt auf kreative Lösungen, die ein stimmiges Zusammenspiel schaffen und Webseiten Persönlichkeit verleihen.

Lights off, spots on

Richtig in Szene gesetzt ist das Ziel beim Minimalismus-Webdesign, Inhalte und Funktionen möglichst einfach und direkt zu präsentieren. Verspielte Elemente, Animationen, Pop-ups oder blinkende Banner, die in erster Linie ablenkend wirken, fallen weg. Nur so wird es möglich die volle Aufmerksamkeit auf den Inhalt bzw. die Botschaft zu richten. Der Benutzer soll möglichst ohne Umwege erreicht werden, sodass er einfach durch die Seite navigieren kann, sich dabei wohlfühlt und wiederkehrt. Alles, was rein dekorative Zwecke erfüllt und die Übersichtlichkeit schmälern könnte, wird ausgespart. Angestrebt wird eine einfache und klare Nutzeroberfläche mit wenigen, dafür aber besonders hervorgehobenen Elementen. Beispielsweise sollte die eigene Marke, das eigene Logo auch oder gerade auf einer minimalistisch gehaltenen Website gut sichtbar sein.

Straightforward

Das Entrümpeln auf Daten-Eben durch den Verzicht auf Spielereien und aufwendige Animationen (wie man sie auf Parallax Scrolling Websites findet) hat seine Vorteile: Ballast in Form großer Datenvolumina entstehen gar nicht erst; so verringern sich die Ladezeiten – worüber sich auch Google freut. Gerade mit Blick auf die massenhaften Verbreitung von mobilen Endgeräten ist das minimalistische Konzept vorteilhaft. Überdies ist es einfacher eine Seite responsive zu gestalten, wenn entsprechend weniger Bausteine vorhanden sind.

 

Schlichtes Webdesign und große Hintergrundbilder

Spread the idea

Keine kurzweilige Modeerscheinung: Die Vorliebe für Schlichtheit hält sich nun schon seit einiger Zeit und der Minimalismus wird in anderer Styles weitergedacht. Eng verknüpft sind minimalistische Designs mit anderen aktuell sehr beliebten Online-Webdesign-Trends, die sich ebenfalls durch klare Strukturen auszeichnen. Vom Minimalismus-Stil beeinflusst sind etwa die Trend-Beispiele

 

Minimalistische Webseiten gestalten 1.0.1.

Zwar gehen die Meinungen zuweilen auseinander, was Minimalismus im Webdesign genau zu bedeuten hat, dennoch gibt es wiederkehrende Gestaltungsmerkmale. Minimalistische Webseiten

  • arbeiten mit flachen Texturen
  • sowie beschränkten Farbpaletten
  • und verwenden vorzugsweise negativen Raum.

 

Da Funktion und Inhalt an absolut erster Stelle stehen, wirkt sich dies stark auf grafischer Ebene aus, auf die Bilder und insbesondere auf das Zusammenspiel von Schrift und leerem Raum:

Schlichheit & gezielte Akzentuierung

Die Farben Schwarz, Weiß und Grau prägen das minimalistisch gehaltene farbliche Spektrum. Getreu dem Leitgedanken, das Essentielle ins Zentrum zu stellen, werden Signalfarben mit Leuchtkraft nur genutzt, um gezielt Akzente zu setzen.

 

Generell werden Bilder und Grafiken eher sparsam eingesetzt und sind dann immer an das minimalistische Thema angepasst. So wird die Botschaft auch auf grafischer Ebene mit Rafinesse durch bewusst zurückgehaltene Farbsetzung auf den Punkt gebracht und der User kann sich ungestört genau darauf konzentrieren.

 

Minimalistisches Webdesign mittels Typographie

 

Fest im Blick

Der Umgang mit dem freien Raum und Entscheidungen auf der Schriftebene gehören zu den wirkungsvollsten Gestaltungsmitteln der “Minimal-Designer”: Die Typographie etwa zeichnet sich durch serifenlose Fonts und Einheitlichkeit des Schrifttyps auf der gesamten Seite aus. Um Texte zu gliedern, wird mit Variationen in der Schriftgröße bzw. Schriftsetzung gearbeitet.

 

Mit dem in den Hintergrund gerückten Einsatz von Grafiken, tritt die viel leichter wahrnehmbare Seitenstruktur in den Vordergrund. Um die Texte übersichtlich und strukturiert darzustellen, bedient man sich beim minimalistischen Webdesign am Rastersystem (Grid Ansatz). Der Text steht hierbei im Blocksatz. Neben Schriftgröße und Schriftsetzung ergibt sich als andere Gliederungsmöglichkeit die Gestaltung mithilfe von Weißräumen: Inhaltliche Hierarchien etwa lassen sich über eine ideale Verteilung von Abständen und freien Flächen im Verhältnis zu Textfläche schaffen.

Flat Design Logo

 

Flat Design: Der Weg zum funktionalen Webdesign

Leuchten, Blinken, komplexe Farben, Schlagschatten, dreidimensionale Effekte - Was noch vor einigen Jahren der Hit war, ist heute unvorstellbar geworden. Das Zeitalter des Flat Design ist angebrochen und setzt den Fokus auf den Content, ohne den Nutzer mit visuellen Effekten und realistisch wirkenden Texturen zu irritieren.

 

Im Gegenteil zum (unaussprechbaren) Skeuomorphism Design, welches eher versucht die Realität abzubilden, konzentriert sich der moderne Flat Style auf die Funktionalität und Simplizität einer Website. Flat Design ist minimalistisch und wirkt dadurch einfach, doch es ist nicht so einfach umzusetzen, wie es aussieht. Sich auf die wichtigen Dinge zu reduzieren fällt uns im Alltag schließlich auch häufig nicht so leicht.

Flat Design: Reduziert ≠ langweilig

Können wir einen Button nur als solchen identifizieren, wenn er durch einen Verlauf, abgeflachte Kanten oder einen Schlagschatten grafisch aufbereitet wurde? Wie viele Verzierungen sind überhaupt notwendig?

 

Das Flat Design zwingt uns dazu, bewusst über die Funktionalität des entsprechenden Designs nachzudenken. Auch unser Webdesign in Berlin konzentriert sich bei der Erstellung einer Webseite auf die Entwicklung von sinnvollen Bedienkonzepten, anstatt auf grafische Spielereien und visuelle Effekte zu setzen.

 

Grundsätze wie “Weniger ist mehr” und “Die Form folgt der Funktion” nehmen im Bewusstsein der Designer Web-Community wieder mehr Präsenz ein. Als positiver Nebeneffekt führt ein Flat Design durch seine reduzierten Grafiken zu schnelleren Ladezeiten. Internetpräsenzen werden dadurch kompakter und flexibler zugleich. Im Sinne des Responsive Webdesign Berlin lässt sich auch ein Flat Design auf unterschiedliche Bildschirmgrößen anpassen.

KIS: Keep It Simple

Den Höhepunkt seiner Popularität erlangte das Flat Design als Apple mit iOS 7 einen radikalen Sprung machte - Texturierte, dreidimensional wirkende Icons mit Schlagschatten waren plötzlich reduziert und wirkten zweidimensional und flach: Daher auch der Name Flat Design.

 

Viele User waren zunächst irritiert - Das reduzierte Design fühlte sich für sie wie ein Rückschritt an. Im multimedialen Trubel unserer heutigen Zeit, hilft das übersichtliche und funktionale Design aber dabei den Überblick zu behalten. Hier ein fiktives Beispiel:

 

Flat Design fiktives Beispiel

 

Als Google seine Webseiten und Anwendungen unter dem Synonym Material Design im Flat Design relaunchte, wurde das reduzierte und funktionale Layout im virtuellen Alltag immer präsenter:

 

Flat Design Google Logo vorher-nachher

 

Selbstverständlich reduziert sich Flat Design nicht nur auf Icons und Logos, sondern hilft auch dabei eine Website zu strukturieren. Nach der radikalen Veränderung des Logos hat Google sogar sein gesamtes Netzwerk Google+ im Flat Design entworfen. Die Oberfläche wirkt dadurch aufgeräumt und übersichtlich:

 

Flat Design: firmennest Google+

 

Die Normen des Flat Designs:

  • Verzicht auf Texturen
  • Typografie als Gestaltungsmittel
  • Make It Perfect: Akurat und pixelgenau
  • Farbe, Farbe, Farbe: hell, kräftig, dynamisch und gesättigt
  • Verzicht auf Plastizität
  • KIS: Keep It Simple
  • Einen Effekt gibt es noch: Den langen Schatten

Flat Design und die dritte Dimension - Geht das?

Google verfolgt also ebenfalls den Ansatz „weniger ist mehr“ um die Nutzerfreundlichkeit seiner Anwendungen zu maximieren. Der Trend des Flat Designs hat sich in den letzten drei Jahren weiterentwickelt. Die “Flat Technologie” hat sich inzwischen etabliert und die anfangs einfach wirkenden Layouts werden immer komplexer und funktionieren trotzdem auf allen mobilen Endgeräten.

 

Im Zeitalter der Virtual Reality bleibt jedoch auch das Flat Design nicht starr. Es liegt im Trend, die flach wirkende zweidimensionale Ebene durch eine dritte Dimension zu erweitern und dem Design dennoch treu zu bleiben. Hierfür werden gerne kleine Animationen eingesetzt, die das Flat Design nicht stören, sondern unterstützen und sowohl im Hover- als auch im Normalzustand sichtbar sind.

Flat Design 2.0 - Wie sieht die Zukunft aus?

Wir interessieren uns für alle News, die das Netz zu bieten hat. Dabei ist es spannend zu beobachten, welche Webdesign Trends 2016 sich halten. Wir sind auch gespannt, wie sich dieser Trend weiterentwickeln wird. Erlebt das verspielte Layout eine Renaissance und die Effekte und Schlagschatten kehren zurück? Oder bleibt uns das “weniger ist mehr” erhalten? Bei der Programmierung einer Website ist uns aber vor allem wichtig, dass diese zeitlos zeitgemäß ist.

 

Flat Design: Verschiedene Icons

Webdesign Trends 2016: Was eignet sich für Ihre Website?

Das Jahr 2016 konnte sich bereits einige Monate lang von seiner besten Seite zeigen und mit neuen Inspirationen sowie dem ein oder anderen Trend glänzen. Auch im Bereich Webdesign und Webentwicklung zeigen sich Trends auf, welche teils neu entstanden, teils aus den vorangegangenen Jahren mitgenommen wurden.


Angepasst an die rasante Entwicklung der Internetnutzung und inspiriert von großen Konzernen wie Microsoft und Apple sind diese Orientierungen richtungsweisend im Webdesign. Lassen Sie sich inspirieren von den aufgeführten Beispielen - vielleicht ist auch etwas für Ihre (neue) Website dabei! Unsere Spezialisten für das Webdesign in Berlin beraten Sie gern!


Flat Design mit minimalistischen Zügen

Das “flache” Design konzentriert sich in seiner Gestaltung vor allem auf die wesentlichen Dinge. Darstellungen und Abbildungen müssen bei diesem Trend nicht mehr absolut realistisch wirken - Texturierung, Schattierung und Verzierungen sind kein Muss.

Webdesign Trends 2016: Flat Design


Viel mehr gehen die Web Design Trends 2016 hin zu einem minimalistischen Design. Durch einfache geometrische Formen und das bewusste Einbeziehen weißer Freiflächen können Webdesigner den Blick des Besuchers gezielt lenken und fokussieren. Der Einsatz plakativer Farbflächen oder leichter Farbverläufe unterstützt diese Funktion.

 

3D-Ansichten bei Produktvorstellungen

Auch wenn die Trends generell in Richtung des Flat Design laufen, ist es bei Online-Shops oder anderen Websites mit Produktansichten konträr: 3D-Ansichten geben dem Interessenten ein viel besseres Bild von dem Produkt und können so besser überzeugen.

Vor allem bei kostenintensiveren Produkten ist diese Darstellungsweise im Web von großem Vorteil und bietet eine Möglichkeit, sich gegenüber Wettbewerbern zu differenzieren.

 

Kacheldesign à la Windows 8

Insbesondere von Microsofts Betriebssystem, aber auch von Pinterest oder ansatzweise Instagram und Tumblr bekannt, ist der Trend zum Design mit Kästchen, Kacheln und Rechtecken. Die Gestaltung von Websites nach diesem Prinzip - auch Card-Based Design genannt - ermöglicht es dem Websitebetreiber, dem Besucher sofort viele Eindrücke und Informationen zu vermitteln. Das dynamische Feld lädt den Besucher zum Klicken und Umschauen ein.

webdesign trends 2016 kacheldesign


Viele Anbieter gingen und gehen hinüber dazu, diese Kacheln oder Fliesen für die eigene Website auch im Responsive Design für mobile Endgeräte und verschiedene Bildschirmgrößen einzusetzen. Eine gleichartige Gestaltung und der Wiedererkenungswert sind damit gesichert. Außerdem sind die Kacheln sowohl mit Mauszeiger als auch Finger gleichermaßen gut bedienbar.

 

 

Mobile Optimierung nicht vergessen!

Dieser Trend 2016 ist eine Weiterführung aus den vorangegangenen Jahren. Die Nutzung von mobilen Endgeräten steigt stetig und das heißt für Webdesigner und Webentwickler, dass die Bedeutung des Responsive Design ebenfalls zunimmt.


Die mobilen Nutzer greifen dabei lieber auf Apps zurück, als den Browser zu verwenden. Vor allem bei sozialen Netzwerken ermöglichen Apps einen einfachen und schnellen Zugriff. Diesen möchten sich auch weitere Plattformen und Shops zu Nutzen machen und bieten eine bequeme Registrierung über die Verbindung mit Accounts sozialer Netzwerke an.
Ist Ihre Website schon “mobile friendliy” für verschiedene Bildschirmgrößen optimiert? Wir beraten Sie gern zum Thema Responsive Webdesign Berlin!

 

 

Animationen als beweglicher Blickfang

Obwohl die Web Design Trends 2016 einerseits in Richtung “weniger ist mehr” gehen, darf die Dynamik auf der eigenen Website trotzdem nicht fehlen.


Kleine, animierte Loading Images können den wartenden Nutzer informieren oder unterhalten. Navigationsmenüs oder Hover Animationen ermöglichen ihm eine leichtere Bedienung, ohne dass die Website von vornherein überladen wirkt. Außerdem verleiht Sie dem Besucher ein Gefühl von Interaktivität.


Slideshows im Bereich above-the-fold und Gallerien erfreuen sich ebenfalls immer größerer Beliebtheit, um eine leichte Bewegung auf die Website zu bringen, ohne dass zu viel Unruhe entsteht. Animationen und Videos im Hintergrund haben ungefähr denselben Effekt - allerdings gehören lange Ladezeiten von Websites verursacht durch zu große Gestaltungselemente nicht zu den Web Design Trends 2016!

 

 

Emotionalisierung der Inhalte

Neben dynamischen Bildern erzeugen auch ruhige, aber minimalistisch gestaltete Bilder und Grafiken im Hintergrund beim Betrachter die gewollte Stimmung. Ob zu informativen oder unterhaltenden Zwecken, visuelle Darstellungen nimmt das menschliche Gehirn besser wahr als Text.


Wegen seiner Anschaulichkeit und Bindung des Betrachters ist auch das Storytelling im Web sehr beliebt. So können Sie eine kleine Geschichte erzählen - über Sie, Ihr Unternehmen, Ihre Erfahrung und Erfolge. Besonders in Verbindung mit den bereits genannten Hintergrundvideos und aussagekräftigen Bildern lassen sich beim Betrachter Sympathiepunkte durch eine ansprechende Gestaltung machen. Webdesigns, die nicht dem gewohnten standardisierten Aufbau entsprechen und sehr persönlich wirken sollen, sind dafür besonders gut geeignet. Laden Sie Ihren Besucher auf eine Reise ein und machen Sie Ihre Website zum Erlebnis!

 

 

Langes Scrolling - Kein Problem für mobile Nutzer

Was der User auf dem Bereich der mobilen Endgeräte kennt, ist auch einer der Web Design Trends 2016. Diese Websites sind wie gemacht für das Element des Storytelling. Der Verlauf der Erzählung kann so in chronologischer und kausaler Reihenfolge dargestellt werden. Von Websites im Responsive Design ist der User langes Scrolling bereits gewohnt. Auch Trends im Web wie der Onepager orientieren sich an diesem Gestaltungsmittel.

 

 

Hamburger Menu: Fluch oder Segen?

Nur wenige der Webdesign Trends 2016 spalten die Meinungen so stark wie das Hamburger Menu. Eigentlich ist es schon seit vielen Jahren im Umlauf und findet bei seinen Befürwortern weiterhin großen Zuspruch.

Web Design Trends 2016 Hamburger Menu
Vorteilhaft ist vor allem das minimalistische Design, welches sich perfekt in die Webdesign Trends 2016 einfügt und es nahezu überall einsetzbar macht. Insbesondere auf kleinen Bildschirmen schafft es Platz für anderen Content, während die Navigation beliebig erweiterbar ist.


Einerseits kann dieses versteckte Menü also sehr hilfreich sein, andererseits verbirgt es die Inhalte der Seite vor dem Nutzer. Ein Extraklick ist notwendig, um die Navigation überhaupt erst sichtbar zu machen und macht diese damit weniger benutzerfreundlich.

 

 

Überzeugende Inhalte zur Differenzierung im Wettbewerb

Ebenfalls ein alter Schinken, dennoch weiter bedeutsam: Der Content der Website darf neben dem Design nicht untergehen. Denn auch wenn nicht jeder User Ihre Website von vorn bis hinten komplett durchliest, informative und unterhaltsame Inhalte wecken das Interesse beim Kunden, wenn sie denn auf der Website richtig platziert sind. Über originellen Content freuen sich nicht nur interessierte Besucher, sondern auch Suchmaschinen wie Google und Co.

 

 

Was ist nun das Richtige für mich und meine Website?

Die Beantwortung dieser Frage kann Ihnen leider niemand abnehmen, denn Sie wissen am besten, wofür Sie, Ihre Firma oder Organisation stehen und wie Sie sich präsentieren möchten. Nicht alle Webdesign Trends müssen auf einer Website vereint werden, denn wichtig ist, welches Ziel Sie mit Ihrer Internetpräsenz verfolgen.

Aus Erfahrung können wir Ihnen viele Tipps zum Verhalten der Internetuser und Referenzen zu verschiedenen Gestaltungselementen geben. In Zusammenarbeit mit Ihnen entwickeln wir so eine ansprechende und benutzerfreundliche Website. Kontaktieren Sie uns für ein erstes unverbindliches Gespräch - wir beraten Sie gern!

Jetzt unverbindlich und kostenlos beraten lassen!

030 53 08 82 35