Qu’est-ce que le Retina Design ?

De nos jours, des écrans dits « Haute Définition » (HD) sont conçus pour que l’oeil humain ne distingue pas la pixellisation dans des conditions normales d’affichage.

Pour Apple, on évoque le terme « Retina », pour désigner ses dalles HD. iPad, iPhone, Mac Book Pro, iMac, moyennant finance, Apple propose des écrans Retina d’une qualité exceptionnelle. Bien entendu, d’autres constructeurs utilisent aussi ce type d’affichage HD. D’autres produits haut de gamme tels que le mobile Samsung Galaxy S6 propose également du Design Retina. Le terme Design Retina ne cible donc pas que les produits Apple. Il s’agit dès lors d’un terme générique classifiant la qualité d’un écran.

• Quelle conséquence pour vos sites internet ?

Pour les images vectorielles, cela ne change rien puisque ce type d’image sait s’étirer à l’infini sans pixelliser.

En revanche, pour les images utilisées habituellement sur un site web dont les extensions sont généralement .jpg ou .png, elles seront nettes sur écran standard mais floues sur un écran Retina. Pour résumer, la particularité de ces écrans réside dans la densité de pixels. En effet, pour une résolution donnée, nous allons avoir deux fois plus de pixels.

Par exemple, un écran iPhone 6 de 1334 x 750 pixels en contient en réalité 2668 x 1500 pixels. Cela permet d’avoir une netteté incroyable, où il est quasiment impossible de distinguer les pixels. Hormis si le site internet que vous visitez n’a pas été optimisé Retina Design et croyez le bien, la plupart ne le sont pas…

• Faites le test

Si vous êtes en possession d’un écran HD, faites le test.

Il vous suffit de zoomer à 150% (CTRL + sur PC avec écran HD ou Command + sur produits Apple Retina) avec votre navigateur favori sur un site internet non « Retina-Ready ». Même sans zoomer, vous êtes à même de voir la différence entre un site internet Retina-Ready de celui qui ne l’est pas.
Le résultat est alors sans équivoque avec une pixellisation des logos.

Autre test, maintenant, amusez-vous à zoomer sur le site eMaginance.com ou sur l’un des sites dont nous avons la maintenance, InsideBasket.com. La gestion du Retina est implémentée et le logo sera clair et net, sans aucune bavure, sans aucune pixellisation. Un vrai régal pour les yeux !

• Savoir s’adapter aux tendances

L’apparition de nouveaux écrans HD complique le travail de conception de site internet.

À eMaginance (Nice -France), nous travaillons sur des postes de type iMac qui nous permettent de tester nos créations sur tous les contextes possibles.

Rassurez-vous, nous sommes à même de réaliser des visuels d’une grande qualité et adaptés aux écrans Retina/HD. Anticipez le web de demain !