Herramientas desarrollo web Chrome y Firefox

Firefox_Fig_1

Objetivo: Identificar herramientas que se integren en el navegador web que permitan revisar el código fuente, etc…

Firebug

Firebug es una extensión de Firefox creada y diseñada especialmente para desarrolladores y programadores web. Es un paquete de utilidades con el que se puede analizar (revisar velocidad de carga, estructura DOM), editar, monitorizar y depurar el código fuente, CSS, HTML y JavaScript de una página web de manera instantánea e inline.

Firebug no es un simple inspector como DOM Inspector, además edita y permite guardar los cambios, un paso por delante del conocido Web Developer. Su atractiva e intuitiva interfaz, con solapas específicas para el análisis de cada tipo de elemento (consola, HTML, CSS, Script, DOM y red), permite al usuario un manejo fácil y rápido. Firebug está encapsulado en forma de plug-in o complemento de Mozilla, es Open Source, libre y de distribución gratuita.

Colorzilla

ColorZilla es una extensión de Mozilla Firefox que puede servir de ayuda a los diseñadores y desarrolladores de páginas web, ofreciéndoles una serie de herramientas relacionadas con la gestión del color.

Tendrás a tu disposición un seleccionador de color capaz de copiar y pegar el tono situado por debajo de tu cursor en varios códigos (RGB, Hex, etc.), un cursor especial que muestra en todo momento el código del color seleccionado y una utilidad de lupa co la que aumentar tu página hasta en un 1.000%.

Puedes acceder a todas sus funciones desde un icono situado en la parte inferior de derecha del navegador, y cuando no lo uses, puedes ocultarlo fácilmente.

CHROME-DEVELOPER TOOLS

Inspirada en el Firebug de Firefox, nos brinda las mismas posibilidades para trabajar con el árbol DOM del cliente, en caliente, añade features propias y, además, trae una serie de características muy interesantes para comenzar a trabajar con html5.

Color picker: El analisis del perfecto gotero de color para Google Chrome

Anuncios

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s