O que são Bookmarklets?
Os bookmarklets são pequenos scripts de código Javascript, armazenados como bookmarks tradicionais e que permitem facilitar a realização de pequenas tarefas nos websites que visitamos.
Por serem baseados em bookmarks são fáceis de adicionar e de gerir. Podem igualmente ser sincronizados entre vários computadores e não necessitam de ser instalados.
Porque são úteis?
Os bookmarklets permitem interagir com a página que está a ser consultada, seja para facilitar a extração de informação, alterar estilos ou a estrutura da página ou qualquer outro tipo de finalidade que possa ser útil.
O código javascript permite aceder a toda a estrutura e conteúdo da página o que significa que toda a informação que está presente naquele momento no browser pode ser usada e manipulada programaticamente.
Qualquer alteração que seja feita desta forma não é persistente e desaparece assim que a página for recarregada. Como os bookmarklets não produzem alterações permanentes, será necessária repetir sua execução sempre que a página for (re)carregada.
Porque não criar um plugin?
Cada browser possui o seu próprio sistema de plugins, obedecendo a um conjunto de regras e procedimentos específicos. O que significa que um plugin criado para um browser provavelmente não irá funcionar noutro sem algum tipo de adaptação.
Se, por exemplo, pretendermos trocar a cor de um texto ou aumentar o seu tamanho para melhorar a legibilidade, podemos fazê-lo facilmente com recurso a um bookmarklet, evitando a complexidade da criação de um plugin.
Infelizmente a utilização de bookmarklets tem caido em desuso com o crescente investimento no suporte de plugins por parte dos browsers. As "lojas" integradas permitem facilitar a divulgação e exploração de novos plugins, tornando-os mais atractivo tanto para os utilizadores, como também para as empresas e profissionais que pretendem criar produtos digitais ou ferramentas integradoras com os seus serviços e plataformas.
No entanto este formato, apesar de menos atrativo para uma audiência mais abrangente, apresenta argumentos muito fortes pela sua simplicidade, facilidade de criação e de distribuição.
Um outro aspecto positivo dos bookmarklets é que não influenciam nem sobrecarregam o browser, pois apenas são carregados e executados no momento em que são utilizados.
Alguns exemplos de utilização
Um bookmarklet tanto pode ser criado com um propósito abrangente, com vista a funcionar num grande número de websites, como pode ser criado para resolver um problema particular num website específico.
Melhorar a legibilidade ou usabilidade
- Melhorar a legibilidade através da alteração do layout, da remoção de elementos não essenciais ou dos estilos e fontes utilizados;
- Visualizar imagens numa dimensão diferente da original;
- Organizar a informação de uma forma personalizada;
- Interagir com outros serviços online - motores de pesquisa, redes sociais, tradutores.
Apoio ao desenvolvimento
- Realização de testes, simulando uma ou mais ações do utilizador;
- Preenchimento automático de formulários com valores pré-definidos;
- Validar a presença (ou ausência) de informação;
- Forçar estados ou pré-configurações;
- Simular testes de carga.
Extração de informação
- Facilitar a pesquisa e obtenção de informação como endereços de e-mail, moradas ou contactos telefónicos;
- Extracção de textos, pdfs, imagens, links ou outro tipo de conteúdos.
Como adicionar um bookmarlet?
A forma mais fácil é arrastar um bookmarklet presente numa página para a barra de favoritos.
Para usar, basta estar navegar para página onde se pretende executar o código e clicar sobre o bookmarklet.
Como criar um bookmarklet
Para criar um bookmarklet devem apenas ser cumpridos os seguintes requisitos:
- iniciar com o termo
javascript:
; - estar formatado em linha;
- conter código javascript válido.
javascript:(function(){alert("O website "+document.location.hostname+" é 👍!");})()
Este bookmarklet pode facilmente ser partilhado e adicionado aos favoritos de um qualquer browser. Apesar de não realizar qualquer tarefa útil, serve o propósito de demonstrar que pode funcionar em qualquer browser e tirar partido do contexto em que se encontra para a execução de uma tarefa.
Alguns exemplos
Modificar o texto de qualquer página
O seguinte bookmarklet permite modificar o texto de qualquer página. Para testar nesta página basta carregar no link e de seguida posicionar o cursor do rato em qualquer parte do texto para começar a modificar o seu conteúdo.
Para adicionar, basta arrastar o link para a barra de Bookmarks e usar na página pretendida - consultar "Como adicionar um bookmarlet?"
Código fonte:
javascript: (function(){document.body.contentEditable = 'true';document.designMode = 'on';}
Para usar num qualquer outro website, basta copiar o seguinte link para os favoritos do browser e executar sobre o website pretendido.
A linha de código javascript usado no link anterior pode também ser copiada e inserida directamente na barra de endereços do browser, para alcançar o mesmo efeito.
Outros recursos úteis
- https://www.reddit.com/r/bookmarklets
- https://codepen.io/bookmarklets/pen/NobJbq
- https://www.thetechbasket.com/most-useful-bookmarklets
A Braus é uma empresa de engenharia de software, especializada no desenvolvimento de aplicações para a web.
Tiramos partido das mais recentes tecnologias web para a criação de produtos digitais orientados ao negócio. Criamos websites e web apps à medida.
Acompanhe as nossas redes sociais ou envie-nos uma mensagem.