Page 62 - Locaweb - Edição 32

lwprogramação
62 locaweb
Dicas para programadores
desenvolvedor do Chrome, há a área
Resources, que possui uma estrutura
em árvore que lista, dentre outras
coisas, a opção de visualizar os
cookies e seus conteúdos. O painel
traz informações como nome, valor,
domínio, data de expiração.
6 Teste sua página em
variadas dimensões
O Google Chrome possui
uma extensão chamada Resolution
Test (goo.gl/ai1lh), que permite
testar a página aberta em qualquer
uma das resoluções predefinidas.
Também é possível informar novas
resoluções para constarem na lista.
Esta ferramenta auxilia muito na hora
de visualizar como ficou seu layout
flexível, ou ver como está no início, na
hora de projetar sua página a partir de
uma resolução mínima.
7 A barra de ferramentas
específica para
desenvolvedores web
Este recurso existe tanto para Google
Chrome (goo.gl/ADYof) como para
Firefox (goo.gl/8RicX) e vem com
uma quantidade grande de recursos
muito úteis para aqueles que atuam
com HTML, CSS e javascript. A
barra de ferramentas permite ações
como: desabilitar todo o CSS da
página, desabilitar somente os
estilos padrão do navegador, editar,
visualizar e recarregar as folhas de
estilo existentes na página. Também
alterna o método dos formulários entre
POST e GET, visualiza informações
dos formulários da página, exibe dados
sobre as imagens, seus atributos alt,
caminhos e modos para torná-las
invisíveis. É possível ainda visualizar
metatags, response headers e
informação sobre quaisquer elementos
HTML. Também exibe elementos
ocultos, realça objetos, valida CSS,
HTML e links, traz uma régua, um
color picker, entre outros recursos.
8 Debugando
javascript “minified”
Tem se tornado uma prática
não só utilizar versões “minified” de
frameworks javascript, mas também
transformar seu código em uma
versão menor, a fim de economizar
tráfego de informações e tempo de
carregamento. Afinal, só em espaços
e quebras de linhas pode-se poupar
alguns bytes na hora de requisitar uma
página. Mas e quando você precisar
entender o funcionamento daquele
Algumas barras
de ferramentas
permitem ações
como: desabilitar
todo o CSS da
página ou apenas
os estilos padrão
Alguns
navegadores
possibilitam que
seja visualizada
a situação atual
de um elemento
HTML na
tela, bastando
posicionar o
mouse sobre o
trecho de código
HTML referente
ao objeto
desejado