Добавление изображений в электронный учебник
Содержание статьи
В электронный учебник рекомендуется добавлять изображения в формате JPEG или Webp. Если нужна анимация, то используйте формат GIF.
Подготовка изображения#
Прежде всего, оптимизируйте все изображения. Картинка должна сохранить приемлемое качество, а также иметь минимальный размер файла.
Примерная характеристика изображения JPEG:
| Параметр | Рекомендации |
|---|---|
| Размер файла | не более 300 килобайт |
| Ширина изображения | не более 1280 пикселей |
- Внимание
-
Параметры картинок зависят только от вашего предпочтения. При оптимизации изображения, обязательно оставляйте резервную копию исходного файла в высоком качестве.
Все изображения будут храниться в одной папке. Поэтому, для понятной структуры файлов, переименуйте все изображения по примеру:
- 1-1.jpg
- 1-2.jpg
- 2-1.jpg
Первое число указывает номер главы или страницы, а второе - порядковый номер изображения на странице.
Вставка изображения#
Для удобства все картинки можно скопировать в папку с электронным учебником.
название учебника\public_html\user-images
Перейдите в визуальный редактор и поставьте курсор в том месте, куда нужно добавить изображение. Каждое изображение вставляйте в отдельный абзац.
Через инструмент Изображение выберите (либо добавьте) нужное изображение из списка и нажмите Вставить.
Также картинки можно добавлять на вкладке HTML-код с помощью тега img:
<img src="user-images/1-1.jpg">
| Атрибут | Описание |
|---|---|
| src | Путь к графическому файлу относительно папки public_html |
| width | Ширина изображения |
| alt | Альтернативный текст изображения |
| border | Толщина рамки изображения |
Пакетное сжатие#
С помощью пакетного сжатия можно оптимизировать несколько картинок одновременно.
Для этого воспользуемся бесплатной программой ImageCompression.SB. Скачать её можно по ссылке.
Порядок пакетного сжатия фотографий:
- Указываем путь к папке с изображениями которые нужно сжать
- Установить необходимую ширину изображений на выходе (если выбрать не изменять, то фотографии сожмутся примерно в 2-3 раза)
- Установить качество изображения 80%
- Выбрать папку для сохранения сжатых изображений.
- Начать обработку
Сжатые изображения появятся в отдельной папке, а исходные файлы затронуты не будут.
Хотите научиться создавать электронные учебники?
18 видеоуроков по TurboSite: от установки до публикации. Исходники, адаптивный шаблон и программа «Редактор схем».
Подробнее о курсе →