Uma ferramenta indispensável para os desenvolvedores ! É o canivete suíço do Firefox ! O cinto de utilidades do Batman! O Bombril das donas de casa! E não estou exagerando!

Vou citar aqui apenas algumas das suas funções:

Desabilitar

Nesse painel da barra, você pode desabilitar o cache, desabilitar javascript , desabilitar o Java e muitas outras coisas.

Cookies

Nesse menu, você pode desabilitar todos os cookies ou intão apenas os cookies de sites externos; o que é interessante, vou testar, pois podemos por exemplo visitar outros blogs, sem que seus donos fiquem sabendo através do bloblogs e sem ter que deletar os cookies. Você também pode apagar todos os cookies ou apenas algum específico, visualizar ou até mesmo criar um cookie!

CSS

Com esse menu você pode desabilitar todo o CSS ou pode desabilitar o CSS interno, externo ou o inline. Você também pode ver todo o CSS usado na página e facilmente editá-lo! É ótimo para testar cores diferentes por exemplo. O menu também tem a opção de ver o CSS para impressão ou para aparelhos móveis.

Forms

Uma ferramenta interessante desse menu é a Display form details, ao selecionar essa ferramenta, ela mostra todo o código de inputs, textarea e tudo mais que for relacionado a formulários, antes de mostrar o campo visualmente. Outra ferramenta muito útil, essa vai para os esquecidinhos, é a Show passwords que serve justamente para isso, mostrar as senhas; sabe aqueles campos de senha que você simplesmente pediu para autocompletar e não lembra mais a senha? Não tem problema, basta habilitar essa função que ao invés de ver *****, você vera a senha digitada!

E tem diversas outras funcionalidades como: habilitar o auto completar dos campos de formulário, acabar com o limite de caracteres de um campo do formulário, e por aí vai…

Images
Uma ótima funcionalidade dessa barra é poder desabilitar as imagens (ótimo para testes de acessibilidade), também tem a opção de procurar por links quebrados, opção de substituir as imagens pelo seu atributo “alt” e muito mais!

Information (importante!)

Aqui, na minha opinião, fica a mais importante função da barra: Display Element Information, ao ativar essa função, o ícone do mouse vira uma mira e ao clicar em qualquer lugar da página, ele te mostra todos os atributos da tag que você selecionou e inclusive as tags mães e filhas! Pense na janela “proprerties” do Dreamweaver… é quase isso! Só que você pode ver tudo de qualquer site! Esse menu tem diversas funções que valem a pena testar.

Miscellaneous

Sempre se perguntou: “quantos pixels deve ter esse menu?” ou intão: “qual deve ser o tamanho desse banner?” ou ficou se perguntando o tamanho de qualquer item da página? Seus problemas acabaram! Com a função Display ruler você simplesmente pode medir qualquer item da tela!

O Menu também tem várias funções interessantes como: mostrar os comentários ou os elementos escondidos por exemplo.

Resize

Muito útil para testar layouts tableless, com apenas um click você pode colocar seu browser como 800×600, depois com outro click: 640×480, depois com mais um click 1024×768 !

Tools

Esse menu possui diversas opções para validação do seu código: validação de CSS, validação de HTML, validação de feed e muitas outras, realmente muito útil!

E acabamos por aqui, dei só uma pincelada nos menus da barra mas como vocês podem ver, realmente ela é fantástica. Aconselho a todos que usam o Firefox baixarem essa extensão e mesmo os que não usam e são desenvolvedores, sugiro que peguem o Firefox mesmo que seja só para usar a Web Developer Toolbar.

Web Developer Toolbar pode ser encontrada aqui.

Compartilhe!