Natascha HunI Encontro /MNT – Goiás – Março/2013
• Natural de Sorocaba/SP• Tecnóloga em Processamento de Dados• Engenheira da Computação• Desenvolvimento PHP desde 2005• S...
Avalie a velocidade do seu site  O usuário não vai esperar seu site carregar  E torne-o mais veloz!
“Web site de alto desempenho levaa uma maior retenção do visitante,   engajamento e conversões”           20 Regras
“YSlow analisa as páginas web e sugeremaneiras de melhorar o seu desempenhocom base em um conjunto de regras para  páginas...
CSS na tag Head faz apágina ser exibidaprogressivamente                                Scripts bloqueiam downloads        ...
Remover comentários e espaços desnecessáriosdiminuem o tamanho do arquivo Jquery.js: 262KB               Jquery.min.js: 90KB
• Não redimensione imagens no HTML• Sempre informe tamanho real da imagem   Aproveite e preencha o atributo alt com keywor...
Remova bytes desnecessários de arquivos de imagemAntes                                       Depois
• Evite resposta “inútil” (404) ou atrasos (301, 302):melhore a experiência do usuário
• Alguns arquivos mudam com pouca frequência (CSS,JS, imagens)...... acessar esses arquivos localmente agiliza ocarregamen...
• Ao colocar CSS e JS em arquivos externos junto comadoção de cache, o código será baixado uma única vez eo HTML será redu...
• CSS no topo   • Redução de 56KB de imagens com otimização   • Redimensionamento de imagens
• Minificação OK   • Redimensionamento de Imagens   • Javascript no topo
Adote ferramentas de apoioPadrão, organização, monitoramente e destaque! Organize e monitore!
nshgeek  @nshgeek  nshgeek@gmail.com  br.linkedin.com/in/nataschash  slideshare.net/nshgeek• Google Page Speed: https://de...
Encontro /MNT: Dicas para Desenvolvedoras Web
Encontro /MNT: Dicas para Desenvolvedoras Web
Encontro /MNT: Dicas para Desenvolvedoras Web
Encontro /MNT: Dicas para Desenvolvedoras Web
Encontro /MNT: Dicas para Desenvolvedoras Web
Encontro /MNT: Dicas para Desenvolvedoras Web
Encontro /MNT: Dicas para Desenvolvedoras Web
Encontro /MNT: Dicas para Desenvolvedoras Web
Encontro /MNT: Dicas para Desenvolvedoras Web
Próximos SlideShares
Carregando em…5
×

Encontro /MNT: Dicas para Desenvolvedoras Web

674 visualizações

Publicada em

Apresentação do Workshop de desenvolvimento do I Encontro Mulheres na Tecnologia, realizado em março/2013 em Goiânia/GO.

  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Encontro /MNT: Dicas para Desenvolvedoras Web

  1. 1. Natascha HunI Encontro /MNT – Goiás – Março/2013
  2. 2. • Natural de Sorocaba/SP• Tecnóloga em Processamento de Dados• Engenheira da Computação• Desenvolvimento PHP desde 2005• SEO | Linux | NFe – leitorxml.com.br
  3. 3. Avalie a velocidade do seu site O usuário não vai esperar seu site carregar E torne-o mais veloz!
  4. 4. “Web site de alto desempenho levaa uma maior retenção do visitante, engajamento e conversões” 20 Regras
  5. 5. “YSlow analisa as páginas web e sugeremaneiras de melhorar o seu desempenhocom base em um conjunto de regras para páginas da Web de alto desempenho” 35 Regras – 23 Analisadas
  6. 6. CSS na tag Head faz apágina ser exibidaprogressivamente Scripts bloqueiam downloads paralelos e devem ser carregados por último Aproveite e preencha a tag tittle com descrição relevante e única da página!
  7. 7. Remover comentários e espaços desnecessáriosdiminuem o tamanho do arquivo Jquery.js: 262KB Jquery.min.js: 90KB
  8. 8. • Não redimensione imagens no HTML• Sempre informe tamanho real da imagem Aproveite e preencha o atributo alt com keywords!
  9. 9. Remova bytes desnecessários de arquivos de imagemAntes Depois
  10. 10. • Evite resposta “inútil” (404) ou atrasos (301, 302):melhore a experiência do usuário
  11. 11. • Alguns arquivos mudam com pouca frequência (CSS,JS, imagens)...... acessar esses arquivos localmente agiliza ocarregamento da página, ao invés de sempre buscá-los
  12. 12. • Ao colocar CSS e JS em arquivos externos junto comadoção de cache, o código será baixado uma única vez eo HTML será reduzido
  13. 13. • CSS no topo • Redução de 56KB de imagens com otimização • Redimensionamento de imagens
  14. 14. • Minificação OK • Redimensionamento de Imagens • Javascript no topo
  15. 15. Adote ferramentas de apoioPadrão, organização, monitoramente e destaque! Organize e monitore!
  16. 16. nshgeek @nshgeek nshgeek@gmail.com br.linkedin.com/in/nataschash slideshare.net/nshgeek• Google Page Speed: https://developers.google.com/speed• Central Google do Webmaster: http://www.google.com/intl/pt-BR/webmasters/• YSlow: http://developer.yahoo.com/yslow/• 34 Regras Yahoo: http://developer.yahoo.com/performance/rules.html

×