As extensões de Firefox são adicionais que se podem instalar opcionalmente para dotar de novas funcionalidades e ferramentas ao programa. Neste caso vamos mostrar uma extensão muito interessante para desenvolvedores: Web Developer.

O bom desta extensão é que incluem muitas das ferramentas mais úteis na hora de desenvolver uma página, todas instaladas de uma vez e acessíveis através de uma barra de navegação, dessas que aparecem na parte de cima do navegador, embaixo dos botões.

Nota:Comentamos com detalhe sobre o que são as extensões de Firefox e damos exemplos dos mais comuns para desenvolvedores. Todo isso no artigo Extensões de Firefox úteis para desenvolvedores do web.

Extensão Web Developer

Como dizíamos, esta extensão cria uma nova barra de navegação, que se situa na parte de cima da janela de Firefox. Esta barra de navegação contém uma série de funções ordenadas em vários botões. Veremos as mais interessantes:


Disable: Serve para desabilitar diversos componentes ou partes do navegador. Por exemplo, para desabilitar cache, Javascript, ou bloqueador de popups, as cores da página…

Cookies: permite-nos fazer coisas com as cookies, como não permiti-las ou encontrar informação completa das cookies que nos enviam em cada página.

CSS: para realizar diversas ações sobre as folhas de estilo. Permite-nos não aplica-las à página, ver alguns estilos e outros não… inclusive tem uma opção para editar as folhas de estilo no próprio Firefox e assim ver como, alterando o código CSS da página, se muda o aspecto da web.

Forms: permite-nos realizar diversas ações sobre formulários, como ressaltar e obter informação de todos seus campos. Porém, também nos permite fazer coisas mais peregrinas, como mudar um campo select por um campo de texto, completar com textos todos os campos do formulário ou tirar os maxlength dos campos.

Images: dispõe de diversas opções para alterar a presença das imagens. Podemos permiti-las ou desabita-las, inclusive desabilitar só as imagens que são externas ao web site. Mostrar informação das imagens, como suas rotas, tamanho em bytes, dimensões em pixels, etc.

Information: permite-nos obter mais informação de uma série de elementos da página. Permite ver informação sobre as âncoras, o tamanho do documento, a profundidade das tabelas, o Javascript que se está executando, informação dos links, etc. Há tantas coisas que algumas são difíceis de entender o que é o que mostram.

Miscellaneous: são várias opções de distinta índole, como mostrar comentários, umas guias para saber a localização de pontos na página, editar o código HTML para ver o que ocorre diretamente ao mudar o código de qualquer página sem ter que subi-la ao servidor, una visualização da página em dispositivos com telas pequenas.... Estas são opções desconectadas entre si, mas algumas bastante úteis.

Outline: que serve para destacar elementos da página, como os links, frames, tabelas, celúlas, elementos obsoletos que se possam estar utilizando no código, etc.

Resize: é uma interessante utilidade para redimensionar a janela do navegador, para observar o aspecto que tem a web se se redimensiona a janela a outros tamanhos ou definições de tela.

Tools: contém umas ferramentas muito úteis, como verificador de links, validadores do código, acesso ao console de Java ou Javascript, etc.

View Source: como seu nome indica, nos serve para ver o código fonte.

Por último, também dispõe de um botão para acessar a diversas opções para configurar o comportamento do navegador ou desta extensão para desenvolvedores.

Conclusão

Trata-se de uma extensão que aconselhamos a todos os desenvolvedores instalar, já que concentra em um espaço mínimo todas as funcionalidades e ferramentas que podem tornar a vida mais simples.

Um grande trabalho, que confirma a Firefox como um navegador extremamente útil para as pessoas que desenvolvem páginas web.