đź“—
Site ritimo.org
  • Bonnes pratiques pour la rĂ©daction et la publication du site (en cours de rĂ©daction)
  • Quelques règles d'Ă©criture inclusive
  • Traitement et optimisation des images
  • Liste des mots-clĂ©s du site
Powered by GitBook
On this page
  • AccessibilitĂ©
  • La taille des images
  • Les diffĂ©rents formats d'image
  • Traiter une image avec GIMP (JPEG)
  • Optimiser une image (jpeg ou png)
  • En savoir plus
  • OĂą chercher des images libres de droit / en creative commons ?
  • Les supports issus de la formation de Dimitri Robert : ​
  • Quelques ressources libres

Was this helpful?

Traitement et optimisation des images

PreviousQuelques règles d'écriture inclusiveNextListe des mots-clés du site

Last updated 1 year ago

Was this helpful?

Accessibilité

Il est important de toujours renseigner le texte "alternatif" (titre + descriptif de l'image) lors de l'ajout d'une image sur le site. Il n'aide pas seulement les personnes malvoyantes qui utilisent un lecteur d'écran, il peut aider les gens à comprendre le contexte de l'image, à fournir un emplacement pour une image manquante ou à charger une image sur une connexion internet lente.

En savoir plus :

La taille des images

Les images du site Ritimo doivent avoir comme taille 1140 pixels x 760 (1)

Citations : courte mettre entre guillemets et en ital ; longues utiliser l'outil spip

  • Lorsqu'elles sont plus grandes, il faut les rĂ©duire

  • Lorsqu'elles sont plus petites, on n'y touche pas (ne jamais agrandir une image : on perd en qualitĂ©)

Provenance : pour le type de doc "campagnes" : ne rien mettre.

L'image de la Une 1 doit être au format : 1400 x 733 (ou, si l'image est plus petite, dans ces proportions impérativement). Le poids de l'image doit être inférieur à 70 ko dans la mesure du possible, d'où la nécessité d'optimiser les images. Pour compresser les images, compresseur en ligne :

Les différents formats d'image

Citations : italiques entre guillemets.

  • GIF = interdit pour le site car s'utilise uniquement pour des images animĂ©es (qui bougent)

  • JPEG = Ă  utiliser pour les photos. Lorsque les images en JPEG sont compressĂ©es, il y a une perte d'information

  • PNG = Ă  utiliser pour les « aplats », images avec peu de dĂ©gradĂ©s, comme les dessins, les schĂ©mas, les cartes. A la compression, il n'y a pas de perte d'information. Il ne faut pas les redimensionner car il y a perte de qualitĂ© de l'image.

  • Webp = Ă  utiliser pour le web, bonne compression (mais problèmes de sĂ©curitĂ©).

Traiter une image avec GIMP (JPEG)

Auteurs personnes physiques : Ă  mettre toujours !

Ouvrir l'image JPEG. Pour diminuer la taille de l'image :

  • Menu image > Choix Echelle et taille de l'image

  • SĂ©lectionner la largeur (maximum) 1140 pixels

  • Menu fichier > Choix Exporter comme > Choisir l'extension JPEG puis afficher l'aperçu : la qualitĂ© de l'image dĂ©termine le poids : changer la qualitĂ© (en%)

  • SĂ©lectionner Exporter

(Pour couper une image : Menu Outil > outils de transformation > découpage)

Optimiser une image (jpeg ou png)

Avec GIMP :

En savoir plus

OĂą chercher des images libres de droit / en creative commons ?

Les supports issus de la formation de Dimitri Robert : ​

Quelques ressources libres

Images et polices

Menu Image > Mode Couleur indexée > Convertir Utiliser des utilitaires : Trimage pour linux (pour supprimer les métadonnées, à utiliser en dernier, donc. Remarques :GIMP optimise mieux que photoshop car il supprime les métadonnées. Ne pas toucher la résolution de l'image quelque soit sa valeur, cela ne sert à rien (c'est pour les impressions papier).Kb = KoBytes n'est pas = à bits

A savoir : La largeur maximum de l'affichage des images sur le site est de 570 à 770, on calcule la taille de l'image en tenant compte du ratio de l'image = 2 (qui permet d'afficher une bonne qualité)

, linuxfr.org, le 22/02/21. Pour illustrer un site web, une plaquette, une dépêche, une app… nous recherchons bien souvent des images. Et comme sur LinuxFr.org, nous respectons toujours le droit d’auteur, nous exigeons, tous, des images libres. Mais où les trouver ? Il y a-t-il des pièges ? Peut-on faire confiance aux banques d’images ? Cette dépêche décortique les licences et conditions d’utilisation de 24 banques d’images, la plus exhaustive étude au monde !

flickr :

cc search :

Wikimedia Commons :

pixabay :

photopin :

Unsplash :

Recherche avancée d'images google :

Présentation sur les notions en infographie :

Support de cours GIMP :

Support de cours Scribus :

Tutoriels de détourage :

Télécharger GIMP :

Polices libres :

👉
https://alttexthalloffame.org/
https://imagecompressor.com/fr/
https://css-ig.net/articles/optimiser-images-web.php
Tour d'horizon des images libres (et pas libres)
https://www.flickr.com
https://search.creativecommons.org/
https://commons.wikimedia.org/wiki/Main_Page?uselang=fr
https://pixabay.com/
http://photopin.com/
https://unsplash.com
https://www.google.fr/advanced_image_search
http://formation-logiciel-libre.com/wp-content/uploads/2018/07/notions_essentielles_en_infographie-vect.svg
http://ma.formation-logiciel-libre.com/gimp/
http://ma.formation-logiciel-libre.com/scribus/
https://formation-logiciel-libre.com/?s=détourage
https://www.gimp.org/downloads/
https://www.fontsquirrel.com/