Книжное издательство "Электронная книга"

Как сделать картинку лёгкой без потери качества?

В предыдущих статьях я рассказал о предварительной работе (о создании макета), и о последующей, как с помощью графического редактора "eCover Studio" создать объёмную обложку.

А так же, как с помощью "PhotoScape" (или другой программы) удалить лишний фон и уменьшить размеры обложки. Сначала в "eCover Studio" я осознанно увеличивал (чтобы не было лесенки на верхнем и нижнем краях книжной обложки) картинку. А затем, наоборот, уменьшал её, чтобы снизить вес файла. Обложка с большими размерами может пригодиться для печати, и не нужна для книги в электронном виде.

Сегодня я расскажу о том, как оптимизировать любую картинку (и обложку в том числе) для веб-страницы.

Содержание статьи:

1. Для чего необходима оптимизация?

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

Ждать никто не любит, проще - посетить другой сайт. По каждому запросу в поиске можно увидеть массу ответов. Конкуренция высокая, и нет смысла тратить своё драгоценное время на сайтах, которые грузятся долго. Поэтому все владельцы сайтов заинтересованы в лёгких веб-страницах.

2. От чего зависит вес веб-страниц?

Веб-страница - это какой-то объём информации, которая измеряется в байтах (килобайтах, мегабайтах и т.д.). И её мы воспринимаем в виде текста, иллюстраций, звука и видео (виды файлов указаны по мере роста их веса). Чаще всего - в виде текста и графических файлов. Наверное, нетрудно догадаться, что текст будет всегда легче картинок.

По своему опыту скажу, текст на веб-странице весит 10-50 Кб. Редко, когда свыше. Рекомендуемый объём - до 30 Кб. Поэтому, желательно писать не слишком объёмные статьи. Достаточно 1-2 вордовских страниц. Если одна страница состоит из 4-х тысяч знаков, значит до 8-ми тысяч. Одна буква (кириллицы) = два байта. Итого: примерно 16 Кб (8000 * 2 = 16 000 байт). Один килобайт - это не тысяча байтов, а 1024. Поэтому я и сказал, что ПРИМЕРНО 16 Кб.

Но графические файлы весят значительно больше текстовых. Поэтому, когда речь идёт об оптимизации веб-страниц, прежде всего надо обращать внимание на графические файлы, вес которых может быть от нескольких килобайт до сотен мегабайт и выше.

Рекомендуемый вес картинки должен быть 35-70 Кб и максимальные размеры 400 * 600 пикселей. Поэтому предварительно обрезается всё лишнее, например, фон. И уменьшаются размеры до нужных. Третьим шагом будет вырезание лишних пикселей. Эта операция позволит дополнительно уменьшить вес файла. Возможно, имеется множество способов сделать это. Я расскажу о двух, при помощи программ "Adobe Photoshop" и "Ashampoo Photo Optimizer FREE".

3. Как оптимизировать картинку в фотошопе?

Открываем файл в графическом редакторе "Adobe Photoshop".

Команды "File" + "Open" (файл + открыть = открываем файл, который мы уже создали заранее).

Затем "File" + "Save for Web &Devices" ("Сохранить для Интернета и устройств").

Выбираем формат файла, в котором будем сохранять, например, "JPEG". И качество изображения: "High" ("высокий"), "Low"("низкий") или "Medium" ("средний, умеренный").

При выборе, самое главное - уменьшить вес файла при сохранении его высокого качества. Поэтому лучше выбрать "Medium" или "High". Достигается путём проб и ошибок, сравнивая результаты. На глаз, возможно, разница не слишком видна, зато вес файла можно уменьшить значительно.

Если что-то пошло не так, нажимаем на "Cancel" ("Отмена"). Если всё в порядке, жмём на "Ok" (сокращённое "okay", "ладно, хорошо").

На выходе получается новый файл. Картинка с такими же размерами, как и на входе, внешне не отличимая (или почти не отличимая) от оригинала, но в несколько раз легче. То, что нам и требовалось.

4. Как оптимизировать картинку в альтернативной программе?

Аналогичную оптимизацию можно сделать в графическом редакторе "Ashampoo Photo Optimizer FREE".

Там ещё проще. Программа русскоязычная. Открываем нужную папку.

Потом выбираем конкретную картинку и жмём "Оптимизировать". Затем "Сохранить" или "Отмена оптимизации", если что-то не понравилось.

Как видите, всё интуитивно понятно. Если нужно сохранить КОПИЮ картинки, сохраняем её. Картинка будет сохранена дважды: ДО оптимизации и ПОСЛЕ. Вдруг, для дальнейшей работы Вам потребуется оригинал.

Ещё один момент! Чем хороша эта программа? Тем, что можно обрабатывать иллюстрации ПАКЕТНО. Например, у Вас имеется папка с двумя сотнями фотографий. И необходимо оптимизировать все фотографии. Тогда оптимизируем всю папку ЦЕЛИКОМ, за один раз.

Результат будет тот же. Это очень удобно! Если имеется сомнение в качестве, пересмотрите результат! Неудачные фото забракуете, заменив их из резервной папки. При необходимости можно обработать индивидуально в фотошопе, как было описано выше.

Надеюсь, что статья была полезной Вам. И Вы теперь знаете, как оптимизировать картинку, используя вышеуказанные программы.

Автор статьи: Олег Гузь
Дата публикации: 03.03.2020

Добавить Ваш комментарий:

Рекомендуемые статьи:

Если информация Вам понравилась, пожалуйста, поделитесь ссылкой на эту веб-страницу со своими друзьями из социальных сетей, нажав на одну из кнопок, расположенных ниже. Пусть и Ваши друзья узнают о ней!

Новинки
книжного издательства

14-го августа 2021 года
издана и опубликована книга:

Принимаются заявки
на издание и последующую
бесплатную
публикацию книг.

Пишите издателю на E-mail:
izknigi@gmail.com