să prindem bug-uri! Un ghid pentru începători pentru testarea site-ului web

James Tsividis
James Tsividis

urmați

mai 2, 2019 · 5 min citit

testarea site-ului web este mult mai simplă decât pare. Nu trebuie să fii un tester pentru a o face. Și veți obține o perspectivă asupra produsului dvs. care vă va ajuta să îl înțelegeți într-un mod cu totul nou.

sunt un tester pentru proiectul single digital Presence (SDP). Treaba mea este de a testa site-uri SDP platformed pe mai multe browsere, dimensiuni de ecran și dispozitive pentru a găsi bug-uri și pentru a asigura o experiență optimă de utilizare.

testarea vă ajută să înțelegeți mai bine utilizatorii

când testez un site web, nu caut doar să găsesc erori sau erori, ci încerc să îl privesc prin cât mai multe obiective diferite. Aceasta înseamnă utilizarea unui site web pe diferite dispozitive, în browsere diferite și în diferite dimensiuni de ecran. Unele bug-uri apar doar în 1 browser, astfel încât testarea în multe medii diferite este necesară. Este, de asemenea, o mare oportunitate de a vedea cât de diferiți utilizatori ar putea interacționa și cu site-ul.

ce testăm pe

pentru vic.gov.au site-ul web, testăm pe mai multe medii, inclusiv Windows, Mac, Android și iOS. Testăm pe computere desktop, tablete și telefoane, precum și mai multe browsere de internet pentru unele dispozitive.

folosim standardele digitale ale Guvernului Victorian testează un ghid de produse sau servicii care include browsere utilizate în mod obișnuit și șabloane de testare a acceptării utilizatorilor.

nu știm niciodată cum vor accesa oamenii site-ul nostru, așa că vrem să ne asigurăm că oricum îl accesează, experiența lor este consecventă și respectă standardele noastre de calitate. Desigur, există un număr aparent nesfârșit de dispozitive pe care le putem testa site-urile noastre, dar utilizarea dispozitivelor pe care le avem deja și pe care le putem împrumuta de la alții este adesea suficientă pentru a ne oferi o perspectivă neprețuită asupra modului în care publicul ar putea să o perceapă.

după vic.gov.au site-ul a fost lansat, s-a întâmplat să fiu la Centrul Comercial Doncaster. Așa că m-am dus la Apple store pentru a testa site-ul pe unul dintre iPhone-urile lor, deoarece nu aveam unul singur. Am completat unul dintre formularele de feedback ale paginii și l-am semnat ca ‘James from a Apple store’, iar echipa noastră de conținut a apreciat efortul prin care am trecut pentru a testa site-ul.

dacă doriți date exacte cu privire la dispozitivele, browserele și dimensiunile ecranului pe care le utilizează utilizatorii pentru a accesa site-ul dvs., puteți verifica întotdeauna Google Analytics dacă a fost configurat cu site-ul dvs.

test de tragere

primul test pe care îmi place să îl fac atunci când testez un site web este testul de tragere. Acest lucru îmi permite să înțeleg rapid cum ar putea arăta site-ul web pe diferite dimensiuni de ecran și pe diferite dispozitive, toate în timp ce stau în același browser.

testul de tragere implică glisarea ferestrei browserului de la cea mai mare dimensiune la cea mai mică dimensiune, pentru a vedea cum arată site-ul la diferite puncte de întrerupere, care este punctul în care site-ul se transformă în funcție de cât de mare este portul de vizualizare.

punctele de întrerupere sunt necesare deoarece dorim ca lucrurile să devină mai mari sau mai mici pentru a se potrivi diferitelor dimensiuni ale ecranului pe care putem vizualiza site-ul, iar glisarea ferestrei pentru a fi mai mică sau mai mare este o modalitate ușoară de a observa toate aceste modificări. Deci, să vedem un exemplu cu vic.gov.au pagina de start.

aceasta este a mea vic.gov.au pagina de pornire a fost deschisă la dimensiunea maximă pe ecranul meu iMac de 27″. Să observăm pagina de pornire și să vedem ce se întâmplă atunci când facem fereastra mai mică.

aceasta este vic.gov.au pagina de pornire, dar ocupă puțin sub jumătate din ecran acum. În imagine, am observat câteva dintre diferențele majore dintre cele două imagini până acum.

această imagine este cea mai mică versiune a site-ului și este vizibilă pe telefoanele mobile. Acesta va fi cel mai diferit de celelalte.

acestea nu sunt singurele trei puncte de întrerupere a dimensiunii ecranului pe vic.gov.au și va fi diferit pentru fiecare site, dar este ceva pentru a obține ai început.

mă uit adesea la antet pentru a vedea pe ce punct de întrerupere sunt, deoarece aproape toți au schimbat ceva în antet de fiecare dată. Și am învățat cum arată fiecare antet diferit uitându-mă la desenele site-ului. Vă ajută foarte mult să aveți acces la modele, astfel încât să puteți ști dacă o caracteristică ar trebui să arate așa cum o face la un anumit punct de întrerupere a dimensiunii ecranului. Având în vedere numărul de diferențe între punctele de întrerupere, există adesea câteva erori în implementare. Deci, acesta este un test foarte valoros pentru a face ca site-ul este în curs de dezvoltare.

nu uitați să faceți testul de tragere pentru antet, conținutul și subsolul site-ului, deoarece toate au conținut unic care s-ar putea schimba între punctele de întrerupere. De asemenea, rețineți unde merge conținutul barei laterale atunci când pagina devine suficient de mică. De obicei merge undeva în partea de jos.

testarea tipului de conținut

fiecare site web are diferite tipuri de conținut de pagină. Asigurați-vă că vă familiarizați cu fiecare tip de conținut individual, deoarece veți testa atribute diferite pe fiecare pagină. Unele pagini variază mai mult decât altele. Pe vic.gov.au, tipurile noastre de conținut sunt:

  • alertă
  • eveniment
  • Grant
  • pagina de destinație
  • știri
  • pagină
  • profil

pentru a afla mai multe despre tipurile de conținut, vizitați: https://www.vic.gov.au/what-single-digital-presence-offers#page-templates-available-on-sdp

testarea dispozitivului și a browserului

și, în sfârșit, odată ce ați testat site — ul temeinic pe browserul dvs. preferat, este întotdeauna bine să vedeți cum arată și pe alte dispozitive și browsere — în special pe cele populare-deoarece experiența tactilă nu este ceva ce puteți anticipa întotdeauna și puteți găsi întotdeauna bug-uri specifice unui anumit browser pe un anumit dispozitiv. Care par să iasă de nicăieri și sunt complet neașteptate.

Handy testing links

  • cele mai populare browsere (Australia) — http://gs.statcounter.com/browser-market-share/all/australia
  • cele mai populare browsere (lume) — http://gs.statcounter.com/browser-market-share
  • simulator iPhone (numai pentru Mac) — https://developer.apple.com/xcode/
  • dacă doriți să efectuați teste specifice dispozitivului în loc să testați doar rezoluția ecranului, atunci Google Chrome Developer Tools are o bară de instrumente pentru dispozitiv care poate simula modul în care se comportă un dispozitiv real, dar nu este perfect.

există multe tehnici de testare a site-urilor web care nu sunt discutate în acest articol, dar acesta este un loc minunat pentru a începe. Următorul lucru pe care l-aș testa este că datele introduse în formulare apar corect în backend și că datele nevalide nu pot fi introduse.

distrează-te testând și aștept cu nerăbdare să aud ce învață oamenii din acest articol. Să facem web mai bine împreună!

Lasă un răspuns

Adresa ta de email nu va fi publicată.