12 Apr 2010 21:53
Fitts Law - en gylden regel i usability
Fitts Law er nok den første "lov", man lærer om, når man arbejder med usability (som jo direkte afleder konverteringer), men alligevel kikser den for rigtigt mange (vil tro, at det er den oftest forekommende usability-kikser på nettet). I al sin enkelthed går Fitts Law ud på, at tiden, det ta'r, at udføre en handling (læs et klik her i webshop-verdenen) er en funktion af afstanden dertil og størrelsen på elementet.
Elementært, min kære Watson.
Vi ta'r den lige på godt jævnt dansk: Du skal have store knapper/klik-områder og de skal være i nærheden af musen (altså ikke flere scroll-sider nede på siden).
En typisk brøler er en menu, som normalt bliver lavet med et link inde i html-tag'et
<li>
Du kan se det klassiske eksempel her:
Den slags har du set før, ikke?
Der hvor det går galt, er at du kun kan klikke på linket - og ikke hele den firkantede menu
Ved at lave a-tag'et om til block-level, så fylder vi hele menuen ud og opfylder derved Fitts Law.
Er du interesseret i mere akademisk læsning om Fitts Law, så er her et blog-indlæg:
http://particletree.com/features/visualizing-fittss-law/
Så har du vist surfet nok - tid til at rette din menu, kammerat.
De sagde: 12 Apr 2010 22:54
Jacob WorsøeGod lille reminder at have med i tankerne når man designer. Men man kan jo ikke bare lave alle elementer større, så man skal vel stadig nøje udvælge hvilke elementer der skal have størst gavn af denne regel. Her tænker jeg mest på primære og sekundære call-to-actions, for dit eksempel med menuen ændre jo ikke noget på designet - det bliver bare nemmere at finde det sted man skal klikke :)
13 Apr 2010 08:32
V4D5Pointen er ikke, at man skal lave giga-store knapper såsom denne her
http://www.frontenddesignconference.com/wtf-happened.php (omend jeg synes, den er super-fed). Pointen er, at du i ovenstående tilfælde allerede har allokeret X antal pixels til din menu og så bør du også bruge dem ordentligt.-Men det er vist også dét, du er inde på ikke? Man ser bare ofte, at folk kikser lige præcis det her og Fitts Law er vist efterhånden dokumenteret nok til at man ikke bare kan kategorisere det som "akademisk sludder".
Man får simpelthen bare mere usability for de samme pixels.
13 Apr 2010 16:13
Jacob WorsøeJoh, hvis loven skal forståes således at størrelsen allerede er givet og det handler om at forkorte vejen hen til det sted man skal klikke, så er det det jeg mener :)
Men det er meget besværligt hvis man har et billede eller knap, og det så ikke er hele elementet der er klikbart, men f.eks. kun teksten, så man skal sidde og lede efter det sted hvor musen forvandles til en hånd :)
13 Apr 2010 16:13
Bent AndersenHold op hvor har jeg tit tænk at det er da komplet åndsvagt at man kun kan klikke på teksten i en knap og ikke hele knappen. Hvor mange gange har man ikke trykket på en knap uden at der skete noget?
Det er da dejligt at jeg ikke er den eneste der synes det er træsl. Det er det samme med tekst/link under et billede, men billedet er ikke aktivt ... Ikke at min shop er perfekt. Langt fra. Men det er en forholdsvis nem ting at lave om på, og en meget vigtig ting, set med mine øjne.
mvh
Bent
25 Apr 2010 16:09
Andreas MadsenMens man er i gang med at sættes display:block; på sine a-tags skal man huske at vende ens padding om. I dette tilfælde vil det sige at fjerne padding fra li-taget og indsætte padding:10px; i a-taget.