Hvordan brugere navigerer i en Touch Screen verden

Den måde, at dit website besøgende interagerer med dine sider og navigere dine links er dramatisk anderledes på en iPhone eller iPad end en stationær eller bærbar computer. Besøgende der bruger en iPhone eller iPad bruger deres fingre - ikke en mus, et tastatur eller stylus. Det betyder links skal være let at identificere og stor nok, at brugerne ikke ved et uheld klikker på for mange ad gangen med en fingerspids.

Også huske på, at rollover effekter ikke virker på samme måde på en iPhone eller iPad, som de gør på en desktop browser. Rollover effekter og lignende hover effekter, som forårsager noget til at ske som bruger ruller en markøren over et billede eller et andet element på en webside, konverteres automatisk til "på Klik på" hændelser i en iPhone eller iPad.

I denne figur vises et fælles design teknik på nettet - en række miniaturebilleder, der er knyttet til større versioner. På din computer, ville du rulle markøren over hvert billede for at se større version; på en iPad disse rollover begivenheder vil blive konverteret til links, udløst af et tryk på en finger.

Hvordan brugere navigerer i en Touch Screen verden

Design dine links til at arbejde på den berøringsfølsomme skærm, og sørg for at teste, om rollover effekter og drop-down menuer kan aktiveres med et tryk på en finger, og en mus.

For at gøre navigationen let for iPhone og iPad besøgende, skal du

  • Gør links let at klikke på: Adskil forbindelser med tilstrækkelig plads mellem dem til at gøre det lettere at udnytte dem ved hjælp af kun en fingerspids. (Som retningslinje Apple anbefaler, at links indstilles til at besætte mindst 44 pixels med 44 pixels af plads.)

    Denne anbefaling er den samme for både iPhone og iPad, fordi det er baseret på størrelsen af ​​en finger, ikke på løsningen af ​​enheden eller størrelsen af ​​skærmen. (Selvom nogle fingre er federe end andre, 44 pixels er en god rettesnor.)
  • Gør links let at se: Style links, så de er nemme at skelne fra anden tekst og elementer på en side. Husk, at dine besøgende kan blive distraheret eller i en fart og kan være i svagt lys, eller værre, klart lys, når du bruger en af ​​disse meget bærbare enheder. Skelne links ved hjælp af tekst og billeder, der står i skarp kontrast til baggrunden.
  • Organiser links: Gruppe links til relaterede elementer sammen, og hvis du har en sub-navigationsmenu på et websted, organisere disse bånd ind i deres egne, let anerkendte sektioner.
  • På mindre iPhone skærm, sted navigation menuer nederst på skærmen, ikke på toppen: Navigational links kan optage en masse plads på en mobil skærm.

    Snarere end rod i toppen af ​​dit design med links, omfatter en enkelt menu-knappen øverst på hver side, som vist i dette design, og oprette et link, der hopper ned til bunden af ​​siden, hvor du kan inkludere flere links uden begrave indholdet.

    Hvordan brugere navigerer i en Touch Screen verden

Det er vist i denne figur motiv er designet til Microsoft af den talentfulde designer Sia Ea, som arbejder på Ansible Mobile.


© 2019 Zajacperrone.com | Contact us: webmaster# zajacperrone.com