Wappalyzer: extensión Firefox para saber que herramientas usa una web

ByLuis

Wappalyzer es una extensión para Firefox que nos muestra que herramientas usa una web. Nos indica entre otras cosas qué CMS, Javascript framework, wiki, sistema de estadísticas, …
Entre otras herramientas detecta el uso de: Google Analytics, jQuery, Mootools, WordPress, Blogger, Joomla, Drupal, mediaWiki, phpBB, …
Wappalizer
Vía / Woork

Similar Posts

Firebug 1.0, lo que nos va a ofrecer

ByLuis

firebug1.0.pngYa en otras ocasiones hemos hablado de Firebug, y esta vez no puede ser menos debido a todo lo que nos va a ofrecer la versión 1.0, lo cual es mucho:

  • Usabilidad: posibilidad de abrirlo en una ventana nueva, pudiendo situarla en un segundo monitor. Listas de páginas en las que queremos que esté activo o no Firebug. Tecla de acceso directo para abrir Firebug de forma normal o en una ventana nueva. Facilidad de lectura ya que se puede aumentar o disminuir el tamaño de la letra.
  • Código HTML: visor de código fuente de forma estructurada, con posibilidad de desplegar etiquetas. Ver qué es lo que se está modificando en la página web. Editar el código HTML en el momento. Encontrar elementos HTML en el código posicionándonos en ellos con el ratón. Busquedas. Si se modifica la página y se recarga, Firebug seguirá apuntando al elemento que teníamos antes de la recarga. Copiar el código HTML al portapapeles.
  • CSS: Inspección en cascada. Previsualización de colores e imágenes. Facilidad para ajustar los estilos mediante la edición de las propiedades. Autocompletado. Modificar los valores numéricos aumentando y disminuyendo los valores usando las flechas de cursor. Selección de valores posibles de los estilos. Posibilidad de desactivar propiedades en los estilos para ver las diferencias. Inspeccionar cualquier hoja de estilos. Copiar al portapapeles colores y rutas de imágenes.
  • Visualización de CSS: Se puede ver el modelo de caja de los elementos HTML. De igual manera, se puede visualizar las medidas de la caja del elemento. Uso de reglas y guías como si se tratara de un programa de diseño gráfico. Modificación de las medidas de las cajas en el acto.
  • Monitor de red: Toma los tiempos de carga de del fichero y de los ficheros adjuntos. Separar los tiempos por tipo de fichero. Distinción entre ficheros de la caché y los que se han descargado de la red. Visualizador de la cabecera HTTP. Monito de las peticiones XMLHTTPRequest.
  • Debug: Permite encontrar ficheros js de forma sencilla. Poner puntos de interrupción en nuestro código. Incluir condiciones en los puntos de interrupción. Ejecución paso a paso. Parar automaticamente la ejecución si encuentra un error. Cuando se produce un error existe la posibilidad de ver la pila de llamdas a funciones que esperan respuesta. Visor de los valores de los objetos y de las propiedades. Uso de tooltips cuando está parada la ejecución del script para ver el valor de las variables. Medición de tiempos de ejecución. Logs de las llamadas a funciones. Acceso rápido a números de línea.
  • Búsqueda de errores: Los errores se muestran en la barra de estado del navegador. Visualización de los errores javascript solo de la página a la que se accede. Información descriptiva de los errores. Acceso fácil al debugger. Búsquedas rápidas. Filtro por tipo de errores.
  • Inspector DOM: Diferenciación entre código estándar y el creado mediante Javascript. Resumen informativo de los objetos inspeccionados. Edición de los objetos con posibilidad de autocompletado. Al recargar la página accede al mismo objeto que estaba seleccionado anteriormente. Navegación por el código Javascript.
  • Ejecución de código Javascript: consola para ejecución de código javascript. Autocompletado. El texto de la consola no es tratado como texto plano sino como hipertexto.
  • Trazas: posibilidad de mostrar trazas en la consola desde Javascript. Las trazas pueden ser de texto, objetos y texto formateado usando variables. Distintos colores para distintos tipos de logs (error, warm, debug e info). Marcas de tiempo. Stack traces. Agrupación de trazas. Inspección de objetos.

Estoy deseando que salga la beta para poder probarla.

Firebug

Vía / Ajaxian

Extension Developer’s Extension: crea extensiones en Firefox

ByLuis

Más claro el nombre no lo puede decir, se trata de una extensión para Firefox que nos facilita la creación de extensiones para Mozilla/Firefox.

  • Entre sus características tenemos:

  • Editor del fichero install.rdf.
  • Shell de Javascript que nos permite experimentar también con XPCOM.
  • Entorno de desarrollo de Javascript, que al igual que la shell tiene privilegios para el chrome.
  • Editor XUL que nos permite modificar XUL en tiempo real.
  • Editor en tiempo real de HTML.
  • JRX, editor en tiempo real de expresiones regulares en Javascript.
  • Interactive XPath Tester, nos permite testear XPath contra un documento XML.
  • Modificar preferencias de debugging.
  • Recargar todos los chrome sin reiniciar, esta es genial ya que es un horror tener que reinciar el Firefox cada vez que quieres hacer pruebas, sobre todo si tienes que poner usuarios/contraseñas de proxys o extensiones cada vez que reinicias.

Extension Developer’s Extension

Vía / dzone

Desarrolladores de Firefox 3 definen una lista preliminar de características

ByLuis

En un reciente encuentro los desarrolladores de Firefox 3, han definido una lista preliminar de requisitos para este programa:

De la lista de requisitos obligatorios destacan:

  • Mejoras en la interacción con las extensiones: un lenguaje más coherente, menos pasos para la instalación, más vías para configurarlos, más alertas cuando haya actualizaciones y un botón permanente para reiniciar Firefox.
  • Soporte para favoritos externos, favoritos y anotación de históricos. ¿Podremos gestionar directamente nuestros enlaces en Delicious o similar?
  • Los archivos o ficheros se podrán abrir con servicios webs; es decir, podríamos hacer cosas como que al hacer click sobre un fichero se habra con Google Documents o aplicaciones web de este tipo.
  • Mejora del soporte para impresión para prevenir cortes en los párrafos de texto.
  • Algo que parece bastante solicitado es un instalador MSI que sería muy valorado por los administradores de sistemas a la hora de actualizar Firefox.
  • Soporte para Microsoft CardSpace y OpenID.
  • El actual sistema de informe de errores, TalkBack, se sustituirá por el sistema de código abierto de Google: airbag.

Entre los requisitos altamente deseables:

  • Sistema de navegación privado. Posiblemente sin caché, historial o guardado de datos de formularios y claves.
  • Guardar páginas en PDF, esto además combinado con el historial.
  • Soporte para pausar y retomar descargas entre sesiones.
  • Ayuda únicamente online. Personalmente no sé quién y por qué quiere eso.
  • Soporte para microformatos .

Otras cosas que serían interesantes:

  • Unificar historial y marcadores
  • Soporte para los controles principales de Windows Vista.
  • Agrupación de pestañas y expose (algo parecido a lo que hace esta extensión).
  • Windows Group Policy.
  • Permitir instalar extensiones sin reiniciar. Esto no se yo si lo harán, pero si que es interesante.
  • Interfaz más intuitivo y manejable para gestionar las descargas.

Vía / Mozillalinks

Más información

|

Modifica dónde guardar los marcadores de Firefox

ByLuis

firefox.pngHoy me he encontrado con que apagué mal el ordenador ayer, y cuando he ido a poner el Firefox… [tachaaan]… no tenía los marcadores. ¡Socorro!, todos los feeds que tengo con el Sage perdidos. Aunque he podido recuperarlos, y aún no sé cómo, lo que sí he querido hacer es guardar los marcadores en otro directorio, en el cual se hacen copias de seguridad.

El método es sencillo:

  • Cierra Firefox
  • Copia o mueve el archivo bookmarks.html y el bookmarks.bak que se hayan en el profile en el directorio nuevo
  • Escribe about:config en la barra de dirección de Firefox
  • Haz click con el botón derecho del ratón, pulsa en Nuevo->Cadena
  • Escribe como nombre de la preferencia: browser.bookmarks.file
  • Escribe el path completo del archivo bookmarks.html (incluido el nombre del archivo)

Listo, ya tenemos cambiada la localización de los marcadores.

Customize the Firefox Bookmarks location

|

FireMarker: cómo crear una extensión para Firefox

ByLuis

firemarker.pngSi el otro día os hablaba de FireMarker, la extensión de Firefox para marcar texto en una página, hoy voy a intentar explicar cómo la desarrollé y así conseguir que otras personas no se encuentren con las mismas dificultades que yo.

Vamos a ir paso a paso, explicando la estructura, los distintos ficheros y sus contenidos, siempre dentro de mi limitado conocimiento, ya que lo que he aprendido ha sido destripando otras extensiones y mirando la documentación que hay sobre XUL.

Read More “FireMarker: cómo crear una extensión para Firefox”

|

View Source Chart: extensión de Firefox para el código HTML

ByLuis

Gracias a Hugo y a otro amigo anónimo vía formulario de contacto, nos ha llegado esta extensión, que si bien podía llevar mucho tiempo, yo desconocía.

Se trata de View Source Chart, una extensión que nos devuelve el código HTML que se genera después de las modificaciones que hace el javascript del DOM.

viewcodechart.png
Por ejemplo, escribimos el siguiente código HTML:

document.write("Hola Mundo");

Nos mostrará el siguiente código HTML:

<script>
...
</script>
Hola Mundo

Muy útil para ver el código real que nos muestra el navegador, y no tener que ir destripando el javascript para saber que saca.

View Source Chart