Vous cherchez à résoudre un problème d’intégration de votre logo sur votre site WordPress ? Il apparait pixélisé ? Bien intégrer son logo sur son site internet est fondamental pour l’image d’une entreprise, mais encore faut-il qu’il soit d’une assez bonne qualité. S’il est pixélisé, vous aurez peu de chance de convaincre un internaute que votre marque est importante. Sur cet article, nous allons voir ensemble comment intégrer parfaitement votre logo sur WordPress !

Pourquoi mon logo est-il pixelisé ?

Le fameux logo pixélisé, à quoi ressemble-t-il ? Il est composé de petits carrés en faible quantité qui finalement déforment totalement les formes du logo. La typographie est également directement impactée, il va sans dire qu’un logo pixélisé peut être dévastateur pour l’image de votre entreprise !

Sachez que le logo peut valoriser votre entreprise d’une façon considérable ! Mais pour cela, il est important de l’afficher proprement, sans dégradation de couleurs ou de formes.

Il y a 3 principales raisons au fait que votre logo apparaisse pixélisé sur WordPress :

  • Il se peut que l’image soit exportée en plus petite résolution que l’originale, puis agrandie manuellement à l’intégration. Par exemple, c’est bien le cas de beaucoup de logos comprenant des ajustements de taille en CSS, et en augmentant fortement la résolution initiale.
  • Sur WordPress, le problème le plus commun se trouve au niveau des redimensionnements automatiques des médias, comme pour les vignettes WooCommerce. Vérifiez donc si vous possédez une extension qui redimensionne les images si vous avez un logo pixélisé sur votre site internet.
  • C’est également possible que le logo ait été conçu sur un logiciel comme Photoshop, qui n’est finalement pas destiné à la création d’un logo, mais à l’édition d’images matricielles. Ce qui rejoint finalement le fait qu’il soit exporté en mauvaise résolution.

Pour analyser tout cela, l’inspecteur d’élément de Google Chrome vous facilitera la vie. Vous pouvez vérifier :

  • La taille initiale du logo (la taille du fichier et la taille après le redimensionnement)
  • Le format du fichier
  • Vous pourrez également analyser son poids ( si votre logo dépasse les 100ko… c’est à optimiser )

Vectoriser un logo pixelisé : comment faire ?

Pour résoudre ce problème et intégrer un logo de qualité sur votre site web, vous devez utiliser un fichier vectoriel de votre logo qui peut être redimensionné sans perdre en qualité.  La meilleure façon de réparer un logo pixelisé est de le recréer à partir de zéro. Cela peut sembler être une tâche plutôt compliquée, mais c’est en fait assez simple si vous disposez des bons outils.

Vectoriser le logo avec Illustrator (ou autre logiciel vectoriel)

Tout ce dont vous avez besoin est un programme d’édition vectoriel comme Adobe Illustrator. Avec Illustrator, vous pouvez recréer facilement votre logo en haute résolution. Ainsi, il aura un aspect net et clair, quel que soit l’endroit où il sera imprimé.

Pour vectoriser votre logo sur Illustrator, vous avez deux possibilités :

  • Vectoriser votre logo automatiquement (à prendre avec des pincettes)
  • Vectoriser manuellement en repassant sur chaque point d’ancrage de votre logo (avec par exemple l’outil « plume »)

Il existe évidemment de nombreux autres logiciels d’édition vectoriels qui peuvent faire tout aussi bien l’affaire. Veillez simplement à choisir un programme facile à utiliser et doté de toutes les fonctionnalités dont vous avez besoin.

Exporter le logo au bon format

Lorsque vous disposez d’un fichier vectoriel de votre logo, il est important de l’enregistrer dans le bon format.

Si vous intégrez votre logo sur une carte de visite, il ne s’agit pas du même type de fichier que sur un site web. Il faut que vous preniez compte du format de logo dont vous avez besoin, selon votre support.

Vous devez enregistrer votre logo dans plusieurs formats afin de pouvoir l’utiliser dans différentes situations.  

Par exemple, vous pouvez avoir une version PNG de votre logo pour une utilisation numérique et un fichier vectoriel EPS pour l’impression.

Une fois que vous avez une version de haute qualité de votre logo, vous pourrez ensuite l’utiliser sur tous vos supports marketing.

Comment intégrer un logo vectoriel dans WordPress ?

Télécharger le plugin SVG Support

Le plugin SVG Support est une excellente solution pour passer les règles par défaut que propose WordPress, à savoir la non-autorisation d’insertion de fichier SVG dans les médias. Pour outre-passer cette règle, vous pouvez simplement télécharger et installer l’extension SVG Support.

Avantage ? Aucun réglage à établir, vous avez seulement besoin d’activer le plugin.

Importer votre logo dans les médias

Vous pouvez ensuite intégrer votre logo dans les médias de WordPress sans la moindre difficulté.

Intégrer le logo en front-end

Il y a différentes façons d’intégrer votre logo sur WordPress, mais la plus commune est de l’importer sur les réglages de votre thème. Cependant, il se peut que certaines fonctions du thème n’incluent pas l’autorisation de télécharger un SVG sur la page. Il faudra donc l’intégrer autrement, voici quelques méthodes :

  • Sur votre éditeur de page (en code HTML brut)
  • Dans le fichier de votre thème header.php

Cette solution est-elle valable sur tous les sites web ?

Je pense très sincèrement qu’intégrer son logo au format vectoriel est la meilleure solution. Elle consiste à améliorer la qualité du rendu ainsi qu’avoir la main sur le développement CSS sur le format SVG. D’ailleurs, il s’agit d’un excellent moyen de développer des illustrations animées sur une page web.

Oui, intégrer un logo sans pixel est possible sur n’importe quel site web. Cette solution est valable sur tous les CMS proposant l’ajout de format SVG, qu’il soit au biais d’une extension ou non. S’il est possible pour vous d’accéder au CSS de votre page, vous pourrez également créer des animations ou colorer votre logo uniquement en code.

J’aimerais savoir : Quelle(s) solution(s) utilisez-vous pour l’intégration de votre logo sur WP ? Écrivez-les dans les commentaires afin de les partager à la communauté de Webmarketing & c’om !

A PROPOS DE L’AUTEUR

Kevin BENABDELHAK : Graphiste professionnel, représentant société de la société K-GRAPHISTE

Facebook – Site