Comment choisir des typos pour votre site e-Commerce...

comment-choisir-typos-site-vente-en-ligne-1
Conseils pour mieux vendre en ligne : choix de la typo et son impact sur la communication visuelle pour votre site e-Commerce

Vous vous demandez peut-être quelles sont les polices de caractères que vous devriez retenir pour votre  site e-Commerce. Voici l'occasion de passer en revue les critères principaux à prendre en compte pour opérer cette sélection... et un aperçu des erreurs les plus fréquentes dans leur utilisation.

 

 

Vous connaissez désormais les enjeux liés au choix des polices de caractères sur votre site, et leur impact sur vos messages commerciaux. Alors entrons désormais dans le vif du sujet pour déterminer comment bien choisir vos typos.

 

Clarté et lisibilité, deux critères à ne pas confondre. Même si ces deux notions peuvent sembler très proches, il s'agit là de critères parfaitement distincts. D'ailleurs seule une combinaison intelligente de ces qualités permettra de communiquer vos arguments avec efficacité

 

La clarté

 

Chaque lettre a une forme et une structure spécifique qui est conditionnée par la police avec laquelle vous avez décidé de l'habiller. Celle-ci influe notamment sur son épaisseur, sur l'espacement entre les lettres ainsi que sur de petits détails comme les empattements. Une police de caractères avec une bonne clarté se caractérise par la facilité du lecteur à distinguer les lettres les unes des autres. Prenons par exemple la typo Veteran Typewriter pour illustrer ce problème. Lorsqu'elle est utilisée en en-tête ou dans un bandeau on distingue nettement tous les petits détails de chaque lettre.

 


Voilà donc une typo plutôt sympa et bien visible en titre. Cependant si elle est utilisée dans des blocs de texte notez comme les contours de chaque lettre deviennent flous et surtout à quel point il devient difficile de distinguer les traits et les points de chaque caractère. En d'autres mots, lorsque la police Veteran Typewriter est utilisée pour des textes affichés dans des textes de petites tailles, elle perd en clarté.

 

En comparaison avec des accroches dans des bandeaux, les descriptifs des produits sont habituellement rédigés à l'aide de caractère de plus petites tailles. Mieux vaut donc opter pour une typo plus claire comme l'Arial avec des formes plus épurées et des traits bien nets.

 


En optant pour une police de caractères moins sophistiquée et sans empattement le texte gagne indiscutablement en clarté dans les blocs. Pour une clarté maximale dans votre boutique en ligne, mieux vaut donc vous en tenir à l'une des polices suivantes pour vos blocs de textes :

 

- Arial
- Verdana
- Times New Roman
- Crimson Text
- Podkova

 


La lisibilité

 

La lisibilité c'est cette notion qui définit la façon dont les textes sont agencés pour faciliter leur lecture par l’œil des gens. Il y a un certain nombre de facteurs qui peuvent donc affecter cette lisibilité tels que :

 

- L'interlignage : C'est l'espace entre les lignes dans un bloc de texte. En l'absence d'espace suffisant, le bloc de texte perd de son esthétique mais plus grave encore cela entrave le fil de la lecture.

 

- Le crénage ou l’interlettrage : C'est l'espace entre les dessins de deux caractères consécutifs dans un mot ou une expression. L'insuffisance ou l’excès d'espace est susceptible de nuire gravement à la lisibilité d'un texte.

 

- La taille des caractères : Écrit en tout petit le contenu devient difficile à lire. Souvenez-vous de l'annuaire des pages blanches... La taille des textes dépend bien évidemment du contexte visuel et de la charte graphique de votre site. Néanmoins la règle veut qu'il soit sage de ne jamais descendre en dessous du 12 (pixels).

 

- La couleur : Le contraste des couleurs joue lui aussi un rôle important dans la lisibilité. Voici quelques exemples :

 

 

 


Un texte rouge sang peut agacer le cerveau des lecteurs et entraîner plus rapidement un sentiment de fatigue. Un contraste trop faible compliquera le décryptage des mots.

 

 

Un contraste trop élevé causera une vibration des couleurs, alors qu'un bon contraste permet au lecteur d'accéder plus aisément au contenu.

 

La cohérence

 

Imaginez que vous receviez la légion d'honneur des mains du Président de la République au Palais de l’Élysée. Oseriez-vous débarquer en survêtement et en baskets ? C'est exactement la même chose pour votre site de commerce en ligne. Vos typos doivent être en adéquation avec la tonalité de votre site, votre univers et les codes visuels propres à votre secteur d'industrie.  Souvenez-vous, les polices de caractères ont un impact significatif sur le ton et l'ambiance de votre site. C'est pourquoi le principe veut donc qu'il est plus sage de choisir une typo qui correspond aux attentes de votre public cible.


Prenons un exemple comme le site du Monde. Vos vous attendez à y trouver du texte rédigé dans une police avec un certain sérieux. Le Monde à judicieusement choisi d'utiliser le Verdana pour son site

 


 

 


Mais regardez ce qui arrive lorsque on change ces caractères dans une autre police comme le Kunstler Script.

 

 

Pas folichon n'est pas ?  Le Kunstler Script correspond bien à un site plus ludique, mais il ne correspond absolument pas aux codes que l'on attend de la part d'un site comme celui du Monde.

 

Combiner les typos

 

L'association des polices de caractères est loin d'être une science exacte, mais il y a tout de même une certain nombre de principes fondamentaux qui peuvent vous aider à soigner le look de votre site et gagner en professionnalisme. Comme pour le choix des couleurs la règle veut que les contraires s'attirent et qu'ils peuvent être plus facilement combinés. A contrario deux typos similaires entreront en concurrence en et finiront par agacer le cerveau du lecteur.

Voici une application de ce principe :

 

 

 

Sur la gauche, nous avons deux typos avec empattements. Alors qu'elles sont techniquement différentes, leur similitude entraîne une forme de tension visuelle pas très agréable à voir. Sur la droite, nous avons une police de caractères mécane et à empattement, fichtre, quelle différence. La tension disparaît instantanément. En effet, la combinaison de polices plus contrastées permet à chaque caractère de s'exprimer tout en calmant le jeu.

 

Voici d'autres exemples de typos opposées qui se complètent naturellement.

 

 

 

Les erreurs fréquentes à propos des typos :

Les boulettes commises dans l'utilisation des  typos sur les sites sont si fréquentes qu'elles pourraient faire l'objet d'un livre. Mais voici néanmoins les principales fautes de goût que vous devriez ABSOLUMENT éviter.

 

Ne touchez pas aux proportions : Vous devriez toujours utiliser une police telle quelle. On peut bien entendu augmenter ou diminuer la taille des lettres mais celles-ci ne devraient en aucun cas être compressées, étirées ou manipulées et perdre leurs proportions d'origine.


 

 

Fuyez ces typos sur votre site : Disons-le tout de go il y a malheureusement des typos qui ont étés maltraitées, surexploitées et qui sont devenues des symboles absolus de ringardise. Elles sont pourries au point de déclencher des réactions viscérales auprès des infographistes professionnels - allant jusqu'à l'infarctus. Pour votre sécurité et celle de vos proches - restez à bonne distance des typos suivantes :

 

Comic Sans : Comic Sans est une typo de style bande dessinée qui a été créée pour un usage informel. Largement abusé Comic Sans confère désormais instantanément une image d'amateurisme à tout ce qu'il touche.

 

Si vous cherchez une typo fun, ludique ou enfantine essayez plutôt les polices suivantes :

- Flamenco
- Ribeye Marrow
- Autour One
- Unkempt


 

Papyrus : Papyrus a été créé pour ressembler à l'écriture manuscrite sur papyrus comme dans l'Egypte ancienne. Tout comme Comic Sans, elle a été la victime de sa surexploitation et d'une utilisation abusive. Le recours à cette police sur un site renvoie désormais une image ultra-kitch à laquelle plus aucune entreprise digne de ce nom ne voudrait être associée.

Si vous envisagiez d'utiliser Papyrus, voici quelques alternatives qui devraient faire votre bonheur.

- Fondamento
- Quintessential
- Crimson Text

 


En résumé

 

Ne soyez pas intimidé par cette nouvelle étape qui consiste à choisir vos typos pour votre site e-Commerce. Il vous suffit de suivre ces petits principes en n'oubliant pas de vous fier à votre instinct. Si vous cherchiez justement des typos, ou si vous préparez une refonte de votre charte graphique consacrez peut-être quelques minutes à la recherche de typos sur le net.

 

Voici une ressource fantastique pour télécharger des polices de caractères : Google Fonts. Google Fonts c'est la plate-forme par excellence  pour trouver et utiliser des typos libres de droit et prêtes pour le Web. Vous pouvez télécharger et utiliser gratuitement toutes les polices que vous y trouverez.