@jjlmoya/utils-converters 1.25.0 → 1.26.0

package/src/tool/imagenBase64/i18n/en.ts

@@ -1,158 +1,158 @@
 import { bibliography } from '../bibliography';
-import type { ImagenBase64LocaleContent } from '../index';
+import type { ImagenBase64LocaleContent } from '../index';
 import { generateSchemas } from '../../../shared/logic/schemas';
-import type { ImageToBase64UI } from '../index';
-
-const slug = 'image-to-base64-converter';
-const title = 'Image to Base64 Converter Online';
-const description =
-  'Convert any image to Base64 code and Data URI directly in your browser. No file uploads. Free, private and instant.';
-
-const ui: ImageToBase64UI = {
-  dragTitle: 'Drag your image here',
-  dragSubtext: 'or click to browse your files',
-  formatBadge: 'Supports JPG, PNG, WEBP, SVG, GIF',
-  dataUriLabel: 'Data URI (Ready for CSS / HTML src="")',
-  base64Label: 'Base64 only (Plain encoded text)',
-  copyBtn: 'Copy',
-  dataUriPlaceholder: 'Upload an image to see the Data URI code...',
-  base64Placeholder: 'Upload an image to see the pure Base64 code...',
-  toastMessage: 'Code copied to clipboard!',
+import type { ImageToBase64UI } from '../index';
+
+const slug = 'image-to-base64-converter';
+const title = 'Image to Base64 Converter Online';
+const description =
+  'Convert any image to Base64 code and Data URI directly in your browser. No file uploads. Free, private and instant.';
+
+const ui: ImageToBase64UI = {
+  dragTitle: 'Drag your image here',
+  dragSubtext: 'or click to browse your files',
+  formatBadge: 'Supports JPG, PNG, WEBP, SVG, GIF',
+  dataUriLabel: 'Data URI (Ready for CSS / HTML src="")',
+  base64Label: 'Base64 only (Plain encoded text)',
+  copyBtn: 'Copy',
+  dataUriPlaceholder: 'Upload an image to see the Data URI code...',
+  base64Placeholder: 'Upload an image to see the pure Base64 code...',
+  toastMessage: 'Code copied to clipboard!',
   invalidImageAlert: 'Please upload a valid image file.',
-  bibliographyTitle: 'Bibliographic References',
-  faqTitle: 'Frequently Asked Questions',
-};
-
-const faq: ImagenBase64LocaleContent['faq'] = [
-  {
-    question: 'What is Base64 and what is it used for in web development?',
-    answer:
-      'Base64 is an encoding system that converts binary data into an ASCII text string. In web development, it is used to embed images directly within HTML or CSS files via Data URIs, reducing the number of HTTP requests to the server.',
-  },
-  {
-    question: 'Is it safe to convert my images to Base64 here?',
-    answer:
-      'Absolutely safe and private. Our tool works 100% locally in your browser. Your images are never uploaded or processed on any external server.',
-  },
-  {
-    question: 'What image formats does the Base64 converter support?',
-    answer:
-      'The tool is compatible with JPG, PNG, GIF, WebP, and even SVG vector files. When loading the image, it will automatically detect its MIME type to generate the exact Data URI code.',
-  },
-  {
-    question: 'When should I NOT use Base64 images?',
-    answer:
-      'You should avoid using Base64 images for large photographs or high-resolution images. Base64 code takes up approximately 33% more weight than the original binary file, which can excessively inflate your CSS stylesheets or HTML documents.',
-  },
-];
-
-const howTo: ImagenBase64LocaleContent['howTo'] = [
-  {
-    name: 'Drag or Select your Image',
-    text: 'Move any image (JPG, PNG, WebP, SVG, GIF) to the upload area to start the conversion.',
-  },
-  {
-    name: 'Copy the Generated Code',
-    text: 'You will see two textareas: the complete Data URI (ready to use in src="" or CSS) and the pure Base64 for other uses.',
-  },
-  {
-    name: 'Use the Code in your Project',
-    text: 'Paste the Data URI directly into the src of an img tag or in your CSS as background-image without needing external files.',
-  },
-];
-
-const seo: ImagenBase64LocaleContent['seo'] = [
-  {
-    type: 'title',
-    text: 'Image to Base64 Converter: Embed Images Without HTTP Requests',
-    level: 2,
-  },
-  {
-    type: 'paragraph',
-    html: 'Base64 is an encoding technique that transforms binary data - like an image - into a pure ASCII text string. The result is a Data URI: a self-contained URL that starts with <code>data:image/png;base64,...</code> and contains the entire encoded image. By embedding this code directly in your HTML, CSS or JSON, the image loads without any additional HTTP request to the server - zero network latency, instant loading.',
-  },
-  {
-    type: 'title',
-    text: 'When to use Base64 images',
-    level: 3,
-  },
-  {
-    type: 'paragraph',
-    html: 'The main argument for Base64 is the elimination of network requests. Every image on a web page means an HTTP request with its overhead of connection, DNS, TLS handshake and latency. For very small critical images - the main application logo, favicon, a UI icon - embedding them in Base64 in the CSS or HTML eliminates that cost and guarantees they display instantly even before the browser has cached anything.',
-  },
-  {
-    type: 'paragraph',
-    html: 'This technique is especially powerful in SPA (Single Page Application) apps where the JavaScript and CSS bundle is generated at build time: embedding small images in the bundle guarantees they load together with the code without additional requests. It is also indispensable for HTML emails, where mail clients block external images but always display embedded Data URIs.',
-  },
-  {
-    type: 'title',
-    text: 'Use cases for Base64 images',
-    level: 3,
-  },
-  {
-    type: 'list',
-    icon: 'mdi:check-circle',
-    items: [
-      'HTML inline: <code>&lt;img src="data:image/png;base64,..."&gt;</code> for critical icons.',
-      'CSS background: <code>background-image: url("data:image/svg+xml;base64,...")</code> for UI SVGs.',
-      'JSON and REST APIs: send images as text data in JSON payloads.',
-      'HTML emails: embedded images that display even when the client blocks external URLs.',
-      'SVG embedding: embed raster images inside SVG files as inline data.',
-    ],
-  },
-  {
-    type: 'title',
-    text: 'How the conversion works in the browser',
-    level: 3,
-  },
-  {
-    type: 'paragraph',
-    html: 'When you select or drag an image, the browser\'s <code>FileReader</code> API reads it directly from disk as binary data in RAM. The <code>readAsDataURL()</code> method converts those binary bytes to their Base64 representation using the RFC 4648 algorithm - every 3 bytes of original data are represented as 4 ASCII characters from the Base64 alphabet. The result includes the automatically detected correct MIME type.',
-  },
-  {
-    type: 'tip',
-    title: 'Use it only for small images (under 10 KB)',
-    html: 'Base64 increases file size by approximately 33%: a 10 KB image becomes ~13.3 KB of text. For small icons and logos this cost is minimal and the elimination of the HTTP request compensates for it. For photographs or large images, the size overhead is significant - always use a CDN for large images.',
-  },
-  {
-    type: 'title',
-    text: 'When NOT to use Base64',
-    level: 3,
-  },
-  {
-    type: 'tip',
-    title: 'Avoid Base64 for large images: use a CDN instead',
-    html: 'If you have images larger than 10-20 KB, Base64 hurts performance: it inflates HTML/CSS size, prevents the browser from caching the image independently, and blocks rendering while the parser processes the giant string. For large images, always serve from a CDN with appropriate cache headers.',
-  },
-  {
-    type: 'title',
-    text: 'Compatibility and privacy',
-    level: 3,
-  },
-  {
-    type: 'paragraph',
-    html: 'Data URIs are compatible with 100% of modern browsers and most email clients. Our tool processes everything locally via the FileReader API - your images never leave your device. This makes it suitable for corporate images, private screenshots or any confidential visual content that you need to convert to Base64.',
-  },
-  {
-    type: 'title',
-    text: 'Conclusion: The fastest and most private embedding tool',
-    level: 3,
-  },
-  {
-    type: 'paragraph',
-    html: 'Converting images to Base64 is a targeted but very powerful technique when applied correctly. Use it for small, critical images where zero HTTP requests makes a difference, and avoid it for large images where a CDN always wins. With our tool, you get the Data URI in an instant, without uploading anything to any server.',
-  },
-];
-
+  bibliographyTitle: 'Bibliographic References',
+  faqTitle: 'Frequently Asked Questions',
+};
+
+const faq: ImagenBase64LocaleContent['faq'] = [
+  {
+    question: 'What is Base64 and what is it used for in web development?',
+    answer:
+      'Base64 is an encoding system that converts binary data into an ASCII text string. In web development, it is used to embed images directly within HTML or CSS files via Data URIs, reducing the number of HTTP requests to the server.',
+  },
+  {
+    question: 'Is it safe to convert my images to Base64 here?',
+    answer:
+      'Absolutely safe and private. Our tool works 100% locally in your browser. Your images are never uploaded or processed on any external server.',
+  },
+  {
+    question: 'What image formats does the Base64 converter support?',
+    answer:
+      'The tool is compatible with JPG, PNG, GIF, WebP, and even SVG vector files. When loading the image, it will automatically detect its MIME type to generate the exact Data URI code.',
+  },
+  {
+    question: 'When should I NOT use Base64 images?',
+    answer:
+      'You should avoid using Base64 images for large photographs or high-resolution images. Base64 code takes up approximately 33% more weight than the original binary file, which can excessively inflate your CSS stylesheets or HTML documents.',
+  },
+];
+
+const howTo: ImagenBase64LocaleContent['howTo'] = [
+  {
+    name: 'Drag or Select your Image',
+    text: 'Move any image (JPG, PNG, WebP, SVG, GIF) to the upload area to start the conversion.',
+  },
+  {
+    name: 'Copy the Generated Code',
+    text: 'You will see two textareas: the complete Data URI (ready to use in src="" or CSS) and the pure Base64 for other uses.',
+  },
+  {
+    name: 'Use the Code in your Project',
+    text: 'Paste the Data URI directly into the src of an img tag or in your CSS as background-image without needing external files.',
+  },
+];
+
+const seo: ImagenBase64LocaleContent['seo'] = [
+  {
+    type: 'title',
+    text: 'Image to Base64 Converter: Embed Images Without HTTP Requests',
+    level: 2,
+  },
+  {
+    type: 'paragraph',
+    html: 'Base64 is an encoding technique that transforms binary data - like an image - into a pure ASCII text string. The result is a Data URI: a self-contained URL that starts with <code>data:image/png;base64,...</code> and contains the entire encoded image. By embedding this code directly in your HTML, CSS or JSON, the image loads without any additional HTTP request to the server - zero network latency, instant loading.',
+  },
+  {
+    type: 'title',
+    text: 'When to use Base64 images',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'The main argument for Base64 is the elimination of network requests. Every image on a web page means an HTTP request with its overhead of connection, DNS, TLS handshake and latency. For very small critical images - the main application logo, favicon, a UI icon - embedding them in Base64 in the CSS or HTML eliminates that cost and guarantees they display instantly even before the browser has cached anything.',
+  },
+  {
+    type: 'paragraph',
+    html: 'This technique is especially powerful in SPA (Single Page Application) apps where the JavaScript and CSS bundle is generated at build time: embedding small images in the bundle guarantees they load together with the code without additional requests. It is also indispensable for HTML emails, where mail clients block external images but always display embedded Data URIs.',
+  },
+  {
+    type: 'title',
+    text: 'Use cases for Base64 images',
+    level: 3,
+  },
+  {
+    type: 'list',
+    icon: 'mdi:check-circle',
+    items: [
+      'HTML inline: <code>&lt;img src="data:image/png;base64,..."&gt;</code> for critical icons.',
+      'CSS background: <code>background-image: url("data:image/svg+xml;base64,...")</code> for UI SVGs.',
+      'JSON and REST APIs: send images as text data in JSON payloads.',
+      'HTML emails: embedded images that display even when the client blocks external URLs.',
+      'SVG embedding: embed raster images inside SVG files as inline data.',
+    ],
+  },
+  {
+    type: 'title',
+    text: 'How the conversion works in the browser',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'When you select or drag an image, the browser\'s <code>FileReader</code> API reads it directly from disk as binary data in RAM. The <code>readAsDataURL()</code> method converts those binary bytes to their Base64 representation using the RFC 4648 algorithm - every 3 bytes of original data are represented as 4 ASCII characters from the Base64 alphabet. The result includes the automatically detected correct MIME type.',
+  },
+  {
+    type: 'tip',
+    title: 'Use it only for small images (under 10 KB)',
+    html: 'Base64 increases file size by approximately 33%: a 10 KB image becomes ~13.3 KB of text. For small icons and logos this cost is minimal and the elimination of the HTTP request compensates for it. For photographs or large images, the size overhead is significant - always use a CDN for large images.',
+  },
+  {
+    type: 'title',
+    text: 'When NOT to use Base64',
+    level: 3,
+  },
+  {
+    type: 'tip',
+    title: 'Avoid Base64 for large images: use a CDN instead',
+    html: 'If you have images larger than 10-20 KB, Base64 hurts performance: it inflates HTML/CSS size, prevents the browser from caching the image independently, and blocks rendering while the parser processes the giant string. For large images, always serve from a CDN with appropriate cache headers.',
+  },
+  {
+    type: 'title',
+    text: 'Compatibility and privacy',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'Data URIs are compatible with 100% of modern browsers and most email clients. Our tool processes everything locally via the FileReader API - your images never leave your device. This makes it suitable for corporate images, private screenshots or any confidential visual content that you need to convert to Base64.',
+  },
+  {
+    type: 'title',
+    text: 'Conclusion: The fastest and most private embedding tool',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'Converting images to Base64 is a targeted but very powerful technique when applied correctly. Use it for small, critical images where zero HTTP requests makes a difference, and avoid it for large images where a CDN always wins. With our tool, you get the Data URI in an instant, without uploading anything to any server.',
+  },
+];
 
-export const content: ImagenBase64LocaleContent = {
-  slug,
-  title,
-  description,
-  ui,
-  seo,
-  faq,
-  bibliography,
-  howTo,
-  schemas: generateSchemas({ title, description, inLanguage: 'en', faq, howTo }),
-};
+
+export const content: ImagenBase64LocaleContent = {
+  slug,
+  title,
+  description,
+  ui,
+  seo,
+  faq,
+  bibliography,
+  howTo,
+  schemas: generateSchemas({ title, description, inLanguage: 'en', faq, howTo }),
+};

package/src/tool/imagenBase64/i18n/es.ts

@@ -1,158 +1,158 @@
 import { bibliography } from '../bibliography';
-import type { ImagenBase64LocaleContent } from '../index';
+import type { ImagenBase64LocaleContent } from '../index';
 import { generateSchemas } from '../../../shared/logic/schemas';
-import type { ImageToBase64UI } from '../index';
-
-const slug = 'convertidor-imagen-base64';
-const title = 'Convertidor de Imagen a Base64 Online';
-const description =
-  'Convierte cualquier imagen a código Base64 y Data URI directamente en tu navegador. Sin subir archivos. Gratis, privado e instantáneo.';
-
-const ui: ImageToBase64UI = {
-  dragTitle: 'Arrastra tu imagen aquí',
-  dragSubtext: 'o haz clic para explorar tus archivos',
-  formatBadge: 'Soporta JPG, PNG, WEBP, SVG, GIF',
-  dataUriLabel: 'Data URI (Listo para CSS / HTML src="")',
-  base64Label: 'Solo Base64 (Texto plano codificado)',
-  copyBtn: 'Copiar',
-  dataUriPlaceholder: 'Sube una imagen para ver el código Data URI...',
-  base64Placeholder: 'Sube una imagen para ver el código Base64 puro...',
-  toastMessage: '¡Código copiado al portapapeles!',
+import type { ImageToBase64UI } from '../index';
+
+const slug = 'convertidor-imagen-base64';
+const title = 'Convertidor de Imagen a Base64 Online';
+const description =
+  'Convierte cualquier imagen a código Base64 y Data URI directamente en tu navegador. Sin subir archivos. Gratis, privado e instantáneo.';
+
+const ui: ImageToBase64UI = {
+  dragTitle: 'Arrastra tu imagen aquí',
+  dragSubtext: 'o haz clic para explorar tus archivos',
+  formatBadge: 'Soporta JPG, PNG, WEBP, SVG, GIF',
+  dataUriLabel: 'Data URI (Listo para CSS / HTML src="")',
+  base64Label: 'Solo Base64 (Texto plano codificado)',
+  copyBtn: 'Copiar',
+  dataUriPlaceholder: 'Sube una imagen para ver el código Data URI...',
+  base64Placeholder: 'Sube una imagen para ver el código Base64 puro...',
+  toastMessage: '¡Código copiado al portapapeles!',
   invalidImageAlert: 'Por favor sube un archivo de imagen válido.',
-  bibliographyTitle: 'Referencias Bibliográficas',
-  faqTitle: 'Preguntas Frecuentes',
-};
-
-const faq: ImagenBase64LocaleContent['faq'] = [
-  {
-    question: '¿Qué es Base64 y para qué sirve en el desarrollo web?',
-    answer:
-      'Base64 es un sistema de codificación que convierte datos binarios en una cadena de texto ASCII. En desarrollo web, se utiliza para incrustar imágenes directamente dentro de los archivos HTML o CSS mediante Data URIs, reduciendo el número de peticiones HTTP al servidor.',
-  },
-  {
-    question: '¿Es seguro convertir mis imágenes a Base64 aquí?',
-    answer:
-      'Absolutamente seguro y privado. Nuestra herramienta funciona 100% de manera local en tu navegador. Tus imágenes nunca se suben ni se procesan en ningún servidor externo.',
-  },
-  {
-    question: '¿Qué formatos de imagen soporta el convertidor a Base64?',
-    answer:
-      'La herramienta es compatible con JPG, PNG, GIF, WebP, e incluso archivos vectoriales SVG. Al cargar la imagen, automáticamente detectará su tipo MIME para generar el código Data URI exacto.',
-  },
-  {
-    question: '¿Cuándo NO debería usar imágenes en Base64?',
-    answer:
-      'Debes evitar usar imágenes en Base64 para fotografías grandes o imágenes de alta resolución. El código Base64 ocupa aproximadamente un 33% más de peso que el archivo binario original, lo que puede inflar excesivamente tus hojas de estilo CSS o documentos HTML.',
-  },
-];
-
-const howTo: ImagenBase64LocaleContent['howTo'] = [
-  {
-    name: 'Arrastra o Selecciona tu Imagen',
-    text: 'Mueve cualquier imagen (JPG, PNG, WebP, SVG, GIF) al área de carga para iniciar la conversión.',
-  },
-  {
-    name: 'Copia el Código Generado',
-    text: 'Verás dos textareas: el Data URI completo (listo para usar en src="" o CSS) y el Base64 puro para otros usos.',
-  },
-  {
-    name: 'Usa el Código en tu Proyecto',
-    text: 'Pega directamente el Data URI en el src de una etiqueta img o en tu CSS como background-image sin necesidad de archivos externos.',
-  },
-];
-
-const seo: ImagenBase64LocaleContent['seo'] = [
-  {
-    type: 'title',
-    text: 'Convertidor de Imagen a Base64: Incrusta Imágenes Sin Peticiones HTTP',
-    level: 2,
-  },
-  {
-    type: 'paragraph',
-    html: 'Base64 es una técnica de codificación que transforma datos binarios - como una imagen - en una cadena de texto ASCII puro. El resultado es un Data URI: una URL auto-contenida que empieza por <code>data:image/png;base64,...</code> y contiene toda la imagen codificada. Al incrustar este código directamente en tu HTML, CSS o JSON, la imagen se carga sin ninguna petición HTTP adicional al servidor - cero latencia de red, carga instantánea.',
-  },
-  {
-    type: 'title',
-    text: 'Cuándo usar imágenes en Base64',
-    level: 3,
-  },
-  {
-    type: 'paragraph',
-    html: 'El principal argumento a favor de Base64 es la eliminación de peticiones de red. Cada imagen en una página web supone una petición HTTP con su overhead de conexión, DNS, handshake TLS y latencia. Para imágenes críticas muy pequeñas - el logo principal de la aplicación, el favicon, un icono de UI - incrustarlas en Base64 en el CSS o HTML elimina ese coste y garantiza que se muestren de forma instantánea incluso antes de que el navegador haya cacheado nada.',
-  },
-  {
-    type: 'paragraph',
-    html: 'Esta técnica es especialmente poderosa en aplicaciones SPA (Single Page Applications) donde el bundle JavaScript y CSS se genera en tiempo de compilación: incrustar imágenes pequeñas en el bundle garantiza que se cargan junto con el código sin peticiones adicionales. También es indispensable para emails HTML, donde los clientes de correo bloquean imágenes externas pero siempre muestran Data URIs incrustados.',
-  },
-  {
-    type: 'title',
-    text: 'Casos de uso para imágenes en Base64',
-    level: 3,
-  },
-  {
-    type: 'list',
-    icon: 'mdi:check-circle',
-    items: [
-      'HTML inline: <code>&lt;img src="data:image/png;base64,..."&gt;</code> para iconos críticos.',
-      'CSS background: <code>background-image: url("data:image/svg+xml;base64,...")</code> para SVGs de UI.',
-      'JSON y APIs REST: enviar imágenes como datos de texto en payloads JSON.',
-      'Emails HTML: imágenes incrustadas que se muestran aunque el cliente bloquee URLs externas.',
-      'SVG embedding: incrustar imágenes rasterizadas dentro de archivos SVG como datos inline.',
-    ],
-  },
-  {
-    type: 'title',
-    text: 'Cómo funciona la conversión en el navegador',
-    level: 3,
-  },
-  {
-    type: 'paragraph',
-    html: 'Cuando seleccionas o arrastras una imagen, la API <code>FileReader</code> del navegador la lee directamente desde el disco como datos binarios en memoria RAM. El método <code>readAsDataURL()</code> convierte esos bytes binarios a su representación Base64 usando el algoritmo de RFC 4648 - cada 3 bytes de datos originales se representan como 4 caracteres ASCII del alfabeto Base64. El resultado incluye el tipo MIME correcto detectado automáticamente.',
-  },
-  {
-    type: 'tip',
-    title: 'Úsalo solo para imágenes pequeñas (menos de 10 KB)',
-    html: 'Base64 aumenta el tamaño del archivo en aproximadamente un 33%: una imagen de 10 KB se convierte en ~13.3 KB de texto. Para iconos y logos pequeños este coste es mínimo y la eliminación de la petición HTTP lo compensa. Para fotografías o imágenes grandes, el overhead de tamaño es significativo - usa siempre un CDN para imágenes grandes.',
-  },
-  {
-    type: 'title',
-    text: 'Cuándo NO usar Base64',
-    level: 3,
-  },
-  {
-    type: 'tip',
-    title: 'Evita Base64 para imágenes grandes: usa un CDN',
-    html: 'Si tienes imágenes de más de 10-20 KB, Base64 perjudica el rendimiento: infla el tamaño del HTML/CSS, impide que el navegador cachee la imagen de forma independiente, y bloquea el render mientras el parser procesa el string gigante. Para imágenes grandes, sirve siempre desde un CDN con headers de caché apropiados.',
-  },
-  {
-    type: 'title',
-    text: 'Compatibilidad y privacidad',
-    level: 3,
-  },
-  {
-    type: 'paragraph',
-    html: 'Los Data URIs son compatibles con el 100% de los navegadores modernos y la mayoría de clientes de email. Nuestra herramienta procesa todo localmente mediante la API FileReader - tus imágenes nunca salen de tu dispositivo. Esto la hace adecuada para imágenes corporativas, capturas de pantalla privadas o cualquier contenido visual confidencial que necesites convertir a Base64.',
-  },
-  {
-    type: 'title',
-    text: 'Conclusión: La herramienta de incrustación más rápida y privada',
-    level: 3,
-  },
-  {
-    type: 'paragraph',
-    html: 'Convertir imágenes a Base64 es una técnica puntual pero muy poderosa cuando se aplica correctamente. Úsala para imágenes pequeñas y críticas donde cero peticiones HTTP marca la diferencia, y evítala para imágenes grandes donde un CDN siempre gana. Con nuestra herramienta, obtienes el Data URI en un instante, sin subir nada a ningún servidor.',
-  },
-];
-
+  bibliographyTitle: 'Referencias Bibliográficas',
+  faqTitle: 'Preguntas Frecuentes',
+};
+
+const faq: ImagenBase64LocaleContent['faq'] = [
+  {
+    question: '¿Qué es Base64 y para qué sirve en el desarrollo web?',
+    answer:
+      'Base64 es un sistema de codificación que convierte datos binarios en una cadena de texto ASCII. En desarrollo web, se utiliza para incrustar imágenes directamente dentro de los archivos HTML o CSS mediante Data URIs, reduciendo el número de peticiones HTTP al servidor.',
+  },
+  {
+    question: '¿Es seguro convertir mis imágenes a Base64 aquí?',
+    answer:
+      'Absolutamente seguro y privado. Nuestra herramienta funciona 100% de manera local en tu navegador. Tus imágenes nunca se suben ni se procesan en ningún servidor externo.',
+  },
+  {
+    question: '¿Qué formatos de imagen soporta el convertidor a Base64?',
+    answer:
+      'La herramienta es compatible con JPG, PNG, GIF, WebP, e incluso archivos vectoriales SVG. Al cargar la imagen, automáticamente detectará su tipo MIME para generar el código Data URI exacto.',
+  },
+  {
+    question: '¿Cuándo NO debería usar imágenes en Base64?',
+    answer:
+      'Debes evitar usar imágenes en Base64 para fotografías grandes o imágenes de alta resolución. El código Base64 ocupa aproximadamente un 33% más de peso que el archivo binario original, lo que puede inflar excesivamente tus hojas de estilo CSS o documentos HTML.',
+  },
+];
+
+const howTo: ImagenBase64LocaleContent['howTo'] = [
+  {
+    name: 'Arrastra o Selecciona tu Imagen',
+    text: 'Mueve cualquier imagen (JPG, PNG, WebP, SVG, GIF) al área de carga para iniciar la conversión.',
+  },
+  {
+    name: 'Copia el Código Generado',
+    text: 'Verás dos textareas: el Data URI completo (listo para usar en src="" o CSS) y el Base64 puro para otros usos.',
+  },
+  {
+    name: 'Usa el Código en tu Proyecto',
+    text: 'Pega directamente el Data URI en el src de una etiqueta img o en tu CSS como background-image sin necesidad de archivos externos.',
+  },
+];
+
+const seo: ImagenBase64LocaleContent['seo'] = [
+  {
+    type: 'title',
+    text: 'Convertidor de Imagen a Base64: Incrusta Imágenes Sin Peticiones HTTP',
+    level: 2,
+  },
+  {
+    type: 'paragraph',
+    html: 'Base64 es una técnica de codificación que transforma datos binarios - como una imagen - en una cadena de texto ASCII puro. El resultado es un Data URI: una URL auto-contenida que empieza por <code>data:image/png;base64,...</code> y contiene toda la imagen codificada. Al incrustar este código directamente en tu HTML, CSS o JSON, la imagen se carga sin ninguna petición HTTP adicional al servidor - cero latencia de red, carga instantánea.',
+  },
+  {
+    type: 'title',
+    text: 'Cuándo usar imágenes en Base64',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'El principal argumento a favor de Base64 es la eliminación de peticiones de red. Cada imagen en una página web supone una petición HTTP con su overhead de conexión, DNS, handshake TLS y latencia. Para imágenes críticas muy pequeñas - el logo principal de la aplicación, el favicon, un icono de UI - incrustarlas en Base64 en el CSS o HTML elimina ese coste y garantiza que se muestren de forma instantánea incluso antes de que el navegador haya cacheado nada.',
+  },
+  {
+    type: 'paragraph',
+    html: 'Esta técnica es especialmente poderosa en aplicaciones SPA (Single Page Applications) donde el bundle JavaScript y CSS se genera en tiempo de compilación: incrustar imágenes pequeñas en el bundle garantiza que se cargan junto con el código sin peticiones adicionales. También es indispensable para emails HTML, donde los clientes de correo bloquean imágenes externas pero siempre muestran Data URIs incrustados.',
+  },
+  {
+    type: 'title',
+    text: 'Casos de uso para imágenes en Base64',
+    level: 3,
+  },
+  {
+    type: 'list',
+    icon: 'mdi:check-circle',
+    items: [
+      'HTML inline: <code>&lt;img src="data:image/png;base64,..."&gt;</code> para iconos críticos.',
+      'CSS background: <code>background-image: url("data:image/svg+xml;base64,...")</code> para SVGs de UI.',
+      'JSON y APIs REST: enviar imágenes como datos de texto en payloads JSON.',
+      'Emails HTML: imágenes incrustadas que se muestran aunque el cliente bloquee URLs externas.',
+      'SVG embedding: incrustar imágenes rasterizadas dentro de archivos SVG como datos inline.',
+    ],
+  },
+  {
+    type: 'title',
+    text: 'Cómo funciona la conversión en el navegador',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'Cuando seleccionas o arrastras una imagen, la API <code>FileReader</code> del navegador la lee directamente desde el disco como datos binarios en memoria RAM. El método <code>readAsDataURL()</code> convierte esos bytes binarios a su representación Base64 usando el algoritmo de RFC 4648 - cada 3 bytes de datos originales se representan como 4 caracteres ASCII del alfabeto Base64. El resultado incluye el tipo MIME correcto detectado automáticamente.',
+  },
+  {
+    type: 'tip',
+    title: 'Úsalo solo para imágenes pequeñas (menos de 10 KB)',
+    html: 'Base64 aumenta el tamaño del archivo en aproximadamente un 33%: una imagen de 10 KB se convierte en ~13.3 KB de texto. Para iconos y logos pequeños este coste es mínimo y la eliminación de la petición HTTP lo compensa. Para fotografías o imágenes grandes, el overhead de tamaño es significativo - usa siempre un CDN para imágenes grandes.',
+  },
+  {
+    type: 'title',
+    text: 'Cuándo NO usar Base64',
+    level: 3,
+  },
+  {
+    type: 'tip',
+    title: 'Evita Base64 para imágenes grandes: usa un CDN',
+    html: 'Si tienes imágenes de más de 10-20 KB, Base64 perjudica el rendimiento: infla el tamaño del HTML/CSS, impide que el navegador cachee la imagen de forma independiente, y bloquea el render mientras el parser procesa el string gigante. Para imágenes grandes, sirve siempre desde un CDN con headers de caché apropiados.',
+  },
+  {
+    type: 'title',
+    text: 'Compatibilidad y privacidad',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'Los Data URIs son compatibles con el 100% de los navegadores modernos y la mayoría de clientes de email. Nuestra herramienta procesa todo localmente mediante la API FileReader - tus imágenes nunca salen de tu dispositivo. Esto la hace adecuada para imágenes corporativas, capturas de pantalla privadas o cualquier contenido visual confidencial que necesites convertir a Base64.',
+  },
+  {
+    type: 'title',
+    text: 'Conclusión: La herramienta de incrustación más rápida y privada',
+    level: 3,
+  },
+  {
+    type: 'paragraph',
+    html: 'Convertir imágenes a Base64 es una técnica puntual pero muy poderosa cuando se aplica correctamente. Úsala para imágenes pequeñas y críticas donde cero peticiones HTTP marca la diferencia, y evítala para imágenes grandes donde un CDN siempre gana. Con nuestra herramienta, obtienes el Data URI en un instante, sin subir nada a ningún servidor.',
+  },
+];
 
-export const content: ImagenBase64LocaleContent = {
-  slug,
-  title,
-  description,
-  ui,
-  seo,
-  faq,
-  bibliography,
-  howTo,
-  schemas: generateSchemas({ title, description, inLanguage: 'es', faq, howTo }),
-};
+
+export const content: ImagenBase64LocaleContent = {
+  slug,
+  title,
+  description,
+  ui,
+  seo,
+  faq,
+  bibliography,
+  howTo,
+  schemas: generateSchemas({ title, description, inLanguage: 'es', faq, howTo }),
+};