Je sais pas vous mais quand je trouve un site sympa, je l’ajoute à l’écran d’accueil de mon iPad, et de mon iPhone. Le Bon Coin, les blogs de mes potes, mes propres blogs, j’aime bien classer par thématique les sites que je consulte le plus souvent. Mais quand je classe mes lectures favorites sur ma tablette, j’aimerai avoir un visuel du logo, une icône qui m’éviterai de devoir assigner des titres trop complexes à chaque site que j’ajoute.
Assigner une icone au raccourci de votre site
Imaginez que vos lecteurs démarrent leurs tablettes et trouvent plus rapidement vos sites grâce à des logos.
En temps normal, lorsque vous naviguez sur un site et souhaitez l’ajouter à votre écran d’accueil, voici ce qui apparait :
Icone par défaut sur iPad
Nous allons voir comment votre produit Apple peut vous simplifier la tâche grâce à un petit bout de code que vous allez ajouter à votre site. Ce dernier vous permet de contrôler l’image de votre icône, afin de vous simplifier la navigation.
Icone personnalisée sur iPad
Idem pour iPhone vous aurez un beau logo bien lisible
Visu iPhone
La première étape est d’aller choisir le logo ( 114×114 pour un format parfait ) et de l’uploader à la racine de votre site.
votreinstalldesite/icone-apple.png
Si vous êtes sous CMS, importez votre image et copiez l’url de cette dernière !
Ensuite voici le code que votre iBidules va interpréter :
<link rel="apple-touch-icon" href="http://www.urldusite.com/votreimage.png" />
Modifier l’url avec la votre et copiez le code complet pour l’insérer sur votre site (dans le fichier header.php par exemple dans la section <head>)
L’astuce rend beaucoup plus pratique la navigation depuis les tablettes et mobile Apple.
iCone de mon site disponible sur iPhone et iPad
Voici en image le rendu sur mes iBidules
Icône sur ma tablette iPad
Icône sur mon iPhone
Les effets arrondis se font automatiquement, pas besoin de travailler votre photo. Voilà maintenant faites le test en live si vous désirez ajouter Cree1site sur votre écran d’accueil et constatez comme c’est plus beau.
Cette astuce est disponible avec des options plus poussées sur le site officiel Apple.
Cet article vous a plu ? Partagez le…
C’est vraiment plus ergonomique et rien ne vaut que de l’ergonomie pour fidéliser le visiteur et lui rendre la navigation plus simple.