Éléments Graphiques et Optimisation
Objectifs
Les objectifs de cette vidéo sont de :
- Comprendre comment lister et extraire les éléments graphiques des maquettes.
- Savoir évaluer et sélectionner la taille appropriée des images.
- Apprendre à créer des images optimisées pour le web.
- Utiliser des sprites pour les icônes afin de réduire les accès au serveur.
Résumé
Découvrez comment lister et réaliser les éléments indispensables à l'intégration HTML en utilisant différentes maquettes, en évaluant et optimisant les images pour un développement web efficace.
Description
Dans cette leçon, nous explorons comment travailler avec des maquettes pour l'intégration HTML. Nous commençons par identifier les éléments graphiques présents dans nos trois maquettes, tels que les logos, les icônes de réseaux sociaux, les images de sliders, et les éléments spécifiques pour tablette et smartphone.
Nous abordons la méthode de sélection des images, en comparant leur taille dans différentes maquettes pour décider si une seule image peut être utilisée ou si plusieurs versions doivent être créées afin de maintenir une qualité optimale. L'accent est mis sur la minimisation des ressources en réutilisant les mêmes éléments graphiques lorsqu’ils sont identiques.
La leçon couvre également la création d'images optimisées pour le web, l'utilisation de sprites pour les icônes de réseaux sociaux pour réduire le nombre d'appels serveur, et des techniques pour manipuler les calques et arrière-plans dans Photoshop.
Questions - réponses
Programme détaillé
Module 1 - Introduction video
Module 2 - Principes généraux
Module 3 - Réaliser une maquette en responsive Design
Module 4 - Maitriser l'intégration en Responsive Design
Module 5 - Le travail des textes
Module 6 - Intégrer des images optimisées
Module 7 - Une réalisation complète
Module 8 - Connaissances complémentaires
Module 9 - Conclusion
