Resolution
R
Definition complete
La Résolution en contexte web désigne les dimensions en pixels d'une image ou vidéo, définissant sa qualité visuelle et son poids fichier. Les résolutions courantes incluent HD (1280x720), Full HD (1920x1080), 2K (2560x1440) et 4K UHD (3840x2160). Le choix de résolution impacte directement les performances du site.
Pour les images web, la résolution doit être adaptée au contexte d'affichage : une image de 4000px de large pour un emplacement de 400px gaspille de la bande passante sans bénéfice visuel. Les écrans Retina (2x) nécessitent des images à double résolution pour rester nettes, d'où l'importance des srcset et picture pour le responsive images.
Pour la vidéo, l'encodage adaptatif (ABR - Adaptive Bitrate) permet de servir différentes résolutions selon la connexion de l'utilisateur. Les plateformes comme YouTube ou Vimeo gèrent automatiquement cette optimisation. L'hébergement vidéo self-hosted nécessite plusieurs encodages et un player adaptatif.
L'équilibre qualité/poids est crucial pour les Core Web Vitals : les formats modernes (WebP, AVIF pour les images, AV1 pour la vidéo) offrent une qualité équivalente à 30-50% du poids des formats traditionnels, améliorant significativement le LCP.
Exemples pratiques
- E-commerce : Images produits à 800x800 pour la grille, 1600x1600 pour le zoom, servies en WebP avec fallback JPEG, économisant 60% de bande passante.
- Vidéo d'entreprise : Encodage en 1080p/720p/480p avec player HLS adaptatif, garantissant une lecture fluide quelle que soit la connexion.
- Portfolio créatif : Images haute résolution chargées en lazy loading progressif, affichant d'abord une version basse résolution (LQIP) puis la version finale.
A quoi sert Resolution ?
La gestion de la résolution sert à optimiser le poids des médias sans sacrifier la qualité perçue, améliorer les Core Web Vitals (LCP) pour le SEO, garantir une expérience fluide sur toutes les connexions, et réduire les coûts de bande passante et stockage. C'est un aspect technique clé de la performance web.
Resolution en pratique chez 123web
Chez 123web, nous optimisons les résolutions d'images et vidéos dans tous nos projets. Nous configurons les pipelines d'optimisation automatique, implémentons les responsive images avec srcset, et recommandons les solutions d'hébergement vidéo adaptées. Cette attention aux détails techniques garantit des sites performants sans compromis sur la qualité visuelle.