Pixel Perfect: http://www.pixelperfectplugin.com/
https://addons.mozilla.org/es-ES/firefox/addon/7943

He aquí un video demostrando el funcionamiento.
http://vimeo.com/1319052

Juan Carlos Lange
Diseño Web Freelance

Originario de Santa Cruz California, Hewitt terminó por consagrarse como un exponente en la programación mundial, tras crear una aplicación de Facebook para el iPhone, como empleado de la empresa donde se desempeña actualmente.

El desarrollador se dio a conocer al crear en 2006 la primera versión de Firebug, un Add-on para el navegador web Mozilla Firefox. Los desarrolladores web de todo el mundo aplaudieron esta nueva herramienta ya que facilitaría la tarea de programar y ahorrar tiempo. Con esta aplicación, el usuario puede obtener información relevante de un sitio web proveniente de su código fuente, hojas de estilo CSS, HTML y Javascript.

Otro de sus aportes es la creación de iUi: iPhone User Interface Framework. Gracias a iUI puedes crear menús de navegación y las preciadas interfaces del iPhone en HTML estándar.

El meticuloso Joe

En la entrevista hecha por Usesthis, Joe confesó que le gustaría que Apple ampliara su oferta de táctiles a mayor escala, una especie de “gran pantalla de iPod Touch”. De seguro algo sospechaba. Después de seis meses de realizada la entrevista a Hewitt, la portadas de todos los medios especializados analizaban el nuevo producto de la manzana: el iPad.

Para sorpresa de muchos el autor de Firebug no es un usuario fiel del Firefox, Safari 4 es su opción debido a que trabaja desde OS X, que le ocasionó más de un problema con el navegador del zorro. Hewitt es usuario de Tweetie e iChat, desde su Macbook Air, que sólo utiliza para navegar y desde su casa trabaja a con un 3.2GHz 8-core de Mac Pro con dos pantallas de 30 pulgadas. Lo que no es impresionante a la hora de buscar precisión, generar videos en iMovie´09 y trabajar horas en Photoshop CS3.

Es un feliz propietario de un iPhone 3G S, en donde sus aplicaciones más utilizadas son Instapaper, QuadCamera, MLB At Bat, Pandora, Kindle, Twitterrific. Pero Joe no sólo le saca partido usándolo como un navegador móvil o como reproductor de audio, Hewitt lo utiliza como una cámara, así lo afirmó en Usesthis.com.

Además de ser reconocido por su trabajo también lo es gracias a su mascota. En su perfil de Flickr dedica un album completo a su perro Pixel.

El distanciamiento con Apple y un futuro prometedor

Según Joe, su distanciamiento de la “manzanita” se debe completamente a la política de Apple respecto a las medidas de revisión de los productos, antes de ser sacados al mercado. Al respecto Apple optó por renovar a su personal, pues desarrolladores sobran para una compañía de su tamaño y volumen de venta. En tanto, Hewitt confirmó que seguirá trabajando en nuevas versiones para mantener a Facebook en los equipos móviles.

Es difícil predecir qué hará Joe Hewitt con toda la experiencia que ha recopilado y después de su publicitada separación de los terrenos de Jobs, pero si hay algo seguro que nos refleja este destacado desarrollador es la capacidad reinventarse.

Para seguirlo hay que apuntar hacia su blog personal en JoeHewitt.com, agregarlo a twitter @joehewitt o revisar su perfil en facebook. Si quieres conocer sus aportes en cuanto a código también revisa sus aportes en Github.

Nuestra fuente: maestrosdelweb

Google Chrome ha mejorado mucho en poco tiempo y principalmente gracias a las extensiones, aunque todavía queda mucho por mejorar y faltan un gran número de extensiones que son muy populares en Firefox la verdad es que Google Chrome está mejorando muy rápidamente.

Firebug Lite para Chrome

Es una versión un poco más liviana que la de Firefox, Firebug Lite para Google Chrome es el primer paso para convertir al navegador en una herramienta más potente para programadores y diseñadores. Con ella podremos realizar las mismas acciones sobre HTML, DOM, CSS y más.

Posee integración con la barra de herramientas, opción de activar Firebug para algún dominio en particular.

Todavía Firebug Lite no dispone de algunas funcionalidades esenciales

Todavía le falta la posibilidad de leer recursos externos, el debugger de JavaScript y el Net Panel, seguramente en la próxima versión todo esto se solucione.

Descargar Firebug Lite para Google Chrome

Nuestra Fuente: TuFuncion.com

Por lo general solía utilizar otros métodos a titulo de log como ser enviar la información a un archivo utilizando error_log() o enviar la información como comentario html para luego al ver el código fuente poder analizar los resultados, etc..

Para cambiar un poco quería jugar con algo conocido y muy usado cuando trabajo con Ajax…utilizar la consola de Firebug como “log”.

Con lo anterior en la cabeza realice esta pequeña función que espero resulte de utilidad para alguien.

function smrPhp2Firebug( $element, $titulo="" ) {
echo "<script language=\"javascript1.1\" type=\"text/javascript\">\r\n";
echo "if ( typeof loadFirebugConsole == 'function' ) {\r\n";
if ( $titulo!="") {
echo sprintf( "console.log(%s);\r\n", json_encode($titulo ) ) ;
}
echo sprintf( "console.log(%s)\r\n", json_encode($element ) ) ;
echo "}\r\n";
echo "</script>\r\n";
}

La función ya forma parte de mi archivo de rutinas (rutinas.inc.php) y nos permitirá enviar el contenido deseado a la consola de Firebug con una descripción si lo desean.

Si te preguntas para que me serviría esto? Pues piensa en poder saber cómo está siendo armada tú consulta SQL ante los parámetros que recibe…. ó el contenido de una matriz… ó qué valor tiene una variable en determinado momento… ó como está la variable esa que contiene el mensaje que estoy a punto de enviar por correo electrónico… o tantas cosas más…

La forma de uso es sencilla puedes probar ejecutando este pequeño ejemplo:

<?php
#-=[ Incluir la libreria de rutinas ]=-
require_once("rutinas.inc.php");
#-=[ Genero una matriz de 1 dimensión ]=-
$frutas=array("manzana", "pera", "naranja", "kiwi", "mandarina", "mango");
#-=[ Genero una matriz asociativa ]=-
$comunidades=array( "Andalucía" => array("Huelva", "Sevilla", "Córdoba", "Jaén", "Cádiz", "Málaga", "Granada", "Almería")
,"Cataluña" => array("LLeida", "Tarragona", "Barcelona", "Girona")
);
#-=[ Leer Variable que llega por GET lipiando su contenido ]=-
$nombre=smrLimpiarVariables("GET","nombre","0");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Enviando contenido desde PHP a la consola de Firebug</title>
</head>

<body>
<a href="http://www.adobe-user-group-granada.es">Adobe User Group Granada</a>
<?php
smrPhp2Firebug($frutas, "Matriz de Frutas"); // Muestra de contenido con un título
smrPhp2Firebug($comunidades); // Muestra de contenido sin título
smrPhp2Firebug($nombre, "Variable ingresada por GET");
?>
</body>
</html>

Al ejecutarlo podrán ver en la consola del Firebug algo como la pantalla siguiente (clic en la miniatura para ampliarla):

y si pulsamos cobre el Object podremos expandir su contenido como muestra la siguiente pantalla (clic en la miniatura para ampliarla)

* Recuerda hacer las llamadas a smrPhp2Firebug() dentro de tu etiqueta body. Ya sabrás porque

Es importante que les comente que luego de hacer esto se me ocurrió ver si la rueda no estaba inventada. Obviamente debería haberlo hecho antes pero bueno la función tampoco es que tenga mucha tarea . Al investigar un poco encontré que en la red tenemos algunos post de utilidad con respecto al aprovechamiento de FireBug como ser estos:

• 10 buenas razones para usar Firebug
• FirePHP: Ampliación de Firebug para debug de código PHP
• Cómo utilizar el código PHP de FirePHP para mostrar mensajes de debug, que podremos visualizar en la consola de Firebug.
• Joe Hewitt nos demuestra cómo usar Firebug

Así que como siempre digo… Sobre gustos pero bueno lo importante es que le saquemos el mayor provecho a esta herramienta llamada FireBug. Que no tienes idea de donde bajarlo pues de aquí: http://getfirebug.com/

Ah y el ejemplo queda aquí por si quereís verlo… recuerda tener el Firebug activo!