Блог
Анны Фёдоровой Как зарабатывать в интернете и на своём блоге?

Как уменьшить вес картинки?

2015.01.15
Автор:

Как уменьшить вес картинки

Доброго времени суток друзья! Тема уменьшения веса картинок всегда актуальна как для блоггеров, которые стремятся ускорить загрузку своих блогов, так и для пользователей, которые хотят уменьшить вес фотографий, к примеру, для аватарки.

И сейчас я вам расскажу, как уменьшить вес картинки, скриншота или фотографии без потери качества.

Перед тем как вставлять изображения в статьи, я их оптимизирую (оптимальный вес картинок для блога – 50КБ и меньше). Некоторые этого не делают, что не очень хорошо сказывается на их сайтах. Теперь несколько слов о том, почему это так важно делать тем, кто ведёт свои блоги или сайты?

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

Кстати кто не знает можно на блоге в статьи вставлять картинки небольшого размера, при этом чтобы при нажатии они увеличивались до оригинального размера и в тоже время нагрузка на блог была минимальной. Как это сделать читайте тут: «Увеличение картинок в статьях».

Итак, продолжаем дальше. Вот взять тот же кулинарный сайт. В одном пошаговом рецепте у многих по 6 фотографий, а то и больше. И если не уменьшать их вес, так и место на хостинге быстро закончится. А теперь ближе к делу. Фотография в среднем весит около 5 Мб, а можно уменьшить вес без потери качества до 50Кб. Чем мы сейчас и займёмся.

Как уменьшить вес картинки?

Самый простой, на мой взгляд, способ уменьшить вес картинки — воспользоваться программой Adobe Photoshop. К тому же многим вебмастерам без неё просто не обойтись. Она платная, но в интернете чего только не найдёшь.

Открываем в фотошопе нужное изображение. И теперь внимание!!! Если вы собираетесь эту картинку вставлять в статью на свой сайт, тогда сразу советую изменить ширину данного изображения. Тем самым подогнать размер этой картинки под используемый вами шаблон.

Нажимаем в верхней части главного меню «Изображение» — «Размер изображения» и указываем нужные параметры ширины и высоты картинки. Если галочка будет установлена на «Сохранить пропорции», то достаточно будет вписать только ширину, а высота будет автоматически подстроена с соблюдением пропорций.

У меня автоматически ширина этой фотографии в фотошопе 3648 пикс.

Я обычно меняю на 600 px (пикселей), чтобы данное изображение в моём шаблоне смотрелось как надо. Можно и меньше поставить если вы хотите чтобы фото было поменьше.

Потом жмём «Файл» — «Сохранить для Web устройств.

umenshit-ves-kartinki

В открывшемся окне справа ставим следующее: Набор – выбираем «Высокое качество JPEG» — «Оптимизация» и «Качество» ставим 60, если устроит качество – можно поставить ещё меньше.

ves-kartinki

В нижнем левом углу смотрим, сколько стала весить картинка. Устраивает — жмём сохранить. В итоге у меня получилось 67,15 КБ. Думаю неплохо, учитывая что было 4,94 МБ. Вот таким образом можно уменьшить вес фото или изображения без заметной потери качества.

Для фотографий лучше использовать формат jpg, а вот для скриншотов можно выбрать формат gif или png.

Можно ещё дополнительно уменьшить вес с помощью онлайн-сервисов. Например kraken.io, нажимаем Try Free Web Interface и загружаем изображение. После чего скачиваем файл. Правда процент сжатия небольшой, но всё таки.
У меня получилось 55,10КБ вместо 67,15. Или вот ещё похожий сервис JPEGmini.

kartinkaНо это ещё не всё есть ещё один способ уменьшить вес картинок — программа Snagit. Опытные ребята наверняка уже знают про неё, рассказываю для тех, кто не в курсе. Открываем изображение у себя на компьютере, запускаем Snagit и делаем скриншот с экрана. Подробнее об этом я писала здесь. Теперь вес картинки уменьшился во много раз. А можно ещё и уменьшить размер, за счёт чего соответственно и вес.

Если у вас изображение лежит на рабочем столе, то правой кнопкой на неё нажимаем, потом «Открыть с помощью» — «Microsoft Office Picture Manager».

kak-umenshit-ves

Далее нажимаем на «Изменить рисунки» — «Изменение размера» и ищем «произвольные ширину и высоту» и устанавливаем нужный вам размер. Можете поставить 600 на 450.

Советую попробовать все эти способы, но один момент — можно сжать картинку с потерями качества, а можно без потерь. Тут уже смотрите на качество получившегося изображения.

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

И поскольку время загрузки сайтов имеет огромное значение как для пользователей интернета, так и для поисковых систем. Желательно  не размещать картинки вес которых превышает 50кб.

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

Проверить какое изображение тормозит загрузку сайта можно с помощью сервиса gtmetrix.com. Переходим и вписываем адрес сайта. После анализа ищем раздел «Optimize images» и нажав на него увидим все картинки, требующие оптимизации на вашем сайте.

уменьшить-вес-картинки

P.S. Если кто знает ещё другие хорошие способы уменьшения веса картинок и напишет в комментариях к статье, буду премного благодарна.

Не пропускайте обновления блога!

С уважением, Анна Фёдорова


Комментариев: 3

  1. Denis

    Фотошоп рулит в этом плане, всегда его использую.

    Ответить
    1. Анна Федорова

      Фотошоп имеет большое количество функций и вебмастерам он просто необходим.

      Ответить
  2. Артем

    Еще можно сделать скрин фотки сразу вес уменьшиться

    Ответить

Оставить комментарий: