Un Data URI es un identificador único de distintos tipos de archivos que no requieren estar alojados en un servidor para ser cargados
El data URI (definido como estándar en el rfrc2397 de IEFT) no entra estrictamente en ninguna de las categorías (URL o URN), ya que es una cadena de caracteres que presentan una imagen. Aun así se sigue considerando un subconjunto de las URIs, ya que siguen el mismo formato básico de una cadena de caracteres que identifica los recursos de una web.
Los data URIs son un tipo de URI muy especial que se utiliza para representar imágenes directamente en el código, sin necesidad de hacer una petición de HTTP por separado para descargarlos. Dependiendo del caso, puede beneficiar o perjudicar el WPO. Se diferencian precisamente por eso de las URLs, ya que las imágenes para funcionar no necesitan ser almacenadas en un servidor web. No es una dirección, es la imagen en si misma, aun así, por la definición de URI, encaja dentro de las URIs aunque no la englobe ninguna de sus dos categorías oficiales.
Una imagen con Data URI puede estar en base 64 o no, en contra de lo que se piensa, se pueden convertir imágenes a data URI sin necesidad de una codificación en base 64. Y al igual que los QR, que es otra forma de almacenar información, no tienen por qué ser estricamente imágenes. Se puede hacer un data URI de una cadena de texto. E incluso para almacenar o codificar una URL
El Data URI comienza con el protocolo o esquema data: seguido de un identificador de tipo de contenido MIME (conocido como MIME/TYPE), seguido de una , y la cadena de caracteres que representa el recurso:
Hay distintos tipos de MYME/TYPES como identificadores de contenido, los registros tienen distintos formatos de: Aplicaciones; audio; tipografías; imágenes; formatos de texto y de vídeo entre otros. Incluyendo un MYME/TYPE creado solo para ejemplos.
Texto con base 64:
data:text/plain;charset=utf-8;base64,aHR0cHM6Ly9jYXJsb3Muc2FuY2hlemRvbmF0ZS5jb20v
Mismo texto sin base 64:
data:text/plain;charset=utf-8,https%3A%2F%2Fcarlos.sanchezdonate.com%2F
En cuanto a SEO, las imágenes en Data URI son perfectamente rastreables e indexables por Google. No es una forma de evitar el indexado de imágenes.
El funcionamiento es igual que cuando se pone una URL dentro de la etiqueta IMG de HTML. Se puede poner el URI en el atributo Resource (src). Ejemplo:
<img src="data:image/svg+xml;base64,{data}" alt="El texto alternativo funciona igual y todos los atributos">
El CORS es el intercambio de recursos de origen cruzado. Por razones de seguridad, los navegadores restringen las peticiones HTTP de origen cruzado iniciadas desde scripts.
Por cierto, si alguna vez te ha surgido la duda de si es posible crear imágenes con Data URI con Chat-GPT, ya te la resuelvo yo 😉:
Te falta mi máster. Accede a una formación avanzada que te permitirá aplicar e implementar SEO en cualquier tipo de WEB
¡Accede al Máster de SEO Técnico!