3 Septembre 2025
Plus tôt cette année, j'ai eu le plaisir de travailler autour du projet GTnum Forges, qui cherche à évaluer et améliorer l'utilisation des forges logicielles dans le milieu enseignant. Pour être en cohérence avec le projet, les technologies utilisées tant pour le site que pour la production visuelle se devaient d'être libres : les fichiers sources seraient ensuite déposés sur la Forge des Communs Numériques Éducatifs (#ForgeEdu).
Nous avons commencé par un site web simple, conçu avec Jekyll, et des illustrations vectorielles en SVG créées avec Inkscape. Des outils bien rodés qui permettent un flux de travail aussi efficace qu'avec des outils propriétaires (quand Inkscape ne plante pas...)
Il a ensuite été question d'un livret imprimé, présentant les questions juridiques autour des ressources éducatives, des droits associés, et de leur mise à disposition sur les forges.
Afin de continuer sur la même lancée, nous avons opté pour la réalisation du livret via Paged.js, une librairie sous licence libre qui implémente des spécifications CSS destinées à l'impression. Il est facile de générer des documents au format PDF à partir de pages web ; Paged.js permet de mieux contrôler leur format et leur mise en page.
En créant le livret à partir de HTML, CSS et JavaScript, nous souhaitions éviter le recours à des logiciels propriétaires et conserver des fichiers sources facilement lisibles, modifiables et versionnables. C'est également une pratique qui facilite la publication multi-supports, puisque le HTML et CSS peuvent être réutilisés—avec quelques ajustements—sur le web, voire des applications natives.
Mon retour sur l'utilisation de Paged.js est légèrement mitigé. Je pense que c'est un outil fantastique, mais qui en l'état actuel demande des efforts et concessions non négligeables par rapport aux logiciels habituels de mise en page.
Flux de travail
J'ai un profil mixte, à mi-chemin entre designer graphique et développeur-se front-end. J'ai autant l'habitude de travailler sur des logiciels de production graphique que dans un éditeur de texte. Passer d'un logiciel de mise en page à un document HTML ne m'a donc pas dérangé-e, bien qu'il m'ait fallu adapter un peu ma façon de concevoir le document.
Tout comme pour une page web, réaliser un document avec Paged.js demande de penser avec le flux HTML. Les éléments se suivent, poussent plus ou moins leurs voisins et ceux qui suivent. Modifier du contenu à un endroit peut changer la place de tout le reste. C'est un paradigme différent des logiciels comme Scribus ou Indesign, où les éléments sont généralement placés à des endroits fixes sur des pages précises.
Les langages CSS et JavaScript offrent toute une panoplie d'outils pour contrôler ce flux, le manipuler ou l'esquiver entièrement. Le positionnement absolu, notamment, se révèle pratique pour maîtriser précisément le placement d'un élément sans se soucier des autres. Les grilles et colonnes permettent une approche plus directement inspirée du "print".
Avec Paged.js on peut aussi ajouter des règles spécifiques au fonctionnement par pages. Par exemple, imposer à un bloc de se placer sur une nouvelle page, ou au contraire ne jamais chevaucher deux pages. Il permet aussi de gérer par exemple la numérotation.
Au final, c'est une sorte d'hybride où l'on jongle entre la façon de concevoir une page web continue et celle d'organiser des pages séparées. On pourrait être tenté-e de tout positionner en absolu, ou au contraire abandonner l'idée de placer les éléments de façon précise. Personnellement, j'ai apprécié le fait de trouver un juste milieu entre les deux et de laisser l'outil guider la pratique.
Efforts supplémentaires
Si Paged.js vous intrigue, je préfère vous prévenir : commencez peut-être par bidouiller un projet perso, pour découvrir la librairie sans enjeu.
Concevoir le livret sur un logiciel "classique" m'aurait facilement pris 3 à 4 fois moins d'efforts, et ce pour plusieurs raisons.
Il y a bien entendu le fait de devoir apprendre un nouvel outil. Même avec de l'expérience en front-end, Paged.js a ses particularités et peut surprendre dans son fonctionnement. Je regrette que la documentation du projet soit incomplète, ce qui m'a parfois demandé de fouiller d'autres réalisations et retours d'expérience pour mieux comprendre certaines fonctionnalités et blocages.
Il y a également les bugs et "quirks". Il m'est arrivé à plusieurs reprises de me heurter à quelque chose qui ne fonctionne pas comme prévu, sans que j'arrive à en déterminer la cause. Par exemple, il existe une propriété CSS qui permet de réinitialiser un compteur, notamment pour les numéros de page.
/* Remettre le compteur de pages à 1 */
.premiere-page {
counter-reset: page 1;
}
Sur le papier, il me suffit ensuite d'appliquer la classe 'premiere-page' au premier bloc d'une page, et elle aura le numéro de page "1". C'était bien le cas lorsque je l'ai fait, mais la page suivante avait le numéro "3" voire "4" au lieu de "2". Il s'avère que les compteurs CSS sont cassés dans Paged.js du fait de changements dans les versions récentes des navigateurs. Dans mon cas précis j'ai réussi à passer outre en ajoutant un élément vide avec la même classe juste avant, mais c'est du bricolage circonstanciel.
Malheureusement c'est un bug parmi bien d'autres. J'ai eu des éléments chevauchant des pages de façon étrange, des bizarreries de la part du moteur de pagination... Il faut parfois expérimenter pour trouver ce qui cloche et comment y pallier.
Prêt pour la production ?
Produire des fichiers pour impression demande d'être rigoureux-se. De nombreuses contraintes assez différentes du web doivent être prises en compte : format de page et reliure, marges et fonds perdus, résolution d'impression, profils colorimétriques, gestion des sauts de pages...
Les outils de développement web modernes (notamment les avancées du langage CSS) rendent possibles des ajustements autrefois spécifiques à la mise en page imprimée : rythme vertical, gestion automatique des césures et des lignes veuves ou orphelines. Pour autant, ni Paged.js ni l'export PDF des navigateurs n'offrent le niveau de contrôle nécessaire pour la production finale des fichiers à imprimer.
Dans mon logiciel habituel, je peux choisir d'exporter selon un standard PDF/X précis, préciser la gestion des couleurs, vérifier que toutes les sources (polices, images, etc) sont présentes, m'assurer de la résolution des visuels, de la couverture totale de l'encre, gérer les surimpressions... Autant de réglages et vérifications parfois difficiles à mettre en place dans ce nouveau flux de travail.
Il faut également noter que Paged.js n'est maintenu que par une poignée de personnes. Sa dernière mise à jour remonte à quasiment 1 an lorsque j'écris ces lignes. Comme je l'ai indiqué précédemment sa documentation est incomplète, voire (il me semble) obsolète par endroits. Point positif, le projet semble reparti pour un tour avec l'annonce d'une nouvelle version et une meilleure documentation.
C'est un outil que j'apprécie beaucoup—je l'ai depuis adopté pour faire mes devis et factures—mais qui manque encore, à mes yeux, de maturité pour briller réellement. Il est tout à fait possible de publier avec, comme en témoigne cette page d'exemples, et j'espère que de plus en plus de personnes s'essaieront au jeu. Pour ma part, selon le temps disponible et le type de projets, je m'y réessaierai volontiers !
Flynn Meryl