L'Auteur du site

Passionné par le web, je suis un JimdoFriend et mets à disposition des tutoriels et astuces pour Jimdo gratuitement.

Rechercher

Sur Facebook

Réseaux sociaux

Retrouvez moi également sur Twitter.

Newsletter

Une icône pour iPhone/iPad (raccourci vers votre site)

Une quoi ?

 

 

Tout le monde n'a pas forcément une application pour iPhone et iPad (ou autre appareil mobile), car souvent hors budget ou tout simplement hors utilité. Néanmoins vu la notoriété de ces appareils dans le monde actuel, il est plutôt essentiel de ne pas les négliger.

 

Il vous faut simplement une image (ou icône si vous préférez) au format carré. Vu la haute résolution des appareils actuels, il vaut mieux avoir une icône ayant une résolution de 180 x 180 pixels minimum (soit l'iPhone 6 Plus).

 

 

 

Personnellement pour ce tutoriel, j'ai pris une icône de 200 x 200 px.

 

Juste pour rappel, nous n'allons pas créer une application mobile, mais simplement un raccourci pour iPhone/iPad vers votre site web.

icône zetuto

Voici à gauche, l'icône que j'ai choisi. A vous de vous créer une petite icône au format PNG. Il ne reste plus qu'à mettre un code dans la head de votre site internet ("Modifier le head") :

<link rel="apple-touch-icon" href="http://site.com/votre-image.png"/>

Remplacez bien sûr http://site.com/votre-image.png par l'adresse de votre propre image.


Comment créer un raccourci sur un iPhone/iPad (ou iPod touch d'ailleurs) ?



Rendez vous tout d'abord sur Safari, puis sur un site web de votre choix.


En haut à droite, juste à droite de la barre de recherche (et à gauche de l'icône +), il y a une icône avec un rectangle et une flèche sortant, cliquez dessous.



Vous aurez ensuite le choix entre différentes options, choisissez "Sur l'écran d'accueil".


Puis cliquez sur "Ajouter".


Et voilà, vous avez votre propre icône !


Écrire commentaire

Commentaires: 15
  • #1

    Les poneys du soleil (mardi, 05 mai 2015 21:15)

    Petit tuto rigolo, avez vous oubliez l'univers Google, Android ?

  • #2

    Ze Tuto (mardi, 05 mai 2015 22:04)

    Bonsoir @Les poneys du soleil,

    Je viens de faire un test en ajoutant un raccourci vers mon site sur un téléphone Android (ainsi que sur une tablette Android) et je vois que mon icône (Apple) a bien été reconnu.

  • #3

    Solie (mercredi, 27 mai 2015 07:15)

    Merci, c'est super !

  • #4

    Vandimarco (mardi, 29 septembre 2015 11:52)

    Bonjour et merci pour votre post,

    Avez-vous une astuce pour insérer cette fonction sur un site Prestashop ?

  • #5

    ZeTuto (samedi, 03 octobre 2015 12:05)

    Bonjour @Vandimarco,

    Voilà pour vous : https://www.prestashop.com/forums/topic/397430-insérer-code-de-suivi-dans-le-head-dune-page-prestashop-en-particulier/

    Cordialement

  • #6

    lambert (vendredi, 19 août 2016 14:40)

    bonjour,
    pouvez vous m aider pour mettre mon logo en icon iphone
    merci

  • #7

    lambert (vendredi, 19 août 2016 14:43)

    j'ai mis ce code et cela ne fonctionne pas
    <link rel="apple-touch-icon" href="https://www.dropbox.com/s/0nke0ndz6423p1r/logo%20lones%20%281%29.png?dl=0" />

  • #8

    ZeTuto (samedi, 17 septembre 2016 13:39)

    Bonjour @lambert,
    Le lien est introuvable,
    quelle est l'adresse de votre site ?

  • #9

    ZeTuto (samedi, 17 septembre 2016 13:43)

    @lambert
    Bonjour, est ce que vous utilisez Jimdo ? Quelle est l'adresse de votre site ?

  • #10

    brigitte (lundi, 07 novembre 2016 19:20)

    Bonjour,
    Comment savoir l’adresse de mon favicon sur mon site Jimdo?
    Mercid’avance pour votre réponse.

  • #11

    ZeTuto (dimanche, 30 avril 2017 08:46)

    Bonjour Brigitte,
    Pour cela, il faut aller dans le code source de votre site (sur une de vos pages, effectuez un clic droit, puis "Afficher le code source", l'expression pour afficher le code source change selon le navigateur, mais vous ne devriez pas avoir de mal à trouver). Recherchez ensuite un code similaire au suivant :

    <link rel="icon" type="image/png" href="favicon.png" />

    Au lieu de favicon.png, il y aura l'adresse de votre favicon.

  • #12

    ID (lundi, 30 juillet 2018 12:22)

    Merci beaucoup ^^

  • #13

    Mireille (jeudi, 16 avril 2020 09:13)

    J'ai mis l'application de ma banque sur mon portable; comment faire pour faire apparaître le logo sur le devant de mon écran? J'ai 70 ans et ne suis pas très douée! Merci d'avance.

  • #14

    Le caca (jeudi, 16 avril 2020 15:01)

    Moi jve juste changer mes icone sur les appli et jtrouve pa

  • #15

    Olivia Richard (mercredi, 22 avril 2020 09:20)

    e suis ici pour témoigner au sujet d'un grand lanceur de sorts à base de plantes appelé Dr. Padman qui m'a aidé à guérir mon VIRUS HERPES SIMPLEX. J'ai été infecté par le VIRUS HERPES SIMPLEX en 2016, je suis allé dans de nombreux hôpitaux pour y guérir, mais il n'y avait pas de solution moi-même jusqu'à ce que je connaisse le Dr Dr Padman par le biais d'un ami qu'il a guéri du VIH. Je l'ai contacté et il m'a envoyé son remède à base de plantes que j'ai pris comme il me l'a ordonné de faire pendant quelques jours et je suis allé à l'hôpital après avoir consommé son phytothérapie et j'ai été confirmé herpès négatif après des années de douleurs et de souffrance, c'est en effet un miracle, est un grand homme, j'ai tellement entendu parler de la façon dont il a aidé beaucoup de gens, si vous avez un problème, vous pouvez le contacter pour de l'aide. ou ajoutez-le sur WhatsApp +19492293867 .vous pouvez me contacter pour plus d'informations via: (padmanlovespell@yahoo.com)