Les navigateurs récents permettent tous l'intégration dans une page web
d'images au format svg sous forme de texte xml inclus dans
une balise <svg>.
L'image de la tulipe de droite n'est donc pas réalisée à partir d'un fichier externe.
Sa description est interne à la page. On peut le constater en visualisant le code
source de la page actuelle.
Les documents qui suivent ne constituent pas un tutoriel pour ateliers
de club sur le graphisme : il y en a déjà beaucoup, et nous n'avons pas l'intention d'en ajouter un de plus.
Nous avons fait, au cours de l'année 2010-2011, un atelier avec un groupe ayant une bonne expérience de l'informatique mais aucune dextérité particulière en infographie : il se proposait de travailler sur les techniques du graphisme. En pratique, aborder le travail sur les bitmaps et les images vectorielles à partir de Gimp et Inkscape, logiciels disponibles sur les plate-formes usuelles.
L'animateur du groupe, a donc élaboré une progression à partir d'exercices classiques adaptés aux participants et certaines de leurs demandes explicites, comme par exemple celle de réaliser des illustrations de documents de formation portant sur des domaines techniques (électronique, programmation), ou encore, de l'adaptation des images pour leur introduction dans un site web.
Assez rapidement, des questions ayant un caractère plus théorique sont apparues : qu'est-ce que la "couleur" ? qu'est-ce qu'un modèle de couleur et comment cela fonctionne-t-il ? qu'est-ce qu'un fichier bitmap ? qu'en est-il des techniques de compression d'image ? qu'est-ce qu'une courbe de Bézier ?
L'animateur a donc sur un certain nombre de questions clefs, constitué une documentation et une formulation en fonction des intérêts des participants, sans vouloir a priori échapper à un minimum de technicité, ni vouloir à tout prix coller à des pratiques utilitaires. Les divers dossiers se sont élaborés en interaction avec les participants, au fil des questions et du travail engagé au cours des dix mois de fonctionnement de l'atelier.
C'est le résultat de cette élaboration qui est proposé dans le document qui suit. Rappelons-le, chaque dossier est un document approfondi qui n'est pas directement destiné à un groupe de formation ; il faut le voir comme un état de références sur les sujets traités pour un formateur, face à un public fortement marqué par sa formation professionnelle technicienne et qui ne rechigne pas devant quelques formules de math.
le modèle BITMAP en infographie
1. Le modèle bitmap.
2. Problèmes liés au modèle bitmap.
couleurs et modèles de couleurs en infographie
1. Les couleurs : données physiques et physiologiques
2. Expériences sur les couleurs.
3. saturation maximale et teinte pure.
4. le modèle HSV.
5. RGB et HScL
6. Les modèles linéaires
7. Calculs sur les pixels
8. nuanciers et chartes de couleur.
fichiers de BITMAPS
1. Afficher, enregistrer, transmettre des images bitmap
2. Un format de stockage élémentaire : le PNM
3. Les trois parties du fichier bitmap
4. Le problème récurent des fichiers bitmap : la taille
compression des fichiers de BITMAPS
1. Le RLE : run-length encoding
2. codage de Huffman
3. codage de Lempel-Ziv
4. Un autre modèle de couleurs : le système YUV (ou YCbCr)
5. Décomposition de Fourier en cosinus
6. développement de Fourier bidimensionnel
sauvegardes sur fichier des bitmaps
1. quelques formats de fichier
2. Le format PNG
3. Le format GIF
4. Le format TIFF (TIF)
5. le format JPEG
6. tests
7. artefacts du mode palette
8. artefacts du jpeg
images animées
1. Le premier modèle d'animation : la substitution d'image.
Les dossiers sur le SVG apparaissent aussi bien dans la partie graphismes
que dans la partie HTML : en effet, sans nier l'importance de la création de
graphisme vectotiels pour la bureautique ou l'illustration, le plus souvent
la phase de création graphique est suivie d'une pixélisation : longtemps les
logiciels de traitement de texte et le web, voir la PAO n'ont accepté que les images
bitmap, mais même aujourd'hui, les formats vectoriels y restent mal implémentés.
Il semblerait qu'avec le HTML5, le format vetoriel SVG soit
bien accepté. Aussi, le plan de travail de nos atelierrs a été le suivant :
d'une part, étudier le format SVG en tant que langage d'édition; et d'autre part,
voir ce qui actuellement passe bien de ce SVG dans son interprétation en
bureautique (OpenOffice), en édition d'image (GIMP) et sur le web (les navigateurs, en
particulier Firefox, Chrome, Opera, Safari/Windows et Internet Explorer)
format LibreOffice (4,4 Mio)
format P.D.F. (3,8 Mio)
splines cubiques en Python
dossier au format P.D.F. (3.7 Mio)