Le , par Julien Wilhelm - Écoconception
En avril dernier, j’ai entamé sur le blog de Temesis une étude technique sur l’optimisation du PDF. Après les résultats sans appel du JPG et une conclusion en demi-teinte pour PNG, voici enfin mes analyses pour l’intégration du SVG dans le PDF.
Bonne nouvelle : ça se présente bien pour ce format vectoriel !
1. Contexte de l’analyse
- J’ai téléchargé cette image SVG sur pixabay. Son poids est de 64,3 Ko.
- J’ai créé un document texte avec l’application “Writer” de la suite LibreOffice téléchargeable gratuitement (version utilisée : 7.5.7.1). Le document est au format A4 (21 x 29,70 cm), ses marges sont toutes de 2 cm.
- J’ai inséré l’image dans le document sans la déplacer ni la redimensionner. Je n’ai par ailleurs rien ajouté d’autre au document.
- J’ai exporté jusqu’à 7 PDF, jouant par curiosité sur les options suivantes :
- “Compression JPEG qualité” (valeurs : 90 et 75 %).
- Ou “Compression sans perte” activé
- Et “Réduit la résolution des images à” (valeurs : 300, 150 et 75 DPI).
2. Optimisation SVG à l’export du fichier PDF
Sans surprise, puisque nous utilisons ici du vectoriel, manipuler les 3 options listées plus haut n’a aucune incidence sur la taille ou la qualité visuelle du PDF généré. J’obtiens en effet, dans tous les cas, un PDF de 28,4 Ko.
Problème : dans tous ces exports, le SVG ressort légèrement altéré. Jugez par vous-même de la différence autour de l’oeil et du museau du rat entre l’aperçu du SVG de base, zoom à 500 % et l’aperçu SVG encapsulé dans PDF, zoom à 1000 %. Cela n’est pas forcément visible hors zoom intensif, mais tout de même : j’entends que cela puisse ne pas être acceptable.
Pour approfondir, et ne pas (trop) rester dans le doute, j’ai réitéré sur trois autres sources SVG. Voici ce que cela donne dans mon explorateur de fichiers pour les 3 nouvelles images (trois dossiers différents) :
- SVG source (69 Ko / 50,4 Ko / 8,3 Ko)
- SVG optimisé avec svgo (65,1 Ko / 46,3 Ko / 2,9 Ko)
- Export PDF image seule (avec Inkscape) (33,7 Ko / 34,3 Ko / 3,1 Ko)
- Document Writer contenant SVG source
- Document Writer contenant SVG optimisé
- Document Writer contenant PDF image seule
- Export PDF document Writer contenant SVG source (28,1 Ko / 24,9 Ko / 3,3 Ko)
- Export PDF document Writer contenant SVG optimisé (28,0 Ko / 24,8 Ko / 3,4 Ko)
- Export PDF contenant PDF image seule (34,1 Ko / 35 Ko / 3,7 Ko)
Je vous épargne les poids des fichiers en points 4, 5 et 6 ; cette information n’est ici pas pertinente.
Deux évidences au regard de ces chiffres :
- Une fois de plus, on obtient un PDF final plus léger en intégrant directement du SVG dans le PDF, que du PDF dans le PDF. Quid de la qualité toutefois ? Rien à déplorer. Vraiment. J’en viens à me dire que le tout premier SVG que j’avais choisi était en cause.
- SVG optimisé au préalable ou non, au moment de l’export du document en PDF, cela ne change pas grand chose. Intéressant…
Je remarque aussi que, dans certains cas, il n’est pas exclu que notre export de document vers PDF fasse un peu gonfler la facture. C’est ce que révèle ma dernière image : la variante SVG optimisée pèse 2,9 Ko, contre 3,7 Ko à la fin.
3. Conclusion
Au final, SVG, c’est pas si mal.
Sur la base de tout ce que j’ai pu observer vis-à-vis de JPG, de PNG et de SVG, voici la synthèse de mes recommandations pour l’intégration d’image dans vos PDF à destination du Web :
- Vous pouvez utiliser des images JPG. Le cas échéant, remettez-vous-en aux options d’export PDF de votre logiciel pour la compression et, sauf cas particulier, veillez bien à choisir un DPI de 75 pour assurer leur redimensionnement à la baisse quand cela est nécessaire. À noter que la composition de ces images reste importante pour aller encore plus loin. J’en parle en formation.
- N’utilisez pas PNG. Point.
- Mais utilisez plutôt SVG… ou directement du PDF, pourquoi pas.
Voilà ! J’estime avoir fait le tour de la question sur la gestion des images dans le format PDF, mais plusieurs autres sujets m’intriguent (la gestion des polices incorporées, l’intérêt de proposer un PDF quand on peut faire du HTML…). À voir si cela donnera lieu à de nouvelles investigations !