lad os fange bugs! En begynderguide til test af hjemmesider

James Tsividis
James Tsividis

Følg

Maj 2, 2019 * 5 min læst

hjemmeside test er meget enklere end det ser ud. Du behøver ikke at være en tester for at gøre det. Og du får et indblik i dit produkt, der hjælper dig med at forstå det på en helt ny måde.

jeg er en tester på Single Digital Presence (SDP) projekt. Mit job er at teste SDP platformede hjemmesider på mange bro.sere, skærmstørrelser og enheder for at finde fejl og sikre optimal brugeroplevelse.

Testing hjælper dig med bedre at forstå dine brugere

når jeg tester en hjemmeside, søger jeg ikke bare at finde fejl eller fejl, men jeg forsøger at se på det gennem så mange forskellige linser som muligt. Dette betyder at bruge en hjemmeside på forskellige enheder, i forskellige bro.sere og inden for forskellige skærmstørrelser. Nogle fejl vises kun i 1 bro.ser, så det er nødvendigt at teste i mange forskellige miljøer. Det er også en stor mulighed for at se, hvordan forskellige brugere kan interagere med sitet også.

hvad vi tester på

til vic.gov.au hjemmeside, vi tester på flere miljøer, herunder vinduer, Mac, Android og iOS. Vi tester på stationære computere, tablets og telefoner samt flere internetsøgere til nogle enheder.

vi bruger Victorian Government Digital Standards Test en produkt-eller servicevejledning, der inkluderer almindeligt anvendte bro.Serere og skabeloner til test af brugeraccept.

vi ved aldrig, hvordan folk får adgang til vores side, så vi vil sikre os, at uanset hvor de får adgang til den, er deres oplevelse konsistent, og den opfylder vores kvalitetsstandarder. Selvfølgelig, der er tilsyneladende uendelige antal enheder, vi kan teste vores sider på, men at bruge de enheder, vi allerede har og kan låne fra andre, er ofte nok til at give os uvurderlig indsigt i, hvordan offentligheden kan opfatte det.

efter vic.gov.au hjemmesiden blev frigivet, jeg var tilfældigvis i Doncaster indkøbscenter. Så jeg gik til Apple store for at teste siden på en af deres iPhones, da jeg ikke selv havde en. Jeg udfyldte en af sidefeedbackformularerne og underskrev den som ‘James fra en Apple store’, og vores indholdsteam værdsatte den indsats, jeg gik igennem for at teste siden.

hvis du ønsker nøjagtige data om, hvilke enheder, søgere og skærmstørrelser folk bruger til at få adgang til din hjemmeside, kan du altid tjekke Google Analytics, hvis den er konfigureret med din hjemmeside.

træk test

den første test jeg gerne gøre, når teste en hjemmeside er træk test. Dette giver mig mulighed for at få en hurtig forståelse af, hvordan hjemmesiden kan se ud på forskellige skærmstørrelser og på forskellige enheder, alt sammen mens du opholder dig i samme bro.ser.

træktesten involverer at trække bro.ser-vinduet fra den største størrelse til den mindste størrelse for at se, hvordan siden ser ud på forskellige breakpoints, hvilket er det punkt, hvor siden morphs baseret på hvor stor visningen er.

Breakpoints er nødvendige, fordi vi ønsker, at tingene bliver større eller mindre for at rumme de forskellige skærmstørrelser, vi kan se siden på, og at trække vinduet for at være mindre eller større er en nem måde at observere alle disse ændringer på. Så lad os se et eksempel med vic.gov.au hjemmeside.

dette er min vic.gov.au hjemmeside åbnet til sin maksimale størrelse på min 27 ” iMac skærm. Lad os se hjemmesiden og se, hvad der sker, når vi gør vinduet mindre.

dette er vic.gov.au hjemmeside, men det tager lige under halvdelen af skærmen nu. På billedet har jeg bemærket nogle af de største forskelle mellem de to billeder hidtil.

dette billede er den mindste version af siden og er synlig på mobiltelefoner. Det vil være den mest forskellige fra de andre.

disse er ikke de eneste tre skærmstørrelse breakpoints på vic.gov.au og det vil være anderledes for hvert sted, men det er noget at få dig i gang.

jeg ser ofte på overskriften for at se, hvilket breakpoint jeg er på, da næsten alle af dem har ændret noget i overskriften hver gang. Og jeg har lært, hvordan hver anden header ser ud ved at se på designene til siden. Det hjælper meget med at få adgang til designene, så du kan vide, om en funktion skal se ud som den gør på et bestemt skærmstørrelsesbrudspunkt. I betragtning af antallet af forskelle mellem breakpoints er der ofte et par fejl i implementeringen. Så dette er en meget værdifuld test at gøre, da stedet udvikles.

glem ikke at gøre træk test for overskriften, indholdet og sidefoden af hjemmesiden, da de alle har unikt indhold, som kan ændre sig mellem breakpoints. Vær også opmærksom på, hvor sidebjælkens indhold går, når siden bliver lille nok. Det går normalt et sted i bunden.

test af indholdstype

hver hjemmeside har forskellige sideindholdstyper. Sørg for at blive fortrolig med hver enkelt indholdstype, da du tester for forskellige attributter på hver side. Nogle sider varierer mere end andre. På vic.gov.au, vores Indholdstyper er:

  • Alert
  • begivenhed
  • Grant
  • destinationsside
  • nyheder
  • side
  • profil

for at lære mere om indholdstyper, besøg: https://www.vic.gov.au/what-single-digital-presence-offers#page-templates-available-on-sdp

test af enhed og bro.ser

og endelig, når du først har testet siden grundigt på din foretrukne bro. ser, er det altid godt at se, hvordan det ser ud på andre enheder og bro. Serere — især de populære — da berøringsoplevelsen ikke er noget, du altid kan forudse, og du kan altid finde fejl, der er specifikke for en bestemt bro. ser på en bestemt enhed også. Som synes at komme ud af ingenting og er helt uventet.

Handy test links

  • mest populære søgere (Australien) — http://gs.statcounter.com/browser-market-share/all/australia
  • mest populære søgemaskineoptimering) — http://gs.statcounter.com/browser-market-share
  • iPhone simulator (kun Mac) — https://developer.apple.com/xcode/
  • hvis du gerne vil udføre enhedsspecifik test i stedet for bare test af skærmopløsning, har Google Chrome Developer Tools en Enhedsværktøjslinje, der kan simulere, hvordan en rigtig enhed opfører sig, men den er ikke perfekt.

der er mange hjemmeside testteknikker ikke diskuteret i denne artikel, men dette er et godt sted at starte. Den næste ting, jeg ville teste, er, at data, der er indtastet i formularer, vises korrekt i backend, og at ugyldige data ikke kan indtastes.

Hav det sjovt at teste, og jeg ser frem til at høre, hvad folk lærer af denne artikel. Lad os alle gøre internettet bedre sammen!

Skriv et svar

Din e-mailadresse vil ikke blive publiceret.