> Manuales > Talleres de diseño web

BrowserLab es un servicio online de Adobe que permite comprobar el aspecto que ofrecen las páginas web en los principales navegadores sin salir de un mismo espacio de trabajo.

Adobe dispone de varias herramientas bastante interesantes para desarrolladores y profesionales de Internet, a través de su sitio web, abiertas y gratuitas para cualquier persona interesada. En este caso vamos a comentar una utilidad que sirve para revisar el aspecto que tiene nuestra página web en varios navegadores sobre distintos sistemas operativos.

Cuantas veces habremos visto nuestra página en otro navegador o en otro sistema operativo, incluso con el mismo cliente web, y nos habrá sorprendido hasta qué punto se ve distinta de como suponíamos. El problema muchas veces es que no disponemos de los navegadores instalados en nuestro ordenador o algo todavía más habitual, que no tengamos por ejemplo un ordenador con el sistema operativo Linux o Mac OS X, con lo que es imposible ver la página en esas plataformas.

Un detalle que también es crucial es que sólo podemos tener un Internet Explorer instalado en nuestro ordenador, con lo que sólo vamos a poder probar la web en una de las versiones posibles del explorador. Algo que también ocurre ahora con Firefox, que sólo podemos tener una versión de este software instalada en el sistema.

Así pues vamos a presentar una herramienta que soluciona en parte este problema. El servicio en cuestión se llama BrowserLabs y como decimos, se encuentra a disposición de los usuarios accediendo a su página web:

http://browserlab.adobe.com

Cuando entramos a Browser Labs encontramos una página web con una interfaz parecida a lo que sería un navegador. Podemos escribir entonces cualquier dirección web y el sistema accederá por nosotros a la página para mostrarnos su aspecto.

Realmente, lo que vamos a obtener no es más que un pantallazo con el aspecto que tiene esa página abierta con cada navegador. Es decir, este sistema nos permite ver cómo renderiza una página en concreto un conjunto de navegadores, aunque no nos permitirá interactuar con la web. No obstante, esa captura de pantalla, será muy interesante para analizar cómo se vería la página en cada entorno.

Nota: Renderizar es una palabra que no existe en español, pero se encuentra ya en el vocabulario técnico de las personas. Su traducción sería interpretar, aunque podríamos decir que es el proceso por el cual se concreta un modelo expresado con un programa o lenguaje. Por ejemplo, cuando se dice renderizar una página, se refiere al proceso por el cual el navegador interpreta el código HTML, CSS, etc, para crear la pantalla que muestra al usuario dentro de su interfaz.


Al lado de la barra de direcciones encontraremos un menú que nos permitirá cambiar la vista entre los distintos navegadores que forman el estudio de BrowserLabs, que por supuesto, son los navegadores más usados actualmente en el panorama de clientes web. Además, permiten seleccionar diferentes sistemas operativos, como Windows o Mac OSX, lo que resulta todavía más interesante. Por ejemplo, podemos ver la renderización de la página por Firefox 3.0 tanto en Windows XP como del mismo navegador en OS X. En este punto cabría decir que se echa en falta algún navegador en el sistema operativo Linux.

Los navegadores que soporta BrowserLabs, al menos en el momento de escribir este artículo, son los siguientes:

Con la interfaz del programa se pueden ver incluso dos o más interpretaciones de la web al mismo tiempo y hacer zoom para ampliar o reducir las imágenes que se muestran como resultado para cada navegador, como podemos ver en la siguiente pantalla de BrowserLabs, en la que encontramos el render de DesarrolloWeb.com tanto en Explorer 6.0 de Windows XP como en Firefox 2.0 de OS X:


En definitiva, se trata de una aplicación interesante para las personas que hacemos webs, puesto que nos permite tener una vista adicional sobre nuestra página, para saber si se vería bien en distintos navegadores y sistemas operativos. No obstante, sí hay que decir que el servicio sería mucho más útil si pudiéramos interaccionar con la página, puesto que muchos de los problemas de compatibilidad no van a surgir sólo en el aspecto de la web, sino también en la programación del lado del cliente que lleva detrás. Esperemos que Adobe continúe realizando esfuerzos para mejorar la herramienta y se puedan ver en el futuro nuevas incorporaciones de navegadores, sistemas y posibilidades de test entre distintas plataformas.

Miguel Angel Alvarez

Fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Com...

Manual