Comment optimiser les JPEG pour les écrans Retina?

Pour accueillir des écrans haute résolution/rétine, vous devrez utiliser une image de 1280 pixels de large, ce que l'on appelle « 2x ». Bien que le graphique s'affiche toujours sur le site Web avec une largeur de 640 pixels, vous doublez la densité de pixels en utilisant une image deux fois plus grande.

1. Qu'est-ce que la rétine optimisée?
2. Comment créer une image prête pour la rétine?
3. Comment préparer mon site Web Retina Ready?
4. Quelle est la résolution de l'écran Retina?

Qu'est-ce que la rétine optimisée?

Exigences d'optimisation de la rétine

Sandvox peut optimiser vos images pour les écrans Retina si la taille, en pixels, de l'image source est au moins le double de la taille, en points, de l'image telle qu'elle apparaît dans Sandvox. ... Si le fichier source fait également 400x400 pixels, il apparaîtra pixelisé sur un écran Retina.

Comment créer une image prête pour la rétine?

Les appareils Retina ont plus de pixels par pouce, ils nécessitent donc des images haute résolution pour remplir ces pixels supplémentaires.
...

1. Étape 1 : Vous devez produire des images avec le double des dimensions en pixels de votre site. ...
2. Étape 2 : Servir des images Retina sur des appareils Retina. ...
3. Étape 3 : Téléchargez vos images Retina sur WordPress et utilisez-les sur votre site.

Comment préparer mon site Web Retina Ready?

Pour rendre votre site Web prêt pour la rétine, utilisez autant que possible des graphiques vectoriels évolutifs (SVG). SVG est un format graphique basé sur XML qui présente des images de haute qualité. Les images SVG peuvent être visualisées dans des navigateurs Internet utilisant XML ou affichées sur des téléphones portables aux formats de fichier SVGB ou SVGT.

Quelle est la résolution de l'écran Retina?

Résolution native : 2880 x 1800 à 220 pixels par pouce. Prise en charge de millions de couleurs. Modèles de MacBook Pro 13 pouces introduits fin 2012 ou plus tard. Résolution native : 2560 x 1600 à 227 pixels par pouce.