Distraktioner på hjemmesider fjerne fokus fra indholdet

Når man starter på en ny hjemmeside og især hvis man har fået fingrene i et nyt tema til f.eks. WordPress eller Joomla! eller tilsvarende, er det fristende at prøve alle nye muligheder af for at se, hvad det kan præstere. Sliders, flippers, css-animationer etc. Der er som regel mange muligheder og også mange muligheder for at gøre hjemmesiden til en demonstration af, hvor mange tricks, webdesigneren kender.

Det er jo sådan set også fint nok, hvis det er designerens egen portfolio, men er det en side der har til formål at kommunikere et budskab, sælge et produkt eller præsenterer en service, virker alle bevægelser på skærmen som en magnet for øjnene og fjerner fokus fra budskabet. Man skal vel bare slå sin ad-blocker fra og besøge Ekstrabladets hjemmeside for at se, hvor galt det kan gå, når der sker for meget skærmen (men det kan selvfølgelig være for at fjerne fokus fra journalistikken…). Ekstrabladet har sikkert lavet en kalkule af, at det kan betale sig, men generelt er det en overmåde dårlig vej at bevæge sig ud af.

Ekstrabladet.dk forside fra 22/4 2015

Ekstrabladet fra 22/4 2015

Ekstrabladet.dk’s forside fra 22/4 2015 uden adblocker installeret. Af naturlige årsager kan man ikke se bevægelsen på skærmen, men reklamerne hele vejen rundt om teksten er meget opmærksomhedssøgende og flagene i rammerne er animerede, så de daler mod skærmens bund. Meget distraherende.

Kunsten at beherske sig

Kunsten består i at beherske sig og kun bruge de effekter der understøtter budskabet. Er det en side for en bedemand, er det nok bedst at skrue lidt ned for animationerne for ikke at virke stødende, mens en side der sælger eksotiske rejser kan slippe af sted med at bruge flere effekter og stadig komme igennem ned budskabet, vel at bemærke uden at støde den potentielle kunde fra sig. Måske kan effekterne ligefrem skab en større forventning til det annoncerede produkt og man skal derfor ikke reflektorisk afvise effekter. Budskabet er derfor: vis mådehold i brugen af grafik og effekter og brug kun netop det, der er med til at understrege og understøtter budskabet og, ikke mindst, at hjælper brugeren med at navigere rundt på sitet.

Taktil feedback

I den virkelige verden har vi en taktil (sanselig med følesansen) fornemmelse af vores handlinger, f.eks. når vi trykker på en lyskontakt eller åbner en dør. Helt så privilegerede er vi ikke, når vi designer hjemmesider (og tak for det; bruger vi Ekstrabladet igen som eksempel, vil et besøg på deres side svarer til at få en lussing, hver gang man besøger en ny side ;-)).

For at opveje manglen på taktil tilbagemelding, kan forskellige effekter hjælpe brugeren ved at give ham visuel feedback på hans handlinger. Lyd er også en mulighed for tilbagemelding, men betragtes af mange som værende mere invasiv og skal derfor så vidt muligt undgås, men der er naturligvis undtagelser hvor lyd-feedback giver mest mening.

Mangel på taktil feedback

Manglen på taktil tilbagemelding kan altså opvejes af visuelle indtryk. Tænk f.eks. på knapper der bliver mørkere, når man trykker på dem for at give effekten af at knappen bliver trykket ned, eller den allestedsnærværende spinner, der viser at browseren er i gang med at hente data fra serveren. Uden disse små effekter kan brugeren nemt komme i tvivl om han allerede har trykket på knappen, om browseren er i gang med at opdaterer siden eller om den venter på yderligere input fra ham.

I disse tilfælde er effekterne en vigtig del af brugerens tilfredsstillende oplevelse af siden og bør derfor ikke udelades. Egentligt kan man vel sammenligne brugen af effekter korrekt og mindre korrekt som forskellen mellem at male en væg med en rulle og at stikke et kanonslag i en dåse maling:

Spinner- og loader-animationer

Eksempler på spinners og loaders, der er små animationer der skal vise brugeren, at browseren er i gang med at hente eller beregne data. Uden sådanne animationer, bliver brugeren hurtig utålmodig (efter ca. 6 sekunder) og vælger måske at re-aktivere funktionen. Dette genstarter processen, der nu tager endnu længere tid og koster flere server-ressourcer.