Auteur Sujet: Les images SVG et les polices de caractères (Lu 5462 fois)

vivien · « **Réponse #12 le:** 25 avril 2023 à 21:17:09 »

Autre exemple :

Image d'origine : 202107_arcep_rapport_etat_internet_2021_4_neutralite_3_original.svg
Image avec les objets en chemin : 202107_arcep_rapport_etat_internet_2021_4_neutralite_3.svg
(opération réalisée sur un PC disposant des polices concernées, après avoir, avec Inkscape, dans le menu "Chemin", puis "Objet en chemin" + optimisation scour intégrée dans Inkscape pour réduire la taille).

Animation qui passe d'une image à l'autre :

trekker92 · « **Réponse #13 le:** 12 mai 2023 à 18:21:19 »

bonjour

je vois ce topic dédié, j'en profite
je créée un svg textuel dans inkscape
je le met en <img> sur un site
le texte n'est évidemment pas sélectionnable
je le met sur un doc odt, que j'exporte en pdf
le texte est sélectionnable

si je comprends bien c'est pas le fichier qui est sélectionnable ou pas, mais cela dépend du logiciel qui le traite?
donc pour avoir du non sélectionnable (par ex les adresses email), le png/jpg seul recours?
merci

vivien · « **Réponse #14 le:** 12 mai 2023 à 18:29:23 »

Attention, les spammeurs savent faire de la reconnaissance de caractère.
Google image indexe les images avec de la reconnaissance de caractère, c'est impressionnant.

Citation de: trekker92 le 12 mai 2023 à 18:21:19

je créée un svg textuel dans inkscape
je le met en <img> sur un site
le texte n'est évidemment pas sélectionnable

C'est le fonctionnement de Inkscape qui va définir le texte en vecteurs, mais ce n'est pas évident pour tous.

Crée un document SVG avec LibreOffice Draw : Tu vas voir que Libre Office permet de conserver l'aspect sélectionnable du texte dans un SVG :

Ouvre cette image SVG (crée avec LibreOffice Draw), le texte est sélectionnable => https://lafibre.info/testdebit/ubuntu/202204_ubuntu_noyau_linux_ga_hwe_oem.svg

Citation de: vivien le 09 février 2023 à 22:12:54

Dans cette image SVG, on retrouve un bloc "EmbeddedFont" qui va définir les caractères utilisés et seulement ceux qui sont utilisés.

Le texte est écrit avec un appel "EmbeddedBulletChars".

vivien · « **Réponse #15 le:** 13 mai 2023 à 22:50:47 »

Je vais faire une comparaison des différents formats d'images, quand on a un schéma / clippart / dessin / diagramme / tableau :
- SVG .svg (avec optimisation scour)
- BMP sans perte, 24bits
- GIF .gif (compression sans perte LZW)
- PNG .png (compression sans perte)
- JPEG .jpeg quasiment sans perte (compression 100)
- TIFF .tiff (compression sans perte LZW)
- WEBP .webp sans perte
- HEIF/HEIC .heic sans perte
- AVIF .avif sans perte
- JPEG XL .jxl sans perte
- PDF

Je vais aussi rajouter 3 formats avec perte, même si ce n'est pas trop pertinent :
- JPEG avec perte 80
- WebP avec perte 82
- AVIF avec perte 64
Source : https://www.industrialempathy.com/posts/avif-webp-quality-settings/

L'idée est de comparer ces 45 images. J'ai essayé d'être assez varié pour être représentatif de ce que l'on va trouver sur internet.
Pour les formats bitmap, il faut une taille en pixels pour la conversion SVG ⇒ bitmap. On considère que l'image doit remplir une feuille A5 (148 mm × 210 mm) sauf la carte qui est au format A3 (297 mm × 420 mm).

13 types d'images seront comparés :
- 4 cliparts dont l'original est au format SVG (vectoriel)
- 4 dessins dont l'original est au format SVG (vectoriel)
- 4 dessins au trait dont l'original est au format SVG (vectoriel)
- 4 diagrammes de type "barres" dont l'original est au format SVG (vectoriel)
- 4 diagrammes de type "courbes" dont l'original est au format SVG (vectoriel)
- 4 diagrammes divers dont l'original est au format SVG (vectoriel)
- 4 tableaux dont l'original est au format SVG (vectoriel)
- 3 terres dont l'original est au format SVG (vectoriel)
- 1 invitation
- 4 photos d'intérieur dont l'original est au format JPEG (haute définition)
- 4 photos d'extérieur dont l'original est au format JPEG (haute définition)
- 4 scans noir et blanc de documents dont l'original est au format TIFF (haute définition)
- 4 scans couleurs de documents dont l'original est au format TIFF (haute définition)

Je vais comparer quatre résolutions :
- 6000ppp
- 300ppp
- 150ppp
- 75ppp

Images au format paysage :
- 600ppp = largeur de 4960 pixels
- 300ppp = largeur de 2480 pixels
- 150ppp = largeur de 1240 pixels
- 75ppp = largeur de 620 pixels

Images au format portrait :
- 600ppp = largeur de 3496 pixels
- 300ppp = largeur de 1748 pixels
- 150ppp = largeur de 874 pixels
- 75ppp = largeur de 437 pixels

Pour les clip-art :
- 600ppp = largeur de 1920 pixels
- 300ppp = largeur de 960 pixels
- 150ppp = largeur de 480 pixels
- 75ppp = largeur de 240 pixels

Voici les images que je pense utiliser pour ma comparaison (n'hésitez pas à me donner votre avis, c'est pour cela que je publie ce message avant de réaliser les tests, il est encore possible de changer le protocole ou les images) :

4 cliparts :

4 dessins :

4 dessins au trait :

4 diagrammes de type "barres" :

4 diagrammes de type "courbes" :

4 diagrammes divers :

4 tableaux :

3 terres :

1 invitation :

4 photos :

4 scans de documents :

trekker92 · « **Réponse #16 le:** 14 mai 2023 à 01:16:31 »

Citation de: vivien le 12 mai 2023 à 18:29:23

Attention, les spammeurs savent faire de la reconnaissance de caractère.
Google image indexe les images avec de la reconnaissance de caractère, c'est impressionnant.

j'aurais adoré voir la reconnaissance de caracteres dans son efficacité, de ggle ou des hackers chinois...
j'envisage de mettre la qualité en médiocre, limite avec du flou, du relief/3D (comme quand on est bourré) voire dans dix ans ce sera une charade pour deviner mon adrsse
depuis quelques années l'arobase est remplacée par des ## spéci@ùx, cependant je la diffuse qu'en png depuis quelques mois
j'imaginais qu'en png/svg ca ralentirait la chose.. sinon une image animée? tiens j'ai des petites idées..

vivien · « **Réponse #17 le:** 14 mai 2023 à 07:40:13 »

Je te conseille de mettre l'adresse avec du texte comme sur https://lafibre.info/forum/mentions-legales/

vivien · « **Réponse #18 le:** 24 mai 2023 à 13:26:41 »

Citation de: vivien le 12 mai 2023 à 18:29:23

C'est le fonctionnement de Inkscape qui va définir le texte en vecteurs, mais ce n'est pas évident pour tous.

Crée un document SVG avec LibreOffice Draw : Tu vas voir que Libre Office permet de conserver l'aspect sélectionnable du texte dans un SVG :

Ouvre cette image SVG (crée avec LibreOffice Draw), le texte est sélectionnable => https://lafibre.info/testdebit/ubuntu/202204_ubuntu_noyau_linux_ga_hwe_oem.svg

Un des problèmes de ce système utilisé par LibreOffice Draw, c'est que le texte justifié n'est plus justifié lors d'un export SVG (vs justification ok avec un export PNG / WebP)