Как уменьшить вес картинки без потери качества

оптимизация картинокСкажите, сколько различных картинок на вашем блоге или сайте?

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

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

Давайте выясним, чем же грозит вашему сайту его медленная загрузка.

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

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

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

Итак, картинка для сайта, сколько же она должна весить и какого размера должна быть?

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

То есть если у вас в статье должна быть картинка шириной в 300 пикселей, то уменьшите эту картинку до такого размера с помощью Фотошоп, например, и только потом загружайте в статью.

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

размер картинки

Оптимизация картинок – дело не сложное. Уменьшить вес картинки можно с помощью Фотошоп или с помощью специальных сервисов.

Я пользуюсь и тем и другим. Картинки в формате jpg я оптимизирую с помощью фотошоп. Это не сложно.

А вот для уменьшения веса картинок в формате png (обычно это картинки на прозрачном фоне) лучше использовать сервисы.

Таких сервисов довольно много. Я перепробовала несколько и выбрала для себя самый удобный. О нем сегодня и расскажу вам в видео ниже.

Какого формата картинки лучше загружать на свой сайт? Если вам не нужна картинка на прозрачном фоне, то лучше использовать формат jpg. Картинки этого формата намного легче, чем картинки формата png. Поэтому старайтесь использовать именно его. И только в крайнем случае картинки png формата. Они в несколько раз тяжелее и уменьшать их вес без потери качества сложнее.

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

Посмотрите на шапку своего сайта! Ведь эта картинка довольно большая и весит она прилично. Да и в теме вашего сайта шапка не единственная картинка.

Если вы ставите баннер в боковую колонку своего сайта, то вес картинки баннера, как и ее размер, тоже имеет значение. Картинки баннеров тоже нужно оптимизировать.

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

И помните, что оптимизация картинок одна из составляющих раскрутки вашего сайта!

Для того, чтобы получить ссылку на сервис, кликните на одну из кнопок соц. сетей ниже.

[sociallocker]Сервис для сжатия картинок https://tinypng.com/ (скопируйте и вставьте в строку браузера)[/sociallocker]

 

Оксана Круговая

Поделись с друзьями

Давайте дружить

10 комментариев: Оптимизация картинок

  • Ян Збаразкий говорит:

    Здравствуйте, Оксана! Хочу немного дополнить Ваш полезный материал, думаю многим пригодится. 

    1) В Photoshop' е можно обрезать ненужные поля картинки в автоматическом режиме: Изображение → Тримминг → Ок. Программа обрезает всё лишнее сама. Очень удобно.

    2) https://compressor.io — онлайн сервис, оптимизирующий картинки даже в формате GIF и SVG, чего нет у «Панды» (сервис на видео). Иногда, когда делаю сайты в Adobe Muse, это бывает кстати. Один недостаток в «Компрессоре» это то, что картинки нужно обрабатывать по одной, в отличии от «Панды», где можно загружать сразу несколько. 

    http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_bye.gif

  • Евгений говорит:

    Взгляните на ещё один сервис. На нём можно регулировать качество. ну и соответсвенно вес изображения. optimizilla.com/ru

     

  • Ирина Лукшиц говорит:

    Оксана, очень нужная информация для новичков. У меня были проблемы с перегрузкой хостинга, искала сервисы для оптимизации картинок и тоже попала на тот, который вы рекомендуете. Очень удобно пользоваться. Я иногда не только png, но и gpj оптимизирую. Но размер беру по ширине 600 или чуть больше. В таком случае в фейсбуке при отправке статьи отображается большая картинка.

  • Андрей говорит:

    Действительно, оптимизация картинок архиважно для продвижения сайта.

    Спасибо за актуальность и практику урока.

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_bye.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_good.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_negative.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_scratch.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_wacko.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_yahoo.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_cool.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_heart.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_rose.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_smile.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_whistle3.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_yes.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_cry.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_mail.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_sad.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_unsure.gif 
http://oxamitta.ru/wp-content/plugins/wp-monalisa/icons/wpml_wink.gif 
 
Внимание!!!
За содержание рекламы несет
ответственность рекламодатель.
Мой каталог
”каталог”
Бесплатно
”сборник”
Новинки

автовебинары

”инфопродукт”
”баннер”
”заработок”
”страницы”
Надо уметь
”страницы”


Copyright © 2020. Оксана Круговая.

Яндекс.Метрика Счетчик PR-CY.Rank