Отдельный файл изображений HTML + CSS + JS +

Существует ли формат файла, который объединяет все содержимое HTML в одном файле?

Вместо doc, docx, odt или pdf я хочу использовать документы HTML5 для создания своего контента. Но это создает проблему, когда я хочу отправить HTML-файлы, например, по электронной почте; Я должен был бы застегнуть это и затем приложить это к электронной почте. Конечно, есть .lit и .chm, но по понятным причинам это не тот путь. Кроме того, в HTML-файлы можно встроить JavaScript и код CSS. Это также имеет недостаток: изображения по-прежнему исключаются, и встраивание всех внешних файлов CSS и Javascript в один файл HTML является громоздким. Инструменты могут автоматизировать это, но тогда проблема изображения все еще существует.

Наиболее важной мотивацией для использования HTML поверх pdf / doc / docx / odt является то, что HTML не предназначен для печати, тогда как pdf / doc / docx / odt все они (и, следовательно, не оптимизированы для чтения с экрана). Кроме того, HTML является полностью приемлемым и открытым стандартом, чего нельзя сказать о названных форматах (odt является открытым, но не широко принятым).

Встраивание всего в обычный HTML-файл - путь. Вы когда-нибудь видели TiddlyWiki ? Я думаю, я видел, что это называется «Одностраничное приложение» - все встроено в один HTML-файл, поэтому он функционирует как (ну, почти) как отдельная часть программного обеспечения. Я не пользуюсь им, но думаю, что это технически довольно впечатляюще.

Изображения могут быть встроены в кодировку base64 с использованием Data URI. Но поддержка в Internet Explorer 8 не завершена (существует ограничение размера IIRC), и поддержка полностью отсутствует в более старых версиях IE. Большинство других современных браузеров имеют хорошую поддержку.

Обратите внимание, что это обычно увеличивает размер изображения примерно на треть (потому что вы «используете» только 6 из каждых 8 битов на байт, поэтому придется использовать еще треть байтов, чтобы учесть этот разрыв).

Например, вы получаете что-то вроде этого:

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

Или это:

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

Возможно, вы также захотите прочитать статью Википедии о URI данных , в ней есть комментарии относительно поддержки браузера и некоторые примеры использования.

Я думаю, что формат MHTML (MIME HTML) (расширение файла .MHT), вероятно, то, что вы ищете. Это встраивает все в один файл (очень похоже на электронное письмо в формате HTML). Изображения и т. Д. Встроены в кодировку base64.

Поддержка браузера разумна. IE и Opera могут сохранять и просматривать файлы MHT. В IE вы просто «Сохранить как ...» и выберите «Веб-архив, один файл (* MHT)». Однако Firefox и Chrome требуют расширения браузера.

Лично я, вероятно, загрузил бы содержимое HTML на веб-сайт (возможно, защищенный паролем) и просто распространял ссылку. MHT-файлы не совсем доступны для редактирования пользователем, поэтому требуют распространения, когда вы хотите распространять. После того, как все это будет объединено в MHT-файл, оно все еще доступно, как HTML?

PDF достаточно доступен. Он имеет свои собственные возможности чтения с экрана. Не уверен, как он обрабатывает изображения - разве вы можете создать это с помощью специального инструмента?