Un solo archivo de imágenes HTML + CSS + JS +

¿Existe un formato de archivo que integre todo el contenido HTML en un solo archivo?

En lugar de doc, docx, odt o pdf, quiero usar documentos HTML5 para crear mi contenido. Pero eso plantea un problema cuando quiero enviar los archivos HTML, por ejemplo, por correo electrónico; Tendría que comprimirlo y luego adjuntarlo a un correo electrónico. Por supuesto, hay .lit y .chm, pero por razones obvias ese no es el camino a seguir. Además, es posible incorporar código javascript y CSS en archivos HTML. Esto también tiene un inconveniente: las imágenes aún se excluyen, y la incrustación de todos los archivos externos de CSS y Javascript en un archivo HTML es engorroso. Las herramientas pueden automatizar esto, pero el problema de la imagen aún existe.

La motivación más importante para usar HTML sobre pdf / doc / docx / odt es que HTML no está diseñado para imprimir, mientras que pdf / doc / docx / odt sí lo están (y por lo tanto no están optimizados para la lectura de pantalla). Además, HTML es un estándar totalmente aceptado y abierto, que no se puede decir de los formatos nombrados (odt está abierto pero no es ampliamente aceptado).

Insertar todo en un archivo HTML normal es el camino a seguir. ¿Alguna vez has visto TiddlyWiki ? Creo que lo he visto referido como una "Aplicación de página única": todo está incrustado en un archivo HTML, por lo que funciona como (bueno, casi) una pieza de software independiente. No lo uso, pero creo que técnicamente es bastante impresionante.

Las imágenes se pueden incluir en línea usando la codificación base64 usando un URI de datos. Pero el soporte en Internet Explorer 8 no está completo (hay un límite de tamaño IIRC), y el soporte falta por completo en versiones anteriores de IE. La mayoría de los otros navegadores modernos tienen un buen soporte.

Tenga en cuenta que esto generalmente aumentará el tamaño de la imagen en aproximadamente un tercio (porque solo "usa" 6 de cada 8 bits por byte, por lo que debe usar un tercio más de bytes para acomodar ese espacio).

Por ejemplo, obtienes algo como esto:

<img src="data:image/png;base64,<BASE64 STRING>" />

O esto:

.someClass
{
    background-image:url(data:image/png;base64,<BASE64 STRING>");
}

También es posible que desee leer el artículo de Wikipedia sobre URI de datos , que tiene comentarios sobre el soporte del navegador y algunos ejemplos de uso.

Creo que el formato MHTML (MIME HTML) (extensión de archivo .MHT) es probablemente lo que buscas. Esto incrusta todo en un solo archivo (al igual que un correo electrónico HTML). Las imágenes, etc. están incrustadas con codificación base64.

El soporte del navegador es razonable. IE y Opera pueden guardar y ver archivos MHT. En IE simplemente "Guardar como ..." y seleccionar "Archivo web, archivo único (* mht)". Sin embargo, Firefox y Chrome requieren extensiones del navegador.

Personalmente, probablemente subiría el contenido HTML a un sitio web (posiblemente protegido por contraseña) y simplemente distribuiría el enlace. Los archivos MHT no son exactamente editables por el usuario, por lo que requieren regeneración cuando desea distribuirlos. Una vez que todo se ha combinado en un archivo MHT, ¿sigue siendo tan accesible como HTML?

PDF es razonablemente accesible. Tiene sus propias capacidades de lectura de pantalla. Sin embargo, no estoy seguro de cómo maneja las imágenes, ¿a menos que pueda crear esto con una herramienta específica?