Selbstverständlich ist bei einer modernen Website heute nicht nur die Lesbarkeit auf allen Geräten wichtig, sondern immer auch vor allem noch das ansprechende Design. Daher zeigen wir Ihnen in diesem Beitrag eine Auswahl von wirklich gut gelungenen, responsiven Websites zu Ihrer Inspiration.
Beispiele von gut umgesetzten responsiven Webdesign
Zu jeder Website haben wir Ihnen die responsiven Ansichten auf allen Ausgabegeräten verlinkt. Dort, wo Sie keine zusätzliche responsive Abbildung finden, ließ sie sich mit dem Tool „Am I Responsive“ leider nicht herstellen. Mobile Ansichten sind bei den betreffenden Websites nur über die Geräte direkt aufrufbar.
News Layout
Hier ein hervorragendes CSS-Grid-Beispiel mit einem 12-Spalten-Layout für eine Nachrichtenseite, mit einer Featured Story ganz oben. Von Marc Müller.
Magazine Layout
Dieses Magazin-Layout verwendet Flexbox, um Retro-Formen, mehrspaltigen Text und ein großes Bild hinzuzufügen. Erstellt von Raisa Yang.
Modular CSS Grid Layout Sections
Von Brian Haferkamp.
CSS Grid Magazine Layout
Von Elzette.
A Piece of Art
Von Michelle Barker.
Inside Abbey Road

Beagle – Better proposals

HBM FiberSensing


Web Design London


Carmichael Lynch

Estudio NK


Welcome Spring Festival 2015


Marie – Creative Agency Portfolio Template


Masi Tupungato


Cofamedia Inc


Fornasetti


OuiSurf in Africa

Chris Niedenthal

Alexander Engzell Portfolio


Bav Tailor


Trading Culture


RGB Media


Unfollowhance


Diego Sivori


RC Comunicação


555 Chabanel


BrainBox


Ello


Mage Developers

Futuramo Icons


jeferson winter


Totem

nbsp;Catalogue-Interactif Bonobo

Nothing But Thieves

One Dollar Lesson

Five Minutes

Doriart Webdesign

Vangarde Music

8. Sons of Anarchy Tattoo Stories

RGB Media Webdesign-Agency

De Haus

Gogoro

adaptable

Trippeo

Let´s make History

Urban Influence

MoodBoard Film

Reebok – Be more Human

Easy Rocket Studio

Chedi Andermatt Residences

Celebrating Chinese New Year 2015

We are Zaion

Melanie Daveid

Österreich erleben

Sassi Holford

Bolig Reisen

DogStudio

FiberSensing

NUA Bikes

Emiliano Barri

RiotGames: Thunderdome

In Pieces

Printemps du Polar

While We’re Young

Fazit
Diese guten Exemplare responsiven Webdesigns machen Hunger auf mehr, man möchte sich fast augenblicklich hinsetzen und eine responsive Website selbst entwickeln. Inspiration dürfte dieser Beitrag genug gegeben haben. Mir persönlich gefällt die Website der Mage Developers sehr gut, da der Hero-Bereich wirklich ansprechend gestaltet worden ist und schöne Fotos Verwendung fanden.
8 Antworten
Danke für die interessanten Beispiele!
Tipp: Statt “Am I Responsive” hätte vielleicht die Firefox-Funktion “Bildschirmgrößen testen” (https://developer.mozilla.org/de/docs/Tools/bildschirmgroessen-testen) oder die analoge Funktion von Chrome geholfen.
Ach, noch etwas: Ich bin ein begeisterter Linux- und Mac-Anwender, aber die ständige Präsenz der Mac-Hardware in Präsentationen, die mit dem tatsächlichen Apfel-Marktanteil nichts zu tun hat, langweilt langsam. Gibt es denn wirklich keine auch nur halbwegs ansehnliche PC-Hardware? OK, ich habe noch keine gesehen, aber gibt es wirklich keine? Überhaupt nicht? Wäre das nicht eine Marktlücke? 😉
Wir haben da leider keine Aktien bei Am I Responsive. Und die verwenden nun mal Mac-Hardware.
Ich verwende sie auch – zum Arbeiten wie in Darstellungen. Mich wundert nur, dass es keine Alternative gibt. Die Monotonie wird langweilig.
Manche Themes sind wirklich sehr schön. Aber ich muss auch mal negatives Feedback loswerden. Was mir immer häufiger auffällt, hier auch am Beginn des Artikels: Das meiste sind einfach nur Stockfotos! Bilder mit 3-4 Buttons und viel mehr kommt dann auch nicht.
Und so minimalistisch wie einige Themes ausfallen, stellt sich mir die Frage wie die Designer damit Geld verdienen können. Im Grunde kann man sich das meiste Wissen in wenigen Tagen dafür aneignen – zudem hat man dann ein wirklich individuelles und eigenes Design.
Andere hier gezeigte Themes sind typisch modern und viele finde ich wirklich inspirierend. Startups und Website-Apps schießen wieder wie Pilze aus dem Boden – darauf zielen die meisten Themes eben ab.
lg Marcus
Hallo Marcus. Danke für deinen Kommentar. Dieser Artikel hier befasst sich allerdings gar nicht mit Themes, sondern ist ein Showcase real existierender responsive Sites.
Du hast völlig recht.
Fast alle Websites die irgendwo als besonders schön vorgestellt werden, leben lediglich durch ihre tollen, vollformatigen Background Photos.
Mich erinnert sowas auch eher an die futuristischen Prototypen, die auf den Autosalons vorgestellt werden – im täglichen Leben bekommt man sie nie zu Gesicht.
Kunden wollen ihren (möglichen )Kunden im Internet etwas über ihr Business, ihre Qualifikation erzählen – viel.
Für vernünftige Suchmaschinenoptimierung sind sie sowieso ungeeignet.
Wirklich schöne Seiten (täglich neu) gibt es hier zu sehen:
http://awwwards.com/
Das sind wirklich tolle Beispiele!