Cross-Browser-Tests von Websites leicht gemacht

Browserstack
Kommentare

Websites zu testen ist wichtig, um den Besuchern die bestmögliche User Experience bieten zu können, egal, mit welchem Browser sie unterwegs sind, oder ob sie mit mobilen Devices die Seite ansteuern.

Websites zu testen ist wichtig, um den Besuchern die bestmögliche User Experience bieten zu können, egal, mit welchem Browser sie unterwegs sind, oder ob sie mit mobilen Devices die Seite ansteuern. Betrachtet man allerdings die unzähligen verschiedenen Geräte und Browser, die alle unterschiedliche Konfigurationen mit sich bringen, wird einem schnell klar, dass das Testen jeder Einstellung unmöglich ist – zumindest, wenn es um manuelles Testen geht. Nützlich sind daher Tools wie Modern.IE, mit denen sich Screenshots der zu testenden Seite in verschiedenen Browser-/Device-Kombinationen erstellen lassen, oder das hier vorgestellte Tool Browserstack, mit dem sich Websites insbesondere auch live in einer virtuellen Maschine testen lassen. Garret Dimon hat das Tool vorgestellt.

Features von Browserstack

Browserstack erleichtert Entwicklern die Arbeit erheblich, weil nicht jedes Gerät und jede Browserversion manuell getestet werden muss. Stattdessen können mit dem Tool Screenshots für die Darstellung in verschiedenen Browsern erstellt oder die Anzeige auf mobilen Geräten, die mit iOS, Android oder Opera laufen, emuliert werden.

Zudem können verschiedene Browser durch eine virtuelle Maschine im Browserfenster live getestet werden. Auch können unterschiedliche Auflösungen ausgewählt werden, mit denen getestet werden soll. Ebenfalls praktisch ist die Möglichkeit, das Responsive Design der Website auf verschiedenen Geräten testen zu lassen.

Weitere Features von Browserstack sind beispielsweise die Optionen, mit den Developer-Tools des virtuellen Browsers Probleme zu beheben oder Screenshots der Website zu erfassen und zu kommentieren.

Browser-Testen in drei Schritten

Beim Testen von Websites kommt es nicht darauf an, jede Konfiguration für jeden Browser und jedes Device bis ins kleinste Detail zu testen. Stattdessen sollten nur die wichtigsten Konfigurationen getestet werden, um signifikante Probleme zu finden und beheben zu können, damit dem Besucher eine bessere User Experience geboten werden kann. Garret Dimon beschreibt drei Schritte, mit denen sich der Workflow beim Testen verbessern lässt.

  1. Auf wenige Plattformen fokussieren Bevor mit dem Testen begonnen wird, sollte man analysieren, welche Plattformen von den Besuchern der Website hauptsächlich genutzt werden und sich dann auf diese Browser und Betriebssysteme konzentriert werden.
  2. Ausgedehnte Smoke-Tests Mit dem Screenshot-Service Browserstack lässt sich eine Seite für verschiedene Browser testen und vergleichen. So lässt sich leicht feststellen, in welchen Browsern umfangreichere Tests nötig sind. Allerdings sollte sich nicht nur auf Screenshot-Tests verlassen werden, sondern gerade auch die weit verbreiteten Browser stichpunktartig manuell getestet werden, um etwa Bugs mit JavaScript auszuschließen.
  3. Interaktive virtuelle Machine von Browserstack für Tests nutzen Neben dem Screenshot-Service bietet Browserstack auch die Möglichkeit, eine spezifische Browser-/Betriebssystemkombination mit einer virtuellen Maschine durch die einfache Eingabe der URL zu testen. Dieser Schritt bietet sich an, wenn man bereits weiß, welche Browser von den Besuchern bevorzugt benutzt werden oder bei welchen die Darstellung der Website besonders problematisch ist.

Lokales Testen

Neben der virtuellen Maschine und dem Screenshot-Service ist auch die Option des lokalen Testens nützlich. Besonders für neue Websites und Apps bietet sich ein Test auf einem lokalen Server an, bevor die Seite der Öffentlichkeit zugänglich gemacht wird.

Nötig ist dafür ein Browser-Plug-in. Es kann zwischen einem Lokalen Server und Lokalen Ordnern gewählt werden, wo Dateien direkt bearbeitet und Veränderungen vorgenommen werden können.

Browserstack kann Entwicklern die Arbeit beim Testen von Websites in verschiedenen Browsern und auf verschiedenen Betriebssystemen erheblich vereinfachen. Allerdings sind die Funktionen nicht kostenlos verfügbar. Zum Ausprobieren gibt es einen kostenlosen Test-Account auf der Browserstack-Website, als Vollversion sind zahlreiche verschiedene Modelle zu unterschiedlichen Preisen, beginnend ab 39 US-Dollar, erhältlich.

Aufmacherbild: Red test button with metallic border on white background von Shutterstock / Urheberrecht: newart-graphics

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -