Modifier une police TrueType

Voir en ligne : Tester la police

Dans le cadre d’une mise à jour du site de mon oncle Henri Tournier, je me suis dit qu’il valait mieux, pour des raisons d’automatisation, utiliser une police de caractères en CSS plutôt qu’en image pour les menus.

La police Samarkan originale
La police Samarkan originale

Mon frère Pierre, qui s’était occupé du design du site, avait utilisé pour les menus la police Samarkan, qu’il avait modifiée via Photoshop afin d’en supprimer les barres horizontales qui gênaient la lisibilité sur de trop petites tailles. Cela n’étant pas possible avec une intégration directe en CSS, il nous faut un moyen de modifier la police elle-même.

Le menu du site, avec la police Samarkan modifiée, en version image.
Le menu du site, avec la police Samarkan modifiée, en version image.

Modifier la police

Une courte recherche sur Internet m’a permis de découvrir TTFEdit, sous licence GPL v2, qui est très simple d’utilisation.

Une fois l’archive extraite dans un répertoire, il suffit de lancer ttfedit.jar. Dans la fenêtre, ouvrez (File -> Open) le fichier TTF que vous souhaitez modifier, puis cliquez sur l’onglet glyf du menu de gauche. Une fenêtre apparaît avec chacun des caractères.

L'interface de TTFEditor
L’interface de TTFEditor

Édition de la lettre « g »
Édition de la lettre « g »

Pour modifier un caractère, il suffit de double-cliquer sur sa représentation. Une fenêtre d’édition apparaît, avec le contour de la lettre en fil de fer. Avec l’outil de suppression de points (Croix blanche sur fond rouge), cliquez sur les sommets que vous voulez supprimer puis, quand la lettre est correcte, sur la croix en haut à droite pour fermer l’outil. Dans ce cas précis nous avons de la chance, les modifications à apporter sont simplissimes. Recommencez pour toutes les lettres (Exceptés le f et le t), puis sauvegardez votre police ainsi modifiée (File -> Save as).

La police Samarkan modifiée
La police Samarkan modifiée

Intégrer la police dans une page Web

En suivant le tutoriel d’Alsacréations, on arrive à créer une page web utilisant la nouvelle police très facilement. Toutefois, pour que l’astuce fonctionne sous les anciennes versions d’Internet Explorer, de Firefox et de Google Chrome, il faut des polices aux formats respectifs EOT, WOFF et SVG. J’ai trouvé un éditeur qui semble fonctionner à la perfection pour la génération de tous ces fichiers à partir du TTF original : Font2Web.

La police ne possédant pas de caractère accentué, il faudra convertir ces derniers avec la méthode utilisée pour générer une url :

$str    =       iconv('utf-8', 'us-ascii//TRANSLIT', $str);

En fonction du réglage serveur, il sera peut-être nécessaire d’ajouter, en début de script, la fonction suivante, comme précisé dans l’article :

setlocale(LC_CTYPE, 'fr_FR');

Avec un peu de CSS, nous obtenons l’image suivante :

Le menu du site, avec la police Samarkan modifiée, en version police web.
Le menu du site, avec la police Samarkan modifiée, en version police web.

Soucis rencontrés

La police est testée avec les versions les plus récentes des navigateurs (Firefox, Internet Explorer 9, Chrome, Safari et Opera), sans souci particulier. Toutefois, sous Chrome (Version 24.0.1312.52 m), avec une taille de 18px, la police semblait un peu trop grasse, ce qui n’est pas le cas avec Chromium.

Voir en ligne : Tester la police

Post-scriptum :

Attention : la police Samarkan n’est pas libre de droits ; elle est distribuée en Shareware. J’ai tenté de contacter ses auteurs pour leur demander s’il était possible de prévoir un autre moyen de paiement que le chèque postal (Paypal ou autre), mais aucune des adresses mail qu’ils mentionnent dans le fichier readme n’existe encore. J’essaye toujours de trouver un moyen de les joindre.
De fait, sans leur consentement, la modification de cette police de caractère n’est probablement pas autorisée.

Laissez votre commentaire