Formations courtes

Performances Web

Initiation
2 jours (14 heures)
Paris
Optimiser ses fichiers (HTML, CSS, images) pour améliorer les performances d'un site

Objectifs

Pour qui ?

Prérequis

Objectifs

Définir les performances Web et ses enjeux
Améliorer ses performances
Optimiser ses fichiers
Analyser et surveiller ses performances
Optimiser une page HTML responsive

Pour qui ?

Intégrateurs et développeurs Web.


Code dokélio :

Prérequis

Il est nécessaire de maîtriser le HTML, les CSS et d'avoir quelques notions de JavaScript ou de jQuery pour suivre cette formation.



Compétences acquises:
Optimiser ses fichiers (HTML, CSS, images) pour améliorer les performances d'un site

Programme

Performances Web

Définir les performances Web et ses enjeux
• Définir la notion de performance Web
• Comprendre l'enjeu des performances sur la navigation mobile
• Comprendre l'impact des performances sur le référencement
• Comprendre l'impact des performances sur l'expérience utilisateur (UX)
➔ Partage d'expériences sur des cas concrets

Améliorer ses performances

Assimiler le fonctionnement d'un navigateur
• Décomposer une requête afin de comprendre l'ordre de chargement des fichiers externes
• Décrypter le temps de chargement d'une page
Restructurer ses requêtes
• Réduire le nombre de requêtes
• Minifier ses ressources pour réduire leur temps de chargement
• Compresser ses ressources
• Précharger certaines ressources
• Paralléliser les requêtes afin de ne pas bloquer le chargement du HTML
• Utiliser des CDN à bon escient
Comprendre les bases de l'optimisation côté serveur
• Optimiser le fichier .htaccess pour sécuriser un site
• Activer la compression
• Personnaliser le cache avec les en-têtes d'expiration
➔ Étude de cas : analyse complète d'un fichier .htaccess

Optimiser ses fichiers

Analyser son JavaScript
• Utiliser les méthodes defer et async
• Savoir placer son code JavaScript pour un meilleur chargement dans le HTML
➔ Exercice : intégrer correctement des fichiers JavaScript dans une page HTML

Maximiser ses images

• Choisir le bon format en fonction du type d'images
• Réduire la taille des images pour un chargement plus rapide
• Utiliser les méthodes de Lazy Loading
• Utiliser les polices d'icônes
• Réaliser des sprites pour diminuer le nombre de requêtes
• Délivrer des images Retina sur mobile
• Optimiser sa favicon
➔ Exercice : choisir le bon format et optimiser une série d'images

Améliorer le HTML et le CSS

• Alléger ses codes HTML et CSS
• Optimiser les performances des sélecteurs CSS
• Fluidifier et optimiser ses animations CSS3
• Optimiser sa page 404 pour une meilleure expérience utilisateur (UX)
➔ Exercice : réaliser une animation fluide

Analyser et surveiller ses performances

• Utiliser les outils de diagnostic en ligne
• Utiliser les outils de développement des navigateurs
• Comprendre la notion de Speed Index
• Surveiller les performances (Monitoring…)
➔ Étude de cas : analyse des performances de divers sites Internet

Optimiser une page HTML responsive

• Optimiser le HTML et les CSS
• Optimiser l'appel aux librairies JavaScript externes
• Optimiser le code JavaScript
• Optimiser les images (Retina…)
• Analyser les performances globales de la page
➔ Exercice : rendre performante une page HTML responsive
Performances Web
Ref
WM11719
Tarif
1300€ HT

Prochaines sessions

Le choix de la session vous sera demandé lors de votre inscription.

Paris
Prochaines sessions
14 et 15 oct. 2019
14-10-2019
15-10-2019
Cette formation vous intéresse ?