Qué son los bookmarklets y cómo usarlos

Los bookmarklets son atajos para realizar determinadas acciones o tareas que el navegador o la página web que estás visitando no permite o tiene ocultas.

En concreto, son pequeños bloques de código JavaScript que, guardado como marcador o favorito del navegador, al pulsar en él se activa determinada acción, como cambiar el aspecto de una página, extraer determinados datos de un sitio web, ocultar elementos molestos o realizar una búsqueda directa.

Concepto utilizado aproximadamente en 1998, el concepto de bookmarklet surgió a raíz de la guía JavaScript de Netscape. Usando estas piezas de código JavaScript se podían hacer cosas que el navegador no ofrecía desde los menús de funciones.

Pongamos un ejemplo: llegamos a una web cuyo diseñador ha decidido recurrir a JavaScript para evitar que podamos hacer uso del menú contextual y/o de la opción de seleccionar texto; una herramienta disuasoria burda pero aún muy usada.

Pues bien, yendo a la barra de marcadores del navegador y haciendo clic en nuestro bookmarklet de ‘Volver a seleccionar texto’ alteraremos el código de la web y, con él, su funcionamiento.

El código que nos permitirá hacer eso es el siguiente (puede ser difícil de ‘leer’ por su falta de identación, pero así es como se almacena):

javascript:(function() { function R(a){ona = “on”+a; if(window.addEventListener) window.addEventListener(a, function (e) { for(var n=e.originalTarget; n; n=n.parentNode) n[ona]=null; }, true); window[ona]=null; document[ona]=null; if(document.body) document.body[ona]=null; } R(“click”); R(“mousedown”); R(“mouseup”); R(“selectstart”); })()

Esta estructura “javascript:(function(){FUNCIÓN})()” se mantiene siempre en los bookmarklet, y nos marca la pauta para crear los nuestros propios a poco que nos defendamos con el JavaScript.

Quizá te estés preguntando “¿cómo se ‘instalan’?”. Normalmente, encontraremos los bookmarklets en la forma de un hipervínculo cualquiera, por lo que bastará con arrastrar el enlace en cuestión a la barra de marcadores de nuestro navegador.

Prueba a hacerlo con los siguientes:

Bookmarklets útiles para tu productividad web

  • Restaurar selección de texto: [Activar selección de texto]
    Restaurar clic con el botón derecho: [Activar clic derecho]
  • Editar la web: ¿Quieres poder alterar el texto de una página web como si estuvieras escribiendo en MS Word? Pues esto es lo que estás buscando. [Edita la web]
  • Búsqueda de segunda opinión: Si estás viendo la página de resultados de Google o de Bing, pero no te convencen los resultados, puedes usar este bookmarklet para abrir una nueva página de búsquedas en otro buscador. Concretamente, en este ejemplo, del nuevo buscador de Brave. [Buscar también en Brave]

  • Diferenciar enlaces por tipo: Un clic en este bookmarklet y todos los enlaces de la web que estás visualizando adquirirán un determinado color de fondo según si son enlacen internos (rojo, por defecto), externos (azul) o si están actualmente abiertos (naranja). Una pequeña (e intuitiva) edición del código nos permitirá personalizar dicho código de colores. [Diferenciar enlace]
  • The Printliminator: Este bookmarklet está pensado facilitar la tarea de imprimir una página web… ayudándonos en el proceso de ir borrando a golpe de clic elementos de la misma que no queramos ver impresos; para ello, desplegará una ventana superpuesta dentro de la pestaña del navegador. También disponible como extensión. [Prepara esta web para imprimir]
  • Generador de contraseñas: Si no usas un gestor de contraseñas, puedes recurrir a este ingenioso bookmarklet que encripta el dominio de la web que estemos usando una ‘contraseña maestra’ que nosotros mismos le proporcionaremos. Cada vez que volvamos a usarlo en la misma web, nos devolverá la misma contraseña. [Generar contraseña]
  • Wappalyzer: Este bookmarklet (también disponible como extensión del navegador) nos muestra información sobre qué tecnologías web se han utilizado en la creación del sitio en cuestión (base de datos, gestor de contenidos, bibliotecas JS, sistema de analítica, plataforma de publicidad online, etc). [Ver tecnologías web].

Queremos seguir creando cursos gratuitos en nuestro canal de YouTube. Solo te pedimos tu ayuda para crecer más. Suscríbete por favor. (Cursos, talleres y charlas gratis para ti).

Ernesto Mota
Nací en el d.f., sigo siendo defeño, hoy radico en la hermosa ciudad de Cuernavaca, Morelos, soy Ing. en Sistemas computacionales, con un posgrado en Tecnologías de información, Doctorando en ambientes virtuales de aprendizaje y realidad aumentada, Tecnólogo es mi categoría laboral, y mi linea de investigación es la realidad aumentada aplicada a nuevos entornos de aprendizaje.

Últimos artículos

a

Publicasciones relaciodadas