Elsewhen

Herausforderung

Elsewhen wandte sich an QAwerk, um seine Unternehmenswebsite während der Neugestaltung gründlich zu testen. Das Unternehmen benötigte die Unterstützung unseres engagierten QA-Teams, um die Website termingerecht zu starten und sicherzustellen, dass sie einwandfrei funktioniert und eine zufriedenstellende Benutzererfahrung bietet.

Hier eine kurze Zusammenfassung der von uns festgelegten Testziele:

• Konsistenz des Designs: Überprüfung der Einheitlichkeit des Designs in verschiedenen Bereichen der Website, einschließlich der Top-Level- und dynamischen Seiten.
• Animationen und Übergänge: Sicherstellung reibungsloser und erwartungsgemäßer Animationen und Übergänge auf der gesamten Website.
• Funktionstests: Testen wichtiger Website-Funktionen wie Suche, Formulare und Links, um deren ordnungsgemäße Funktionalität sicherzustellen.
• Browser- und Gerätetests: Überprüfung der Kompatibilität mit verschiedenen Browsern und Geräten für ein einheitliches Benutzererlebnis.
• SEO und Barrierefreiheit: Bewertung und Verbesserung der SEO-Elemente und Barrierefreiheitsstandards der Website.
• Leistungstests: Sicherstellung der optimalen Leistung der Website unter verschiedenen Lastbedingungen, um schnelle Ladezeiten und eine reibungslose Navigation zu gewährleisten.

Das Hauptziel bestand darin, sicherzustellen, dass das aktualisierte Design sowohl auf den Top-Level-Seiten als auch auf den dynamischen Seiten konsistent ist, und gleichzeitig die Funktionalität, Leistung und allgemeine Benutzererfahrung zu überprüfen.

Lösung

Wir entwickeln für jedes einzelne Projekt, an dem wir mitwirken, eine maßgeschneiderte Teststrategie. Werfen wir einen genaueren Blick auf die Arbeit unseres QA-Teams und die Auswirkungen, die sie auf den Umsatz und die allgemeine Markenwahrnehmung unseres Kunden hatte.

Funktionstests

Wir haben alle kritischen Bereiche – Homepage, Navigation, Inhaltsanzeige, Links, Fehlerbehandlung und interaktive Elemente – manuell getestet und dabei besonders auf hochdynamische und funktionsreiche Bereiche wie Suchfilter und Kontaktformulare geachtet.

Warum das wichtig ist: Funktionstests tragen dazu bei, dass Benutzer Aufgaben ohne Fehler oder Blockaden ausführen können. Außerdem helfen sie dabei, Supportanfragen zu reduzieren und die Konversionsraten zu steigern, indem sie für ein reibungsloses Erlebnis sorgen.

UI-Tests

Das Elsewhen-Team hat uns seine Designdatei zur Verfügung gestellt, und wir haben die Website durchgesehen und mit dem Design verglichen. Wir haben das Layout, die Typografie, die Abstände und die Farbgebung auf der gesamten Website überprüft. Unsere QA-Ingenieure haben auch die Bewegungseffekte zwischen den UI-Zuständen überprüft, einschließlich Ladevorgängen, Hover-Zuständen und modalen Öffnungen.

Warum das wichtig ist: UI-Tests tragen durch ein gepflegtes, professionelles Erscheinungsbild dazu bei, das Vertrauen der Benutzer und die Wahrnehmung der Marke zu verbessern. Ein einheitliches Design reduziert die kognitive Belastung und hilft den Benutzern, sich schneller und sicherer zurechtzufinden. Durch das Testen von Animationen und Übergängen wurde sichergestellt, dass es keine störenden Übergänge gab, die die Benutzer frustrieren oder verwirren könnten, was zu einem hochwertigeren und moderneren Erscheinungsbild beitrug.

Barrierefreiheitstests

Für die Barrierefreiheitstests einigten wir uns auf einen optimalen Arbeitsumfang für die erste Überprüfung, der Folgendes umfasste:

• Überprüfung, ob die Website Untertitel und Transkripte für Audio- und Videoinhalte bereitstellt
• Sicherstellung, dass der Text lesbar ist und einen ausreichenden Kontrast zum Hintergrund aufweist
• Sicherstellung, dass alle Funktionen über die Tastaturnavigation verfügbar sind
• Sicherstellung, dass die Website den Benutzern hilft, Fehler zu vermeiden und zu korrigieren, insbesondere in Kontaktformularen
• Überprüfung der Kompatibilität mit Screenreadern

Warum das wichtig ist: Unsere Barrierefreiheitstests trugen dazu bei, die Website inklusiv und konform mit den Web Content Accessibility Guidelines (WCAG) zu gestalten. Wir haben Kontrastprobleme identifiziert und dokumentiert, wie diese behoben und in Zukunft überwacht werden können. Außerdem haben wir HTML-Fehler gemeldet, die die Arbeit von Screenreadern behindern und potenzielle Darstellungsprobleme verursachen. Unsere QA-Ingenieure haben mehrere Fälle von fehlenden Alt-Beschreibungen gefunden, die für blinde Nutzer von entscheidender Bedeutung sind.

Insgesamt haben unsere Testmaßnahmen dazu beigetragen, das Web- und Mobile-Erlebnis für Nutzer mit Behinderungen, ältere Nutzer und Nutzer in Umgebungen mit schlechten Lichtverhältnissen zu verbessern.

SEO-Test

Für den SEO-Check haben wir die folgenden Testbereiche identifiziert:

• Defekte Links und 404-Fehler
• Konfiguration der XML-Sitemap und der robots.txt-Datei
• Ladezeit der Seite und Mobilfreundlichkeit
• SSL-Zertifizierung und HTTPS-Status
• Titel-Tags und Meta-Beschreibungen
• Struktur der Header-Tags (H1, H2 usw.)
• Alt-Texte für Bilder
• Weitere Meta-Tags
• Struktur der Seiten-URLs
• Favicon

Warum das wichtig ist: SEO-Tests tragen dazu bei, die organische Sichtbarkeit zu verbessern, sodass mehr Nutzer das Produkt über Suchmaschinen entdecken können. Bei der SEO-Prüfung wurden drei Probleme festgestellt: Duplikate von H1 auf einigen Seiten, fehlende Alt-Texte für einige Bilder und eine schlechte Leistungsbewertung für mobile Geräte. Die Behebung dieser festgestellten Fehler führt zu einem erhöhten Traffic auf der Website ohne bezahlte Werbung. Wir haben sichergestellt, dass die Seiten korrekt indexiert und für Such-Bots zugänglich sind.

Kompatibilitätstests

Kompatibilitätstests waren unerlässlich, da die Designs von Elsewhen oft unterschiedliche Layouts oder Designänderungen pro Breakpoint und gelegentlich unterschiedliche Funktionen zur Verbesserung der Benutzererfahrung aufwiesen. Unsere QA-Ingenieure testeten die Website auf Desktop- (Chrome, Edge, Firefox) und mobilen Browsern (Chrome für Android, Safari auf iOS, Samsung Internet, Opera Mobile).

Warum das wichtig ist: Die von uns durchgeführten Kompatibilitätstests garantierten eine konsistente und zuverlässige Erfahrung unabhängig von Gerät oder Plattform. Wir haben Elsewhen dabei geholfen, ihre Reichweite auf alle Nutzersegmente auszuweiten und fehlerhafte Erfahrungen auf sekundären Browsern zu vermeiden.

Leistungstests

Da von einer B2B-Website nicht erwartet wird, dass sie eine große Anzahl gleichzeitiger Nutzer bewältigt, haben wir keine hohe Auslastung von 1.000 Nutzern oder mehr simuliert. Stattdessen konzentrierte sich unser QA-Team auf die Analyse der Ladezeit, des Verhaltens unter verschiedenen Netzwerk- und CPU-Bedingungen, der renderblockierenden Ressourcen und einiger anderer Faktoren. Die Leistung der Website wurde sowohl auf Desktop-Computern als auch auf Mobilgeräten mit dem Chrome-Browser getestet.

Warum das wichtig ist: Wir haben festgestellt, dass die Leistung für Mobilgeräte erheblich verbessert werden muss, da die durchschnittlichen Werte bei etwa 50 lagen, was auf eine erhebliche Verzögerung der Ladezeiten hindeutet. Auf bestimmten Seiten dauerte das Laden des größten Inhaltselements mehr als 10 Sekunden, was drastisch von den Erwartungen moderner Nutzer abweicht (maximal 2-3 Sekunden).

Auf der Grundlage der Ergebnisse der Leistungsbewertung hat QAwerk die folgenden Empfehlungen ausgesprochen:

• Reduzierung der Anzahl der HTTP-Anfragen
• Minimierung der JavaScript-Ausführungszeit
• Sicherstellung responsiver Bilder für mobile Geräte
• Implementierung von kritischem CSS-Inline, um das Blockieren des Renderings zu vermeiden

Dank unserer Leistungstests konnte Elsewhen die mobile Benutzerfreundlichkeit verbessern und die Absprungraten reduzieren, wodurch eine schnelle und reaktionsschnelle Erfahrung geboten wird.