Share
Ich hatte das große Vergnügen, die abschließende Keynote auf der Responsive Day Out 3: Der letzte Haltepunkt. Bei der Konferenz, die am 19. Juni 2015 in Brighton (Großbritannien) stattfand, kamen Designer und Entwickler zusammen, die ihre Workflowstrategien, -techniken und -erfahrungen mit responsivem Webdesign austauschten.
Hier ist was ich zu sagen hatte.
Heute gab es eine erstaunliche Tour durch die Welt des responsiven Designs. Wir haben gesehen, wie wir unsere Workflows und Prozesse verbessern können. Wir haben neue Wege gefunden, um die Zugänglichkeit unserer Produkte zu verbessern. Wir haben uns mit modernen CSS- und HTML-Funktionen auseinandergesetzt, die uns dabei helfen, die äußerst variablen Anzeigegrößen zu umarmen, die sich um uns herum bewegen.
Wir haben die Zukunft des modularen Codes und der Fähigkeit von Browsern erforscht, ohne Netzwerkverbindung zu arbeiten. Und wir haben sogar eine Reise in die mögliche Zukunft des Web unternommen.
Wir haben seit Ethans Artikel, Fluid Grids, flexiblen Medien und Medienanfragen einen langen Weg zurückgelegt. Diese drei Grundsätze säen einen Samen aus, der gewachsen und blühte, als wir die Implikationen der Geräteverbreitung besser verstehen wollten. Wir haben gesehen, dass das Web in der Lage ist, überall hin zu gehen und so ziemlich alles zu tun.
Ich würde behaupten, dass "Responsive Web Design" der erste Artikel war, der es wirklich geschafft hat, die Konzepte, die John Allsopp so viele Jahre zuvor in "A Dao of Web Design" besprochen hatte, einzufangen und sie in etwas zu destillieren, das die Design- und Entwicklungsgemeinschaft wirklich versenken könnte ihre Zähne in. Es ist ein konkretes Beispiel für die Fähigkeit der Bahn, sich zu biegen und in jede Form umzuformen, die sie annehmen muss.
Es war das erste Mal, dass sich viele Designer mit der Idee auseinandersetzten, dass „Erfahrung“ keine monolithische Sache ist.
Sicher, viele von uns in der Web-Standards-Community hatten über die fortschreitende Verbesserung gesprochen. Und wir gewannen Konvertiten, aber der Fortschritt war langsam. Ethan demonstrierte direkt und knapp, wie die fortschreitende Verbesserung des visuellen Designs aussehen könnte.
Es wäre unmöglich, jedem Menschen, der auf unsere Websites zuzugreifen versucht, eine identische Erfahrung zu bieten. Es sind einfach zu viele Faktoren zu berücksichtigen. Wir haben Bildschirmgröße, Anzeigedichte, CPU-Geschwindigkeit, RAM-Größe, Verfügbarkeit von Sensoren, Verfügbarkeit von Funktionen, Schnittstellenmethoden… atmen … Betriebssystemtyp, Betriebssystemversion, Browsertyp, Browserversion, installierte Plug-Ins, Netzwerkgeschwindigkeit, Netzwerklatenz, Netzwerküberlastungen, Firewalls, Proxies, Router und wahrscheinlich ein Dutzend anderer Faktoren, die mein Geist nicht in der Lage ist, inmitten des Wirbelwinds herumzuputzen der technischen Überlegungen.
Und das betrifft nicht einmal unsere Benutzer.
Wenn es um die Menschen geht, die wir erreichen müssen, damit unsere Arbeit tatsächlich eine Rolle spielt, müssen wir das Alphabetisierungsniveau, den Lesewissen, das Domänenwissen, kognitive Beeinträchtigungen wie Lernbehinderungen und Dyslexie, Aufmerksamkeitsdefizite, Umweltablenkungen, Sehstörungen, Hörbehinderung, motorische Beeinträchtigung, wie viel sie mit ihrem Gerät umgehen, wie sehr sie mit ihrem Browser umgehen, wie gut sie mit den gängigen Webkonventionen vertraut sind, und eine Menge anderer "menschlicher Faktoren"..
Jeder Mensch ist anders und jeder kommt mit seinen speziellen Bedürfnissen ins Web. Manche sind immer dabei, zum Beispiel Blindheit. Andere sind vorübergehend, wie z. B. den Mausarm brechen. Wieder andere sind rein situativ und abhängig von dem Gerät, das Sie gerade verwenden, sowie von ihren technischen Möglichkeiten oder Einschränkungen.
Der Versuch, für jeden Einzelnen eine monolithische Erfahrung zu entwickeln, um in jedem Kontext, der jeden Faktor berücksichtigt, zu bestehen, wäre unmöglich. Und doch hatte Sir Tim Berners-Lee eine Vision für ein Web, das überall hingehen konnte. War er verrückt??
Sir Tims Vision für das Internet bestand darin, dass Inhalte einmal erstellt und von überall aus aufgerufen werden können. Über den Globus verstreute, aber verwandte Teile von „Hypermedia“ könnten über Links miteinander verbunden werden. Darüber hinaus können sie von jedem Gerät auf jedem Gerät abgerufen werden, das HTML lesen kann. Kostenlos.
Letztendlich sah Sir Tim eine universelle Zugänglichkeit vor.
Für viele von uns ist die Sicherstellung der Zugänglichkeit unserer Websites ein nachträglicher Einfall. Wir sprechen ein gutes Spiel, wenn es darum geht, dieses oder jenes „benutzerzentriert“ zu behandeln, aber häufig wird das Wort „Zugänglichkeit“ als Synonym für „Bildschirmleser“ behandelt. Es ist so viel mehr als das. Bei „Barrierefreiheit“ geht es um Menschen. Menschen konsumieren Inhalte und verwenden Schnittstellen auf viele verschiedene Arten, einige sind ähnlich und manche sind sehr unähnlich wie wir es tun.
Sicher, Menschen mit Sehbehinderung verwenden häufig einen Bildschirmleser, um Inhalte zu konsumieren. Sie können aber auch ein Braille-Touch-Feedback-Gerät oder einen Braille-Drucker verwenden. Sie verwenden wahrscheinlich auch eine Tastatur. Oder sie verwenden einen Touchscreen in Verbindung mit Audio-Hinweisen. Oder sie verwenden sogar eine Kamera, um Inhalte per OCR und Text-zu-Sprache „lesen“ zu können. Und ja, Sehbehinderung wirkt sich auf einen anständigen Prozentsatz der Bevölkerung aus (besonders wenn wir älter werden), aber sie ist nur ein Teil des Rätsels „Zugänglichkeit“.
Der Kontrast zwischen Text und Hintergrund ist ein wichtiger Faktor, um sicherzustellen, dass der Inhalt in verschiedenen Lichtsituationen lesbar bleibt. Die Farbauswahl ist ein Problem der Zugänglichkeit.
Die Sprache, die wir auf unseren Websites und in unseren Schnittstellen verwenden, wirkt sich direkt darauf aus, wie einfach es für unsere Benutzer ist, zu verstehen, was wir tun, welche Produkte wir anbieten und warum es wichtig ist. Dies beeinflusst auch, wie wir unsere Benutzer dazu bringen, sich selbst, ihre Erfahrung und unsere Unternehmen zu fühlen. Die Sprache ist ein Problem der Zugänglichkeit.
Die Größe unserer Webseiten hat einen direkten Einfluss darauf, wie lange das Herunterladen unserer Seiten dauert, wie viel unsere Kunden für den Zugriff auf sie kosten und (manchmal) sogar, ob der Inhalt erreicht werden kann oder nicht. Leistung ist ein Problem der Zugänglichkeit.
Ich könnte weitermachen, aber ich bin mir sicher, dass Sie den Punkt verstehen.
Bei der Barrierefreiheit geht es darum, gute Erfahrungen für alle zu bieten, unabhängig von körperlichen oder geistigen Fähigkeiten, Geschlecht, Rasse oder Sprache. Es erkennt an, dass wir alle spezielle Anforderungen haben - physikalische Beschränkungen, Bandbreitenbeschränkungen, Gerätebeschränkungen -, die erfordern, dass wir dieselbe Schnittstelle auf unterschiedliche Weise kennenlernen.
Wenn ich beispielsweise eine Website auf meinem Telefon besuche, bin ich visuell durch meine Bildschirmauflösung eingeschränkt (insbesondere, wenn ich einen Browser zum Zoomen benutze) und ich bin nur eingeschränkt in der Lage, mit Schaltflächen und Links zu interagieren, da ich mit browse meine Fingerspitzen, die größer und weitaus weniger genau sind als ein Mauszeiger.
Auf einem Touchscreen kann es sein, dass die Erfahrung ein wenig anders ist, aber ich muss immer noch in der Lage sein, das zu tun, wozu ich auf die Website gekommen bin. Ich brauche ein Erfahrung, aber dazu brauche ich die angemessen Erfahrung.
Die Erkenntnis, dass Erfahrung nicht nur eine Sache sein muss, wird uns helfen, mehr Menschen mit weniger Kopfschmerzen zu erreichen. Erfahrung kann und soll als Kontinuum gestaltet werden. Dies ist eine fortschreitende Verbesserung: Wir beginnen mit einer Basiserfahrung, die für jeden Inhalt, echte Links, Formularsteuerelemente der ersten Generation und Formulare, die tatsächlich an den Server übermittelt werden, funktioniert. Dann bauen wir die Erfahrung von dort aus auf.
Ihr Browser unterstützt HTML5-Formularsteuerelemente? Großartig! Sie erhalten eine bessere virtuelle Tastatur, wenn Sie Ihre E-Mail-Adresse eingeben. Sie können CSS verwenden? Toll, lassen Sie mich dieses Leseerlebnis für Sie verbessern. Oh, Sie können mit Medienanfragen umgehen! Lassen Sie mich das Layout anpassen, damit diese Leitungslängen etwas angenehmer sind. Wow, Ihr Browser unterstützt Ajax ?! Lassen Sie mich hier einige Teaser für verwandte Inhalte laden, die Sie vielleicht interessieren könnten.
Stellen Sie sich vor, Sie sitzen in einem Restaurant, nur damit Ihnen der Kellner sofort ein Steak bringt. Aber du bist Vegetarier. Sie fragen, ob sie etwas anbieten, das Sie essen können, und sie antworten höflich: "Oh, tut mir leid, Fleisch ist eine Voraussetzung. Warum isst du nicht einfach Fleisch? Es ist einfach! Du verpasst wirklich etwas Leckeres." Das würde kein Kellner tun, der sich wirklich für Ihre Erfahrung interessiert.
Und dennoch haben wir als Industrie kein Problem damit, jemandem mitzuteilen, dass er seinen Browser ändern muss, um uns anzupassen. Das ist einfach falsch. Unsere Arbeit ist ohne Benutzer ohne Bedeutung. Wir sollten uns nach hinten beugen, um sie anzuziehen und zu halten. Dies ist der Kundenservice 101.
Dies kommt auf Postels Gesetz zurück, das Jeremy oft erzählt:
Sei konservativ in dem, was du tust, sei liberal in dem, was du von anderen akzeptierst.
Wir müssen lasch sein, wenn es um Browser-Unterstützung geht, und nicht zu viele (oder besser) Annahmen darüber machen, was wir senden können.
Natürlich ist dies keine Herangehensweise, zu der sich alle in unserer Branche bekennen. Ich werde ein weiteres Angebot unterbreiten, zu dem ich immer und immer wieder komme.
Wenn etwas passiert, ist das einzige, was in Ihrer Macht steht, Ihre Einstellung dazu; Sie können es entweder annehmen oder ablehnen.
Wir können die Welt nicht kontrollieren, wir können nur unsere Reaktion darauf kontrollieren.
Nun, die von Ihnen, die sich zu diesem letzten Responsive Day Out versammelt haben (oder zu Hause nachfolgen), verstehen dies wahrscheinlich mehr als die meisten anderen. Wir spüren, dass ständig neue Geräte, Bildschirmgrößen und Fähigkeiten bombardiert werden. Die einzige Möglichkeit, mit all dem umzugehen, besteht darin, dies zu akzeptieren, die Vielfalt anzunehmen und die Verbreitung von Geräten und Browsern als Funktion und nicht als Fehler zu betrachten.
Es liegt an uns, die Menschen in unserer Umgebung aufzuklären, die - entweder durch Zufall oder durch Absicht - nicht akzeptiert haben, dass Vielfalt die Realität ist, in der wir leben und die Dinge nur noch verrückter werden. Den Kopf in den Sand zu stecken, ist keine Option.
Wenn ich versuche, Menschen dabei zu helfen, Vielfalt zu verstehen und anzunehmen, greife ich oft nach einer meiner Lieblingsübungen von John Rawls.
Rawls war ein Philosoph, der ein soziales Experiment mit Studenten, Kirchengruppen und dergleichen durchführte.
Im Experiment durften die Teilnehmer ihre ideale Gesellschaft schaffen. Es könnte einer Philosophie folgen: Es könnte eine Monarchie, eine Demokratie oder eine Anarchie sein. Es könnte kapitalistisch oder sozialistisch sein. Die Menschen in diesem Experiment hatten die freie Hand, um jede Facette der Gesellschaft zu kontrollieren… aber dann würde er noch etwas hinzufügen: Sie konnten nicht kontrollieren, welche Position sie in dieser Gesellschaft einnahmen.
Diese Wendung ist das, was John Harsanyi - ein früher Spieltheoretiker - als „Schleier der Ignoranz“ bezeichnet. Was Rawls immer und immer wieder feststellte, war, dass die am Experiment teilnehmenden Personen die egalitärsten Gesellschaften schaffen würden.
Es macht Sinn: Welchen rationalen, selbstinteressierten Menschen würden ältere Menschen, Kranke, Geschlechter, Rasse, Glaube oder Farbe schlecht behandeln, wenn sie sich in derselben Position befinden könnten, wenn der Schleier weggezogen wird?
Die Dinge, die wir tun, um spezielle Bedürfnisse zu befriedigen, zahlen sich in Zukunft aus. Schau dir Rampen an.
Sie sind ein klassisches Beispiel für eine Barrierefreiheitsfunktion für Rollstuhlfahrer, von der auch Personen profitieren, die sich nicht in ihnen befinden: Personen, die Gepäck mitnehmen, Zustelldienste, die schwere Gegenstände auf Dollies transportieren, Eltern, die Kinder (oder ihre gekleideten Hunde) in Kinderwagen schieben ein Pendler, der mit dem Fahrrad geht, und derjenige, der lieber einen sanften Anstieg hinaufgeht als die Anstrengung, die erforderlich ist, um eine Stufe zu besteigen.
Wenn wir alternative Pfade erstellen, um von Punkt A nach Punkt B zu gelangen, können Menschen den für sie am besten geeigneten Weg wählen, entweder durch Wahl oder Notwendigkeit. Und jeder kann seine Ziele erreichen.
Wir haben alle besondere Bedürfnisse. Mit denen sind wir geboren. Einige entwickeln wir. Einige sind vorübergehend. Einige haben nichts mit uns persönlich zu tun, sind aber situativ oder abhängig von der verwendeten Hardware, den verfügbaren Interaktionsmethoden oder sogar der Geschwindigkeit, mit der wir auf das Internet zugreifen oder Daten verarbeiten können.
Worum geht es beim responsive Webdesign, wenn nicht barrierefrei? Ja, seine grundlegenden Prinzipien befassen sich mit visueller Gestaltung, aber im Großen und Ganzen geht es darum, das bestmögliche Leseerlebnis zu bieten.
Als Anwender von Responsive Design verstehen wir die Vorteile der Anpassung unserer Schnittstellen. Wir verstehen Rückschläge. Wir verstehen es, robuste Erlebnisse zu entwerfen, die unter den verschiedensten Bedingungen funktionieren. Jeden Tag erweitern wir die Zugänglichkeit unserer Produkte.
Diese Fähigkeiten werden uns von unschätzbarem Wert machen, denn die Technologie bietet immer neue Möglichkeiten, unsere Websites zu nutzen und mit ihnen zu interagieren.
Wir fangen gerade an, sich in die Welt der bewegungsbasierten gestischen Steuerelemente zu begeben. Sicher, wir hatten sie schon eine Weile auf Touchscreens in zwei Dimensionen, aber dreidimensionale bewegungsbasierte Steuerelemente erscheinen erst langsam. Im folgenden Video sehen Sie eine Demo der Gestiksteuerung um die 41-Sekunden-Marke:
Der erste große Schritt in diese Richtung war Kinect auf der Xbox 360 (und später Windows). Mit Kinect interagieren wir mit dem Computer, wobei wir Körperbewegungen verwenden, wie zum Beispiel das Heben einer Hand (was Kinect dazu zwingt, aufmerksam zu sein), unsere Hand zum Klicken / Tippen vorwärts drücken und die Leinwand in eine bestimmte Richtung ziehen.
Das Kinect hat zu einer großen Revolution in Bezug auf die Schnittstelle zu Computern geführt, aber aus Sicht der Interaktion stellt es ähnliche Herausforderungen wie der Wii-Controller und die PlayStation Move von Sony. Große Körperbewegungen wie das Anheben der Hand (oder einen Zauberstab-Controller) können ermüdend sein.
Sie sind auch nicht besonders genau. Wenn Sie der Meinung waren, dass die Genauigkeit des Touchscreens ein Problem ist, stellen Handgesten wie die für Kinect oder LEAP Motion eine noch größere Herausforderung dar.
Um Interaktionen wie diese zu ermöglichen (die wir derzeit nicht erkennen können), müssen wir wissen, wie einfach es ist, auf interaktive Steuerelemente zu klicken. Wir müssen feststellen, ob unsere Schaltflächen und Links groß genug sind und ob zwischen ihnen ein ausreichender Abstand vorhanden ist, um sicherzustellen, dass die Absicht des Benutzers genau an den Browser übermittelt wird. Zwei Spezifikationen, die dazu beitragen können, sind Media Queries Level 4 und Pointer Events.
In Media Queries Level 4 konnten wir Stilregeln auf bestimmte Interaktionskontexte anwenden. Wenn wir beispielsweise unseren Cursor sehr genau steuern (wie im Fall eines Stifts oder einer Maus) oder eine weniger genaue Steuerung (wie im Fall eines Touchscreens oder einer physischen Geste):
@media (Zeiger: fein) / * Kleinere Links und Schaltflächen sind in Ordnung * / @media (Zeiger: grob) / * Größere Links und Schaltflächen sind wahrscheinlich eine gute Idee * /
Natürlich möchten wir eine sinnvolle Vorgabe in Bezug auf Größe und Abstand als Rückfall für ältere Browser und Geräte bieten.
Wir haben auch die Möglichkeit festzustellen, ob das Gerät über einem Element schweben kann, und kann die Schnittstelle entsprechend anpassen.
@media (hover: hover) / * hover-bezogene Interaktionen sind A-OK * / @media (hover: auf Abruf) / * hover-verwandte Interaktionen sind möglicherweise schwierig, möglicherweise tun Sie stattdessen etwas anderes. * / @ media (hover: none) / * Kein Hover möglich :-( * /
Wir müssen jedoch noch herausfinden, wie gut dies auf multimodalen Geräten wie dem Surface-Tablet funktioniert. Ändert sich das Design, wenn der Benutzer zwischen den Eingabemodi wechselt? Sollte es? Zu diesem Zweck bietet die Spezifikation auch beliebiger Zeiger und jeder hoverto, So können Sie abfragen, ob irgendein Die unterstützte Interaktionsmethode erfüllt Ihre Anforderungen, aber hier ist eine Warnung aus der Spezifikation:
Entwerfen einer Seite, die nur deshalb auf Schwebeflug oder genaues Zeigen verweist Any-Hover oder beliebiger ZeigerWenn ein Eingabemechanismus mit diesen Funktionen verfügbar ist, führt dies wahrscheinlich zu einer schlechten Erfahrung.
Diese Optionen für die Medienabfrage werden in Chrome, Mobile Safari und Microsoft Edge eingeführt. Daher sollten Sie einen Blick darauf werfen.
Pointer Events ist eine weitere Spezifikation, die allmählich an Zugkraft gewinnt. Es verallgemeinert die Interaktion auf ein einzelnes Ereignis, anstatt uns zu zwingen, Silo-Erfahrung in mausgesteuerte, berührungsgesteuerte, stiftgesteuerte, (seufz), kraftgesteuerte und so weiter.
Wir können unauffällig die Unterstützung für Zeigerereignisse erkennen…
Accentsconagua
if (window.PointerEvent) window.addEventListener ("pointerdown", detectType, false); … Und dann alle gleich behandeln oder auf der Basis von pointerType:
function detectType (event) switch (event.pointerType) case "mouse": / * Mauseingabe erkannt * / break; Fall "Stift": / * Eingabe von Stift / Stift erkannt * / Pause; case "touch": / * Berührungseingabe erkannt * / break; default: / * pointerType ist leer (konnte nicht erkannt werden) oder UA-spezifischer benutzerdefinierter Typ * /
Natürlich müssen wir nicht nur die Genauigkeit berücksichtigen, die unsere Benutzer bei der Interaktion mit unseren Bildschirmen haben, sondern auch die potenziell größere Entfernung, in der unsere Benutzer unsere Inhalte lesen.
Zu diesem Zweck habe ich mit der Einheit für das Ansichtsfenster (vw) experimentiert.
Ich habe lange Zeit Ems für die maximale Breite des Layouts verwendet (die Zeilenlänge ist also proportional zur Schriftgröße). Ich verwende auch relative Schriftgrößen. Als Grundlage kann ich eine Medienabfrage verwenden, die der maximalen Breite entspricht, und die Basisschriftgröße beim vw-Äquivalent bei der maximalen Breite festlegen.
Körper max-Breite: 64em; @media screen und (min-width: 64em) body font-size: 1.5625vw; / * (1em / 64em) * 100 * /
Dann vergrößert das gesamte Design das Layout einfach, wenn es über diese Größe hinaus betrachtet wird.
Wenn Sie so etwas nicht automatisch aktivieren möchten, können Sie es mit JavaScript ein- und ausschalten.
Noch verrückter wird es, wenn Sie Geräte wie die HoloLens in Betracht ziehen. Und nein, ich bin noch nicht dazu gekommen, mit einem zu spielen, aber Sie können eine großartige Demo bei der 1:27-Marke in diesem Video sehen:
Die Idee, einen anpassbaren virtuellen Bildschirm auf einer beliebigen Oberfläche ablegen zu können, bietet einige interessante Möglichkeiten als Benutzer und einige besondere Herausforderungen als Designer. HoloLens bringt natürlich auch Gestensteuerung mit, so dass die Berücksichtigung einer Vielzahl von Eingabetypen ziemlich weit kommen sollte.
In ähnlicher Weise sollten wir darüber nachdenken, wie Erfahrungen aussehen können und sollen, wenn wir nur mit unserem Blick stöbern. Blickverfolgung hat ihren Ursprung im Zugänglichkeitsraum als Mittel, um Leuten mit eingeschränkter oder keiner Verwendung ihrer Hände eine Schnittstellenkontrolle zu bieten. Traditionell war die Hardware zur Blickverfolgung mehrere Tausend US-Dollar, was sie für viele Menschen unerreichbar macht, aber das beginnt sich zu ändern.
In den letzten Jahren hat die Rechenleistung unserer Geräte zugenommen, da die mit der Unterstützung der Blickverfolgung verbundenen Hardwarekosten drastisch gesunken sind. Wenn Sie sich umschauen, können Sie sehen, wie sich die Blickverfolgung in der Öffentlichkeit bewegt. Viele Smartphones und Smartwatches erkennen, wenn Sie sie betrachten (oder zumindest manchmal). Dies ist nur einen kurzen Schritt entfernt, um zu wissen, wo Sie auf dem Bildschirm suchen. Und fast jedes High-End-Smartphone ist jetzt mit einer Frontkamera ausgestattet, die sie zu idealen Kandidaten für diese Interaktionsmethode macht.
Eine großartige Demo der Gesichtsverfolgungstechnologie des Sesame Phone aus der 18-Sekunden-Marke können Sie in diesem Video sehen:
Das Sesam-Telefon wurde entwickelt, um Menschen die Verwendung eines Smartphones ohne Hände zu ermöglichen. Mit der Gesichtsverfolgung kann ein virtueller Cursor über den Bildschirm bewegt werden, sodass Benutzer mit dem darunter liegenden Betriebssystem sowie einzelnen Anwendungen interagieren können. Es unterstützt Tap, Swipe und andere Gesten (über ein Kontextmenü) und ist in meiner Erfahrung ziemlich beeindruckend. Dank dieser Technologie können Menschen, die an MS, Arthritis, Muskeldystrophie und mehr leiden, ein Smartphone verwenden und vor allem im Internet surfen.
The Eye Tribe und Fixational arbeiten ähnlich, um Eye-Tracking auf Smartphones und Tablets zu ermöglichen. Die Augenverfolgung ähnelt der Gesichtsverfolgung, der Cursor folgt jedoch Ihrem Fokus. Mikro-Gesten wie Blinzeln, Blinzeln usw. ermöglichen die Interaktion mit dem Gerät.
Obwohl die meisten Blickverfolgungsprogramme eine Maus imitieren und eine einstellbare Empfindlichkeit aufweisen, ist ihre Genauigkeit als Zeigegerät nicht fantastisch. Wenn ich zum Beispiel das Sesam-Telefon verwendet habe, hatte ich Schwierigkeiten, die Position meines Kopfes zu kontrollieren, um den Cursor immer noch zu halten, um zu schweben und auf eine Schaltfläche zu klicken. Ich bin mir sicher, dass sich dies mit der Übung verbessern würde, aber man kann mit Sicherheit sagen, dass in einer Blickinteraktion größere, räumlich gut angeordnete und leichter anzuzeigende Links und Schaltflächen ein Glücksfall wären.
Bisher habe ich mich auf Interaktionsmethoden konzentriert, die die Navigation und die Verwendung von Inhalten erleichtern. Aber was ist mit dem Ausfüllen eines Formulars? Ich kann Ihnen sagen, dass das Schreiben einer E-Mail Buchstabe für Buchstabe auf einer virtuellen Tastatur mit Ihrem Gesicht saugt…
Glücklicherweise sind die meisten dieser gestischen Implementierungen mit einer Form der Spracherkennung gekoppelt. Kinect zum Beispiel akzeptiert verbale Befehle, um zu navigieren und Aufgaben wie das Ausfüllen von Formularen auszuführen. Das Sesam-Telefon unterstützt auch Sprachbefehle für bestimmte grundlegende Aktionen, das Diktieren von E-Mails und dergleichen.
In Verbindung mit der Stimme funktionieren die alternativen Interaktionsmethoden von Kinect und Sesame Phone sehr gut. Sprachinteraktion kann aber auch für sich alleine stehen.
Die meisten von uns kennen Apple's Siri, Google Now und Microsofts Cortana. Diese digitalen Assistenten eignen sich hervorragend zum Abrufen von Informationen aus ausgewählten Quellen und zum Ausführen anderer hilfreicher Dinge wie z. B. das Berechnen eines Tipps und das Festlegen einer Erinnerung. Was die Interaktion mit dem Web angeht, ist dies jedoch noch nicht der Fall. Wir können uns mit ihnen beschäftigen, aber sie können sich nicht (notwendigerweise) auf eine Webseite einlassen.
Die Informationen, die auf unseren Webseiten gespeichert sind, werden über semantisches HTML und strukturierte Syntax wie Mikroformate, Mikrodaten und RDFa verfügbar gemacht sollte Wir stellen unseren Assistenten schließlich unsere Inhalte zur Verfügung, wissen es aber nicht. Ihre verschiedenen Hersteller haben uns keine Ahnung gegeben, wie das geht, und wie es jetzt steht, kann keiner von ihnen eine Webseite nachschlagen und Ihnen vorlesen. Dafür müssen Sie einen Screenreader aufrufen.
Jedes Unternehmen bietet einen First-Party-Screenreader an. Und alle können Ihnen helfen, mit einer Seite zu interagieren, einschließlich des Ausfüllens von Formularen, ohne die Seite sehen zu müssen. Diese Technologien wurden jedoch nicht mit ihren entsprechenden Assistenten gekoppelt. Es wird wahrscheinlich nicht lange dauern, bis wir das sehen.
Wenn wir überlegen, wie unsere Websites in einem Sprachkontext erlebt werden, wird die Lesbarkeit unserer Webseiten entscheidend. Eine klare, gut geschriebene Prosa und eine logische Quellenordnung werden absolut notwendig sein. Wenn unsere Seiten beim Lesen keinen Sinn ergeben, worauf kommt es an??
Der Inhaltsstratege Steph Hay betrachtet die Benutzeroberfläche als Gelegenheit, sich mit unseren Benutzern zu unterhalten. Bald wird es buchstäblich sein.
Interessanterweise hat Microsoft uns einen Einblick gegeben, wie es sein könnte, benutzerdefinierte Sprachbefehle für unsere Websites zu entwerfen, die über die Unterstützung des Betriebssystems mit Cortana hinausgehen. Mit anderen Worten, sie lassen uns ihren Assistenten unterrichten.
In Windows 10 können installierbare Web-Apps eine Voice Command Definition (VCD) -Datei im Kopf der Seite enthalten, um benutzerdefinierte Befehle zu aktivieren:
Bei der referenzierten VCD-Datei handelt es sich einfach um eine XML-Datei, die das Schlüsselwort für die Web-App und die Befehle definiert, die ausgegeben werden können.
Mit einer sehr einfachen Syntax identifiziert die VCD optionale Teile einer bestimmten Phrase und Variablen, die Cortana extrahieren sollte:
Gruppenpost Gruppenbeitrag Notiz hinzufügen fügen Sie eine Notiz Nachricht mit Gruppenpost hinzu [bitte] füge eine Notiz hinzu [dass] noteSubject Hinzufügen von noteSubject zum Gruppenbeitrag
Diese spezielle App übergibt die erfassten Informationen zur Verarbeitung an JavaScript. Das ist richtig, Cortana hat auch eine JavaScript-API. Ziemlich ordentlich.
Aber traditionelle Computer und intelligente mobile Geräte sind nicht der einzige Ort, an dem wir sprachgestützte Erfahrungen machen. Wir haben auch körperlose Stimmen wie Amazons Echo und den Ubi, die völlig ohne Kopf sind.
Im Moment scheinen sie sich beide darauf zu konzentrieren, Ihrem Haus zu helfen, Musik zu „intelligenter“ zu machen, den Thermostat einzustellen usw., aber es ist nicht schwer vorstellbar, dass sich diese Geräte mit der Möglichkeit verbinden, mit dem Internet zu surfen und mit dem Internet zu interagieren.
Sprachbasierte Interaktionen mit dem Web werden in naher Zukunft durchaus möglich sein. Sie werden wahrscheinlich am Anfang ein bisschen saugen, aber sie werden besser.
Ich werde eine etwas mutige Vorhersage treffen: Während die Berührung in vieler Hinsicht revolutionär war, um den digitalen Zugang zu verbessern, wird die Stimme noch bedeutender sein. Sprachbasierte Schnittstellen schaffen neue Möglichkeiten für Menschen, mit der digitalen Welt zu interagieren und daran teilzunehmen.
Da wir darüber nachgedacht haben, wie die von uns erstellten Erlebnisse auf einer Vielzahl von Geräten konsumierbar sind, haben wir den Vorteil, dass andere Leute, die im Web arbeiten, in Bezug auf die Stimme arbeiten. Wir sehen Erfahrung als ein Kontinuum, beginnend mit Text.
Mit der Reife der Sprachtechnologie werden wir die Experten sein, auf die die Leute schauen. Wir werden die nächste Generation von Websites und Anwendungen dazu befähigen, sprachgesteuert zu werden, und dadurch werden wir das Leben von Milliarden Menschen verbessern. Weil es bei „Barrierefreiheit“ nicht um Behinderungen geht, geht es um Zugang und Es geht um Menschen.
Sicher, wir machen es einfacher, die Filmzeiten abzurufen und Tickets zu kaufen, um die neuesten Informationen zu erhalten Transformer Debakel, aber wir werden auch die fast 900 Millionen Menschen weltweit stärken, von denen über 60% Frauen sind, die Analphabeten sind. Und das ist eine Bevölkerung, die in unserem überwiegend textuellen Web weitgehend ignoriert wurde.
Wir werden neue Möglichkeiten für die Armen und Benachteiligten schaffen, um an einer Welt teilzunehmen, die sie ausgeschlossen hat. Sie wissen vielleicht nicht, aber 80% der Fortune-500-Unternehmen - Target, Walmart-only - akzeptieren Bewerbungen online oder über Computer. Wir werden Menschen mit eingeschränkten Computerkenntnissen oder Lesern die Möglichkeit geben, sich bei diesen Unternehmen für eine Stelle zu bewerben.
Wir können dazu beitragen, die digitale Kluft und die Alphabetisierungslücke zu überbrücken. Wir können den Menschen Möglichkeiten bieten, ihr Leben und das ihrer Familien zu verbessern. Wir haben die Macht, in dieser Welt mehr Gerechtigkeit zu schaffen, als die meisten von uns jemals erträumt haben.
Dies ist eine unglaublich spannende Zeit, nicht nur für die responsive Design Community, nicht nur für das Web, sondern für die Welt! Die Zukunft kommt und ich kann es kaum erwarten, zu sehen, wie großartig Sie es schaffen!
Responsive Day Out 3: Der letzte Haltepunkt fand am 19. Juni 2015 in Brighton, Großbritannien, statt.
