Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

Performance web - Optez pour une approche qui marche

1.640 Aufrufe

Veröffentlicht am

- L'importance du sujet de la performance web
- Métriques et KPI
- Outils de mesure de la performance
- Approche organisationnelle
- Budget de performance
- Automatisation

Veröffentlicht in: Marketing
  • Als Erste(r) kommentieren

Performance web - Optez pour une approche qui marche

  1. 1. #seocamp 1@LoukilAymen Performance Web Optez pour une approche qui marche Aymen Loukil Consultant SEO International
  2. 2. #seocamp 2@LoukilAymen Le web appartient aux utilisateurs et non pas aux éditeurs..
  3. 3. #seocamp 3@LoukilAymen Le performance web impacte drastiquement l’expérience utilisateur #UX
  4. 4. #seocamp 4@LoukilAymen 50% des sites web mettent 13s à se charger STRESS
  5. 5. #seocamp 5@LoukilAymen
  6. 6. #seocamp 6@LoukilAymen source :newsroom.cisco.com Mauvaise performance, facteur d’exclusion
  7. 7. #seocamp 7@LoukilAymen Être là peu importe le contexte de vos clients North Carolina - source : people.com
  8. 8. #seocamp 8@LoukilAymen
  9. 9. #seocamp 9@LoukilAymen Les sites rapides, sont mieux appréciés* par Google #SEO *moins coûteux à crawler
  10. 10. #seocamp 10@LoukilAymen Satisfaction clients Notoriété marque CA €€ Nb de sessions Bounce rate Crawl rate Coût infrastructure Forfait internet Impact
  11. 11. #seocamp 11@LoukilAymen Mauvaise compréhension du sujet
  12. 12. #seocamp 12@LoukilAymen “On a pas de métriques de performance suivies dans le temps, mais lorsqu’on teste notre site depuis les locaux ou même depuis chez nous, il semble très rapide… En plus, on a jamais eu de réclamations de nos utilisateurs comme quoi c’est lent !” - Une entreprise Digitalement Transformée..
  13. 13. #seocamp 13@LoukilAymen Fonctionnalité 1 Fonctionnalité 2 Fonctionnalité n Audit performance Développer rapidement un code lent..
  14. 14. #seocamp 14@LoukilAymen La Performance est un sujet culturel
  15. 15. #seocamp 15@LoukilAymen - Vision stratégique - Management - Maturité technique - Choix frameworks - Design / UI / UX - Outils et culture de la qualité
  16. 16. #seocamp 16 L’approche qui marche
  17. 17. #seocamp 17@LoukilAymen Une équipe de performance dédiée - Durée de vie : 3 mois* - Objectifs : - Faire le point! - Eduquer / Insuffler - Définition des process - Mise en place de tooling - Définir les KPIs A terme, dans chaque équipe la performance devient un critère d’acceptance et de qualité.
  18. 18. #seocamp 18@LoukilAymen - Se donner le temps pour apprendre - Tester des choses - S'inspirer des autres réussites - Ne parlez pas trop, montrez - Se faire accompagner Éduquer et insuffler la culture de performance
  19. 19. #seocamp 19@LoukilAymen
  20. 20. #seocamp 20@LoukilAymen Métriques quantitatives Métriques visuelles Métriques d'interactivité Nombre de requêtes Taille de la page PageSpeed score Lighthouse perf Score First Contentful Paint First Meaningful Paint Speed Index Visually Complete Time To Interactive First Input Delay First CPU Idle Métriques customs ?
  21. 21. #seocamp 21@LoukilAymen Priorisez le haut
  22. 22. #seocamp 22@LoukilAymen Métriques customs Time To Hero Image Time To Hero Text Time To First Tweet
  23. 23. #seocamp 23@LoukilAymen Corréler les métriques de performance avec les métriques business
  24. 24. #seocamp 24@LoukilAymen Tooling
  25. 25. #seocamp 25@LoukilAymen Outils performance web Outils synthétiques Outils terrain - RUM ● Chez nous ● Tester sur un environnement maîtrisé ● Débugger en développement (QA) ● Comparer dans le temps ● Chez les utilisateurs ● Voir comment ça se comporte dans la vraie vie ● Se mettre à l’épreuve de différents contextes utilisateurs (localisation, connexion et latence, type support)
  26. 26. #seocamp 26@LoukilAymen Outils performance web Outils synthétiques Outils terrain - RUM
  27. 27. #seocamp 27@LoukilAymen Budget de performance
  28. 28. #seocamp 28@LoukilAymen Budget Global IMAGES CSS JavaScript Nombre de requêtes 600Kb max, 35 requêtes, 300kb de JS FMP
  29. 29. #seocamp 29@LoukilAymen Fonctionnalité 1 Fonctionnalité 2 Fonctionnalité n Audit performance ? ? ? ● charge plusieurs scripts ? ● augmente le nombre de requêtes BDD/page ? ● fait des appels à des APIs externes ? ● fait des opérations complexes ? ● explose notre budget de performance ? On serait à combien ? 1-Se poser les bonnes questions en amont ?
  30. 30. #seocamp 30@LoukilAymen Tout n’a pas la même importance en contenu Contenu Core Améliorations Le reste HTML et CSS essentiels, expérience sans JavaScript Images, polices, CSS plus beau, JavaScript, Widgets, Animation Analytics, publicité, AB testing, 3rd party scripts.. Indispensable Moins important Faible importance
  31. 31. #seocamp 31@LoukilAymen Fonctionnalité 1 Tester la performance (OS) Corriger 2- Prendre le temps pour développer un code rapide ?
  32. 32. #seocamp 32@LoukilAymen Home Listing ProductResult pass / fail Write code CI If passes Go LIVE !! Automatiser, pérenniser
  33. 33. #seocamp 33@LoukilAymen Intégrer la mesure dans l’intégration continue (CI) https://github.com/ebidel/lighthouse-ci
  34. 34. #seocamp 34@LoukilAymen
  35. 35. #seocamp 35@LoukilAymen Empêcher la livraison si on dépasse le budget
  36. 36. #seocamp 36@LoukilAymen Customiser Lighthouse avec vos propres audits ! aymen-loukil.com/blog/creer-des-custom-audits-avec-lighthouse
  37. 37. #seocamp 37@LoukilAymen Fonctionnalité 1 Tester la performance (OS) Corriger Livrer et tester (RUM) 3- Valider post livraison avec la RUM ? 1 2 3
  38. 38. #seocamp 38@LoukilAymen Collecte des métriques RUM - CrUX FCP Device Connection typeOnload
  39. 39. #seocamp 39@LoukilAymen Comparer et benchmarker https://www.aymen-loukil.com/blog/top-sites-ecommerce-performance-2018/
  40. 40. #seocamp 40@LoukilAymen Dashboard Data Studio + CrUX
  41. 41. #seocamp 41@LoukilAymen source: developer.google.com 3- Valider post livraison avec la RUM
  42. 42. #seocamp 42@LoukilAymen Tips pratiques webperf https://www.slideshare.net/aymenloukil/
  43. 43. Aymen Loukil #TechnicalSEO #webperf #speaker #entrepreneur #ex-dev Consultant SEO International https://www.aymen-loukil.com @LoukilAymen

×