Extensões de Chrome para quem desenvolve sites

10 Extensões de Chrome para quem desenvolve sites

quinta-feira, 24 de outubro de 2019 | Comentários

Escrito por

Escute o conteúdo do post com o player

Desde seu lançamento em 2008, o Google Chrome se tornou um dos browsers mais utilizados da internet. De acordo com o Global Web Stats, dentre os 10 navegadores mais utilizados do mundo, seis são versões do Chrome, o que dá uma pequena dimensão de sua penetração e market share (que gira em torno de 57%).

Sua origem acabou com a bipolaridade entre Internet Explorer e Mozilla Firefox e trouxe para o mercado um ótimo produto. Além disso, leva a marca e a qualidade dos produtos Google em seu DNA.

Rapidamente, o Chrome se tornou o líder entre os browsers, mas sua estrada de sucesso não foi construída apenas com hype sobre a marca Google ou pelo baixo desempenho dos concorrentes. As ferramentas presentes sempre foram um grande diferencial, especialmente as extensões do Chrome.

Elas são funcionalidades e ferramentas que podem ser adicionadas ao browser para aprimorar uma determinada ação. São add-ons, que podem ser englobados no Google Chrome para torná-lo ainda mais completo ou para deixar algo mais prático.

As 10 principais extensões do Chrome para quem desenvolve sites

Existem milhares de extensões para o Chrome disponíveis para download e instalação, e algumas delas são bastante úteis para quem trabalha com desenvolvimento de sites.

Se você tem interesse em agregar algumas ferramentas extras ao seu Google Chrome, se liga nessas 10 extensões que valem a instalação! Elas irão facilitar seu trabalho no desenvolvimento ou ajudarão na organização da sua rotina profissional.

1. Web Developer

Essa extensão foi criada para concentrar diversas ferramentas simples e úteis em uma barra adicional no Chrome. O conceito veio da barra de ferramentas do desenvolvedor.

Ela é repleta de utilidades para quem quiser usar em seu trabalho diário, não só para os programadores, mas também para quem opera no webdesign. Dentre os recursos estão alguns como:

  • Adição de contornos aos elementos (tudo com apenas um clique);
  • Detecção de imagens quebradas;
  • Controle de habilitação/desabilitação de popups, plugins e JavaScript.

A Web Developer é uma extensão utilizada por mais de um milhão de pessoas ao redor do planeta.

Clique e instale agora!

2. Window Resizer

Essa extensão do Chrome redimensiona a janela do navegador em tempo real. Com isso, é possível emular diferentes resoluções de tela e compreender como um site irá aparecer em uma série de dispositivos.

Esse tipo de preocupação é muito importante, especialmente hoje em dia. Existem telas de PC widescreen, ultrawide, celulares com telas médias e outros com telas gigantes. Isso sem falar nos monitores e nas diferentes resoluções que cada um deles apresenta.

A extensão foi feita para trazer praticidade ao desenvolvimento web, facilitando a visualização de seu trabalho para as diferentes telas.

Clique aqui para adicionar

3. Wappalyzer

Já entrou em um site e ficou curioso para saber o que foi utilizado para desenvolvê-lo? Com essa extensão, fica mais fácil fazer um diagnóstico completo de um site e descobrir elementos como:

  • Plugins;
  • Widgets;
  • Servidores;
  • Plataformas de conteúdo;
  • CMS;
  • Frameworks utilizados.

Trata-se de uma boa extensão para fazer uma pesquisa de mercado em sites concorrentes, analisar como eles são desenvolvidos, os conceitos de arquitetura da informação e quais ferramentas são utilizadas para entregar uma boa experiência ao usuário.

Clique aqui e adicione ao seu Chrome!

4. HTTPS Everywhere

Essa extensão para o Chrome faz um trabalho bem simples, mas muito importante: ela reescreve a solicitação feita pelo usuário no Chrome, para que seja possível acessar a versão segura de qualquer site.

A grande maioria dos sites que conhecemos utiliza o protocolo HTTPS. Contudo, a internet é um vasto mundo cheio de perigos, e essa ferramenta se torna essencial para deixar sua navegação sempre mais segura.

Lembrando que essa extensão não é restrita aos desenvolvedores. Qualquer usuário do Chrome vai melhorar sua experiência de navegação com o HTTPS Everywhere.

Adicione clicando aqui.

5. Ghostery

Extensão criada para bloquear anúncios para um usuário enquanto ele está navegando por outras páginas. A Ghostery também é capaz de disfarçar dados de navegação para evitar o remarketing ou coleta de informações pessoais.

Junto com as questões de segurança, a extensão faz com que os sites carreguem mais rápido.

Clique aqui para instalar.

6. ColorZilla

Quem trabalha com PhotoShop ou Illustrator sabe que uma das ferramentas mais importantes é o “conta gotas”. Com ele, é possível pegar o estilo ou a cor de um elemento (texto, forma, vetor) e replicar em outro elemento. A ColorZilla é uma extensão que faz algo semelhante, porém, somente com as cores.

Ao utilizar a ferramenta, o desenvolvedor consegue saber qual é a cor utilizada em qualquer site da internet. Como o “conta gotas”, a extensão concede o código hexadecimal e o RGB de cada pixel.

Além dessas funções, a ColorZilla permite analisar palhetas de cores para sites e cria gradients (uma espécie de efeito degradê) em código CSS. Com isso é possível anexar ao desenvolvimento do site de forma simples.

Clique aqui para adicionar!

7. Usersnap

Já teve aquele pensamento “ah, se eu pudesse pegar uma caneta e anotar no meu monitor o que eu estou vendo aqui”. É isso que o Usersnap faz. Ele permite ao usuário criar anotações em qualquer página da web.

A ferramenta é ideal para captar e fornecer feedback visual sobre projetos, além de servir para reportar bugs e capturar imagens de elementos de um website. Ela é extremamente utilizada por gigantes da tecnologia na caça aos erros e bugs.

Adicione ao seu Chrome clicando aqui.

8. FormFiller

Quem desenvolve sites, tanto no front-end quanto no back-end, sabe que preencher formulários de teste pode ser uma tarefa maçante. Ao mesmo tempo, não dá para evitar os testes, já que os formulários com erros podem prejudicar a estratégia de captação de público de um site.

Por isso, a FormFiller foi desenvolvida para auxiliar nesse processo. Ela é uma extensão que preenche todas as entradas de um formulário com texto padrão, fazendo dos testes de formulários algo muito mais simples. Chega de ficar inserindo dados verídicos manualmente!

Clique aqui e acabe com esse problema!

9. Click & Clean

Cansado de ficar apagando histórico, limpando cache manualmente e se livrando dos cookies de navegação? A Click&Clean é a extensão ideal para você. Seu funcionamento é simples e tem uma missão bastante clara: limpar as informações de navegação.

Além da premissa básica, a extensão é capaz de identificar as que não estão sendo utilizadas e buscar ameaças, como vírus e arquivos maliciosos.

Clique aqui e adicione ao seu navegador.

10. Block Yourself from Analytics

Quando alguém está trabalhando na construção/alteração de um site, o ideal é que sua navegação pelas páginas não impacte os dados captados pelo Google Analytics. A atividade do desenvolvedor “suja” o banco de dados do sistema de análise, portanto, a melhor forma é navegar de maneira anônima.

Para isso ocorrer com 100% de eficácia, surgiram extensões como a Block Yourself from Analytics. Ela consegue reter seus dados de navegação e impedir que sejam contabilizados pelo sistema do Analytics.

Clique aqui e instale no seu navegador.

Essas são apenas algumas das extensões do Chrome que merecem a atenção dos profissionais que trabalham no desenvolvimento de sites e webdesign.

Com um pouco mais de pesquisa, você vai encontrar muitas (mas muitas mesmo!) ferramentas que auxiliam esse trabalho e simplificam ações durante a navegação.

Existem muitos outros temas que são fundamentais e que não podem ficar de fora do radar de quem deseja desenvolver um site. Por exemplo, um deles é como manter seu site seguro e outro é a otimização de um site.

Com certeza, uma busca pela biblioteca de extensões do Google vai te ajudar a otimizar esses aspectos, além dos já citados acima.

Você utiliza alguma outra extensão que não foi mencionada? Deixe seu comentário e fale mais sobre ela!

Tags:
Comentários
Pressione Enter para pesquisar ou ESC para fechar