Dica: tirar um screenshot total de uma página com o Chrome

Falámos ontem num pequeno truque que nos pode ajudar a gerir o Instagram sem sair do computador, tudo com recurso ao Google Chrome e à fantástica ferramenta DevTools que vem com o próprio browser.

Hoje vamos mostrar como usar a DevTools do Google Chrome para fazer um screenshot completo de uma página recorrendo a uma opção muito interessante.

Visão geral do Chrome DevTools

As ferramentas de desenvolvimento do Chrome (DevTools para abreviar) são um conjunto de ferramentas de criação e depuração da Web incorporadas no Google Chrome. O DevTools oferece aos programadores web um acesso profundo aos meandros do navegador e à sua aplicação web.

Os utilizadores podem usar o DevTools para despistar problemas de layout de forma eficiente, definir pontos de interrupção de JavaScript e obter informações sobre otimização de código.

Usar de forma simples

Além de todas as imensas funcionalidades de desenvolvimento, esta ferramenta pode ajudar nas coisas simples, tão simples como tirar uma captura de um fragmento de uma página ou de uma página completa.

Começamos por invocar, com um clique com o botão direito do rato, a janela de contexto. No menu que se abre escolhemos a opção Inspecionar.

Depois de chamar a ferramenta voltamos a usar o ícone mais à esquerda, no topo da janela, que permite transformar em modelo mobile a página que estamos a ver.

Depois, para além das funcionalidades que já referimos poderem ser usadas neste modo mobile, podemos tirar uma fotografia à imagem no ecrã ou tirar uma captura total da página que estamos a inspecionar.

A ferramenta irá recolher todo o conteúdo em modo gráfico e criar um screenshot total, tal como mostramos a seguir:

Agora escusa de ter uma ferramenta de terceiros instalada para este efeito. Explore as restantes opções e boas experiências.

Leia também: