Executando verificação de segurança...
7
nelsonmatenda
2 min de leitura ·

Como Fazer Scrolling Screenshot de um Site Sem Extensão‼ (test article)

Este é um artigo para testar a ferramenta(tabnews). Mas como o foco da tabnews é agregar valores reais para o pessoal, então aqui vai um pequeno tutorial que acredito que pouca gente saiba.

Scrolling Screenshot

Vamos aprender a fazer captura completa de um site sem o uso de uma extensão.

um pequeno tutorial de como fazer scrolling screenshot de um site

  1. Com o site aberto, abra o devtool do navegador(F12 no Chrome);
  2. Com o devtool aberto em Customiza(...) selecione a opção Run Command ou Ctrl+Shift+P;
  3. Escreva pelo comando screenshot, aparecerão comandos acessíveis e seleciona "Capture full size screenshot"

Será gerado um png para o download.
Está tudo prontinho.

Tenho mais uma dica MANEIRA para lhe dar, me segue lá no twitter @nelsonmatenda e vamos compartilhar mais ideias e evoluir juntos.

⚠ Dependendo do tamanho do site ele pode não entregar o site por completo, mas na maior parte dos casos ele não deixa a desejar.

Exemplo:
scrolling screenshot de um artigo do site sumo.com

Carregando publicação patrocinada...
2
2
hamiltoncampos

É uma ótima opção mesmo, mas tem um problema: a depender do tamanho da página ela não dá screenshot por inteiro até o fim.

Venho recomendar o plugin para GoogLe Crome chamado GoFullPage que faz o scrool de cada sessão e tira print, dando o resultado para você baixar em .PNG ou .PDF.

E para utilizar em bem fácil:

1 - Depois de instalado clicka no icon de câmera e ele já vai começar a fazer os prints

GoFullPage Exemplo

2 - Assim que finalizar ele vai dar o resultado e várias opções para download.

GoFullPage Exemplo Resultado

Espero que ajude a galera que está tentando tirar prints de páginas gigantescas!

1
nelsonmatenda
Autor
Autor

infelizmente tem essa limitação sim, mas em maior parte dos caso ela consegue entregar tudinho e realmente para mais eficiência um extension ajudaria muito.

1
1
ricardosaul

Que dica show! Uso uma extensão para isso, acaba que fica com um click. Mas pode acontecer de usar o PC de outra pessoa e esse comando vir a calhar! Parabéns!

1
filipedeschamps

nelsonmatenda sensacional meu caro! Vou começar a usar mais essa técnica para mostrar prints nos meus vídeos 🤝

Em paralelo, você conhece alguma forma de fazer a página navegar para baixo de forma natural? Muitas vezes eu filmo a tela comigo navegando para baixo de forma bem devagar (manualmente), e seria show encontrar uma forma fácil de fazer esse scroll automatizado.

3
MarceloSantana

Quando eu quero descer a página assim, eu aperto a roda do mouse e movo o mouse pra baixo na velocidade que quero que a página role e ai ele move a página automaticamente.
texto

2
2
nelsonmatenda
Autor
Autor

filipedeschamps para automatizar o scroll acredito que precisaria rodar alguns codigos, não conheço nenhuma opção do chrome que permina fazer isso.
Mas existe no chrome://flag a opção 'smooth scrolling' que deixa o scroll mais fluído.

Aproveitando a sua atenção: Por que tabnews ainda não tem sua presença nas redes sociais? eu ficaria feliz em ajudar com isso, seria muito massa rodar um robô no twitter que auxiliaria muito no crescimento da comunidade.

2
filipedeschamps

Não temos presença ainda, pois não tivemos tempo, mas queremos sim. Por enquanto estou parcialmente trazendo essa presença pelas minhas redes mesmo e muito obrigado por oferecer ajuda 🤝

1
juliofpsm

Mano parabéns me resolveu um problemão aqui :)

Eu escrevo documento auxiliar de teste e documentação sobre o sistemas que dou manutenção é horrível ter que ficar emendando print.

Você conhece alguma maneira de fazer um macro para tirar o print de uma vez só ou com um atalho ?

1
1
1
Gui98

Valeu mesmo @nelsonmatenda. Chega de ficar tirando prints e mais prints para montar em ordem depois kkkk. O bom disso que você ensinou é que fica fácil de pegar até partes que estão separadas na página e juntá-las na edição.

Valeu mesmo!

1