Hey, Hi und Hallo.

361° BLOGGT RICHTIG AB.

Die Zukunft des Responsive Webdesign Teil 2

Die Zukunft des Responsive Webdesign Teil 2

13.11.2015 / geschrieben von Christian
in Entwicklung, Gestaltung, Meinung

13.11.2015 / geschrieben von Christian / in Entwicklung, Gestaltung, Meinung

  • Kommentare deaktiviert für Die Zukunft des Responsive Webdesign Teil 2

Im letzten Artikel haben wir uns über die Barrierefreiheit unterhalten. Darüber, dass Responsive Webdesign mehr leisten muss, als nur die Ausrichtung auf verschiedene Bildschirmgrößen.
Was denn noch?

Sind wir nicht alle etwas beschränkt?

Wenn ich eine Website mit meinem Smartphone besuche bin ich visuell durch die Größe meines Bildschirmes eingeschränkt (besonders, wenn ich einen Browser benutze, der von mir Pinch-to-Zoom verlangt). Gleichzeitig bin ich bei der Benutzung von Buttons eingeschränkt, da ich mit meinen Fingerspitzen surfe und die nun mal deutlich größer und ungelenker sind, als es ein Mauszeiger wäre.

Auf einem Touchscreen-Display brauche ich also eine angepasste user experience: aber ich will immer noch im Stande sein, all das mit und auf der Seite zu unternehmen, weswegen ich vorbeigeschaut habe. Ich brauche also ein angemessenes Erscheinungsbild der Website.

Diese Realität zu akzeptieren hilft uns mehr Menschen zu erreichen und dabei weniger Kopfschmerz und Augenkrebs zu verursachen. Das Erscheinungsbild, die User-Experience, kann und soll als ein zusammenhängendes Ganzes geschaffen werden. Das ist, was progressive Enhancement meint.

Am Anfang gibt es eine Art grundlegende UX (neudeutsch = user experience), die für und bei jedem funktioniert: Content, Links und Formulare, die Informationen an den Server übertragen. Und dann bauen wir die Benutzererfahrung von dort an auf und aus:

Dein Browser unterstützt HTML5-form-controls? Super! Du bekommst eine bessere virtuelle Tastatur, wenn du deine E-Mail-Adresse eingibst. Dein Browser versteht CSS? Überragend! Du bekommst eine gesteigerte Lesbarkeit. Und – dein Browser kann auch mit Media-Queries umgehen? Dann pass‘ ich dir die Zeilenlängen an, dass du es beim Lesen komfortabler hast. Wow, dein Browser kann auch noch Ajax?! Lass mich dir noch ein paar Teaser mit ähnlichem Content nachladen, die du vielleicht interessant findest.

 


 

Stell dir mal vor, du setzt dich in ein Restaurant und der Kellner bringt dir sofort ein Steak.
Aber du bist Vegetarier. Ba dum ts.
Du fragst höflich, ob du auch was anderes haben kannst und er erwidert nur: „Tut mir leid, Fleisch ist die Bedingung, Steak ist erforderlich.“ Kein Kellner, der sich für seine Gäste interessiert (und auch möchte, dass sie wiederkommen), würde sich so verhalten.

Warum tun wir das im Internet?

Warum gibt es so viele Websites, die einem sagen: Bitte besuchen Sie meine Website auf diesem oder jenem Browser, bitte installieren Sie dieses oder jenes Plugin.
Und warum verkaufen Werbeagenturen heute noch solche Websites?

Ohne User ist jede Website sinnlos. Wir sollten uns selbst anstrengen, um die Benutzer auf unsere Website zu ziehen, sie davon zu begeistern, sie zu animieren immer wieder vorbei zu schauen.
Postels Law, also der Robustheitsgrundsatz, der den Internetstandards zu Grunde liegt, sagt:

Sei streng bei dem was du tust und offen bei dem was du von anderen akzeptierst!

Vom Umgang mit Einschränkungen

Wir sollten also lieber nachsichtig sein, wenn es um die Browserunterstützung beim modernen Responsive Webdesign geht und nicht so viele (am besten keine!) Vermutungen anstrengen, welche Standards wir denn bei unseren Usern erwarten können.

Wir können die Welt nicht kontrollieren – nur unsere Reaktionen.

Für uns, Leute aus der Branche, ist das alles klarer als für die Marketingverantwortlichen und Firmenchefs. Wir werden andauernd mit neuen Bildschirmgrößen, Geräten und Fähigkeiten bombardiert. Der einzige Weg, den ich bisher gefunden habe um damit klar zu kommen ist es, diese Vielfalt zu akzeptieren. Als Feature. Nicht als Bug. Es gibt WordPress, Contao, Typo3. Es gibt normale Websites, responsive Websites, mobile Websites und Microwebsites. Es gibt Online-Shops, Webportale, interaktive Anwendungen – und natürlich noch viel viel mehr.

Es liegt an uns diejenigen in unserem Umfeld, die diese Vielfalt nicht akzeptieren, zu schulen. Zu verdeutlichen, dass das eine Realität ist, die nicht zu leugnen ist. Den Kopf in den Sand zu stecken ist keine Alternative. (Nicht nur wegen dem Sand auf dem Kopf…)

Wenn es uns selbst betrifft gehen wir immer gerne auf spezielle Bedürfnisse ein. Ein Beispiel sind Rampen für Rollstuhl- oder Radfahrer. Das ist etwas, was uns selbst immer mal wieder betrifft. Oder vielleicht auch erst, wenn wir alt sind und das Laufen nicht mehr so richtig funktioniert.

 

Rampe_edit

 

Solche Rampen sind ein Paradebeispiel für Barrierefreiheit. Aber eben nicht nur für Rollstuhlfahrer. Sondern auch für diejenigen, die einen Trolley hinter sich herziehen. Die schweres Gepäck transportieren. Oder Eltern mit Kinderwagen. Und für diejenigen, die einfach lieber die Rampe nehmen wollen und nicht die Treppe.

Wenn wir also verschiedene Wege von A nach B anbieten, können die User selbst entscheiden, welcher für sie richtig ist; sei es aus freier Wahl oder weil es die Gegebenheiten so erfordern. Am Ende kommt aber jeder an sein Ziel.

Im letzten Blogartikel haben wir uns schon die „special needs“ angesehen, die jeder von uns mitbringt. Und auch, wenn ich mich hier wiederhole: Responsive Webdesign ist natürlich etwas, das mit dem Aussehen einer Website zu tun hat. Aber der Kern des ganzen liegt in der Barrierefreiheit. Es geht darum, jedem die für ihn beste Erfahrung zu bieten.

Warum ich das immer wiederhole? Warum ich anderthalb Blogartikel mit dieser philosophischen Grundlage fülle? Ganz einfach:

Immer weiter. Immer vorwärts.

Weil die Technik jetzt nicht anhält, nur weil wir Touchscreens haben. Die Gestensteuerung kommt langsam in’s Rollen. Ja, sie funktioniert noch nicht so präzise wie ein Mauszeiger das tut. Das konnten die ersten Touchscreens auch nicht. Da hieß es am Anfang auch, dass es sich nicht durchsetzt. Niemand wolle immer ein dreckiges Display. Das waren die Worte des damaligen Nokia-CEOs. (Nokia… hach… Sentimentalität…)

Nur weil es gerade noch nicht perfekt funktioniert, oder weil wir finden, dass es affig aussieht seine Xbox mit der Hand wedelnd zu bedienen, heißt das noch lange nicht, dass es heute niemand tut, und morgen niemand tun wird.

Mit Kinect kann man seine Xbox heute schon vollständig mit Gesten steuern. Aber große Gesten sind anstrengend und auch nicht so akkurat. Das muss das Webdesign der Zukunft beachten. LEAP-Motion arbeitet deshalb schon heute an einer Finger-Steuerung für den Computer. Man sitzt also auf dem Sofa, bewegt seine Finger und surft so durch das Internet. Das funktioniert heute schon. Es ist vielleicht noch nicht verbreitet – aber es ist existent und es wird sich verbreiten.

Wie man seine Website für so etwas zurüstet? Mit Media Queries und Pointer Events. Seit Media Queries Level 4 sind wir in der Lage Stilvorgaben für explizite Interaktionskontexte zu erstellen. Beispielsweise also dafür, wenn jemand ein akkurates Eingabegerät nutzt (Maus, Stylus) oder eben ein nicht so akkurates (Finger…):

 

@media (pointer:fine) {/* kleine Buttons und Links sind ok */}
@media (pointer:coarse) {/* größere Buttons und Links wären besser */}

 

Aber das reicht ja noch nicht. Wie funktioniert es mit Hovern? Mit der Maus geht das, auf dem Touchscreen nicht, und bei Gesten?

 

@media (hover:hover) {/* Hover sind ok */}
@media (hover:on-demand) {/* Hover-Aktionen sind wahrscheinlich schwierig – vielleicht funktioniert es auch anders? */}
@media (hover:none) {/* Hover geht nicht. :( */}

 


 

Krasses Zeug? Eigentlich nicht. Das grundsätzliche Problem ist eher, dass die Art und Weise, wie wir digitalen Inhalt konsumieren, konsumieren wollen und eigentlich konsumieren sollten sich immer und immer wieder – und das auch noch rasend schnell – ändert.
Und wir sind eben eine Internetagentur, die nicht nur Trends hinterherhechelt, sondern das große Ganze sieht, nachfragt, verstehen will, Lösungen will – und euch was davon weitergibt.

Und im nächsten Blogartikel schauen wir uns dann die Sprachsteuerung an. Kommt alles auf uns zu. Unaufhaltsam…
Was denkt ihr dazu? Gestensteuerung im Web totaler Schwachsinn oder „the-next-big-thing“?

  • Kommentare deaktiviert für Die Zukunft des Responsive Webdesign Teil 2

Über den, der's geschrieben hat:

Christian mag gute Gestaltung, schöne Fotografie und echte Schallplatten. Auf der Suche nach dem Guten und Schönen kontaktet und konzeptet er für 361° Digital.

Comments are closed