Base de connaissances

Oui !

La plupart des appareils mobiles, y compris iOS (iPhone et iPad), ainsi que certains ordinateurs (comme le MacBook Pro Retina) prennent en charge les images haute résolution.

Une image haute résolution (ou Retina) contient deux fois plus de pixels qu'une image normale, mais elle a la même largeur et la même hauteur.

Les images peuvent ainsi paraître beaucoup plus nettes sur ces appareils. EverWeb permet de prendre en charge très facilement les appareils Retina ou haute résolution.

Toute image intégrée à EverWeb est automatiquement convertie pour vous en graphique Retina. Par exemple, si vous avez créé un bouton ou utilisé un dégradé, EverWeb veille à ce qu'ils soient superbes sur les appareils haute résolution, sans aucune étape supplémentaire de votre part.

Vous n'avez à vous occuper que des images que vous ajoutez à votre site Web. Pour que votre site Web utilise des images Retina, vous devez procéder comme suit :

1) Il vous faut deux images pour chaque image que vous ajoutez à EverWeb : une en taille normale et une en taille double. Remarque : ne vous contentez pas d'agrandir votre image de taille normale pour la rendre deux fois plus grande. Cela irait à l'encontre du but recherché en ajoutant des graphiques Retina à votre site.

2) Votre image en taille double doit être nommée ainsi :

[email protected]

où normal_image est identique au nom de votre image de taille normale et png est la même extension de fichier que celle de votre image normale. La seule différence est que vous ajoutez @2x avant l'extension de fichier de votre image Retina.

EXEMPLES DE NOMS DE FICHIERS

IMAGE NORMALE : traveling.png
IMAGE RETINA : [email protected]

IMAGE NORMALE : myphoto.jpg
IMAGE RETINA : [email protected]

3) Faites ensuite simplement glisser les deux images dans la liste des composants d'EverWeb. Lorsque vous utilisez l'une ou l'autre image sur votre site, EverWeb produit les versions normale et Retina lors de la publication de votre site Web. Il utilise pour cela un code CSS très optimisé, de sorte que seule l'image adaptée à l'écran de votre visiteur est téléchargée par son navigateur Web.