Académie›Médias›Fiche 08
Médias

Préparer vos photos pour le web

Recadrer, redimensionner et alléger une image avant de la déposer, pour garder un site rapide.

⏱ 6 min Intermédiaire
Préparer vos photos pour le web

Ce que vous allez faire

Transformer une photo de téléphone ou d'appareil (5 à 12 Mo) en une image web de moins de 300 Ko, avec un nom de fichier propre, sans perte visible.

Étapes

  1. Choisissez la photo sur votre ordinateur et vérifiez son orientation (paysage ou portrait) par rapport à la place qu'elle va occuper. Recadrez si besoin avec l'outil Photos de Windows ou celui de votre Mac : le sujet bien centré, pas de zone vide.

  2. Renommez le fichier avant de l'envoyer : des mots simples séparés par des tirets, sans accent, sans espace, sans majuscule. IMG_4521.JPG devient facade-boutique-perpignan.jpg. Google lit ce nom, et vous le retrouverez dans la médiathèque.

  3. Redimensionnez et allégez en une fois avec Squoosh, un outil gratuit qui tourne dans votre navigateur (rien n'est envoyé nulle part). Glissez la photo dans la page.

    Squoosh : la photo à gauche, les réglages à droite
    Squoosh : on glisse la photo dans la zone rose (1), les réglages apparaissent ensuite à droite
  4. Dans la colonne de droite : cochez Resize et mettez 1600 en largeur (2000 pour une grande image d'accueil, 800 pour une vignette). Choisissez le format MozJPEG pour une photo, OxiPNG pour un logo ou un dessin. Qualité JPEG autour de 75. Le poids s'affiche en bas : visez moins de 300 Ko. Cliquez sur la flèche de téléchargement.

  5. Envoyez le fichier obtenu sur le site : Médias → Ajouter un fichier média (ou directement depuis l'image à remplacer, fiche 07).

    Médias → Ajouter : la zone de dépôt des fichiers
    Médias → Ajouter un fichier média (1) : on dépose le fichier dans la zone en pointillés (2) ou on le choisit sur l'ordinateur (3)

Résultat attendu

Un fichier .jpg (ou .png) bien nommé, de 800 à 2000 px de large, de moins de 300 Ko, qui s'affiche net sur le site.

Si ça coince

Ce que vous voyez Ce que ça veut dire Ce que vous faites
L'image est nette sur l'ordinateur mais floue sur le site Elle a été réduite en dessous de la taille affichée Reprenez l'original et redimensionnez plus large (1600 px au lieu de 800)
Le poids reste au-dessus de 500 Ko Qualité trop haute, ou format PNG pour une photo Qualité 70, format MozJPEG
Les couleurs ont changé après Squoosh Profil colorimétrique d'appareil photo Négligeable pour le web ; si la différence est forte, exportez d'abord la photo depuis Photos en JPEG standard
Le fichier a une extension .heic ou .webp que l'outil refuse Format récent de téléphone Ouvrez-le dans Photos, Enregistrer sous en JPEG, puis reprenez à l'étape 3
Vous n'avez que la photo reçue par WhatsApp Elle est déjà compressée et petite Demandez l'original par email ou par un lien de partage : WhatsApp dégrade les photos

Aide-mémoire

  • Recadrer, renommer (mots-simples-sans-accent.jpg), redimensionner, alléger.
  • Squoosh : Resize 1600, MozJPEG, qualité 75, moins de 300 Ko.
  • Logo en PNG ou SVG, jamais en capture d'écran.
  • Jamais de photo de 5 Mo sur le site.
  • WhatsApp abîme les photos : demandez l'original.

Vous ne trouvez pas votre réponse ?

Simon vous accompagne en visio pour réaliser la manipulation avec vous.

Fiche mise à jour le 29 septembre 2026

Mon espace

Entrez le mot de passe que Simon vous a remis à la formation : les fiches s'adaptent à votre site (adresse d'administration, formule, fiches qui vous concernent).