1. Experiência do cliente
Performance comovantagem competitiva

2. Objetivo da conversa: Acabar com a inveja
A loja do meu
concorrenteé
mais rápida!

3. Objetivo da conversa: Direcionar a raiva!
Quem é o maior
culpado?
Plataforma?
TI?
Agência?
Designers?

7. A velocidade da sua loja como diferencial competitivo :10 dicas
1. A experiência do usuário e a perfomace da loja?
1. Expectativa X Realidade
2. Como funciona seu cérebro?
3. Como funciona seu Browser?
4. As três métricas para avaliação de velocidade
2. Metodologia Profite de análise?
1. Matriz Profite de análise
2. Aplicação da Matriz
3. Velocidade como oportunidade
4. Aplicação com case da platéia
3. Ferramentas para avaliação:
1. Pingdon
2. Speedtools
3. Webpagetools
4. Conclusão OtimizaçãoFront-end
1. HTML / CSS / JS / Imagens
2. Interface

8. A experiência do usuário
47% dos internautas nãoirão esperar mais do que três
segundospara o
carregamento de um site, em 2006 o tempo era de quatro segundos.

9. A experiência do usuário
Compradores se tornam desatentos em sites lentos,
14% mudam de loja e 23% desistem da compra

10. A experiência do usuário
A cada anoa
velocidade da
WEB aumenta e
os sites carregam
mais rápido?

11. A experiência do usuário
A cada ano a velocidade da
WEB aumenta e os sites
carregam mais rápido?
Em geral as lojas ficaram mais lentas.
Não!

12. A experiência do usuário
A cada ano a velocidade da
WEB aumenta e os sites
carregam mais rápido?
Estudo com os 2000 top Retail sites USA
2011 -> 5.94sec
2012 -> 6.50sec
TOP 100 >> 7.14sec
TOP 100 >> 100 files
As stores estão
9% mais lentos do que em 2011

13. Como funciona seu cérebro?

14. 1. Como funciona seu cérebro
Como funciona seu cérebro?

15. Como funciona seu Browser?

16. As três métricas para velocidade
Tempo de carregamento
Quantidade de arquivos
Soma total de bytes
Use as métricas para cobrar:
Suaequipe
SuaAgência
SuaPlataforma de Ecommerce
Seu Host

17. AS 03 Métricas para avaliação de velocidade.
tempo de carregamento da loja no browser
Assim que o browser começa receber os
arquivos ele organiza visualmente os códigos
no formato da interface que o cliente utiliza
para navegar na sua loja.

18. AS 03 Métricas para avaliação de velocidade.
Quantidade de arquivos enviados para browser
do seu cliente
Quanto maior números de arquivos enviados
para o cliente mais tempo a sua loja levará
para carregar.

19. AS 03 Métricas para avaliação de velocidade.
- Soma total de bytes dos arquivos da sua loja
Soma total em bytes dos arquivos incluindo
Html, imagens, css, javascript/jquery, Flash e
etc

20. Velocidade como oportunidade
Qual a oportunidade?

21. Velocidade como oportunidade

22. Velocidade como oportunidade

23. Velocidade como oportunidade

24. As três ferramentas para avaliação de performance
Avaliação detalhada
PorArquivos
Qualidade de código
Comparação entre players
Pornotasevisuais

25. 04>Ferramentas: GOOGLE PAGE SPEED

26. 04>Ferramentas: PingDOM.com

27. 04>Ferramentas: Webpage.org

28. Soluções simples :
Menos arquivos:
Sprites
CSS único
JS único
Menos bytes:
MinifyJS e CSS
Compactação de
imagens

29. Usabilidade : Planejamento de usabilidade ( Agência / Criação)

31. Desenvolvimento: menos arquivos
Sprites :
Unificar as imagens
que se repetem na
loja em um arquivo
único.
CSS único
JS único

32. Desenvolvimento: menos bytes
http://javascriptcompressor.com/
http://jsbeautifier.org/
http://www.csscompressor.com/
http://jsbeautifier.org/