Ajoutez votre logo et quelques informations pour obtenir toutes les icônes, une image de partage et les balises head dans un seul .zip. Vous obtenez favicon.ico, les icônes PNG et Apple, un manifeste web, une image de partage de 1200 par 630 et les balises head à coller. Votre image ne quitte jamais cet appareil. C'est gratuit.
Comment créer vos icônes et balises, étape par étape
- Choisissez un Logo ou une image, ou déposez-la sur la page. Un logo carré de 512 px ou plus rend le mieux.
- Choisissez le style de l'image de partage : Logo sur couleur ou Photo entière.
- Renseignez le Nom du site, le Titre de la page, la Description, l'Adresse de la page et l'identifiant X.
- Choisissez la Couleur d'arrière-plan et la Couleur du thème, qui teinte la barre du navigateur du téléphone.
- Regardez l'aperçu de la carte de partage et des icônes.
- Appuyez sur Télécharger le .zip et Copier le HTML.
- Importez les fichiers dans votre dossier de fichiers, puis collez les balises dans le head de vos pages.
Ce que contient le pack
favicon.ico contient des icônes de 16, 32 et 48 pixels pour tous les navigateurs. favicon-16.png et favicon-32.png sont les versions nettes qu'utilisent les navigateurs modernes. apple-touch-icon.png sert pour l'écran d'accueil des iPhone et iPad, et les icônes Android plus site.webmanifest servent quand quelqu'un installe votre site. og-image.png est l'image affichée quand votre lien est partagé, et head.html contient chaque balise prête à coller.
Obtenir une bonne image de partage
Les applis de chat et les sites sociaux affichent l'image à environ 1200 × 630, puis la rognent ou la réduisent pour des cartes plus petites : gardez donc le titre court et le logo net. Le style Logo place votre logo sur la couleur d'arrière-plan à côté du titre. Le style Photo remplit la carte avec votre image et place le titre sur une ombre douce, ce qui convient le mieux aux photos larges. Les images de partage demandent une adresse https:// complète : renseignez donc l'adresse de la page.
Vérifier que cela fonctionne
Après avoir importé les fichiers, ouvrez votre page et affichez sa source pour voir les balises. De nombreux sites mettent les cartes de partage en cache : si une ancienne image s'affiche encore, ajoutez une version à l'adresse de l'image, comme og-image.png?v=2, ou demandez à l'outil d'aperçu de lien de la plateforme de récupérer à nouveau la page.
Conseils
- Utilisez un logo simple qui reste lisible à 16 pixels.
- Choisissez une couleur d'arrière-plan qui correspond à votre marque.
- Écrivez une courte description qui donne envie de cliquer.
- Contrôlez ensuite votre page avec l'analyse avant lancement.
Pour un jeu de balises plus complet, comme robots et les détails d'article, voir le générateur de balises meta, et pour une icône seule, le générateur de favicon.
Qui l'utilise
Personnes qui lancent un site personnel, un portfolio, une boutique ou une page de petite entreprise, et développeurs qui veulent créer d'un coup toutes les icônes et tous les fichiers de partage.
Questions
Où dois-je mettre les fichiers ?
Importez tout le contenu du .zip dans le dossier de fichiers de votre site, puis collez les balises dans le head de vos pages.
Ai-je besoin de toutes les icônes ?
Utiliser le jeu complet garantit que votre icône s'affiche bien dans les navigateurs, sur l'écran d'accueil des téléphones et quand votre site est installé.
Mon logo est-il envoyé ?
Non. Tout est créé dans votre navigateur.