Оптимизация изображений улучшает ранжирование страниц. Картинки должны быть легкими, но качественными. При загрузке фото и иллюстраций важно проставить метатеги, чтобы поисковые системы понимали, что на них изображено. Мы расскажем про этапы оптимизации изображений для сайта с конкретными примерами.
Бесплатный экспресс аудит
Проведём SEO аудит без оплаты. Акция действует до конца августа.
Поисковые алгоритмы Яндекса и Google обращают внимание на названия изображений. Названия должны соответствовать метатегам картинок и содержанию страницы. Желательно использовать в названиях ключевые слова (запросы, по которым пользователи могут искать ваш контент).
Примероптимизации фото:
Некорректное имя файла: qW31tY80zM.jpg
Оптимизированное название: iphone-16-white.jpg
Имя картинки не должно быть случайным набором символов. Придумывайте понятные названия, которые описывают суть изображения и легко читаются. Пишите имена файлов транслитом или на английском языке.
Не стоит писать названия файлов на русском языке. Поисковые роботы Google могут неправильно распознавать кириллицу. Некоторые CMS-системы и отдельные плагины не поддерживают работу с файлами, названия которых записаны русскими буквами.
Шаг 2: Уменьшить вес изображений
Перед загрузкой фото и картинок нужно оптимизировать изображения — провести сжатие файлов. Производительность сайта в первую очередь зависит от иллюстраций. Одна картинка часто весит больше, чем текст на странице. Тяжелые картинки часто загружаются по частям, что раздражает читателей.
Не все пользователи готовы ждать, пока сайт загрузится до конца. Некоторые закрывают вкладку, даже если текст загрузился, а картинки — нет. Тяжелые картинки замедляют загрузку сайта и увеличивают процент отказов. В результате позиции сайта в поисковых системах ухудшаются, и трафик снижается.
Помните, что не все люди пользуются скоростным интернетом. Многие открывают сайты с 3G-сетей. Позаботьтесь об их комфорте с помощью сжатия и оптимизации картинок.
Способ 1: Уменьшить размер иллюстраций
Самый простой способ, как оптимизировать изображение, это уменьшить его размер. Чем меньше размер картинки, тем меньше вес. Ширина контентной части во многих шаблонах сайтов: 600-800 пикселей. Часто нет смысла загружать картинки с шириной более 800 пикселей.
CMS-системы автоматически уменьшают большие иллюстрации до нужной ширины. Но сначала с сервера загружаются оригиналы. На загрузку и преобразование файлов требуется время. Чтобы сайт открывался быстрее, следует уменьшить размеры картинок, прежде чем загружать их на сервер.
Есть два подхода к оптимизации изображений для сайта: можно уменьшить размер картинки или обрезать иллюстрацию. Обрезать картинку можно, если фон занимает много места, но не влияет на восприятие сюжета. В ином случае лучше оставить картинку целой, но уменьшить ее ширину и высоту.
Обрезать картинки или менять их размеры можно с помощью платных и бесплатных графических редакторов:
Чтобы оптимизировать изображение, можно просто поменять его формат. В дизайне сайтов чаще всего используются следующие форматы файлов:
JPEG — растровое изображение. Формат часто используется в блогах, соцсетях, каталогах интернет-магазинов. Сохранение изображений происходит с небольшой потерей качества. Формат подходит для передачи сложных градиентов, но не поддерживает прозрачный фон. Универсальное расширение открывается даже в устаревших версиях браузеров.
PNG — растровое изображение. Формат позволяет сохранять фото без потери качества, он сохраняет четкие контуры надписей и логотипов. Можно сохранять картинки с прозрачным фоном. Но PNG файлы весят больше по сравнению с другими форматами, этот вариант не подходит для оптимизации фото.
WebP — растровое изображение. Современный формат WebP создан как замена JPEG и PNG для оптимизации картинок. Он обеспечивает качество изображений при небольшом весе файлов, поддерживает анимацию и прозрачный фон.
SVG — векторное изображение. Формат используется для сохранения иконок, логотипов, графиков и диаграмм.
Для оптимизации изображений для сайта может быть достаточно перевести их из формата JPEG или PNG в формат WebP. После сохранения картинок в разрешении WebP вес уменьшается на 25-35%, а качество остается неизменным. Изменить формат можно с помощью Adobe Photoshop, Squoosh, Photopea и других сервисов.
Способ 3: Использовать превью
Большинство CMS-систем позволяют добавлять превью иллюстраций. Превью — это маленькая картинка, при нажатии на которую открывается полная версия изображения. Стандартная ширина миниатюры: 200-300 пикселей.
Использование превью ускоряет загрузку страниц. Но маленькие картинки ухудшают восприятие информации. Например, не стоит вставлять их в гайды, где используются скриншоты программ.
Скидка 5000 рублей на SEO продвижение
Дарим скидку 5000 рублей на SEO продвижение сайта. Акция действует до конца декабря.
Оптимизировать изображение можно, если снизить качество. Эта функция есть в Adobe Photoshop и других графических редакторах. Чтобы уменьшить вес файла в Adobe Photoshop, нужно открыть диалоговое окно «Сохранить для Web» в меню «Файл». Затем выбрать формат файла и указать в поле «Потери сжатия» допустимый уровень потерь.
Примеры онлайн-сервисов для оптимизации фото:
Compressor.IO.
TinyPNG.
ImageRecycle.
Optimizilla.
При загрузке картинок на сайт важно соблюдать баланс между качеством и весом файлов. Легкие картинки плохого качества быстро открываются. Но низкое разрешение не нравится посетителям. Мы не советуем ухудшать качество файлов более чем на 40%. Оптимальный уровень сжатия: 20-30%.
Для большинства сайтов подходят изображения среднего качества. В некоторых случаях качество иллюстраций важнее, чем минимальная скорость загрузки. Пример: нельзя сильно сжимать фото товаров, которые выбирают по дизайну.
Шаг 3: Заполнить атрибуты Alt и Title
Оптимизация картинок включает создание метатегов Alt и Title. Нужно заполнять их при загрузке иллюстраций на сервер. В метатегах должны быть ключевые слова, которые соответствуют описанию изображения.
Какие задачи выполняют метатеги:
Alt(alternative text) — текст, который описывает содержание картинки. Он дает поисковикам возможность понять, что на ней изображено. Альтернативный текст подставляется вместо картинки, если она не загружается, или используется программа для чтения с экрана.
Title — всплывающая подсказка. Она появляется на экране, когда пользователь наводит на картинку курсор.
Alt — обязательный атрибут для оптимизации. Заполнение Alt улучшает ранжирование страниц и делает контент доступным. Title — дополнительный атрибут, который улучшает пользовательский опыт. Мы советуем заполнять Title, потому что он косвенно влияет на ранжирование.
Примероптимизации фото с помощью метатегов:
Alt:Lada Granta Sport.
Title: Белая Лада Гранта Спорт в ночном городе.
Оптимизация изображений для сайта с помощью метатегов Alt и Title может привлекать трафик из Яндекс.Картинок и Google Image. Хорошо ранжируются уникальные картинки высокого качества. Хорошая стратегия — загружать собственные фотографии и иллюстрации, которых еще не было в интернете. Когда такой возможности нет, чтобы сделать картинку уникальной, можно отзеркалить ее, изменить цвета или дорисовать новые элементы.
Хостинг — это услуга по размещению сайта на сервере и обеспечению постоянного доступа к нему через интернет. Компанию, которая предоставляет такие услуги, называют хостинг-провайдером. Большинство провайдеров предлагают несколько типов хостинга, отличающихся по возможностям, цене и требованиям к администрированию. Разберём основные варианты и критерии выбора подходящего решения. Виды хостинга На практике чаще всего используются следующие типы […]
Результаты e‑commerce во многом определяются тем, как высоко сайт интернет-магазина показывается в поисковой выдаче и насколько удобно им пользоваться потенциальным покупателям. Задача SEO-специалистов — обеспечить максимальную видимость ресурса в поисковых системах и создать комфортный пользовательский опыт. Грамотно выстроенная SEO-оптимизация способна приносить интернет-магазину до 53 % всего трафика. SEO остаётся одним из самых выгодных каналов привлечения […]
Поисковое продвижение по-прежнему остаётся одним из ключевых инструментов маркетинга для медицинских компаний и частных клиник. Статистика показывает: Это означает, что медицинскому сайту жизненно важно занимать высокие позиции в поиске. Без продуманной SEO-оптимизации добиться заметной видимости и стабильного потока пациентов практически невозможно. Эффективное SEO-продвижение даёт медицинским ресурсам ряд серьёзных преимуществ: В условиях тотальной цифровизации грамотная поисковая […]
Когда мы запустили свою компанию по монтажу лифтов, у нас вообще не было сайта. Работали по старинке — через сарафанное радио, рекомендации и личные связи. Но в какой-то момент стало ясно, что без онлайн-присутствия мы теряем огромное количество клиентов. Тогда мы обратились в DDSI, и это было, пожалуй, одно из лучших решений для нашего бизнеса.
Ребята сделали для нас сайт с нуля: продумали структуру, создали удобный и понятный дизайн, написали тексты, которые действительно «цепляют» клиентов. Но самое главное — они взялись за продвижение. Уже через несколько месяцев наш сайт оказался в ТОПе поисковой выдачи по ключевым запросам, а поток заявок вырос в разы. Если раньше мы искали клиентов сами, то теперь они находят нас.
С уверенностью могу сказать, что без DDSI мы бы не добились такого роста. Если вам нужен сайт, который действительно работает, и продвижение, которое приносит результат — обращайтесь к ним без раздумий!
С уважением,
Игорь Громов
Директор ТЕХНО ЛИФТ
Развернуть
Виктория Королёва
КУЛИНАРНЫЙ ОАЗИС
2 февр 2025
Компания DDSI оказала всестороннюю поддержку в продвижении нашего интернет-магазина Кулинарный Оазис. Их команда продемонстрировала высокий уровень профессионализма и глубокое понимание SEO-продвижения и маркетинга. Благодаря их усилиям, наш сайт значительно улучшил свои позиции в поисковой выдаче, что напрямую отразилось на увеличении числа заказов. Отдельного упоминания заслуживает их подход к веб-дизайну. DDSI разработали для нас современный и удобный интерфейс, который не только привлекает клиентов, но и улучшает их опыт взаимодействия с нашим магазином. Мы также оценили их готовность вносить изменения и адаптироваться к нашим специфическим требованиям.
В итоге, наше сотрудничество стало важным шагом в развитии нашего бизнеса, и мы с уверенностью рекомендуем их услуги всем, кто ищет надежного партнера в области маркетинга и веб-дизайна.
Развернуть
Лидия Земляная
ЭЛЕГАНС
2 янв 2025
Здравствуйте! Меня зовут Лидия Земляная, и я руководитель модельной школы «Элеганс» в Москве. Хочу поделиться своим опытом сотрудничества с компанией DDSI, которая занималась продвижением моего бизнеса в интернете. Когда я обратилась в компанию, моя основная цель была увеличить количество осведомленных о школе клиентов и привлечь больше студентов на наши курсы. Команда DDSI сразу произвела на меня впечатление своей профессиональностью и вниманием к деталям. Мы тщательно обсудили мои ожидания и разработали стратегию, направленную на достижение наилучших результатов. Первое, что меня приятно удивило, — это насколько оперативно ребята взялись за работу. Они полностью обновили наш сайт, сделали его не только стильным и современным, но и удобным для пользователей. Вся информация о курсах и преподавателях стала доступна в несколько кликов, а посещаемость сайта значительно возросла.
Но это был только первый шаг. Наиболее впечатляющие результаты я увидела благодаря активному продвижению в социальных сетях и использованию современных инструментов таргетированной рекламы. Увеличение нашей присутствия в интернете привело к значительному росту числа записей на курсы и повышению узнаваемости нашего бренда. Отдельно хочу поблагодарить команду за их постоянную поддержку и готовность адаптировать стратегию в зависимости от меняющихся условий рынка. Их гибкость и профессионализм сделали процесс продвижения не только успешным, но и очень комфортным для меня. Я искренне благодарна DDSI за такой замечательный результат! Благодаря их работе, моя школа «Элеганс» не только укрепила свои позиции на рынке, но и обрела новых вдохновленных студентов. Рекомендую DDSI всем, кто хочет вывести свой бизнес на новый уровень в цифровом пространстве!
Развернуть
Татьяна Щербакова
SANLUX
4 окт 2024
Благодарю компанию DDSI за выдающуюся работу по разработке и продвижению нашего интернет-магазина сантехники SANLUX. С первых дней работы с DDSI мы ощутили высокий уровень профессионализма их команды. Они провели всесторонний анализ нашего сайта и разработали стратегию, специально адаптированную под наши нужды. Новый дизайн и улучшенная навигация сделали наш сайт более привлекательным и удобным для пользователей. Особенно хотим выделить успешное продвижение нашего магазина в поисковых системах. Благодаря эффективному SEO наши позиции в поисковой выдаче существенно улучшились, что напрямую отразилось на увеличении трафика и продаж.
Оставьте оценку и комментарий