Ignite GeekFtour - Optimisation des performances du web

20
Optimisation des performances du web Par Mohammed Bensoltana samedi 11 août 12

description

 

Transcript of Ignite GeekFtour - Optimisation des performances du web

Page 1: Ignite GeekFtour - Optimisation des performances du web

Optimisation des performances du webPar Mohammed Bensoltana

samedi 11 août 12

Page 2: Ignite GeekFtour - Optimisation des performances du web

Petit constat

evolutionoftheweb.com

samedi 11 août 12

Page 3: Ignite GeekFtour - Optimisation des performances du web

Le web au Maroc c’est beau!

samedi 11 août 12

Page 4: Ignite GeekFtour - Optimisation des performances du web

C’est beau! Mais...

5.63s1.56MB86req

2.79s1.74MB157req

37.57s2.14MB116req

3.70s4.66KB62req

5.72s2.03MB114req

6.16s2.77MB198req

5.07s3.72MB124req

8.67s3.6MB138req

13.31s2.66MB275req

11.17s2.49MB211req

6.64s2.72MB159req

4.27s1.47MB179req

samedi 11 août 12

Page 5: Ignite GeekFtour - Optimisation des performances du web

Quelques chiffres...

๏ 47% des visiteurs s’attendent à ce qu’une page web se charge en moins de deux secondes

๏ 40% vont fermer la page web si son chargement prend plus de trois secondes

samedi 11 août 12

Page 6: Ignite GeekFtour - Optimisation des performances du web

Mais pourquoi optimiser au juste?๏ Pour une meilleure expérience utilisateur et

une meilleure satisfaction

๏ Pour réduire le taux de rebond

๏ Pour réduire la bande passante du site et ainsi le cout de l’infrastructure

๏ Pour augmenter le taux de conversion pour les e-commerçants

samedi 11 août 12

Page 7: Ignite GeekFtour - Optimisation des performances du web

D’accord! Et ça consiste en quoi?๏ Mesurer les performances du site

๏ Définir comme but principal : avoir un site qui se charge en moins de deux secondes

๏ Adopter les nouvelles technologies (hébergement cloud, CDNs, répartition de charges...)

samedi 11 août 12

Page 8: Ignite GeekFtour - Optimisation des performances du web

Et Mr Google dans tout ça?

1%des recherches sur Google sont touchées par le facteur de vitesse de chargement pour le

positionnement des résultats

samedi 11 août 12

Page 9: Ignite GeekFtour - Optimisation des performances du web

Meet PageSpeed & YSlow!

Outils d’analyse des performances des pages web et de suggestions d’optimisations

YSlow! par Yahoo!developer.yahoo.com/yslow

PageSpeed par Googledevelopers.google.com/speed

samedi 11 août 12

Page 10: Ignite GeekFtour - Optimisation des performances du web

Let’s analyze!

samedi 11 août 12

Page 11: Ignite GeekFtour - Optimisation des performances du web

Technique 1 : Réduire le nombrede requêtes

samedi 11 août 12

Page 12: Ignite GeekFtour - Optimisation des performances du web

Technique 2 : Content Delivery Network

samedi 11 août 12

Page 13: Ignite GeekFtour - Optimisation des performances du web

Technique 3 : Compression des images avec ImageOptim

224kb16.7mln couleurs

34kb64 couleurs

samedi 11 août 12

Page 14: Ignite GeekFtour - Optimisation des performances du web

Technique 4 : Utilisation des CSS Sprites

samedi 11 août 12

Page 15: Ignite GeekFtour - Optimisation des performances du web

Modules d’optimisation

samedi 11 août 12

Page 16: Ignite GeekFtour - Optimisation des performances du web

Résultats d’optimisation

- 50% en moyenne de temps de crawl par Google

samedi 11 août 12

Page 17: Ignite GeekFtour - Optimisation des performances du web

Résultats d’optimisation

Augmentation de plus de 100% dans le nombre de pages crawlées par Google par jour !

samedi 11 août 12

Page 18: Ignite GeekFtour - Optimisation des performances du web

What’s next?

Make it green!

samedi 11 août 12

Page 19: Ignite GeekFtour - Optimisation des performances du web

What’s next?

Make it responsive!

samedi 11 août 12

Page 20: Ignite GeekFtour - Optimisation des performances du web

Merci pour votre attention!

Let’s keep in touch ;)@simobenso

[email protected]

samedi 11 août 12