Imagen a Base64

Cuándo conviene incrustar la imagen

Una URL de datos ahorra una solicitud, pero no se puede almacenar en caché por separado: se descarga de nuevo con cada copia del HTML o CSS que la contiene y ocupa aproximadamente un tercio más que el archivo. Esta compensación funciona con imágenes diminutas de unos pocos kilobytes, como un icono en una hoja de estilos o un marcador de posición desenfocado. Las fotos y las imágenes reutilizadas en varias páginas se cargan más rápido como archivos normales. En SVG, codificar la URL del marcado en lugar de usar Base64 suele producir una URL de datos más corta.

Dónde no funcionan las URL de datos

Gmail y muchos otros clientes de correo no muestran imágenes incrustadas como URL de datos, así que en los boletines enlaza a una imagen alojada. Muchas API que aceptan imágenes Base64 solo quieren el contenido: elimina todo hasta la coma posterior a base64, incluida la propia coma. Una página con una política de seguridad de contenido debe incluir data: en su directiva img-src para que se carguen las imágenes incrustadas.

Cómo se usa

1. Elige una imagen.
2. Codifícala localmente.
3. Copia la URL de datos resultante.

Privacidad y límites

El archivo se queda en tu dispositivo. Base64 es una codificación, no un cifrado, y aumenta el tamaño aproximadamente en un tercio.