Adobe BrowserLab: Vorschau für Webdesigner

Adobe hat ein kostenloses Werkzeug zur Simulation verschiedener Browser namens BrowserLab veröffentlicht. Nutzbar ist BrowserLab in zwei Varianten: Einerseits als Onlineservice, anderseits als Erweiterung für Besitzer der Software Dreamweaver CS4. Bei CS5 ist es grundsätzlich integriert. Interaktive Funktionalitäten bietet leider nur die in Dreamweaver integrierte Variante, Nutzer des Onlineservices müssen sich hingegen mit originären Screenshots zufrieden geben.

Aktuell werden folgende Browser unterstützt:

  • Firefox 2.0, 3.0 und 3.5 (Windows XP und Mac OS X)
  • Internet Explorer 6.x, 7.x und 8.x (Windows XP)
  • Safari 3.x und 4.x (Mac OS X)
  • Chrome 3.0 (Windows XP)

Die Online-Variante

Voraussetzung für die Nutzung der Onlinevariante ist lediglich Flash 10 sowie ein Benutzerkonto bei Adobe.

Der BrowserLab Onlineservice ist kein Livetest, sondern zeigt lediglich auf Adobe-Servern erzeugte Screenshots an. Diese kann man dann nebeneinander (2-up View) oder übereinander (Onion Skin View) anzeigen lassen, wodurch eine pixelgenaue Analyse möglich wird.

Die in Dreamweaver integrierte Variante

Nutzer von Dreamweaver haben zwei Möglichkeiten, BrowserLab zu nutzen. Die erste Möglichkeit ist das Erzeugen von Screenshots aus Dreamweaver heraus, was sich in der Funktionalität nicht vom Onlineservice unterscheidet. Einen direkten Zugang hierfür finden Sie im Menü “Vorschau im Browser” oder Sie nutzen die Palette unter “Fenster/Erweiterungen”.

Die zweite Möglichkeit bietet sich an, um die Funktionsfähigkeit interaktive Zustände, wie beispielsweise Ajax oder JavaScript, austesten. Hierzu klicken Sie auf den LiveView-Button, hinter dem sich ein integrierten Webkit-Browser verbirgt. Nun berühren Sie mit der Maus das interaktive Element, wie etwa einen JavaScript Rollover-Effekt. Durch drücken der F6-Taste wird JavaScript in der Liveansicht deaktiviert und sozusagen eingefroren. Starten sie nun Browserlab, wird dieser Zustand auf die BrowserLab-Server übertragen und in den Screenshots können Sie so das Ergebnis des interaktiven Elements in unterschiedlichen Browseransichten miteinander vergleichen.

BrowserLab steht in direkter Konkurrenz zu Microsoft Expression Web SuperPreview, welches allerdings nur offline arbeitet.

Über Jens Kilgenstein

Ich bin seit über zehn Jahren im Bereich Webdesign tätig und betreue seitdem kleine und große Kunden bei der Konzeption und Umsetzung von Webprojekten. → Zum Profil

,

Ebenfalls Lesenswert:

3 Reaktionen zu Adobe BrowserLab: Vorschau für Webdesigner

  1. VasyaP 31. August 2009 at 13:38 #

    Sie können auch einen Blick darauf werfen http://www.browserseal.com

Trackbacks/Pingbacks

  1. CSS einfach erklärt » Microsoft Expression Web SuperPreview - 6. September 2009

    [...] Die jetzige Beta ist bereits sehr vielversprechend. Sollte in der finalen Version tatsächlich alle gängigen Rendering Engines zur Verfügung stehen, würde das Tool ein extrem hilfreiches Werkzeug für Webentwickler darstellen und so manchen Umweg über virtuelle Maschinen und Cross-Browser-Checks überflüssig machen. Adobe arbeitet übrigens seit einiger Zeit an einer ähnliches Software (Codename Meer Meer) namens BrowserLab. [...]

  2. Einen grafischen Entwurf pixelgenau umsetzen | CSS einfach erklärt - 14. Dezember 2009

    [...] auch wie folgt behelfen: Einige Browser-Simulationsprogramme wie Expression Web SuperPreview oder BrowserLab bieten eine überlagerte Darstellung an. In einem solchen Programm verwendet man die mit Pixel [...]

Hinterlasse eine Antwort