Lass uns Käfer fangen! Ein Leitfaden für Anfänger zum Testen von Websites

 James Tsividis
James Tsividis

Folgen

2. Mai 2019 * 5 min Lesezeit

Website-Tests sind viel einfacher als es scheint. Sie müssen kein Tester sein, um es zu tun. Und Sie erhalten einen Einblick in Ihr Produkt, der Ihnen hilft, es auf ganz neue Weise zu verstehen.

Ich bin Tester im Projekt Single Digital Presence (SDP). Meine Aufgabe ist es, SDP-Plattform-Websites auf vielen Browsern, Bildschirmgrößen und Geräten zu testen, um Fehler zu finden und eine optimale Benutzererfahrung zu gewährleisten.

Testen hilft Ihnen, Ihre Benutzer besser zu verstehen

Wenn ich eine Website teste, suche ich nicht nur nach Fehlern oder Fehlern, sondern versuche, sie durch so viele verschiedene Linsen wie möglich zu betrachten. Dies bedeutet, dass Sie eine Website auf verschiedenen Geräten, in verschiedenen Browsern und in verschiedenen Bildschirmgrößen verwenden. Einige Fehler treten nur in 1 Browser auf, sodass Tests in vielen verschiedenen Umgebungen erforderlich sind. Es ist auch eine großartige Gelegenheit zu sehen, wie verschiedene Benutzer mit der Website interagieren können.

Was wir testen auf

Für die vic.gov.au website, testen wir auf mehreren Umgebungen, einschließlich Windows, Mac, Android und iOS. Wir testen auf Desktop-Computern, Tablets und Telefonen sowie auf mehreren Internetbrowsern für einige Geräte.

Wir verwenden den Victorian Government Digital Standards Test, einen Produkt- oder Servicehandbuch, der häufig verwendete Browser und Vorlagen für Benutzerakzeptanztests enthält.

Wir wissen nie, wie Menschen auf unsere Website zugreifen werden, daher möchten wir sicherstellen, dass ihre Erfahrung konsistent ist und unseren Qualitätsstandards entspricht. Natürlich gibt es scheinbar unendlich viele Geräte, auf denen wir unsere Websites testen können, aber die Verwendung der Geräte, die wir bereits haben und die wir von anderen ausleihen können, reicht oft aus, um uns einen unschätzbaren Einblick in die Wahrnehmung der Öffentlichkeit zu verschaffen.

Nach dem vic.gov.au website wurde veröffentlicht, Ich war zufällig im Einkaufszentrum Doncaster. Also ging ich in den Apple Store, um die Site auf einem ihrer iPhones zu testen, da ich selbst keines hatte. Ich füllte eines der Seitenfeedback-Formulare aus und unterschrieb es als ‚James aus einem Apple Store‘, und unser Content-Team schätzte die Bemühungen, die ich unternommen hatte, um die Website zu testen.

Wenn Sie genaue Daten darüber wünschen, mit welchen Geräten, Browsern und Bildschirmgrößen Personen auf Ihre Website zugreifen, können Sie jederzeit Google Analytics überprüfen, ob es für Ihre Website eingerichtet wurde.

Drag Test

Der erste Test, den ich beim Testen einer Website gerne mache, ist der Drag Test. Auf diese Weise kann ich schnell verstehen, wie die Website auf verschiedenen Bildschirmgrößen und auf verschiedenen Geräten aussehen könnte, während ich im selben Browser bleibe.

Beim Drag-Test wird das Browserfenster von der größten auf die kleinste Größe gezogen, um zu sehen, wie die Site an verschiedenen Haltepunkten aussieht.

Haltepunkte sind notwendig, weil wir möchten, dass die Dinge größer oder kleiner werden, um den verschiedenen Bildschirmgrößen gerecht zu werden, auf denen wir die Site anzeigen können, und das Ziehen des Fensters, um kleiner oder größer zu sein, ist eine einfache Möglichkeit, all diese Änderungen zu beobachten. Sehen wir uns also ein Beispiel mit dem vic.gov.au homepage.

Das ist mein vic.gov.au homepage geöffnet, um seine maximale Größe auf meinem 27 „iMac-Bildschirm. Lassen Sie uns die Homepage beobachten und sehen, was passiert, wenn wir das Fenster verkleinern.

Dies ist die vic.gov.au homepage, aber es nimmt jetzt knapp die Hälfte des Bildschirms ein. Im Bild habe ich bisher einige der Hauptunterschiede zwischen den beiden Bildern festgestellt.

Dieses Bild ist die kleinste Version der Website und ist auf Mobiltelefonen sichtbar. Es wird sich am meisten von den anderen unterscheiden.

Dies sind nicht die einzigen drei vic.gov.au und es wird für jede Site anders sein, aber es ist etwas, um Ihnen den Einstieg zu erleichtern.

Ich schaue oft auf die Kopfzeile, um zu sehen, an welchem Haltepunkt ich mich befinde, da fast alle von ihnen jedes Mal etwas in der Kopfzeile geändert haben. Und ich habe gelernt, wie jeder einzelne Header aussieht, indem ich mir die Designs für die Site angesehen habe. Es hilft sehr, Zugriff auf die Designs zu haben, damit Sie wissen, ob eine Funktion an einem bestimmten Haltepunkt der Bildschirmgröße so aussehen soll, wie sie es tut. Angesichts der Anzahl der Unterschiede zwischen Haltepunkten gibt es oft einige Fehler in der Implementierung. Dies ist also ein sehr wertvoller Test, der während der Entwicklung der Website durchgeführt werden muss.

Vergessen Sie nicht, den Drag-Test für die Kopfzeile, den Inhalt und die Fußzeile der Site durchzuführen, da sie alle einen eindeutigen Inhalt haben, der sich zwischen Haltepunkten ändern kann. Beachten Sie auch, wohin der Seitenleisteninhalt geht, wenn die Seite klein genug wird. Es geht normalerweise irgendwo unten hin.

Testen von Inhaltstypen

Jede Website hat unterschiedliche Seiteninhaltstypen. Machen Sie sich mit jedem einzelnen Inhaltstyp vertraut, da Sie auf jeder Seite nach verschiedenen Attributen suchen. Einige Seiten variieren mehr als andere. Auf vic.gov.au , unsere Inhaltstypen sind:

  • Alert
  • Event
  • Grant
  • Zielseite
  • Nachrichten
  • Seite
  • Profil

Weitere Informationen zu Inhaltstypen finden Sie unter: https://www.vic.gov.au/what-single-digital-presence-offers#page-templates-available-on-sdp

Geräte— und Browsertests

Und schließlich, sobald Sie die Website gründlich in Ihrem Lieblingsbrowser getestet haben, ist es immer gut zu sehen, wie sie auch auf anderen Geräten und Browsern aussieht — insbesondere auf den beliebten -, da das Touch-Erlebnis nicht immer vorhersehbar ist und Sie immer Fehler finden können, die für einen bestimmten Browser auf einem bestimmten Gerät spezifisch sind. Die aus dem Nichts zu kommen scheinen und völlig unerwartet sind.

Praktische Testlinks

  • Die beliebtesten Browser (Australien) — http://gs.statcounter.com/browser-market-share/all/australia
  • Die beliebtesten Browser (Welt) — http://gs.statcounter.com/browser-market-share
  • iPhone Simulator (nur Mac) — https://developer.apple.com/xcode/
  • Wenn Sie gerätespezifische Tests durchführen möchten, anstatt nur die Bildschirmauflösung zu testen, verfügt Google Chrome Developer Tools über eine Geräte-Symbolleiste, die das Verhalten eines realen Geräts simulieren kann, jedoch nicht perfekt ist.

Es gibt viele Website-Testtechniken, die in diesem Artikel nicht behandelt werden, aber dies ist ein großartiger Ausgangspunkt. Das nächste, was ich testen würde, ist, dass in Formulare eingegebene Daten im Backend korrekt angezeigt werden und dass ungültige Daten nicht eingegeben werden können.

Viel Spaß beim Testen und ich freue mich darauf zu hören, was die Leute aus diesem Artikel lernen. Lassen Sie uns alle gemeinsam das Web besser machen!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.