Image vers Base64
Base64 encode les octets d'image binaire sous forme de texte ASCII que vous pouvez coller dans les charges utiles HTML img src, CSS url() ou JSON.
Comment encoder une image en Base64
1. Téléchargez le fichier image (gardez-le petit — moins de ~ 100 Ko est pratique).
2. Copiez la chaîne Base64 générée ou l'URL complète des données.
3. Collez dans votre HTML, CSS ou config.
4. Testez dans l'environnement cible : certains clients de messagerie limitent les URI de données.
Exemples d'encodage
Logo en ligne dans l'e-mail HTML
Un logo PNG de 2 Ko sous la forme data:image/png;base64,... évite le blocage d'images externes dans les boîtes de réception d'entreprise strictes.
CSS arrière-plan pour le prototype
Collez une texture Base64 dans une démo mono-fichier sans hébergement d'actifs.
Appareil de test API
Incluez un petit JPEG Base64 dans un corps de requête JSON pour le test du point de terminaison de téléchargement d'image.
Quand les images Base64 aident
• Pour les très petits actifs où une requête HTTP coûte plus que la surcharge de taille en ligne.
• Pour les prototypes HTML à fichier unique hors ligne.
• Lorsque l'hébergement externe n'est pas disponible dans des environnements verrouillés.
Base64 dans les budgets de performance
L'inlining supprime les allers-retours mais empêche la mise en cache de l'image par le navigateur séparément. À utiliser avec parcimonie pour les petites icônes critiques au-dessus du pli ; chargez normalement des médias volumineux paresseusement.
Questions fréquentes
Pourquoi Base64 est-il plus gros que le fichier ?
L'encodage utilise 4 caractères tous les 3 octets, soit environ 33 % de surcharge plus le préfixe de l'URL des données.
Qu'est-ce qu'une URL de données ?
Format : data:image/png;base64,iVBORw0KG... — Type MIME plus charge utile encodée.
Taille maximale pour l'e-mail ?
Gardez une croissance totale des messages inférieure à 10 à 20 Ko ; de nombreux clients s'étouffent avec d'énormes images en ligne.
Décoder dans le fichier ?
Utilisez l'outil d'encodeur/décodeur Base64 pour inverser l'ASCII en binaire si nécessaire.
Les images sont-elles téléchargées ?
Non : FileReader lit localement dans le navigateur.