Webdesign Inspiration – Designer Websites 2013

Web Designer, Agenturen und Webentwickler sind meist die ersten, die neue Webdesign Trends aufgreifen und in den eigenen Webseiten umsetzen. Viele versuchen dabei die wichtigen Trends konsequent einzubauen. Flat Design in Retro-Optik sowie einer klaren Fokussierung auf den Content stehen häufig im Vordergrund.

Sehr interessant ist auch der Trend zu einer ausgeblendeten Navigation, die aber dann eingeblendet mehr Platz verwendet und weitere Funktionen übernimmt. Erwartungsgemäß ist die Websites auch fully responsive – inzwischen fast schon Standard bei Agenturen & Designern.

Flat Webdesign Inspiration

Ich habe mich auf die Suche nach den schönsten Designer Websites von Agenturen und Freelancern begeben und diese in einer Kollektion für euch zusammengestellt.

Buffalo Agency – Minimales Webdesign

Modernes Webdesign mit Minimalem Design

Modernes Webdesign mit Minimalem Design

Die Website der Agentur Buffalo setzt auf ein flaches und modernes Layout in Form von Hexagonen, die eine Art zweite Navigation darstellen. Den einzelnen Botschaften wird sehr viel Raum gegeben und sie werden nur durch einfach Linien voneinander abgegrenzt. Elegante CSS3 Effekte sowie jQuery Slider sind gekonnt in Szene gesetzt ohne dabei die Seite zu überladen.

zur Website

Nikitia Shanin – Schönes UX Design

Minimales Webdesign und gutes UX Design

Minimales Webdesign und gutes UX Design

Die Website des russischen Webentwicklers Nikita Shanin ist ebenfalls sehr reduziert und modern realisiert worden. Neben der Startseite finden sich lediglich noch die About, Work und Contact Seiten. Der Inhalt der Seiten lädt sehr schön auf der Seite nach und wird dann langsam eingeblendet. Weniger ist eben doch oftmals mehr.

zur Website

Yaron Schoen – Minimales Webdesign

Minimales Webdesign mit Besucher-Dialog

Minimales Webdesign mit Besucher-Dialog

Geniales und einfaches UX Design. Der Human Interface Designer Yaron Schoen ist wirklich der Meister was Minimalismus betrifft. Die Website ist von Anfang an im Dialog mit dem Besucher und führt diesen vorsichtig an den Inhalt heran. Die Navigation ist in die obere Ecke verbannt, und erscheint nur bei einem Klick auf das Logo – dann aber in voller Pracht. Zu den Kunden zählen unter anderem Twitter, AOL, EA und Natial Geographic.

zur Website

Image Mechanics – Einfaches Webdesign

Minimales Webdesign mit dynamischen Nachladen

Minimales Webdesign mit dynamischen Nachladen

Die australische Agentur Image Mechanics reduziert ihre Botschaften sehr eindrucksvoll. Ansehnlich ist ebenfalls das dynamische jQuery Nachladen und Einblenden der Inhalte auf den Unterseiten. Bei der Schrift für den Content hätte ich mir persönlich etwas mehr erhofft als eine Arial in 13px.

zur Website

William Leek – Coole CSS3 Animationen

Coole CSS3 Animationen

Coole CSS3 Animationen

Die Website des Entwicklers und Designers William Leek ist minimal gestaltet. Bis auf die CSS3 Animation auf der Startseite wird auf technische Spielereien verzichtet, und dem Inhalt Vorrang gegeben. Dieses Webdesign findet sich auch immer häufiger in den populären WordPress Themes.

zur Website

Simple as Milk – Schrille Farben & Coole Typo

Flat Webdesign mit guter Typographie

Flat Webdesign mit guter Typographie

Die britische Agentur simple as milk verwendet eine sehr stilvolle Typographie in progressiver Farbkombination. Durch das flat Webdesign und die große Typographie wird der Fokus klar auf den Inhalt gesetzt.

zur Website

Jim Ramsden – Mobile User-Interface

Mobile User Interface und cooles Drop-Down

Mobile User Interface und cooles Drop-Down

Absolut geniale Seite des Designers Jim Ramsden. Hier zeigt sich deutlich wie sehr mobile Interface-Elemente inzwischen auch auf normalen Websites Einzug gehalten haben. Neben dem schmalen Design ist die versteckte Navigation ein Highlight. MUST SEE!

zur Website

Manos Agency – Flat Webdesign

Minimales Flat Webdesign

Minimales Flat Webdesign

Die Designer und Entwickler von Manos, ein Studio, dass Apps und Webseiten erstellt, zeigen auf der eigenen Webseite ihren Geschmack und ihr Können.

zur Website

Full-Screen Websites mit innovativer Navigation

Durch die neuen Anforderungen des responsive Webdesign ändern sich auch die Navigationen bzw. Menüs.

Booreiland – Awesome Slider

Ken Burne Zoom-Effekt im Slider

Ken Burne Zoom-Effekt im Slider

Die niederländische Agentur Booreiland inszeniert ihre Referenzen perfekt. Ein leichter Zoomeffekt auf die Bilder verstärkt die Wirkung und setzt die Referenzen noch stärker in Szene. Die Navigation der Seite ist innovativ gestaltet und erscheint erst auf Klick. Die starke Verschmelzung von Webseite und mobilen Interface-Elementen wird dann in der Navigation besonders deutlich. MUST SEE!

zur Website

Online Department – Sticky Navigation & Keyboard

Full-Width Slider und einfaches Webdesign

Full-Width Slider und einfaches Webdesign

Eine weitere niederländische Agentur zeigt ihre Referenzen auf der Startseite der eigenen Onlinepräsenz. Die Navigation auf der Seite per Pfeiltasten ist ein nettes Feature, an dass man sich gewöhnen kann. Es werden zahlreich aber gezielt elegante CSS3 & HTML5 Effekte eingesetzt. Reinschauen lohnt sich auf jeden Fall.

zur Website

BKWLD – Stilvolle Sticky Navigation

Video Background im Header

Video Background im Header

Die in Sacramento ansässigen Agentur BKWLD präsentiert sich auf ihrer Website mit einem Video, dass einen bleibenden Eindruck hinterlässt. Minimales Design, perfekte Videos im Hintergrund und eine Reduktion auf ganz wenige Botschaften machen diese Seite zu einem absoluten Kunstwerk. MUST SEE! Zwei Referenzen der Agentur sind ebenfalls außergewöhnlich gut: Drexel University Kampagne und Osborn Barr.

zur Website

Teehan + Lax – Full-Screen Menü

Sexy Webdesign mit Full-Screen Menu

Sexy Webdesign mit Full-Screen Menu

Die Website der Agentur Teehan+Lax ist die perfekte Synthese aus mobilem User-Interface und minimalem Web Design. Die Referenzen werden auf der Startseite im Slider imposant inszeniert. Die Navigation ist nur auf Klick verfügbar aber dann in überwältigender Schönheit. Absolutes MUST SEE!

zur Website

Work – Geniale Sidebar mit Portfolio

Innovatives One-Page Webdesign mit Multifunktions-Menu

Innovatives One-Page Webdesign mit Multifunktions-Menu

Die norwegische Agentur work ist klar im Trend mit der eigenen hochmodernen Website. Der Inhalt der Seite ist in diesem One-Page-Layout sehr geschickt verpackt. Die Themenblöcke sind farblich voneinander klar abgegrenzt und sowohl die Referenzen als auch die Fotos der Agentur befinden sich in angenehm zu bedienenden Slidern. Ein besonderes Highlight ist die Projekt-Navigation, die sich hinter dem gelben Balken am Rand versteckt. MUST SEE!

zur Website

Fantasy-Interactive – Full-Screen Blog Webdesign

Full-Screen Blog mit Sidebar

Full-Screen Blog mit Sidebar

Der Blog der Agentur Fantasy Interactive, nutzt geschickt die volle Bildschirmbreite. Die einzelnen News sind großzügig gestaltet, komplett verlinkt und nehmen etwa zwei Drittel der Bildschirms ein. Die Sidebar auf der rechten Seite ist fixiert und kombiniert herkömmlichen Footer und Sidebar. Hier wird der Trend deutlich, dass auf Websites immer häufiger Elemente verwendet werden, die ursprünglich für Touch-Gesten optimiert wurden.

zur Website

Team Geek – Icon-Navigation

Clean Webdesign mit moderem Header

Clean Webdesign mit moderem Header

Die mehrfach mit Preisen und Awards ausgezeichnete Webseite der neuseeländischen Agentur Team Geek ist im klassischen One-Page Layout. Durch einen Klick in der Navigation wird zum passenden Inhaltselement gescrollt.

zur Website

Metro Webdesign mit Grids

Mit Windows 8 kam der Metro-Stil, der sich durch große Kacheln auszeichnet. Diese Kacheln sind häufig in einem Grid angeordnet und es werden unterschiedliche Farben verwendet. Das Metro-Webdesign verzichtet komplett auf 3D-Effekte und hat meist eine sehr saubere Typographie und viel Whitespace.

Etch – Der Filter als Navigation

Grid-Website mit cooler Filter-Navigation

Grid-Website mit cooler Filter-Navigation

Die App-Designer und Entwickler von Etch, verwenden für die ganze Website ein Masonary. Jedes Inhaltselement wird in einer eigenen Kachel untergebracht, und jene Kacheln lassen sich über das eingebautes jQuery Quicksand nach Kategorie filtern. Was man sonst üblicherweise nur als Produktfilter kennt wurde hier zur Navigation umfunktioniert.

zur Website

Float Design – Grid ohne Lücken

Flat Webdesign für die Referenzen

Flat Webdesign für die Referenzen

Quadratische Flächen als Navigationselemente kennen wir inzwischen nur zu gut. Die Designer von Float verwenden dieses Prinzip auf ihrer Website sehr geschickt und kombinieren es mit einer fixen Navigation.

zur Website

My Poor Brain – Full-Width Portfolio

Full-Screen Portfolio mit Sidebar

Full-Screen Portfolio mit Sidebar

Der Graphic Designer und Illustrator Tim aus London verwendet ebenfalls Kacheln für die Referenzen und dies über die komplette Breite des Endgeräts. Eine Art Synthese aus Footer und Navigation befindet sich in der schmalen Leiste am linken Bildschirmrand.

zur Website

TinyBigStudio – Einfaches Webdesign

Simple Webdesign für das Online-Portfolio

Simple Webdesign für das Online-Portfolio

Das tinybigstudio von Pablo Dominguez verwendet ebenfalls Kacheln zur Darstellung von Inhalten und Referenzen.

zur Website

Ausgefallene Webseiten

Um in der kreativen Welt der Agentur- und Freelancer wahrgenommen zu werden, ist ein ausgefallenes Webdesign durchaus von Vorteil. Hier sind 3 gute Beispiele für euch.

Webeffectual – Starke Farben und Große Typo

Schrille Farben und Aggressives Webdesign

Schrille Farben und Aggressives Webdesign

Die grellen CMYK Farben der Joomla und Drupal Agentur sind sicherlich nicht jedermanns Geschmack. Das Design ist jedoch sehr modern und auf die Kernbotschaften fokussiert.

zur Website

Filidor Wiese – Schöne Animationen

Liebevolle CSS3 und jQuery Animationen

Liebevolle CSS3 und jQuery Animationen

Die liebevoll animierte Website des Entwicklers Filidor Wiese ist auf jeden Fall einen Besuch wert. Je nach Uhrzeit liest, programmiert, schäft oder spielt der kleine Pixelzwerg.

zur Website

Ian James Cox – One-Page Webdesign mit Scrolling

One-Page Website mit coolen Scrolling-Effekten

One-Page Website mit coolen Scrolling-Effekten

Die Webseite von Ian James Cox war sicherlich ein hartes Stück Arbeit. Sämtlicher Content befindet sich auf einer Seite und wird es wird per Navigation zur passenden Referenz gescrollt.

zur Website

Eine Übersicht der neuen Inspirationen findet ihr hier.

  • Vielen Dank für diese Auswahl wirklich wunderbarer Webseiten. Selten so einen „guten“ Geschmack erlebt beim Vorstellen der Arbeiten von Kollegen. Ich teile deine Vorliebe für minimalistisches Design.

    Herzliche Grüße
    Renate