Comment créer un logo SVG BIMI

Créer un logo BIMI qui réponde à toutes les exigences

Le logo du BIMI doit répondre à un certain nombre d'exigences avant de pouvoir être affiché dans la boîte de réception. Si le logo ne répond pas à ces exigences, il ne peut être présenté. Lisez la suite et découvrez quelles sont les exigences BIMI et comment créer un fichier SVG valide.

Veuillez noter que le groupe de travail BIMI est l'autorité qui définit les spécifications. Les exigences et le "mode d'emploi" ci-dessous peuvent faire l'objet de mises à jour ou de modifications.

Exigences relatives au logo BIMI

• Veillez à ce que le logo soit vectoriel. Les fichiers portant l'extension : PDF, Ai SVG ou EPS sont souvent des fichiers vectoriels. En cas de doute, veuillez contacter le concepteur.
• Format : SVG Tiny 1.2
• Dimensions du logo : carré
• Le logo du BIMI doit être publié sur un domaine disposant d'un certificat SSL (https).

Comment créer un fichier SVG BIMI validé ?

• Ouvrez votre fichier dans Adobe Illustrator

  Commencez par une version vectorielle de votre logo.

• Enregistrer au format SVG

  Allez dans Fichier > Enregistrer sous, puis sélectionnez SVG (et non SVGZ). Choisissez un nom de fichier simple : en minuscules, sans espaces, sans traits de soulignement ni caractères spéciaux. Par exemple : brand-name-bimi.svg

• Appliquez les paramètres d'exportation appropriés

  Dans la boîte de dialogue d'exportation SVG, définissez le profil SVG sur « SVG Tiny 1.2 » et l'emplacement de l'image sur « Conserver ».

• Ouvrez le fichier dans un éditeur de texte ou un éditeur de code

  N'importe quel éditeur de texte fera l'affaire — TextEdit sur Mac ou le Bloc-notes sur Windows si vous ne disposez pas d'un éditeur de code.

• Modifier le profil de base

  À la ligne 3, recherchez « baseProfile="tiny" » et remplacez-le par « baseProfile="tiny-ps" ».

• Supprimer les attributs x/y

  Sur la même balise svg<, supprimez les attributs x="0" et y="0" s'ils sont présents.

• Ajouter un élément « title »

  <Après la balise svg< et avant la <g> balise g>, ajoutez : <title>Nom de la</title> marque. Veillez à ce que le titre ne dépasse pas 65 caractères. 

• Enregistrez le fichier

  Enregistrez le fichier SVG modifié. Votre fichier est désormais prêt à être téléchargé.

• Téléchargez le fichier SVG sur votre serveur

  Hébergez le fichier sur le même domaine que celui sur lequel votre enregistrement DNS BIMI est publié.

Dépannage du fichier SVG BIMI

Vérifiez si le logo BIMI contient des images bitmap

Pour savoir si une image bitmap a été ajoutée, vérifiez le fichier SVG. Il existe plusieurs façons de vérifier le code source d'un fichier SVG. Deux d'entre elles sont mentionnées ci-dessous :

• Enregistrez/téléchargez le fichier SVG (option 1) > Ouvrez le fichier SVG dans TextEdit (Mac) ou le Bloc-notes (Windows)
• Ouvrez le fichier SVG dans Google Chrome (option 2) > Affichez le code source (afficher le code source via « > developer » > ) > Une fois le code source affiché, recherchez : img/ 

Si la recherche donne un résultat, on peut supposer que le fichier SVG contient une image bitmap et ne correspond donc pas aux directives du logo BIMI.

Exemple :
Lorsque la ligne suivante (file.Xlink:href="data:img/png;base64, i) est détectée, le fichier SVG contient une référence à un fichier PNG (bitmap).

Solution
Demandez au concepteur du logo de modifier le fichier afin qu'il soit entièrement vectoriel.

Fichiers SVG volumineux sans images bitmap

Il est possible que le fichier SVG ait été créé d'une manière différente et qu'il contienne donc plus de code (inutile).

Solution
Dans ce cas, ouvrez le fichier SVG dans Adobe Illustrator et suivez les étapes mentionnées ci-dessus. Cela permettra de créer un fichier SVG correctement encodé.

Ressources complémentaires

• La spécification SVG BIMIcomplète
• Plus d'informations sur la création de fichiers SVG avec Adobe Illustrator