Touchscreens Werk anders as sleutelborden en muizen
In die vroeë dae van die ontwerp van webwerwe vir mobiele toestelle het die meeste ontwikkelaars hul produkaanbieding verruil. Hulle het 'n ten volle funksionele lessenaar weergawe vrygestel en dan 'n "mobiele geoptimaliseerde" weergawe wat baie van die handelsmerke en beelde weggestroop het om die beperkte vermoëns en netwerkspoed van snoepbalkfone en 3G-draadlose netwerke te akkommodeer.
Hedendaagse slimfone kan egter webbladsye net so doeltreffend maak as desktop-rekenaars, deur netwerke so goed of beter as gister se DSL-lyne.
Ontwerp, dan, konvergeer terug na 'n enkele gebruikerskoppelvlak. Maar die risiko vir ontwerpers is nie dat 'n slimfoon of tablet 'n moderne reageerwebwerf kan maak nie. Inteendeel, dit is dat die metode van gebruikerinvoer op 'n touchscreen-toestel betekenisvolle veranderinge aan die onderliggende werfontwerp vereis. Die dae van die bou van 'n webwerf wat besoekers aanvaar, het 'n sleutelbord en 'n muis is verby.
Basiese Touchscreen Ontwerp Reëls
Die ontwerp van 'n touchscreen-bewuste webinterface vereis 'n evolusie van die tradisionele monitor-muis-sleutelbordbenadering van die verlede. U moet veral interaksies soos gebare, krane en multitouch-insette akkommodeer.
- Tik is nie akkuraat nie. Tensy die kliënt die vingers van 'n kleuter het, selfs met die baie akkurate sagteware kontroles, kan dit moeilik wees om te tik en presies te wees.
- Gebare verskil van krane. Om 'n lang bladsy op 'n touchscreen te blaai, sleep die gebruiker een vinger in die blaaier. Dit lyk dalk nie belangrik nie, totdat jy besef dat jy met 'n muis blaai, beweeg jy die muis af .
- Twee (en meer) vingerkrane. 'N Gebruiker kan gelyktydig verskeie vingerkrane op die toestel gebruik om dit te beheer. Daardie ekstra krane kan iets spesifiek beteken, afhangende van die bedryfstelsel van die gebruiker se toestel.
- Hoë-glans toestelle. Die skerms van die meeste touchscreen tablette word gemaak van 'n stewige glas. Hierdie materiaal kan baie moeilik wees om deur middel van helder ligte situasies met baie glans te lees. Plus, met al die aanraking, kry hulle vingerafdrukke en velle op die skerm wat kan beïnvloed hoe jou bladsye lyk.
- Op-skerm sleutelbord. Terwyl sommige gebruikers 'n draadlose sleutelbord het, verbind hulle met hul tablette, die meeste tabletgebruikers gebruik die sleutelbord op die skerm vir data-invoer. OSK-inskrywing kan lei tot 'n paar skreeusnaakse tik asook ongemaklik om vir lang tydperke te gebruik.
As gevolg van hierdie eienskappe van die toestel, moet webontwerpers verskeie basiese ontwerpreëls vir touchscreen gebruikers beklemtoon:
- Moenie kliekbare items te naby aanbring nie. Daar is geen vinnige reël wat bepaal hoe naby is te naby nie, maar lyste van skakels, veral in 'n klein lettergrootte, kan moeilik wees om te navigeer deur te kliek (tik) met 'n vetvinger. Dit kan irriterend wees om net in te zoem om te probeer om 'n skakel te klik. Hierdie beginsel geld vir knoppies sowel as skakels.
- Hiërargieë kan moeilik wees om oop te bly. Een populêre vorm van dinamiese kieslys gebruik JavaScript om 'n submenu oop te maak wanneer die gebruiker klik en dan die muis oor die subkieslys beweeg. Hierdie toestande kan baie moeilik of onmoontlik wees om op aanraakskerms te gebruik, want hulle bly ook nie oop nie of sluit nie.
- Skuif skakels en klikbare areas weg van die regterrand van die venster. Die meeste mense is regshandig en is geneig om aan die kant van die skerm te blaai. Aangesien die skuif met 'n gebaar gedoen word, is dit soms moontlik om die foute per ongeluk op 'n skakel te begin. Gebruikers kan word geïrriteerd as hulle wou blaai op die bladsy en in plaas daarvan uiteindelik beland om 'n skakel te tik. Deur jou skakels van die regterkant af te skuif, kan jy hulle help om hierdie ongerief te vermy.
- Daar is geen muis nie. En dit beteken dat daar geen muiswyser is nie . Jy moet nie staatmaak op die muiswyser wat verander om te help aandui dat iets kliekbaar is nie.
- Hover state bestaan nie. As gevolg van bogenoemde, aangesien daar geen muis is nie, is daar niks om te beweeg nie. 'N Skakel word óf geklik (tik) óf nie op 'n touchscreen-toestel nie, sodat gebruikers nie nuttige inligting uit sulke hover-state kan aflei soos kleurveranderinge, gereedskapwenke of statusbalkveranderinge nie.
- Swart agtergronde verhoog die glans. 'N webwerf met 'n swart agtergrond kan baie moeilik wees om te lees op 'n touchscreen toestel as gevolg van die glans. Swart maak die vingerafdrukke op die toestelle duideliker, vervaag die skerm. En die swart kan die skerm draai in 'n spieël wat terugkyk, en die gebruikers staan dikwels meer as die teks op die skerm.
- Lang blokke van teks in vorms is moeilik om te skryf. Alhoewel dit moontlik is om volledige romans op 'n iPad- of 'n Android- of Windows-tablet te skryf, hou die meeste mense nie van die skermklavier vir lang tekstrappe nie. Hoe meer jou ontwerp data-inskrywing so kort en maklik moontlik kan maak, hoe beter.
Die belangrikste aspek van die ontwerp met touchscreens in gedagte is om jou bladsye te toets op 'n touchscreen-toestel . Terwyl baie iPad- en Android-emulators beskikbaar is, en baie Windows-tablette, bied hulle steeds nie die gevoel van 'n touchscreen. Jy kan nie sê dat die skakels te naby is nie, of dat die knoppies te klein is, of dat die glans die bladsy te moeilik maak om te lees, tensy jy 'n tablet uitgaan en dit uitprobeer voordat jy jou nuwe webwerfontwerp vrystel.