Afficher des logotypes nets sur iPad en SVG

Oui, il n'y a pas que le PNG dans la vie…!
dans | dans mon bocal | potager | typo |

En toilettant urbanbike avec l'aide de @doopix et @monarobase, j'apprends des tas de choses plus ou moins compliqués.

Mais dans la série astucieuse (et pas compliquée) pour affichage sur écrans Retina, opter pour d'autres formats que les sempiternels .jpg ou .png n'est pas inutile.

Enfin, quand c'est possible.

Le seul hic est de mettre les utilisateurs de vieux navigateurs hors course. En même temps, vu la masse de lecteurs d'urbanbike, si j'en perds 50 % (sic !), cela me vaudra que deux mails de protestation auxquels je répondrais bien volontiers. J'deconne !

Jusqu'à présent, j'exportais mes logotypes (…vous savez ces trucs avec écrit en gros urbanbike ou photager…!) en .png mais au double de la résolution native, soit 150 en lieu et place du sempiternel 72 dpi.

Cela permettait d'avoir un affichage pas trop vilain sur l'iPad.

Et puis, en discutant avec Richard de @monarobase, il évoque le format SVG que je connais par ailleurs (…pour mémoire, Inkpad exporte en SVG) mais que je n'emploie jamais pour le web. Erreur !

@urbanbike

Avertissement, cela ne fonctionne de manière optimale que pour des éléments vectorisés. Et comme il s'agit ici de deux logotypes, démonstration.

@urbanbike

Comme vous pouvez le vérifier par vous même, en pinçant l'écran du iPad (ou d'un iPhone sur la version non mobile) pour zoomer, c'est juste impeccable et le poids des fichiers fort léger.

@urbanbike

Bien entendu, cela fonctionne aussi sur un Mac avec ⌘ + activé plusieurs fois pour grossir le contenu affiché de votre navigateur…

Merci @monarobase pour ce point de détail fort utile…!

Note de fin : si vous débarquez sur leur site, c'est vieillot car leurs développeurs n'ont pas le temps de s'en occuper, ensevelis sous les demandes exigeantes des clients… Bon, les gars, ça vient là…? Hop, je sors le fouet…!

Markdown et typo | 2

Un constat en passant
dans | dans mon bocal | écrire | iOS | typo |

Ces derniers temps, j'ai pondu (…le terme n'est pas heureux mais il traduit assez bien mon sentiment !) quelques billets dédiés aux traitements de texte. J'ai listé les avantages des uns et des autres, évoqué leurs barres additionnelles, etc.

Mais il y a un point de confort sur lequel je souhaite ouvrir une petite parenthèse (…quitte à la refermer aussitôt !), celle des typos proposées par ces produits.

@urbanbike

Mon premier brouillon saisi au départ dans Daedalus touch…

De fait, tous ces applications proposent, peu ou prou, les mêmes déclinaisons. Plus amusant, ces derniers temps, l'Helvetica Neue — avec sa variante light — fait son apparition (étrange, non ?!).

  • Ce même texte copié et collé dans 1Writer (détail et vue d'ensemble)

@urbanbike

@urbanbike

J'ai pour ma part apprécié la Meslo mais également la Inconsolata. Et bien sûr, la Source code pro proposée par Adobe (que j'emploie sous OSX en définitive (voir cette chronique sur urbanbike)). Je n'ai pas dédaignée Avenir, Ubuntu ou Anonymus Pro.

Seul iA Writer et Daedalus touch sortent du lot.

  • Dans le cas de iA Writer, son unique typo a été dessinée (à confirmer) par son developpeur.

@urbanbike

@urbanbike

  • Pour Daedalus touch, le choix de la Goudy Bookletter 1911 que je trouvais bizarre au tout début de mes premiers textes s'est imposée peu à peu.

@urbanbike

@urbanbike

C'est celle que je privilégie quotidiennement…

Et tu veux en venir où ?

Nulle part, juste insister sur ce point qui paraît anodin et qui s'avère aussi important que les marges gauches et droites, la taille de la typo et de son interlignage.

Bref, rappeler que tester les différentes typos de son traitement de texte n'est pas une perte de temps mais, un peu comme on prend le volant d'une voiture en réglant son siège et ses rétros, permet de mieux se caler pour écrire.

C'est tout !

Note de fin : @doopix m'indique que la typo de iA Writer est en fait la Nitti dessinée par Pieter van Rosmalen

Markdown et typo

Mais pourquoi saisir ou baliser triste…?!
dans | écrire | outils | typo |

Encore un élément de plus en faveur du Markdown et des traitements de texte minimalistes que nous pouvons employer sur nos écrans, ici celui de mon portable… Le choix de la typo…

Trois événements — dans l’ordre — m’ont conduit à tester la Dolly Pro italique sur Byword ce soir…

  • Hier, j’ai chargé la Goudy Bookletter 1911 pour l’employer dans Ulysses III et ainsi retrouver l’esprit de ce que je vois/lis sous Daedalus touch. Pour mémoire, elle est dans le domaine public… Et donc très agréable d’avoir la même ambiance typographique sur mon Mac et mon iPad…
  • Ensuite j’ai reçu d’Underware au titre de vieux et fidèle client — qui s’est déjà offert la Bello Pro et la Liza en son temps — un courriel me proposant de télécharger une typo gratuitement… Tiens donc…? Bien entendu, l’idée est également de suggérer à l’auteur de ces lignes un passage sur leur site et, accessoirement, de déclencher une envie irrépressible d’achat de fontes (…ils y sont presque arrivés… [1]).
  • Enfin, un petit mail sympa de Flô (mais restons discret…!)… Or il se trouve qu’elle emploie dans son courriel de l’italique pour ses citations et que j’ai trouvé cela très chouette…

— Bon, et alors me direz-vous…?

Tout ceci m’a conduit enfin à cliquer sur le lien d’Underware et de suivre leur proposition, de choisir enfin dans leur bibliothèque de typos la Dolly Pro… italique…!

— Ah, mais c’est ballot, tu aurais du prendre la Dolly Pro roman

Certes, en toute logique cartésienne, j’aurais du. Sauf que non…!

Difficile de résister, non…
Difficile de résister, non…

Comme il nous est possible de tester en direct sur leur site la typo en entrant un bout de texte, j’ai été attiré par ses jambages (…elle a… de belles gambettes, c’est vrai…!!)… Et hop, cet italique a atterri dans mon FontAgentPro.

Je disais que je l’ai testée sous Byword sous OSX et je la trouve très élégante, agréable à l’oeil.

— Oui, mais comment tu fais pour voir l’italique avec ta typo italique, hein…?

Héhé…! Permettez-moi de vous rappeler que je balise en Markdown et que dans mon brouillon de saisie, un mot en italique est entouré de part et d’autre par un astérisque… Pas plus compliqué que cela pour discerner ce qui est en italique de ma saisie… en italique…! Une fois copié dans WordPress ou transformé en code HTML, c’est bien la typo du site — plus exactement, de la CSS — qui prend la main… Et puis, si souci, je fais appel à Marked, CQFD.

Ce que je lis sur mon écran en mode saisie…
Ce que je lis sur mon écran en mode saisie…

Ensuite, dans Byword, les balises sont atténuées en gris léger et ne nuisent nullement à la lecture… À moi, tapoteur consciencieux, de relire mon texte à l’aune de ces informations subtiles et discrètes, de passer outre des ligatures…!

Mais quel plaisir de juste saisir ainsi son billet en lieu et place de la très efficace Source Code Pro. D’autant que c’est rien de changer d’ambiance typographique selon ses besoins…


  1. Vous avez vu ses petites capitales en regular…? Et ce gras splendide, hein…? Non, je résiste, je résiste…  ↩

Yemen, cité des écritures

Hugues Fontaine et Mounir Arbach
dans | ailleurs | mémoire | typo | voir |

Vu le temps frais qui s’abat sur nos régions — tout le monde ne vit pas à Kunming, Yvon…! — , pas mal de repartir en photos dans un coin du monde un peu plus… chaud.

Hugues Fontaine (photographe et réalisateur de cet ouvrage) et Mounir Arbach (épigraphiste) nous emmènent dans leurs bagages dans les parages de Ma’rib.

Au lieu de lire la courte page dédiée sur wikipedia, s’emparer de ce livre est d’emblée une invitation au voyage dans ce paysage étonnant de sable et de typographies…

@urbanbike

Toutes les pages de ce livre sont en couleurs mais plutôt que de rater le rendu chromatique avec la lumière ambiante, photographier en noir et blanc quelques pages de ce chouette livre fonctionne pas mal…! Et là, j’ai évité les grandes doubles pages sublimes…

@urbanbike @urbanbike @urbanbike

Yemen, cité des écritures
Hugues Fontaine et Mounir Arbach
Français et résumé en arabe
Éditions Le bec en l’air
9782916073156 | 49,50 € pour 240 grandes pages — 25 x 32 cm — quadri

image caddie

@urbanbike

Bref, livre à s’offrir ou à offrir…

FontAgent Pro 5 sur Mac

Gérer ses typos sous Lion et Mountain Lion
dans | dans mon bocal | pratique | typo |

Utilisateur depuis la première heure de FontAgent Pro ([1]) après l’abandon d’ATM par Adobe ([2]) dans les années “biiiip”, je me suis décidé à basculer sur la version 5 le jour de la fête des Morts. Bon, c’est moi qui ai failli y passer tant j’ai eu de soucis…!

Il y avait deux voies qui s’offraient à moi : revenir via mon dernier back-up préventif à la situation précédente, option certes peu satisfaisante.

Ou réussir cette installation en ne faisant plus fi des problèmes rencontrés, voire en les éliminant enfin !

La première option a tenu la corde car je savais que cela risquait d’être long. Heureusement, démarrer ce type de marathon avant un WE permet, à tout le moins, de ne renoncer que le dimanche midi en cas d’échec. Néanmoins, pas question de continuer comme sous OSX 10.6.x à fonctionner avec un dispositif boiteux.

Dès samedi matin, je savais que la partie était gagnée au prix d’ultimes réglages (…oublis de quelques typos clés en cours de route) et réouvertures d’anciennes maquettes pour s’assurer de la pérennité de l’installation.

Alors, c’était quoi le problème ?

Classic, l’éternel retour !

En cause, mes anciennes polices classic. Oui, dans mes bibliothèques système, des typos fort anciennes traînent là depuis des lustres et sont employées dans d’anciens projets, maquettes qui peuvent reprendre du service à l’occasion d’une réédition et du changement de valeur d’un dos bibliothèque.

Bref, je savais déjà que cela n’était pas très propre ces derniers mois mais là, plus question de laisser en l’état et de faire comme si. Un nettoyage intégral était devenu nécessaire, indispensable même.

Les typos actives dans FontAgent Pro et pourtant bien localisées dans le dossier ad hoc ne s’affichaient plus dans InDesign… Enfer et damnation…!

@urbanbike

Pire, vendredi, ma machine refusait de s’éteindre ou de redémarrer correctement, l’usage de smasher 2.0 comme d’Onyx pour vider les caches ne servait manifestement à rien.

@urbanbike

Et toujours une vieille typo système active à chaque lancement de FontAgent Pro !

Réinstallation complète

Le support technique par courriel de FontAgent Pro m’a indiqué quelles ressources (pas tout !!!) virer dans la library pour reconstruire ma base de données (merci Bob et Erik) mais le problème, dans mon cas, était nettement plus profond, ces vielles typos actives resurgissant désespérément.

@urbanbike

Du coup, j’ai opté pour un nettoyage complet.

  • désinstallation totale et propre de Smasher et de FontAgent Pro
  • suppression de tous les fichiers connexes de ces applications dans la bibliothèque (…même pas peur)
  • duplicata préalable sur un disque externe de toutes mes typos déjà rangées par FontAgent Pro (inconscient mais pas trop quand même)
  • suppression de toutes les fontes contenues dans le dossier des sets attaché à FontAgent Pro sachant que je conservais là des vieilleries devenues, elles, totalement inutiles.
  • nettoyage des caches plutôt deux fois qu’une
  • réinstallation de FontAgent Pro comme si c’était la première fois (…de l’intérêt de conserver l’historique de tous ses numéros de série)
  • récréation de la base de données de mes typos avec un nombre limité de dossiers mais via une ventilation par fondeur et type en employant le système des ensembles disponible dans FontAgent Pro
  • vérification en cours de route que tout suivait correctement sous inDesign et autres
  • une fois validé, un coup de SuperDuper! ([3]) pour backuper mon système revu et (revenu) opérationnel sur deux clones

C’est à ce prix-là que j’ai retrouvé ma sérénité, de la vitesse à l’ouverture de mes dossiers de travail et de l’espace disque en virant ces typos inutiles conservées au cas où, en privilégiant celles de Jean-François Porchez, Lucas de Groot, Mark Simonson, Luce Averous (je suis un inconditionnel de sa verveine) sans oublier celles de Hoefler & Frere-Jones et de bien d’autres fondeurs.

Certes ces opérations de nettoyage et de réinstallation m’ont coûté en termes de temps passé mais cela a plein d’aspects positifs.

  • exhumer des typos achetées il y a fort longtemps et jamais employées (…ou si peu, je pense à la Rumba de Laura Meseguer ou à la Bello de chez Underware), adresser un salut fraternel par la pensée à Thierry Puyfoulhoux en retrouvant sa BigCity. Etc.
  • Constater en situation que le tri alphabétique réalisé par la version précédente de FontAgent Pro n’a pas de prix. Ce qui m’a permis de glisser aisément mes collections dans leurs nouveaux dossiers destinations.

Et me rendre compte à nouveau que, pendant des années, j’ai acheté des typos juste pour le plaisir de savoir que je pouvais un jour (sic !) les proposer dans un projet. Bon, pas de DA fonts dans mes tiroirs numériques mais beaucoup de typos achetées chez p22.com ou MyFonts.com.

Le dernier point positif a été de virer les derniers doublons en privilégiant bien sûr les OTF. Il m’a été assez facile de découvrir que je conservais parfois deux jeux des mêmes typos sous deux formats différents. Très simple désormais en affichant l’icône associée de repérer les fontes postscript, TrueType ou OpenType pur jus OTF.

Les “plus” de la version 5

Comme toujours, l’auto-activation des typos dans les suites Créative Suite Adobe, de la 5, 5.5 à 6. La possibilité d’opter pour un ajout des typos ouvertes par un fichier dans la catégorie polices qui s’ouvriront — ou non — à l’ouverture du Macintosh.

La gestion de plusieurs typothèques en parallèle également. Là, j’ai réduit et suis passé d’un set par fondeur (soit une trentaine d’espaces à gérer, ce qui est assez ballot à l’usage) à trois sets en tout et pour tout. Dont un rempli exclusivement des vieilles fontes classic que je mets un point d’honneur à ne plus ouvrir.

Utiliser plus intelligemment les ensembles pour retrouver en un clic les typos manuscrites ou de titraille. Visualiser en une seule opération la ou les graisses d’une typo donnée ou comparer des polices…

@urbanbike @urbanbike

Mais le plus intéressant est de pouvoir afficher désormais dans FontAgent Pro le contenu des glyphes d’une typo, ne visualiser que les ligatures présentes par exemple, etc.

@urbanbike @urbanbike

Bref, me voici paré pour de nouvelles missions. Si elles veulent bien se donner la peine de me parvenir, CQFD.

Oui mais quid des fontes système en vigueur ? Jocker ! J’avoue que je ne m’en soucie pas car j’appelle directement dans les applications que j’emploie les typos idoines que j’en ai besoin. Certes, le système ajoute un paquet de fontes dont je n’ai — strictement — rien à faire et il me serait possible d’en masquer certaines. Ceci sera l’objet d’un prochain billet si j’ai le courage de mettre en place une solution adéquate puis de rédiger un billet…! Or, avec des si…


  1. Voir le site de l’éditeur… FontAgent Pro  ↩

  2. Lire cette chronique sur urbanbike à propos d’ATM et FontAgent  ↩

  3. Lire ce billet à propos de… SuperDuper!  ↩

Toilettage d’urbanbike | 2

Typos…?
dans | dans mon bocal | groummphh | typo |

Pour moi, c’était quasi réglé…

Et puis les copains se mettent à vous indiquer quelques pistes, liens, options. Tssss…! Et vous plombent le WE. Bref, ce qui suit est de la faute de Thierry et de Benoît (ils se reconnaîtront)…!

Et tes typos, au fait…?

Les deux zigotos mentionnés sont des pros à la différence de votre serviteur… Du coup, j’ai commencé à bricoler ma CSS (…en laissant des tas de trucs obsolètes en place). Mais en gros, je m’achemine vers ça (…à droite sous Safari et Firefox versus la disposition actuelle à gauche).

@urbanbike

Et sur iPad, cela donne ça (non, ce n’est pas responsive)…

@urbanbike

Pas d’époustrouillants changements et, en cas de malaise du serveur source, retour au Verdana de base…! Cette solution s’appuie sur des typos libres de droit — sauf s’il s’avère que je me suis totalement fourvoyé/illusionné. Ce qui n’est jamais impossible…!

Basculement un de ces jours. Ou pas. Bon, surprise, c'est fait…!

À suivre.

Note : Bon, je le sais, le seul signe non encodé correctement dans ces typos de chez Adobe (non…? Si…!) est le e dans l’o… oe… Démonstration : œ. Moche…! Deux options, un recherche-remplacement global dans la base des textes (5 secondes sous ExpressionEngine). Ou attendre que cela soit modifié chez Adobe. Comme je suis un éternel optimiste, j’attends une version ajustée sur le serveur d’Adobe.

image du monde végétal — close-up
logotype d'urbanbike

Sans oublier…!

image

les liens vers des billets proposés sur…

image

cf. lien publié le 2014-04-23 16:44:31 GMT

cf. lien publié le 2014-04-23 15:22:37 GMT

cf. lien publié le 2014-04-22 18:19:30 GMT

cf. lien publié le 2014-04-22 18:18:59 GMT

cf. lien publié le 2014-04-22 17:56:44 GMT

cf. lien publié le 2014-04-22 17:53:11 GMT

cf. lien publié le 2014-04-22 17:47:34 GMT

cf. lien publié le 2014-04-22 17:39:24 GMT

cf. lien publié le 2014-04-22 17:37:26 GMT

cf. lien publié le 2014-04-22 17:29:34 GMT

cf. lien publié le 2014-04-21 17:20:42 GMT

cf. lien publié le 2014-04-21 17:10:39 GMT

cf. lien publié le 2014-04-21 17:09:06 GMT

cf. lien publié le 2014-04-21 17:01:08 GMT

cf. lien publié le 2014-04-21 16:50:11 GMT

cf. lien publié le 2014-04-21 16:47:30 GMT

cf. lien publié le 2014-04-20 15:27:45 GMT

cf. lien publié le 2014-04-19 17:11:13 GMT

cf. lien publié le 2014-04-19 17:02:29 GMT

cf. lien publié le 2014-04-19 16:52:29 GMT

Ailleurs… | blogroll…
Follow me on App.net
image