Principais extensões do Chrome para desenvolvedores Web

Selecionamos as principais extensões do Chrome para desenvolvedores Web

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.

10 extensões do Chrome para desenvolvedores FrontEnd

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:

1. Adição de contornos aos elementos (tudo com apenas um clique);
2. Detecção de imagens quebradas;
3. 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:

1. Plugins;
2. Widgets;
3. Servidores;
4. Plataformas de conteúdo;
5. CMS;
6. 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. 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!

5. 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.

6. 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!

7. 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.

LEIA TAMBÉM:

Avaliação do pacote Game Developer da Danki.Code