Изменить стиль страницы

Спецификация ePub описывает допустимые форматы изображений:

image/jpeg

image/gif

image/png

image/svg+xml

Давайте определимся с концепцией. Любое цветное и качественное изображение на экранах черно-белых ридеров с e-ink дисплеем (8-16 градаций серого) – будет смотреться достаточно невзрачно. Значит ли это, что иллюстрации не нужно особо подготавливать? Нет, есть люди, читающие книги на планшетах, цветных ридерах. У планшетов уже сейчас есть высококачественные дисплеи с высоким разрешением (скептикам рекомендуется пообщаться с iPad, полистать фотографии). Вывод – планка требований к иллюстрациям должна быть на уровне хорошего качества.

Еще одна особенность. Обычно книги читают в портретной ориентации экрана. Возьмём за основу абстрактный экран шириной 600 и высотой 800 пикселей. Особенности форматирования стилей в книге epub диктуют, чтобы изображения подгонялись под 100% ширину экрана. Тогда иллюстрация 600×800 будет демонстрироваться на весь экран, что смотрится достаточно приятно. Стоит ли подбирать все изображения в портретной ориентации? Вовсе нет. Рисунок может быть шириной 1200 и высотой 600 пикселей, он будет масштабирован на 100% ширины экрана. Будем уменьшать размеры?

Нет. Открою небольшой секрет – электронную книгу можно читать и повернув экран в ориентацию landscape (альбомная ориентация, хотя мне больше нравится термин "ландшафт"). Это возможно на многих ридерах, на планшетах. И вот тут, внимание, иллюстрация снова будет масштабирована на всю ширину экрана.

Более того, на планшетах есть возможность увеличить любое изображение, рассмотреть детали. Я это проверял в нескольких программах – очень приятная функция.

Какие выводы? Да, есть ограничения: "вес" изображения не должен быть более 270-290 кб (иначе процессор устаревших ридеров может не справиться с перелистыванием такой странички. Впрочем, это ограничение можно и игнорировать). Ну и собственно размеры изображений не стоит брать с большим запасом. Минимум 768×1024 (ширина – высота) диктуется увеличением разрешения более современных устройств для чтения. И практически все разработчики подчеркивают, что для иллюстраций в электронной книге не требуется того высокого качества, которое требуется для цветной печати (это важно!).

При использовании фотографий для иллюстраций – безусловно рекомендован формат jpeg. Для уменьшения "веса" изображения есть 2 способа: уменьшение размера (ресайзинг) и снижение качества изображения по сравнению с исходным файлом. Считается, что при хорошем исходном качестве файла (яркость, контрастность, мало посторонних шумов и т.п.), уменьшение качества изображения до 72-75% визуально отличить на мониторе очень трудно. Я использую оба способа. Да, обычному пользователю вовсе не нужно виртуозное владение фотошопом. Есть много бесплатных графических редакторов (можно я не буду перечислять и давать здесь ссылки?).

Некоторые авторы рекомендуют на иллюстрациях чуть повышать резкость. Я думаю, что подход к изображениям должен быть индивидуальным и + тесты. (Я иногда использую "нерезкую маску" – unsharp mask). Надо пробовать разные варианты. Доработка иллюстраций необходима, так как именно за счёт иллюстраций увеличивается общий вес книги.

В таблице стилей CSS должно быть прописано правило по форматированию изображений.

Пример:

.imgDiv

{

text-align: center;

width: 100%;

}

В коде страницы изображение заключают внутри тега <div>.

Элемент <div> является блочным элементом и предназначен для выделения фрагмента документа с целью изменения вида содержимого. Как правило, вид блока управляется с помощью стилей. Чтобы не описывать каждый раз стиль внутри тега, можно выделить стиль во внешнюю таблицу стилей, а для тега добавить атрибут class или id с именем селектора.

Как и при использовании других блочных элементов, содержимое тега <div> всегда начинается с новой строки. После него также добавляется перенос строки.

&lt;body&gt;

   &lt;div class=&quot;imgDiv&quot;&gt;

           &lt;img alt=&quot;girl01&quot; src=&quot;../Images/girl01.jpg&quot; /&gt;

   &lt;/div&gt;

&lt;/body&gt;

Вооружившись этим набором знаний уже можно вставить иллюстрацию внутрь книги в программе Sigil.

В нужное место после текста ставится курсор. Нажимается кнопка

Руководство по созданию книг в формате ePub 2.0 _59.jpg
Insert File. (В версиях до 0.7.0 эта кнопка обозначалась как Insert Images.) Появится окно, в котором можно выбрать изображения, которые Вы уже поместили в папку Images. Подтвердите выбор файла. Перейдите в режим просмотра кода и скорректируйте код, как описано выше.

Есть ли ещё какие-то особенности? Увы, да.

Многие авторы помнят, как красиво выглядит обтекание картинки текстом (слева или справа). Да, на странице сайта или в файле PDF можно предполагать, что всё будет хорошо. К сожалению, подобное лёгкое украшение может привести к непредсказуемому внешнему виду странички на различных ридерах, вплоть до полной "каши", т.к. невозможно заранее предсказать ширину экрана, на котором вашу книгу будут читать. Пример в Приложении 2

Большинство экспертов по разработке электронных книг рекомендуют размещать картинки отдельно от текста, иногда даже на отдельной страничке (вставляя разрывы страниц до и после изображения).

Руководство по созданию книг в формате ePub 2.0 _60.jpg

И ещё особенность. Если текст, например, стихотворения, занимает 2/3 пространства страницы, и далее сразу же разместить иллюстрацию – часть программ чтения "вытесняет" иллюстрацию на следующую страницу, но может случиться и большая "неприятность" – изображение может получиться разрезанным. Или будет катастрофически уменьшено. Это оставляет неприятный осадок при чтении.

Опытным путем лично я пришел к выводу, что не стоит помещать даже небольшие иллюстрации после названия стихотворения, перед текстом. На некоторых устройствах может возникнуть ситуация, что после рисунка на странице может остаться только первая строчка (или три строки от катрена). Это тоже неприятно. И давайте подумаем, что автор хочет донести до читателя – свой текст или рисунок и текст к нему?

В новой версии Sigil (начиная с v.0.6.0) появилась очень приятная особенность: при просмотре изображений в папке Images теперь можно просмотреть изображения во внешней программе. Под каждой иллюстрацией можно увидеть свойства файла.

Думаю, будет правильно здесь же чуть прокомментировать вопрос "где брать иллюстрации?"

Есть несколько простых рекомендаций, чтобы Ваша книга была легальной и не нарушала авторских прав художников, фотографов и дизайнеров.

1. Сотрудничество со знакомым художником, фотографом, дизайнером.

2. Получение разрешения от автора изображения на использование его работ в Вашей книге.

3. Использование собственных иллюстраций (рисунков или фотографий).

4. Использование изображений из Public Domain (общественное достояние). К примеру, Jason Matthews ( http://ru.scribd.com/doc....or-Free ) приводит перечень сайтов, где можно свободно брать изображения:

http://www.photos8.com/

http://www.public-domain-photos.com/