Лучшие партнерские программы - отзывы и рейтинг
  • Войти
  • Регистрация
Написать пост
Карты без СКАМА
  • Партнерки
    • CPA партнерки
    • Гемблинг
    • Wap Click
    • Adult партнерки
    • Дейтинг
    • Интернет - магазины
    • Дропшиппинг
    • Товарные
    • Форекс
    • Финансовые
    • Essay / образование
    • Мобильные
    • Необычные
    • Download / install
    • Крипта и биржи
    • Black list
  • Рекламные сети
    • Popunder и clickunder
    • Push сети
    • Баннерные сети
    • Видеореклама
    • Мобильная реклама
    • Тизерные сети
    • Контекстная реклама
    • Нативная реклама
    • Adult трафик
  • Сервисы
    • Онлайн-школы
    • Хостинг
    • E-mail рассылки
    • VPN и прокси
    • Платежные сервисы
    • SMM сервисы
    • Крауд-маркетинг
    • Биржи контента
    • Сервисы для бизнеса
    • Биржи ссылок
    • Обзоры нейросетей
    • Фриланс биржи
    • Чат, обратный звонок
    • Конструкторы сайтов
    • Темы и плагины для CMS
    • SEO сервисы
    • Для арбитражника
    • Для вебмастера
    • Для интернет-магазинов
    • Обмен валют
    • Раскрутка сайта
    • Сбор подписчиков
  • Статьи
    • SEO
    • Кейсы
    • Маркетинг
    • Криптовалюта
    • Новости
    • Веб-разработка
    • Нейросети
    • Соцсети
    • Личные блоги
    • Для начинающих
    • Заработок
    • Дизайн
    • Финансы
    • Профессии
  • Курсы
    • Программирование
    • Маркетинг
    • Дизайн
  • Анонсы
  • Конкурсы
Нет результатов
Смотреть все
Лучшие партнерские программы - отзывы и рейтинг
  • Партнерки
    • CPA партнерки
    • Гемблинг
    • Wap Click
    • Adult партнерки
    • Дейтинг
    • Интернет - магазины
    • Дропшиппинг
    • Товарные
    • Форекс
    • Финансовые
    • Essay / образование
    • Мобильные
    • Необычные
    • Download / install
    • Крипта и биржи
    • Black list
  • Рекламные сети
    • Popunder и clickunder
    • Push сети
    • Баннерные сети
    • Видеореклама
    • Мобильная реклама
    • Тизерные сети
    • Контекстная реклама
    • Нативная реклама
    • Adult трафик
  • Сервисы
    • Онлайн-школы
    • Хостинг
    • E-mail рассылки
    • VPN и прокси
    • Платежные сервисы
    • SMM сервисы
    • Крауд-маркетинг
    • Биржи контента
    • Сервисы для бизнеса
    • Биржи ссылок
    • Обзоры нейросетей
    • Фриланс биржи
    • Чат, обратный звонок
    • Конструкторы сайтов
    • Темы и плагины для CMS
    • SEO сервисы
    • Для арбитражника
    • Для вебмастера
    • Для интернет-магазинов
    • Обмен валют
    • Раскрутка сайта
    • Сбор подписчиков
  • Статьи
    • SEO
    • Кейсы
    • Маркетинг
    • Криптовалюта
    • Новости
    • Веб-разработка
    • Нейросети
    • Соцсети
    • Личные блоги
    • Для начинающих
    • Заработок
    • Дизайн
    • Финансы
    • Профессии
  • Курсы
    • Программирование
    • Маркетинг
    • Дизайн
  • Анонсы
  • Конкурсы
Нет результатов
Смотреть все
Лучшие партнерские программы - отзывы и рейтинг
Нет результатов
Смотреть все
Карты без СКАМА

Как оптимизировать изображения

Дмитрий Дмитрий
21.03.2025
 SEO, Для начинающих
0
0
Как оптимизировать изображения
1.6k
просмотров
Содержание
  • 1. Какие бывают виды картинок
  • JPEG
  • PNG
  • GIF
  • WEBp
  • 2. Зачем нужно оптимизировать картинки
  • 3. Как именно можно уменьшить размер картинок
  • 4. Сжатие изображения
  • 5. Чем сжимать?
  • WP Smush или Imsanity
  • 6. Что еще можно сделать?
  • 7. Небольшой чек-лист
  • 8. Заключение

Картинки – камень преткновения в SEO продвижении многих сайтов. Вроде бы ничего такого, это же просто изображения, иллюстрирующие страницу, но баланс между их качеством и размером очень важен для продвижения всего сайта.

Если сильно ужать – пострадает качество. Ужать недостаточно сильно – страница будет много весить. Так как найти этот самый баланс и ужимать картинки правильно?

Какие бывают виды картинок

Глобально все вся графика делится на два вида: Растровая и Векторная.

Векторная графика генерируется математически из трех видов базовых фигур: кривой, точки и линии.

Растровая графика состоит из сетки пикселей.

В чем разница на практике? Размер векторного изображения можно изменять как угодно, он просто будет пересчитываться и не терять в качестве. С растром же наоборот. Чем больше вы увеличиваете размер от изначального – тем пиксельнее оно становится, т.е. ухудшается качество.

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

Самый популярный формат векторной графики – SVG (Scalable Vector Graphics) или масштабируемая векторная графика. SVG используют для логотипов, фонов и других графических элементов в веб-дизайне.

С растром всё сложнее. Тут мы имеем три часто используемых формата:

Читайте также

Как найти и удалить скрытый майнер с компьютера: полный гайд

Как сделать гиф из видео? ТОП-5 способов

Топ платежных систем для арбитража в 2025 году

  • Jpeg
  • Png
  • Gif
  • WEBp

JPEG

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

PNG

Тут всё наоборот. Есть и прозрачность и отсутствует потеря качества при сжатии. Главный недостаток – слишком маленькая степень сжатия, в следствии чего, большой вес изображений.

GIF

GIF – самый популярный формат для анимации в интернете. Формат поддерживает всего 256 цветов и прозрачность. Недостаток – большой вес самой анимации и многие браузеры блокируют её авто воспроизведение ради экономии трафика.

WEBp

Этот формат разработан в Google. Из его преимуществ – сжатие размера файла достигает 25%. Хорошо работает в родном браузере Google, но пока беда с поддержкой в различных CMS и сервисах. Тот же WordPress его не поддерживает.

Зачем нужно оптимизировать картинки

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

Каждая секунда загрузки страницы снижает конверсию в среднем на 7%, это доказано. Так что, готовы ли вы из-за больших картинок расстаться с продажами? Не думаю.

Как именно можно уменьшить размер картинок

Существует несколько базовых способов изменить размер изображения:

  • Масштабирование
  • Обрезка
  • Сжатие
  • Изменение формата

Каждый из этих способов можно использовать даже на одной картинке. Давайте возьмем практический пример.

Допустим возьмем вот это изображение планеты. Изначально оно имеет у нас 7 007 261 байт размера, формат PNG т разрешение 2212х2212 пикселей.

Вставить мы его хотим на наш сайт, соответственно и подогнать его нужно под наш формат.

Первое что мы сделаем, это изменим размер изображения. Размер контентной сетки у нас 700 пикселей. По сути, больше картинка и не нужна, но мы посмотрим на перспективу дальнейшего расширения контентной части сайта до 900 пикселей и ужмем эту картинку до такого размера.

Загружаем её в Photoshop, выбираем инструмент «Размер изображение» в разделе «Изображение» и меняем её ширину на 900, сохраняем.

Теперь наше изображение имеет вес 1 454 745 байт и в целом не потеряло в качестве, ведь оно и так на сайте ужималось аж до 700 пикселей.

Всё в том же Photoshop меняем формат картинки на JPG и смотрим на результат. Для этого просто выбираем «Сохранить как» и формат JPG.

Дальше ФШ предложит нам выбрать формат JPEG, где качество изображения измеряется по 12-ти бальной шкале. Мы рекомендуем выставить значение равное 9, его вполне достаточно для хорошего сжатия и минимальной потери качества.

Теперь вес нашей картинки составляет всего 327 579 байт и имеет белый фон. Видимой потери в качестве всё еще не наблюдается.

Осталось ужать картинку с помощью специального софта FileOptimizer, настройки которого вы можете посмотреть на скриншоте.

Теперь моё изображение весит всего 283 204 байт или 276 кбайт. Учитывая, что изначально картинки весила 1.5кк байт, а сейчас всего 283 204 байта и мы не потеряли в качестве, то это очень хороший результат.

Да кстати, в этом примере мы не использовали обрезку, так как у картинки изначально не было лишних полей.

Сжатие изображения

Что есть сжатие? Это удаление информации из изображения, которую человек не видит. Сюда же входит и вся информация о том, когда была сделана фото, на что она была сделана. В общем удаляется все метаинформация о картинке.

Лучше всего использовать сжатие именно на JPEG, так как он лучше всего поддается ему. Главное, не переборщить со степенью, чтобы не потерять в качестве. Если точнее, то в качестве вы потеряете в любом случае, но разница в том, будет ли это заметно человеческому глазу или нет.

Чем сжимать?

Софта для сжатия много. Можно пользоваться платными или бесплатными программами, онлайн сервисами или плагинами для CMS.

Из бесплатных оффлайн программ себя хорошо выделяет FileOptimizer. Хорошее сжатие, быстрая работа, а главное – пакетная обработка изображений. Вы легко можете загрузить туда 10 000 картинок и в течение нескольких часов они все будут сжаты.

Настройки позволяют выбирать степень сжатия и сохранять ли бэкапы картинок.

WP Smush или Imsanity

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

Однако, будьте предельно аккуратны используя такие плагины на старых картинках и тщательно проверяйте предварительные настройки. Допустим, в Imsanity есть такая настройка как «Преобразовывать PNG в JPG». В идеале её нужно включить для всех новых картинок, но если вы хотите преобразовать и старые, убедитесь, что логотип и другие элементы графики на сайте останутся в порядке, т.к. многие используют для лого именно PNG формат.

Для сайтов рекомендуется делать максимальным размер картинок не более 1280 пикселей по любой стороне. Качество изображений оставляем стандартное 82, Deep Scan вам скорее всего не нужен.

ОБЯЗАТЕЛЬНО сделайте бэкап сайта перед пакетной работой с изображениями. Лучше подстраховаться заранее.

Что еще можно сделать?

Еще вы можете преобразовать все картинки со своего сайта формат WEBp, так вы выиграете еще 20-25% веса.

Можно организовать загрузку картинок через CDN сеть, но это повлечет за собой дополнительные расходы.

Небольшой чек-лист

Вот вам небольшой чек-лист для каждой картинки, которую вы хотите загрузить на сайт:

  • Проверьте формат, предпочтительный JPG
  • Проверьте размер изображения. Лучше, чтобы он не сильно превышал размер контентной сетки сайта
  • Можно ли что-то обрезать на картинке? Если да, сделайте это
  • Стоит ли на вашем сайте плагин для оптимизации картинок? Если да, то загружайте изображение, если нет, то воспользуйтесь онлайн-сервисом или оффлайн-софтом, например FileOptimizer

Заключение

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

Метки:Руководства
Previous Post

Какие сайты не стоит покупать

Next Post

Как правильно анализировать конкурентов

Дмитрий

Дмитрий

Похожие Статьи

8 Заблуждений новичков об интернет-маркетинге
Маркетинг

8 Заблуждений новичков об интернет-маркетинге

27.03.2025
1.8k
Что такое репутация компании в интернете
Для начинающих

Что такое репутация компании в интернете

21.03.2025
1.4k
Сайт нахаляву
Для начинающих

Сайт нахаляву

31.03.2025
13.1k
Next Post
Как правильно анализировать конкурентов

Как правильно анализировать конкурентов

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

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

Нажимая «Отправить», вы принимаете пользовательское соглашение и политику конфиденциальности.

Статьи

  • Топ
  • Комментарии
  • Новое
Правильные ответы на тест Воркзилла

Правильные ответы на тест Воркзилла

05.04.2025
Как создать бота в Телеграм

Как создать бота в Телеграм

10.04.2025
5 способов обхода запрета блокировщиков рекламы на YouTube

5 способов обхода запрета блокировщиков рекламы на YouTube

11.04.2025
Все виды поисковых операторов

Все виды поисковых операторов

3
15 плагинов WordPress для создания личного кабинета

15 плагинов WordPress для создания личного кабинета

1
12 лучших WordPress-плагинов для создания тестов, квизов и опросов

12 лучших WordPress-плагинов для создания тестов, квизов и опросов

1
10 российских нейросетей, которые стоит попробовать

10 российских нейросетей, которые стоит попробовать

13.06.2025
Шевелятся, улыбаются, говорят: нейросети для оживления фотографий

Шевелятся, улыбаются, говорят: нейросети для оживления фотографий

12.06.2025
Как найти и удалить скрытый майнер с компьютера: полный гайд

Как найти и удалить скрытый майнер с компьютера: полный гайд

11.06.2025
Выбор редакции
1
OFFERGATEОоооочень много офферов
5.0 
2
MYBIDТоповые пуши
5.0 
3
CATAFFSТоп гемблинг офферы
5.0 
4
LGAMINGБолее 1000 гемблинг-офферов
4.9 
5
Меta CPAПрямой рекламодатель по нутре
4.9 
6
BYBITЛучшая криптобиржа
4.9 
7
1XPARTNERSБеттинг партнерка №1
4.9 

© 2025 Aff1.ru — Один из ведущих порталов в рунете о партнерских программах, интернет-маркетинге и способах заработка в интернете.

О сайте

  • Контакты

Интересное

  • Подборки сервисов
  • Закрывшиеся партнерки

Войти на сайт

Мы всегда рады вас видеть

Забыли пароль? Регистрация

Создать новый аккаунт

Заполните форму для регистрации

*Нажимая «Зарегистрироваться», вы принимаете пользовательское соглашение и политику конфиденциальности.
Все поля обязательны Войти

Восстановить пароль

Введите ваш логин или email для восстановления пароля

Войти
Нет результатов
Смотреть все
  • Партнерки
    • CPA сети
    • Гемблинг
    • Wap click
    • Мобильные
    • Дейтинг
    • Финансовые
    • Adult партнерки
    • Форекс
    • Интернет — магазины
    • Essay / образование
    • Товарные
    • Крипта
    • Дропшиппинг
    • Необычные
    • Download / install
    • Black list
  • Рекламные сети
    • Popunder и clickunder
    • Push сети
    • Тизерные сети
    • Нативная реклама
    • Баннерные сети
    • Контекстная реклама
    • Мобильная реклама
    • Видеореклама
    • Adult трафик
  • Сервисы
    • Онлайн-школы
    • Хостинг
    • E-mail рассылки
    • VPN и прокси
    • Платежные сервисы
    • SMM сервисы
    • Крауд-маркетинг
    • Биржи контента
    • Сервисы для бизнеса
    • Биржи ссылок
    • Обзоры нейросетей
    • Фриланс биржи
    • Чат, обратный звонок
    • Конструкторы сайтов
    • Темы и плагины для CMS
    • SEO сервисы
    • Для арбитражника
    • Для вебмастера
    • Для интернет-магазинов
    • Обмен валют
    • Раскрутка сайта
    • Сбор подписчиков
  • Статьи
    • SEO
    • Кейсы
    • Маркетинг
    • Криптовалюта
    • Новости
    • Веб-разработка
    • Нейросети
    • Соцсети
    • Личные блоги
    • Для начинающих
    • Заработок в интернете
    • Дизайн
    • Финансы
    • Профессии
  • Курсы
    • Программирование
    • Маркетинг
    • Дизайн
  • Анонсы событий
  • Конкурсы
  • Войти
  • Регистрация

© 2013-2025 Aff1.ru - Один из ведущих порталов в рунете о партнерских программах, интернет-маркетинге и способах заработка в интернете.

Мы используем файлы cookie, чтобы сделать наш сайт максимально удобным для вас. Пожалуйста, ознакомьтесь с политикой использования Cookies.