LibrosWeb.es

Si te dedicas profesionalmente al diseño de páginas y aplicaciones web, seguramente tu navegador preferido para trabajar es Firefox. Si no lo conoces, puedes descargar gratuitamente Firefox desde su sitio web oficial: http://www.mozilla.com/firefox

Las principales ventajas de Firefox desde el punto de vista del diseñador y creador de páginas web es que respeta los estándares del W3C mucho más que los navegadores de la familia Internet Explorer. Además, permite instalar pequeños añadidos, llamados extensiones, que añaden funcionalidades al navegador.

Una extensión se puede considerar como un pequeño programa que se instala dentro del navegador y que añade alguna característica interesante que el navegador no incorpora de serie. Lo mejor de las extensiones de Firefox es que existen cientos de extensiones, prácticamente todas son gratuitas y casi todas son realmente útiles.

El sitio web de Firefox incluye una sección especial llamada "Complementos" en la que se puede encontrar el listado completo de extensiones disponibles para Firefox. A continuación se muestra una pequeña selección de algunas de las extensiones más interesantes para los diseñadores de páginas web.

Firebug es la extensión más útil y completa de todas las que están relacionadas con el diseño web. No importa si tu especialidad es XHTML, CSS, JavaScript, DOM o AJAX, ya que Firebug proporciona toda la información posible sobre cada uno de estos temas.

Como Firebug tiene tantas opciones, sería necesario un libro entero para explicar sus posibilidades. Por ello, lo mejor es que instales la extensión y la pruebes en tus proyectos web.

Figura 14.1. Extensión Firebug para Firefox

Probablemente, después de varios meses de uso de Firebug, seguirás descubriendo nuevas opciones muy útiles y seguirás agradeciendo a su creador las horas de trabajo que te ha ahorrado.

Antes de que existiera Firebug, la extensión Web Developer era la más útil para los diseñadores web. Se trata de una barra que se instala junto con el resto de herramientas del navegador y que básicamente se puede utilizar para obtener información sobre la página:

Figura 14.2. Extensión Web Developer para Firefox

Además de proporcionar información, la extensión Web Developer incluye utilidades que Firebug todavía no incorpora, como la redimensión de la ventana del navegador a las dimensiones más utilizadas, recuadrar todos los elementos de un determinado tipo (celdas de tabla, divs, etc.), mostrar una lupa, una regla redimensionable, mostrar los elementos de tipo hidden, mostrar la ruta de cada imagen, etc.

Una buena práctica, y un requisito impuesto por muchos clientes, es que las páginas XHTML creadas sean válidas y por tanto, pasen el validador de HTML y de CSS disponible en el W3C. Para facilitar la validación de las páginas, la extensión HTML Validator indica en todo momento los errores y las recomendaciones sobre el código HTML de la página que muestra el navegador.

Figura 14.3. Extensión HTML Validator para Firefox

Figura 14.4. Extensión HTML Validator para Firefox

• ColorZilla: permite obtener el color de cualquier elemento de la página mediante una herramienta similar a la de los programas de diseño gráfico.
• MeasureIt: permite medir la altura y anchura de cualquier elemento de la página.
• View Source With: permite elegir el programa o editor con el que se muestra el código fuente de la página y los archivos CSS y JavaScript.
• Screengrab: permite guardar una página entera como una imagen. Los pantallazos ("screenshots") también se pueden realizar de una parte concreta de la página o de los contenidos visibles en la ventana del navegador.
• IE Tab: permite visualizar con Internet Explorer cualquier página cargada en Firefox. La integración con Internet Explorer es total, ya que ni siquiera hace falta abrir ese navegador.