Share
Ik had het genoegen om de afsluitende keynote te leveren Responsive Day Out 3: The Final Breakpoint. De conferentie werd gehouden in Brighton, Verenigd Koninkrijk, op 19 juni 2015 en was een bijeenkomst van ontwerpers en ontwikkelaars die hun workflowstrategieën, technieken en ervaringen delen met responsief webontwerp.
Dit is wat ik te zeggen had.
Vandaag heeft een geweldige rondleiding door de wereld van responsive design gegeven. We hebben gezien hoe we onze workflows en processen kunnen verbeteren. We hebben nieuwe manieren geleerd om de toegankelijkheid van onze producten te verbeteren. We hebben geworsteld met moderne CSS- en HTML-functies die ons helpen de enorm variabele weergavegrootten te omarmen die om ons heen wervelen en wervelen.
We hebben de toekomst van modulaire code en browsercapaciteit voor werken zonder netwerkconnectiviteit verkend. En we hebben zelfs een reis gemaakt naar de mogelijke toekomst van waar het web zou kunnen gaan.
We hebben een lange weg afgelegd sinds het artikel van Ethan, vloeibare rasters, flexibele media en vragen uit de media. Die drie leerstellingen zaaiden een zaadje dat is gegroeid en bloeide nu we de implicaties van de proliferatie van apparaten beter hebben begrepen. We hebben gezien dat internet overal naartoe kan en vrijwel alles kan.
Ik zou willen beweren dat "Responsive Web Design" het eerste artikel was dat de ideeën die John Allsopp zoveel jaren eerder in 'A Dao of Web Design' had besproken, echt heeft kunnen vangen en heeft gedestilleerd tot iets dat de gemeenschap van ontwerpen en ontwikkelen echt zou kunnen laten zinken hun tanden in. Het leverde een concreet voorbeeld op van het vermogen van het web om zichzelf te buigen en vormen naar elke vorm die het nodig had om aan te nemen.
Het was de eerste keer dat veel ontwerpers het idee onder ogen kregen dat 'ervaring' geen monolithisch iets was.
Natuurlijk hadden velen van ons in de gemeenschap van webstandaarden gesproken en liepen ze met betrekking tot progressieve verbetering. En we kregen bekeerlingen, maar de voortgang was traag. Ethan demonstreerde - direct en bondig - hoe de progressieve verbetering van het visuele ontwerp eruit zou kunnen zien.
Het is onmogelijk om een identieke ervaring te bieden voor elk mens dat probeert toegang te krijgen tot onze sites. Er zijn simpelweg veel te veel factoren om te overwegen. We hebben schermgrootte, weergavedichtheid, CPU-snelheid, hoeveelheid RAM, beschikbaarheid van sensoren, beschikbaarheid van functies, interfacemethoden ... ademen ... type besturingssysteem, besturingssysteemversie, browsertype, browserversie, geïnstalleerde plug-ins, netwerksnelheid, netwerklatentie, netwerkcongestie, firewalls, proxy's, routers en waarschijnlijk een dozijn andere factoren die mijn geest niet in staat is om te plukken te midden van de wervelstorm van technische overwegingen.
En dat geldt zelfs voor onze gebruikers.
Als het gaat om de mensen die we moeten bereiken voor ons werk om er echt toe te doen, moeten we rekening houden met geletterdheid, leesvaardigheid, niveau van domeinkennis, cognitieve stoornissen zoals leerstoornissen en dyslexie, problemen met aandachtstekorten, omgevingsafwijkingen, visusstoornissen, gehoorverlies, motorische beperking, hoeveel ze begrijpen hoe ze hun apparaat moeten gebruiken, hoeveel ze begrijpen hoe ze hun browser moeten gebruiken, hoe goed ze thuis zijn in gewone webconventies en een hoop andere 'menselijke factoren'.
Elke persoon is anders en iedereen komt op het internet met zijn eigen speciale behoeften. Sommigen zijn er altijd bij, blindheid bijvoorbeeld. Anderen zijn van voorbijgaande aard, zoals het breken van je muis. Weer anderen zijn puur situationeel en afhankelijk van het apparaat dat u op dat moment gebruikt en de technische mogelijkheden of beperkingen ervan.
Het is onmogelijk om een monolithische ervaring te bedenken voor elke persoon in elke context die elke factor beschouwt. En toch had Sir Tim Berners-Lee een visie voor een web dat overal naartoe kon gaan. Was hij gek?
Sir Tims visie voor het web was dat content één keer kon worden gemaakt en vanaf elke plek kon worden benaderd. Ongelijke maar gerelateerde stukken "hypermedia" verspreid over de wereld zouden via links met elkaar verbonden kunnen zijn. Bovendien zouden ze opvraagbaar zijn voor iedereen op elk apparaat dat in staat is om HTML te lezen. Gratis.
Uiteindelijk zag Sir Tim universele toegankelijkheid.
Voor een groot deel van ons is het zorgen voor toegang tot onze websites een bijzaak. We hebben het over een goede game als het gaat om 'gebruikersgericht', maar behandelen het woord 'toegankelijkheid' vaak als een synoniem voor 'schermlezer'. Het is zoveel meer dan dat. "Toegankelijkheid" gaat over mensen. Mensen consumeren inhoud en gebruiken interfaces op veel verschillende manieren, sommige vergelijkbaar en sommige heel anders dan hoe we het doen.
Natuurlijk gebruiken mensen met een visuele beperking vaak een schermlezer om inhoud te consumeren. Maar ze kunnen ook een apparaat met braille-aanraakterugkoppeling of een brailleprinter gebruiken. Ze gebruiken waarschijnlijk ook een toetsenbord. Of ze kunnen een touchscreen gebruiken in combinatie met audio-aanwijzingen. Of ze kunnen zelfs een camera gebruiken om inhoud te "lezen" via OCR en tekst-naar-spraak. En ja, visuele beperkingen tasten een behoorlijk percentage van de bevolking aan (vooral als we ouder worden), maar het is slechts een deel van de "toegankelijkheid" -puzzel.
Het contrast tussen tekst en de achtergrond is een belangrijke factor om ervoor te zorgen dat de inhoud leesbaar blijft in verschillende lichtsituaties. Kleurkeuze is een toegankelijkheidsprobleem.
De taal die we gebruiken op onze sites en in onze interfaces heeft rechtstreeks invloed op hoe gemakkelijk het is voor onze gebruikers om te begrijpen wat we doen, welke producten we aanbieden en waarom het ertoe doet. Het heeft ook invloed op hoe we onze gebruikers laten denken over zichzelf, hun ervaring en onze bedrijven. Taal is een toegankelijkheidsprobleem.
De grootte van onze webpagina's heeft een direct effect op de tijd die onze pagina's nodig hebben om te downloaden, hoeveel het onze klanten kost om deze te openen en (soms) zelfs of de inhoud al dan niet kan worden bereikt. Prestaties zijn een bereikbaarheidsprobleem.
Ik zou door kunnen gaan, maar ik weet zeker dat je het begrijpt.
Toegankelijkheid gaat over het bieden van goede ervaringen voor iedereen, ongeacht fysieke of mentale vaardigheden, geslacht, ras of taal. Het erkent dat we allemaal speciale behoeften hebben - fysieke beperkingen, bandbreedtebeperkingen, apparaatbeperkingen - waarvoor we op verschillende manieren dezelfde interface moeten ervaren.
Wanneer ik bijvoorbeeld een website op mijn telefoon bezoek, word ik visueel beperkt door mijn schermresolutie (vooral als ik een browser gebruik die zoomen stimuleert) en ik ben beperkt in mijn mogelijkheid om te communiceren met knoppen en koppelingen omdat ik aan het browsen ben met mijn vingertoppen, die groter en veel minder nauwkeurig zijn dan een muiscursor.
Op een touchscreen heb ik de ervaring misschien iets anders nodig, maar ik moet nog steeds kunnen doen waar ik naar toe ben gekomen. ik heb nodig een ervaring, maar bovendien heb ik de geschikt ervaring.
Als we de realiteit omarmen dat ervaring niet één ding hoeft te zijn, kunnen we meer mensen bereiken met minder hoofdpijn. Ervaring kan en moet worden gemaakt als een continuüm. Dit is een progressieve verbetering: we beginnen met een basislijnervaring die voor iedereen werkt: inhoud, echte links, besturingselementen van de eerste generatie en formulieren die daadwerkelijk worden verzonden naar de server. Dan bouwen we de ervaring van daaruit op.
Uw browser ondersteunt HTML5-formulierbesturingselementen? Super goed! U krijgt een beter virtueel toetsenbord wanneer u uw e-mailadres typt. U kunt CSS gebruiken? Geweldig, laat me die leeservaring beter voor je maken. Oh, je kunt media-zoekopdrachten aan! Laat me de lay-out aanpassen zodat die lijnlengten iets comfortabeler zijn. Wow, ondersteunt uw browser Ajax ?! Hier kan ik wat teasers laden voor gerelateerde inhoud die u mogelijk interessant vindt.
Stel je voor dat je in een restaurant gaat zitten, om de ober je meteen een biefstuk te brengen. Maar je bent een vegetariër. Je vraagt of ze iets aanbieden dat je kunt eten en ze antwoorden beleefd: "Oh het spijt me, vlees is een vereiste." Waarom eet je niet gewoon vlees? Het is gemakkelijk, je mist echt lekker eten. " Geen ober die echt om je ervaring geeft, zou dat doen.
En toch lijkt het ons - als branche - geen probleem te hebben iemand te vertellen dat ze hun browser moeten aanpassen om ons te ontvangen. Dat is gewoon verkeerd. Ons werk is zonder gebruikers zinloos. We moeten achterover buigen om ze aan te trekken en te behouden. Dit is klantenservice 101.
Dit komt terug op de wet van Postel, die Jeremy vaak vertelt:
Wees conservatief in wat je doet, wees liberaal in wat je van anderen accepteert.
We moeten laks zijn als het gaat om browserondersteuning en niet te veel (of beter nog) veronderstellingen maken over wat we kunnen verzenden.
Natuurlijk is dit niet een benadering die iedereen in onze sector bereid is te omarmen, dus ik zal een andere quote aanbieden waar ik keer op keer naar terug kom ...
Wanneer er iets gebeurt, is het enige dat in uw macht ligt, uw houding ertegen; je kunt het accepteren of ertegen staan.
We kunnen de wereld niet beheersen, we kunnen alleen onze reactie erop beheersen.
Diegenen van jullie die zich verzameld hebben voor deze laatste Responsive Day Out (of die dit thuis volgen) begrijpen dit waarschijnlijk meer dan de meesten. We voelen het constante bombardement van nieuwe apparaten, schermformaten en mogelijkheden. De enige manier die ik heb gevonden om dit allemaal aan te pakken, is door het te accepteren, de diversiteit te omarmen en apparaat- en browserproliferatie te bekijken als een functie, geen bug.
Het is aan ons om mensen om ons heen te onderwijzen die - hetzij per ongeluk of opzet - niet hebben geaccepteerd dat diversiteit de realiteit is waarin we leven en dat dingen alleen maar gekker zullen worden. Het is geen optie om onze kop in het zand te steken.
Wanneer ik probeer mensen te helpen om diversiteit te begrijpen en te omarmen, dan grijp ik vaak naar een van mijn favoriete gedachtenoefeningen van John Rawls.
Rawls was een filosoof die een sociaal experiment leidde met studenten, kerkgroepen en dergelijke.
In het experiment mochten deelnemers hun ideale samenleving creëren. Het zou elke filosofie kunnen volgen: het zou een monarchie of democratie of anarchie kunnen zijn. Het kan kapitalistisch of socialistisch zijn. De mensen in dit experiment hadden de vrije hand om absoluut elk facet van de samenleving te beheersen ... maar dan voegde hij er de twist aan toe: ze konden niet bepalen welke positie ze in die maatschappij innamen.
Deze draai is wat John Harsanyi - een vroege gametheoreticus - de 'Veil of Ignorance' noemt. Wat Rawls steeds weer ontdekte, was dat individuen die aan het experiment deelnamen, zouden neigen naar het creëren van de meest egalitaire samenlevingen.
Het is logisch: welk rationele, zelfinteresseerde mens de ouderen, zieken, mensen met een bepaald geslacht, ras, geloof of kleur slecht zou behandelen als ze zich in dezelfde positie zouden bevinden als de sluier wordt weggetrokken?
De dingen die we doen om tegemoet te komen aan speciale behoeften betalen nu in de toekomst dividenden. Kijk naar hellingen.
Ze zijn een klassiek voorbeeld van een toegankelijkheidsfunctie voor mensen in rolstoelen die ook mensen ten goede komen die er niet in zijn: mensen die bagage dragen, bezorgdiensten die zware dingen vervoeren op dollies, ouders die kinderen (of hun verklede honden) in kinderwagens duwen, een forens die op haar fiets loopt, en die vent die er gewoon de voorkeur aan geeft een lichte helling op te lopen om de inspanning te doen die nodig is om een stap te zetten.
Wanneer we alternatieve paden maken om van punt A naar punt B te komen, kunnen mensen de meest geschikte voor hen kiezen, hetzij door keuze of noodzaak. En iedereen kan zijn doelen bereiken.
We hebben allemaal speciale behoeften. Sommigen waarmee we zijn geboren. Sommige ontwikkelen we. Sommige zijn tijdelijk. Sommigen hebben niets persoonlijk met ons te maken, maar zijn situationeel of puur afhankelijk van de hardware die we gebruiken, de interactiemethodes die we tot onze beschikking hebben, of zelfs de snelheid waarmee we toegang hebben tot internet of procesgegevens.
Wat is responsief webontwerp over als niet toegankelijkheid? Ja, de grondbeginselen hebben te maken met visueel ontwerp, maar in termen van het grote geheel gaat het erom de best mogelijke leeservaring te bieden.
Als beoefenaars van responsive design begrijpen we de voordelen van het aanpassen van onze interfaces. Wij begrijpen fallbacks. We begrijpen hoe we robuuste ervaringen kunnen ontwerpen die onder uiteenlopende omstandigheden werken. Elke dag verbreden we de toegankelijkheid van onze producten.
Deze vaardigheden zullen ons van onschatbare waarde maken, omdat technologie nieuwe manieren blijft bieden om onze websites te consumeren en er interactie mee te hebben.
We beginnen net te dippen of te gaan, handen in de wereld van op beweging gebaseerde gebarenbesturing. Natuurlijk hebben we ze al een tijdje in twee dimensies op aanraakschermen, maar er verschijnen nog maar driedimensionale op bewegingen gebaseerde besturingselementen. Je kunt een demo van gebarenbesturingselementen zien rond de 41-secondenmarkering in de volgende video:
De eerste grote stap in deze richting was Kinect op de Xbox 360 (en later Windows). Met Kinect communiceren we met de computer door middel van lichaamsbewegingen zoals een hand opsteken (waardoor Kinect oplet), onze hand naar voren duwen om te klikken / tikken en vastgrijpen om het canvas in een bepaalde richting te slepen.
De Kinect luidde een grote revolutie in op het gebied van interfacing met computers, maar vanuit een interactief perspectief biedt het soortgelijke uitdagingen als die van de Wii-controller en Sony's PlayStation Move. Grote lichaamsbewegingen zoals het opheffen van uw hand (of een controller van een controller) kunnen vermoeiend zijn.
Ze zijn ook niet erg accuraat. Als je dacht dat touchscreen-nauwkeurigheid een probleem was, vormen handgebaren zoals die voor de Kinect- of LEAP-beweging zelfs een grotere uitdaging.
Om dergelijke interacties (die we momenteel niet kunnen detecteren) op te vangen, moeten we ons ervan bewust zijn hoe gemakkelijk het is om op interactieve besturingselementen te klikken. We moeten bepalen of onze knoppen en koppelingen groot genoeg zijn en of er voldoende ruimte tussen is om te zorgen dat de intentie van onze gebruiker nauwkeurig wordt doorgegeven aan de browser. Twee specs die kunnen helpen dit aan te pakken, zijn Media Queries Level 4 en Pointer Events.
In Media Queries Level 4 konden we stijlregels toepassen op bepaalde interactiecontexten. Bijvoorbeeld als we heel nauwkeurige controle hebben over onze cursor (zoals in het geval van een stylus of muis) of minder nauwkeurige controle (zoals in het geval van een touchscreen of een fysiek gebaar):
@media (pointer: prima) / * Kleinere links en knoppen zijn goed * / @media (pointer: grof) / * Grotere links en knoppen zijn waarschijnlijk een goed idee * /
Natuurlijk willen we een zinvolle standaard qua grootte en spatiëring aanbieden als een terugval voor oudere browsers en apparaten.
We hebben ook de mogelijkheid om te bepalen of het apparaat in staat is om over een element te zweven en kan de interface dienovereenkomstig aanpassen.
@media (hover: hover) / * hover-gerelateerde interacties zijn A-OK * / @media (hover: on-demand) / * aan zweven gerelateerde interacties zijn mogelijk moeilijk, misschien doe je in plaats daarvan iets anders * / @ media (zweeftekst: geen) / * Geen hover mogelijk :-( * /
We moeten nog steeds uitzoeken hoe goed dit uiteindelijk werkt op multimodale apparaten zoals de Surface-tablet. Zal het ontwerp veranderen als de gebruiker schakelt tussen invoermodi? Zou het? Daartoe biedt de specificatie ook any-pointer en any-hoverto, zodat u kunt vragen of ieder ondersteunde interactiemethode voldoet aan uw vereisten, maar hier volgt een waarschuwing uit de specificatie:
Een pagina ontwerpen die alleen op basis van zweven of nauwkeurig richten nodig is any-hover of any-pointeraangeven dat een invoermechanisme met deze mogelijkheden beschikbaar is, waarschijnlijk resulteert in een slechte ervaring.
Deze opties voor mediaberichten beginnen uit te rollen in Chrome, Mobile Safari en Microsoft Edge, dus het is de moeite waard ernaar te kijken.
Pointer Events is een andere spec die wat meer grip krijgt. Het generaliseert de interactie tot een enkele gebeurtenis in plaats van ons te dwingen tot siloreving in muisgestuurde, door aanraking aangedreven, pen-aangedreven, (zucht) gedwongen, enzovoort.
We kunnen onopvallend ondersteuning voor Pointer-evenementen detecteren ...
Accentsconagua
if (window.PointerEvent) window.addEventListener ("pointerdown", detectType, false); ... en behandel ze allemaal op dezelfde manier of maak branches op basis van de pointerType:
function detectType (event) switch (event.pointerType) case "mouse": / * muisinvoer gedetecteerd * / pauze; case "pen": / * pen / stylus invoer gedetecteerd * / pauze; hoofdletter "aanraken": / * aanraakinvoer gedetecteerd * / onderbreken; standaard: / * pointerType is leeg (kon niet worden gedetecteerd) of UA-specifiek aangepast type * /
Naast het feit dat we rekening houden met de nauwkeurigheid die onze gebruikers hebben tijdens de interactie met onze schermen, moeten we uiteraard ook rekening houden met de mogelijk grotere afstand waarop onze gebruikers onze inhoud lezen..
Daartoe heb ik geëxperimenteerd met de viewport width (vw) -eenheid.
Lange tijd heb ik ems gebruikt voor de maximale breedte van de layout (dus de lijnlengte is evenredig met de lettergrootte). Ik gebruik ook relatieve lettergroottes. Daarmee als basis kan ik een mediaquery gebruiken die overeenkomt met de maximale breedte en de basislettergrootte instellen op het vw-equivalent op de maximale breedte.
body max-width: 64em; @media-scherm en (min-breedte: 64em) body font-size: 1.5625vw; / * (1em / 64em) * 100 * /
Vervolgens zoomt het hele ontwerp eenvoudig in op de lay-out wanneer deze buiten dat formaat wordt bekeken.
Als u iets dergelijks niet automatisch wilt inschakelen, kunt u inschakelen dat het met JavaScript wordt in- en uitgeschakeld.
Het wordt nog gekker als je begint te denken aan apparaten als de HoloLens. En nee, ik heb er nog niet één kunnen spelen, maar je kunt een geweldige demo zien op het 1:27 teken van deze video:
Maar het idee van het kunnen laten vallen van een aanpasbaar virtueel scherm op elk oppervlak biedt enkele interessante mogelijkheden als gebruiker en een aantal unieke uitdagingen als ontwerper. HoloLens brengt natuurlijk ook gebaarcontroles met zich mee, dus als we rekening houden met verschillende soorten invoer, zouden we ver komen.
Op dezelfde manier moeten we beginnen na te denken over hoe ervaringen eruit kunnen en moeten zien wanneer we uitsluitend met onze blik rondkijken. Gaze-tracking heeft zijn oorsprong in de toegankelijkheidsruimte als een middel om interfacecontrole te bieden aan mensen met beperkt of geen gebruik van hun handen. Van oudsher is hardware voor het volgen van beelden duizenden dollars geweest, waardoor het buiten het bereik van veel mensen komt, maar dat begint te veranderen.
In de afgelopen paar jaar is de rekenkracht van onze apparaten toegenomen, omdat de hardwarekosten in verband met het ondersteunen van het volgen van blik drastisch zijn gedaald. Als u rondkijkt, kunt u het volgen van de blik in de publieke sfeer zien gaan: veel smartphones en smartwatches kunnen herkennen wanneer u ernaar kijkt (of ze doen het soms). Dit is slechts een korte stap verwijderd van weten waar op het scherm u kijkt. En bijna elke high-end smartphone is nu uitgerust met een camera aan de voorkant, waardoor ze de perfecte kandidaten zijn om deze interactiemethode te bieden.
Je kunt een geweldige demo van de Face Tracking-technologie van de Sesame Phone zien vanaf het 18-seconden-teken in deze video:
De Sesame-telefoon is zo ontworpen dat mensen een smartphone kunnen gebruiken zonder hun handen te gebruiken. Het maakt gebruik van gezichts volgen om een virtuele cursor over het scherm te verplaatsen, waardoor gebruikers kunnen interageren met het onderliggende besturingssysteem en met individuele applicaties. Het ondersteunt tikken, vegen en andere gebaren (via een contextmenu) en is behoorlijk indrukwekkend in mijn ervaring. Zo'n technologie stelt mensen die lijden aan MS, artritis, spierdystrofie en meer in staat een smartphone te gebruiken en - wat nog belangrijker is voor ons - op het internet te surfen.
The Eye Tribe en Fixational werken op dezelfde manier om eyetracking naar smartphones en tablets te brengen. Oog volgen is vergelijkbaar met gezicht volgen, maar de cursor volgt je focus. Micro-bewegingen - knipper, knipoog, enz. - stellen u in staat om met het apparaat te communiceren.
Hoewel de meeste blik-volg software een muis nabootst en een instelbare gevoeligheid heeft, is de nauwkeurigheid ervan als een aanwijsapparaat niet fantastisch. Toen ik bijvoorbeeld de Sesam-telefoon gebruikte, had ik het moeilijk om de positie van mijn hoofd te regelen om de cursor stil te houden en op een knop te klikken. Ik weet zeker dat dit zou verbeteren met de praktijk, maar het is veilig om te zeggen dat in een blikinteractie grotere, goed gespatieerde en gemakkelijker gerichte links en knoppen een uitkomst zouden zijn.
Tot nu toe heb ik me gericht op interactiemethoden die het navigeren en het consumeren van inhoud vergemakkelijken. Maar hoe zit het met het invullen van een formulier? Ik kan je vertellen dat het typen van een letter per letter op een virtueel toetsenbord, met je gezicht, sucks ...
Gelukkig zijn de meeste van deze gebarenimplementaties gekoppeld aan een vorm van stemherkenning. De Kinect accepteert bijvoorbeeld verbale opdrachten om te navigeren en taken uit te voeren, zoals het invullen van formulieren. De Sesame-telefoon ondersteunt ook spraakopdrachten voor bepaalde basisacties, dicteren van e-mail en dergelijke.
In combinatie met stem werken de alternatieve interactiemethoden van Kinect en Sesame Phone heel goed. Maar steminteractie kan ook op zichzelf staan.
De meesten van ons zijn bekend met Apple's Siri, Google Now en Cortana van Microsoft. Deze digitale assistenten zijn goed in het ophalen van informatie uit geselecteerde bronnen en het doen van andere assistent-dingen zoals het berekenen van een tip en het instellen van een herinnering. Wat betreft de interactie met het web, echter, ze nog niet ... tot nu toe. We kunnen contact met hen opnemen, maar ze kunnen (niet noodzakelijk) een webpagina bezoeken.
De informatie die op onze webpagina's is opgeslagen, ontmaskeren via semantische HTML en gestructureerde syntaxis zoals microformats, microdata en RDFa moeten uiteindelijk maken onze inhoud beschikbaar voor deze assistenten, maar we weten het niet echt. Hun verschillende makers hebben ons niet echt een idee gegeven hoe dat moet en, zoals het er nu uitziet, kan geen van hen een webpagina opzoeken en voorlezen. Daarvoor moet je een schermlezer aanroepen.
Elk bedrijf biedt een first-party schermlezer. En ze zijn allemaal in staat om u te helpen op een pagina te reageren, inclusief het helpen invullen van formulieren, zonder de pagina te hoeven zien. En toch zijn deze technologieën niet gekoppeld aan hun overeenkomstige assistenten. Het zal waarschijnlijk niet lang duren voordat we dat zien gebeuren.
Wanneer we beginnen na te denken over hoe onze websites ervaren zullen worden in een stemcontext, wordt de leesbaarheid van onze webpagina's cruciaal. Duidelijk en goed geschreven proza en een logische bronorde zijn een absolute noodzaak. Als onze pagina's niet logisch zijn bij het lezen, wat is het punt?
Inhoudstrateeg Steph Hay beschouwt interface als een gelegenheid om een gesprek met onze gebruikers te voeren. Binnenkort zal het dat letterlijk zijn.
Interessant is dat Microsoft ons heeft laten zien hoe het zou kunnen zijn om aangepaste spraakopdrachten voor onze websites te ontwerpen die verder gaan dan wat het besturingssysteem standaard ondersteunt met Cortana. Met andere woorden, ze lieten ons hun assistent lesgeven.
In Windows 10 kunnen installeerbare webapps een VCD-bestand (Voice Command Definition) aan de kop van de pagina bevatten om aangepaste opdrachten in te schakelen:
Het VCD-bestand waarnaar wordt verwezen is eenvoudigweg een XML-bestand dat het sleutelwoord definieert voor de webapp en opdrachten die kunnen worden uitgegeven.
Met behulp van de basissyntax identificeert de VCD optionele delen van een bepaalde zin en variabelen die Cortana zou moeten extraheren:
Groepspost Groepspost voeg een notitie toe voeg een bericht message toe met groepsbericht [please] voeg een notitie toe [that] noteSubject noteSubject toevoegen aan groepspost
Deze specifieke app geeft de vastgelegde informatie door aan JavaScript voor verwerking. Dat klopt, Cortana heeft ook een JavaScript-API. Best netjes.
Maar traditionele computers en slimme mobiele apparaten zijn niet de enige plekken waar we op stem gebaseerde ervaringen beginnen te zien. We hebben ook onstoffelijke stemmen zoals Amazone Echo en de Ubi die volledig zonder hoofd zijn.
Op dit moment lijken ze allebei vierkant gefocust op het helpen van je huis om 'slimmer' muziek te streamen, de thermostaat aan te passen, enz. Maar het is niet moeilijk je voor te stellen dat deze apparaten gekoppeld worden aan de mogelijkheid om te surfen en interactie te hebben met internet.
In de nabije toekomst zullen op stem gebaseerde interacties met het web heel goed mogelijk zijn. Ze zullen waarschijnlijk eerst een beetje zuigen, maar ze zullen beter worden.
Ik ga een enigszins gewaagde voorspelling doen: terwijl aanraking op veel manieren revolutionair is geweest in de richting van verbetering van digitale toegang, zal stem nog belangrijker worden. Op spraak gebaseerde interfaces zullen nieuwe mogelijkheden bieden voor mensen om te communiceren met en deel te nemen aan de digitale wereld.
Omdat we hebben nagedacht over de manier waarop de door ons gemaakte ervaringen op verschillende apparaten kunnen worden gebruikt, hebben we de sprong gemaakt naar andere mensen die op het web werken op het gebied van spraak. We zien ervaring als een continuüm, beginnend met tekst.
Naarmate de stemtechnologie volwassener wordt, zullen wij degenen zijn die naar de deskundigen kijken. We zullen de volgende generatie websites en applicaties in staat stellen spraakgestuurd te worden en zo het leven van miljarden mensen te verbeteren. Omdat 'toegankelijkheid' niet over handicaps gaat, gaat het om toegang en het gaat over mensen.
Natuurlijk maken we het makkelijker om filmtijden op te zoeken en kaartjes te kopen om het nieuwste te zien transformers debacle, maar we zullen ook de bijna 900 miljoen mensen wereldwijd - meer dan 60% vrouwen - van analfabeten voorzien. En dat is een populatie die grotendeels is genegeerd op ons overwegend tekstuele web.
We zullen nieuwe kansen creëren voor armen en achtergestelden om deel te nemen aan een wereld die hen heeft uitgesloten. U weet het misschien niet, maar 80% van de Fortune 500-bedrijven denkt dat Target, Walmart alleen sollicitaties online of via computers accepteert. We stellen mensen met beperkte computervaardigheden of mensen die moeite hebben met lezen in staat om bij deze bedrijven een baan te zoeken.
We kunnen helpen de digitale kloof en de kloof tussen geletterdheid te overbruggen. We kunnen kansen creëren voor mensen om hun leven en het leven van hun familie te verbeteren. We hebben de macht om meer gelijkheid te creëren in deze wereld dan de meesten van ons ooit hebben gedroomd.
Dit is een ongelooflijk opwindende tijd, niet alleen voor de responsieve ontwerpgemeenschap, niet alleen voor het web, maar voor de wereld! De toekomst komt eraan en ik kan niet wachten om te zien hoe geweldig je het maakt!
Responsive Day Out 3: Het laatste breakpoint werd gehouden in Brighton, Verenigd Koninkrijk op 19 juni 2015.
Dit artikel maakt deel uit van de webontwikkelingsserie van Microsoft-techevangelisten over praktisch leren van JavaScript, open source-projecten en best practices voor interoperabiliteit, waaronder Microsoft Edge-browser en de nieuwe EdgeHTML-renderingengine.
We raden u aan om te testen op verschillende browsers en apparaten, waaronder Microsoft Edge, de standaardbrowser voor Windows 10, met gratis hulpprogramma's op dev.modern.IE:
Diepgaande technologische kennis van Microsoft Edge en het webplatform van onze ingenieurs en evangelisten:
