Los bookmarklets son pequeñas aplicaciones Javascript contenidas dentro de una URL en una página web, de la siguiente forma:
<a href="javascript:function(laQueSea){};">Bookmarklet La Que Sea</a>
La idea es que sean ejecutada mediante el click del enlace, y lo que usualmente se usa es guardarlos mediante bookmarks en tu browser; así puedes tenerlos a mano siempre que los necesites.
Como están escritas en Javascript, puedes hacer modificaciones a cualquier elemento de DOM dentro de la página: cambiar tamaño de fuentes, colores, extraer datos de la página (links, imágenes, texto), enviar datos para validación o traducción entre muchas otras cosas.
Personalmente me son bastante útiles al momento de desarrollas mis proyectos web; tengo algunos de frecuente uso y quisiera compartirlos por si ayudan a más de alguno en los excelentes trabajos que seguro hacen. Para utilizarlos, lo mejor es hacer click en el enlace y arrastrarlo a tu barra de Bookmarks como se ejemplifica en la siguiente imagen:
XRay click y arrastra
Permite visualizar las propiedades DOM del elemento al seleccionarlos: selector, ID, CLASS, herencia y estilos CSS asociados.
Design click y arrastra
Permite visualizar la grilla utilizada en la construcción de la página, medidas y alineamiento entre otras cualidades.
800×600 1024×768 1280×1024 1600×1200 click y arrastra cada uno
Modifica el tamaño de la ventana de tu browser a alguna de esas medidas estándar.
MRI click y arrastra
Muestra y enmarca cualquier selector que queramos ver de una página web.
WTFramework click y arrastra
Muestra qué framework de Javascript se está utilizando en el sitio.
Microformats click y arrastra
Muestra cuáles microformatos están siendo utilizados en determinada página.
Y por último, mi favorito:
ReCSS click y arrastra
Recarga sólo las hojas de estilos llamadas desde la página, sin tener que volver a cargar todo el HTML para visualizar cambios.
Comentarios
Aqui teneis otro para compartir directamente desde Google Reader a Delicious, Facebook, Meneame
http://0x564242.me/2009/01/12/fbreader-compartir-desde-google-reader/
Utilísimos, sobretodo el ReCSS.
Saludos!
Solo queria aclarar q aunq el titulo dice ‘Mis…’ no soy autor de ninguno; solo los he recopilado de horas de navegacion por la web.
Disfrutenlos!
Geniales 🙂
Muchas de estas cosas las hago con extensiones de Firefox y la verdad es que resulta muy refrescante conocerlas en javascript ya que nos da libertad para desarrollar con diferentes navegadores. Gracias por compartirlo.
Excelente, ya usaba el xray, pero muy bueno tener estos otros… estoy deacuerdo con «Jaime M-F», el de ReCSS me cae como «anillo al dedo»
Muchísimas gracias, no sé si las usaré mucho o poco, pero me ha encantado el concepto de varias.
Un saludo
buen aporte, el de wtf no muestra correctamente el jquery 1.3x… muy buenos.!!!
saludos