La imagen superior en no es una imagen insertada al uso, sino que se trata de una imagen cuyos datos están insertados en el código html. De hecho, esta es la “pinta” que tiene:
<img alt="Embedded Image" width="120" height="120" src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAA..." />
Para la obtención de la cadena de texto codificada en base64 que va justo después de la coma se puede usar el siguiente comando:
uuencode -m images.jpeg /dev/stdout | sed ‘1d’ | sed ‘$d’ | tr -d ‘\n’
(sino se tiene disponible el comando, instalar el paquete donde está: sudo aptitude install sharutils)
Esta forma de insertar imágenes en una página web puede ser útil para determinadas aplicaciones donde no tenemos la posibilidad de subir imágenes, pero si podemos poner todo el texto que queramos.
También hay que decir que Internet Explorer no es muy amigo de este tipo de incrustación, así que es posible que a algunos no se les vea bien el ejemplo 😛
Fuentes: greywyvern.com y commandlinefu.com
Actualización 13/01/2012: para más información, ver el artículo de Data URI Scheme en la wikipedia
2 replies on “Insertar imágenes en html directamente”
Hola Sucotronic
Disculpa que te interrumpa. Me puedes ayudar?, me estoy voviendo un poco loco. Me faltan muchos conocimientos y desconozco la mayoría de este idioma que utilizais los que sabeis.
Me gustaria a partir de una tabla de exel, que me proporcione las distancias y los tiempos entre dos puntos pero soy tan durito que no lo entiendo.
Me lo podrías explicar en plan niños de 4 años??.
Baje el catálogo java, pero no se donde tengo que escribir la macro ni como hacerla ni como utilizar el catálogo. Parezco un Neandertal. De verdad me da un poquito de verguenza pero necesito aprender a hacer esto.
Puedes ayudarme?
@Alberto, hola Alberto, creo que te has equivocado de post. ¿A que distancias te refieres?