10 Complementos de Firefox Para Diseñadores Web

Los siguientes son 10 complementos que puedes instalar en tu Firefox para ayudarte con el diseño web:


1. Web Developer


image

El complemento Web Developer es una gran suite de herramientas de diseño web con muchas funciones útiles que ayudarán a realizar las tareas de diseño web más eficiente. Por defecto al instalarle, aparece como una barra de herramientas en la parte superior del navegador, presentándote varios menús como CSS, Resize y Cookies.

Cuando necesitas inspeccionar el CSS de página, descubrir información acerca de una página web (tal como ver todos los atributos “alt” de las imágenes en la página), rápidamente validad un diseño que cumpla con las especificaciones para W3C o medir elementos de diseño, Web Developer será una gran herramienta muy conveniente para ti.


2. Firebug


image

Firebug es un complemento para diseño web de Firefox tan popular que ya hay complementos para él. Y seguramente cualquier diseñador puede sentirse a gusto con Firebug.

Firebug es un complemento “open source” que nos da herramientas de diseño web muy poderosas para inspeccionar y depurar un diseño web. Puede ayudar a averiguar que estilos CSS afectan ciertos elemtnos, en caso tengas un estilo CSS que parece no estar funcionando correctamente, inspeccionar el modelo de objetos de documento DOM para aprender la estructura de la página web, determinar atributos tales como color, ancho, altura y mucho más.

Firebug es algo complicada y demora aprender a utilizarla, pero vale el tiempo, asi que es recomendable leer la documentación antes de todo.


3. MeasureIt


image

Este complemento de Firefox tiene un simple propósito: darte una regla que puedes utilizar en cualquier página web para medir cualquier elementos. Desde que el diseño web necesita medidas exactas es una herramienta valiosa para tu colección de complementos de Firefox.


4. ColorZilla


image

Una cosa con la que lidian frecuentemente los diseñadores web es color. Este complemento incluye un selector de color parecido al que vemos en Photoshop y una herramienta cuentagotas para identificar los colores de una página web.


5. CSS Usage


image

CSS Usage es una extensión para Firefox que requiere tener instalado Firebug ya que es un complemento para éste, que descubre estilos CSS no utilizados. Trabaj identificando las CSS que usas y las que no, señalando las innecesarias para mantener tus archivos CSS tan ligeras posible.


6. Page Speed


image

La velocidad de un sitio web es importante para la usabilidad y la experiencia del usuario. Los usuarios odian los sitios web lentos, así que debes diseñar sitios web rápidos.

Page Speed es una extensión para Firefox y para Chrome, desarrollada por Google que analiza una página web y dice cuales cosas se pueden mejorar para aumentar la velocidad del sitio. Es una herramienta para probar la habilidad del diseño web para renderizar rápido.


7. HTML Validator


image

Este complemento de Firefox ayudará a que te asegures que estás escribiendo un correcto código HTML.


8. IE Tab 2


image

Un diseñador web siempre está preocupado acerca de la compatibilidad de su diseño con varios navegadores, IE Tab 2 es un complemento de Firefox que permite ver cualquier página en Internet Explorer, sin dejar Firefox, todo lo que tienes uq ehacer es elegir “View Page in IE Tab” en el menú contextual.


9. Screengrab


image

Tomar caputras de pantalla en el navegador es una tarea común para diseñadores web. Screengrab es una herrmaienta simple para tomar capturas de pantalla totales o parciales, puedes copiar al portapapeles o guardarlo en el disco como un archivo de imagen.


10. SEO Doctor


image

La optimización para los motores de búsqueda debería empezar en la fase de diseño cuando el HTML del sitio está en pañales, y SEO Doctor es una herramienta conveniente para revisar el SEO de cualquier página web.

SEO Doctor te da un puntaje entre 0 a 100% y resalta áreas en la página web que puede estar optimizada para los motores de búsqueda. Una característica útiles poder exportar los datos a hojas de cálculo para un análisis posterior o archivo.

0 comentarios: