Fichier unique HTML + CSS + JS + images

8

Existe-t-il un format de fichier qui intègre tout le contenu HTML lui-même dans un seul fichier?

Au lieu de doc, docx, odt ou pdf, je veux utiliser des documents HTML5 pour créer mon contenu. Mais cela pose un problème lorsque je veux envoyer les fichiers HTML par exemple par email; Je devrais le compresser puis le joindre à un e-mail. Bien sûr, il y a .lit et .chm, mais pour des raisons évidentes, ce n'est pas la voie à suivre. Il est également possible d'inclure du code javascript et CSS dans des fichiers HTML. Cela présente également un inconvénient: les images sont toujours exclues et l'intégration de tous les fichiers CSS et Javascript externes dans un seul fichier HTML est lourde. Les outils peuvent automatiser cela, mais le problème d'image persiste.

La motivation la plus importante pour utiliser HTML sur pdf / doc / docx / odt est que HTML n'est pas conçu pour l'impression, alors que pdf / doc / docx / odt le sont tous (et donc pas optimisé pour la lecture d'écran). De plus, HTML est une norme entièrement acceptée et ouverte, ce qui ne peut pas être dit des formats nommés (odt est ouvert mais pas largement accepté).

user45971
la source

Réponses:

7

Tout est incorporé dans un fichier HTML normal. Avez-vous déjà vu TiddlyWiki ? Je pense que je l'ai vu comme une "application à page unique" - tout est intégré dans un fichier HTML, donc il fonctionne comme (enfin, presque) un logiciel autonome. Je ne l'utilise pas, mais je pense que c'est techniquement assez impressionnant.

Les images peuvent être incluses en ligne en utilisant le codage en base64 à l'aide d'un URI de données. Mais la prise en charge dans Internet Explorer 8 n'est pas complète (il y a une limite de taille IIRC), et la prise en charge est entièrement manquante sur les anciennes versions d'IE. La plupart des autres navigateurs modernes ont un bon support.

Notez que cela augmentera généralement la taille de l'image d'environ un tiers (parce que vous "n'utilisez" que 6 bits sur 8 par octet, vous devez donc utiliser un tiers d'octets de plus pour combler cet écart).

Par exemple, vous obtenez quelque chose comme ceci:

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

Ou ca:

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

Vous pouvez également souhaiter lire l'article de Wikipedia sur les URI de données , il contient des commentaires concernant la prise en charge du navigateur et quelques exemples d'utilisation.

DMA57361
la source
Existe-t-il des outils (gemmes, œufs, packages de nœuds, etc.) qui gèrent la conversion et l'inclusion? Existe-t-il un outil qui alignera JS et CSS là où il voit un attribut src="..."or href="..."? Et puis convertir les images en base64 et remplacer le <img src="..."par <img src="data:image/..."?
Sukima
Je n'en ai aucune idée, je n'ai pas essayé d'envelopper quelque chose comme ça avant d'avoir jamais besoin de regarder.
DMA57361
3

Je pense que le format MHTML (MIME HTML) (extension de fichier .MHT) est probablement ce que vous recherchez. Cela intègre tout dans un seul fichier (un peu comme un e-mail HTML). Les images, etc. sont intégrées avec l'encodage base64.

La prise en charge du navigateur est raisonnable. IE et Opera peuvent enregistrer et afficher des fichiers MHT. Dans IE, il vous suffit de "Enregistrer sous ..." et de sélectionner "Archive Web, fichier unique (* mht)". Cependant, Firefox et Chrome nécessitent des extensions de navigateur.

Personnellement, je téléchargerais probablement le contenu HTML sur un site Web (éventuellement protégé par mot de passe) et distribuerais simplement le lien. Les fichiers MHT ne sont pas exactement modifiables par l'utilisateur, donc nécessitent une régénération lorsque vous souhaitez distribuer. Une fois que tout a été combiné dans un fichier MHT, est-il toujours aussi accessible que HTML?

Le PDF est raisonnablement accessible. Il a ses propres capacités de lecture d'écran. Vous ne savez pas comment il gère les images - à moins que vous ne le créiez avec un outil spécifique?

MrWhite
la source
Outre les exigences techniques, il existe également une exigence organisationnelle de ne pas travailler avec une norme propriétaire (le pdf peut être ouvert, il est toujours propriétaire). Je regarderai cependant en mhtml.
user45971
Voir tools.ietf.org/html/rfc2557 . C'est un standard ouvert. Cela m'a surpris qu'IE ait un meilleur support que Firefox (ce dernier préférant son propre format propriétaire), mais vous l'avez. Il existe probablement un meilleur support d'outil pour les dépendances pdf ou html +.
Iiridayn