Зачем необходимо оптимизировать изображения для сайта? Как это повлияет на скорость работы ресурса? Поможет ли это в продвижении проекта? Об этом и многом другом поговорим в данной статье. Привет, друзья! С вами Юрий Бошников! Не стоит думать, что процесс оптимизации картинок для сайта – маловажный этап в продвижении сайта. На самом деле пренебрегая данным направлением, владельцы сайтов провоцируют негативное отношение поисковых роботов к контенту, размещенному на ресурсе. Ведь картинки также принимают участие в поиске! Если они не оптимизированы, не подписаны, слишком тяжелые, все это негативно отражается на позиции проекта в поисковых системах.
Содержание статьи:
(смотрите видео: это самый наглядный разбор с примерами)
Ищем картинки для сайта: где их брать и какими они должны быть
Перед началом работы следует убедиться, что используемая картинка соответствует трем параметрам:
- релевантность публикуемой статье;
- уникальность;
- «легкость».
Что такое релевантность – думаю, понятно. Если нет – немного уточню: соответствие фотографии тематике материала. То есть, если вы пишите про женскую одежду, нет смысла прикреплять иллюстрацию карбюратора.
Уникальность картинки столь же важна, как и уникальность текста. Если есть возможность самостоятельно создавать картинки, фотографии – отлично! Тогда с уникальностью проблем не возникнет.
Обратите внимание! Крайне не рекомендуется ставить ссылки на картинки – если источник перестанет работать, на сайте окажется пустое место. Брать изображения с других сайтов просто так – плохое решение. Это воровство.
Где брать картинки? Первый способ:
- ввести нужный запрос в поисковой системе Гугл;
- перейти в раздел «Картинки»;
- под поисковой строкой кликнуть на «Настройки»;
- кликнуть по надписи «Лицензия»;
- выбрать раздел с «Лицензией на использование».
Второй способ подразумевает покупку изображения на фотостоках. Там представлен огромный выбор высококачественных изображений по любой тематике. Вот список наиболее популярных стоков:
- Shutterstock;
- iStockphoto;
- Dreamstime;
- BigStock.
Если у вас проект молодой, нет свободных средств на покупку картинок, попробуйте поискать изображения по нужной тематике на бесплатных фотостоках. Среди таковых выделяются:
- StockSnap;
- Pexels;
- Unsplash;
- Death to the Stock Photo.
Еще интересная информация по поводу использования картинок из интернета.
Смотрите видео всего 9 минут
Как оптимизировать изображения для сайта: что нужно сделать
Процесс оптимизации занимает некоторое время. Предполагает несколько этапов. Но все эти действия – простые. Пусть вас не пугает объем текста. Ознакомившись с ним и немного набив руку, на каждую картинку вы будете тратить не более 3-5 минут.
Добиваемся уникальности
Где бы вы ни взяли фото – оно может быть не уникальным. Даже, если купили на стоке, вероятно, что его купил еще кто-то или купит в будущем. Поэтому нужно заняться уникализацией изображения.
1. Изменения названия. Пишется оно латиницей. Лучше всего английскими слова вкратце описать, что изображено на картинке. Так поисковые роботы лучше проиндексируют картинку.
2. Обработка в редакторе. Достаточно немного обрезать картинку или повернуть ее хотя бы на 15 градусов в любом направлении, а лишнее обрезать.
Совет! Нанесение изображения на картинку не делает ее уникальной.
Уменьшение «веса»
Теперь о том, как оптимизировать изображение для сайта Google. Или для любой другой поисковой системы. Крайне важно, чтобы картинка была достаточно легкой, без проблем грузилась и не приводила к длительному открыванию страницы ресурса.
Обратите внимание! Скорость загрузки оказывает непосредственное воздействие на позиции проекта в поисковой выдаче.
Наличие современного программного обеспечения позволяет уменьшать картинки без потери качества. Размеры изображения зависят от типа сайта. Например, если это блог, то ширина картинки обычно составляет 600 пикселей. Поэтому, если подготовить более широкое изображение, картинка будет отображаться на странице не слишком красиво.
Открываете изображение в редакторе – фотошопе. Нажимаете сочетание клавиш Ctrl+I, открывается новое окно и вводите нужные вам параметры. Картинка автоматически сжимается до введенных размеров.
Совет! Первый раз убедитесь, что в качестве «системы измерения» установлены пиксели. При нажатии клавиш Ctrl+I и открытии нового окна вы увидите, где меняются параметры.
Теперь картинка стала меньшего размера. Но ее вес можно еще больше уменьшить, не потеряв качества. Зажмите следующее сочетание клавиш: Ctrl+Shift+Alt+S. Откроется окно сохранения картинок для веба. Верхнем правом углу поставьте качество картинки 60%. Сохраните изображение. Теперь оно будет максимально легким, но не потеряет свое качество.
Обратите внимание! Первый этап можно пропустить. Сразу сохраняя картинку для веб, в открывшемся окне в нижней его части будет поле ввода размера изображения. Установите там нужные параметры, проверьте качество (60%) и сохраняйте.
Отмечу, что оптимизировать изображение онлайн тоже реально. Но я привык работать в фотошопе. Если интересуют именно онлайн-сервисы, вы без труда найдете их в сети. Работать с ними – достаточно просто.
Формат картинки
Рассказывая о том, как оптимизировать изображения для сайта, не могу пройти мимо формата картинок. Они бывают трех видов:
- jpg;
- gif;
- или png.
Каждый формат предназначен для картинок различного типа и размера. В большинстве случаев принято использовать расширение jpg. Картинки с png используются в тех случаях, когда важен прозрачный фон.
Кстати! Еще немного о том, как оптимизировать изображения для сайта онлайн. Среди наиболее популярных и отлично работающих сервисов выделяются gtmetrix.com, developers.google.com. Именно их я рекомендую на своем онлайн-тренинге «Как сделать сайт своими руками». Кстати, обучение бесплатное и построено на практических заданиях. Спустя четыре дня каждый студент уже имеет свой работающий, оформленный и наполненный контентом сайт.
Оформление изображения
Следующий важный этап, как оптимизировать изображение для сайта Google – это правильное оформление картинки. Проводится операция после того, как картинка загружена на сайт.
Там будет доступна опция редактирования. Кликнув по соответствующей кнопке, откроются свойства картинки. В зависимости от редактора и административной панели, для изменения представлены следующие параметры:
- размеры;
- положение на странице;
- отступы от текста;
- и, возможно, некоторые другие.
Наиболее важными являются два атрибута – это alt и title. Если их не заполнить, это негативно отразиться на поисковой оптимизации самого изображения, конкретной страницы и всего сайта в целом.
Вкратце расскажу, что представляет собой каждый из этих атрибутов – тегов. Начнем с alt. Он – альтернативный текст. Именно на него ориентируются поисковые роботы – они не распознают картинки, а считывают их. Если по какой-то причине изображение не подгрузится, когда пользователь будет открывать страницу, то вместо него будет пустой квадратик с надписью. Эта надпись и есть тот самый alt.
В данный тег на любом удобном для владельца проекта вводится краткое описание картинки. Например – «футбольный мяч адидас». То есть, нужно описать, что изображено на фотографии или рисунке.
Обратите внимание! Данный тег важен для пользователей с ограниченными возможностями. Так, есть специальное ПО, которое насчитывает, что именно изображено на странице. Программа сможет пояснять картинку. Заполняя тег, вы не только оптимизируете сайт в целом, но и сделаете его максимально удобным для людей с ограниченными возможностями.
В свое время я занимался оптимизацией сайтов на заказ. Признаюсь, на крупных порталах, масштабных интернет-магазинах не всегда есть смысл писать названия картинок. Потому что это слишком большая, затратная по времени работа. Ведь там используется несколько сотен, а то и тысяч фотографий товаров.
Поэтому в таких случаях ограничиваются заполнением тега alt. Но без него не обойтись. Это минимум, который можно сделать, чтобы оптимизировать изображения. Что положительно отразится на конечных результатах поисковой выдачи.
Но есть один важный момент, которым также нельзя пренебрегать. Касается он размещения картинок внутри сайта. Они должны быть помещены в одном каталоге. Если в этом есть необходимость, внутри каталога создаются дополнительные подкаталоги, папки.
Это нужно для того, чтобы поисковые роботы максимально быстро, точно и правильно выполнили индексирование всех используемых на ресурсе картинок. Они будут лучше распознаваться, а сайт в целом, как и его отдельные страницы в частности, быстрее отобразятся в поисковой выдаче.
Теперь немного о том, что такое тег title – это заголовок изображения. Он отображается после того, как пользователь наведет мышкой на картинку. Title также достаточно важен. Вместе с alt поисковые роботы узнают, что конкретно представлено на картинке, к какому ключевому запросу ее отнести, релевантно ли вообще изображение странице и тексту.
Обратите внимание! Оба тега обязательно должны быть релевантными статье или тексту, который окружает картинку на конкретной странице. То есть, повторюсь, если сайт посвящен автомобильным шинам, публиковать картинки с женской одеждой нет смысла. Как и нет смысла, прописывать такие теги. Поисковые роботы слега озадачатся, а результаты выдачи будут непредсказуемыми.
При заполнении title рекомендую взять небольшой отрывок окружающего текста, который лучшим образом отобразит содержание самой статьи и картинки. Но отрывок не должен превышать 8 слов.
Как оптимизировать изображения для сайта: есть ли смысл использовать плагины
Читайте также: Контент стратегия: 12 шагов к ее созданию
Главная цель оптимизации – повысить поисковую выдачу сайта и сделать его удобным для пользователей. Второе – также крайне важно. Поскольку оказывает воздействие на поведенческие факторы, а это, снова-таки, влияет на результаты поисковой выдачи.
В чем удобство оптимизированной картинки для пользователя? Во-первых, маленький размер, благодаря чему картинка не съедает много трафика. Во-вторых, ее подпись. В-третьих, пользователь попадает именно туда, куда хотел и находит именно то, что искал.
Некоторые, задаваясь вопросом, как оптимизировать изображение для сайта Google, часто интересуются – возможно ли использовать для этих целей различные плагины. Лично я не советую этого делать. Ведь работы не так и много, все действия реально выполнить в сжатые сроки.
Ведь только вы сами можете добиться нужного результата. А затраченное на оптимизацию время оценивайте, как инвестиции в свой проект
Кстати! Обязательно проверьте файл robots.txt. Возможно, в нем будет стоять запрет на индексацию картинок. Уберите его!
Как оптимизировать изображения: личный совет
В завершение вкратце перечислю все этапы оптимизации изображения для сайта:
- поиск релевантной тематике статьи картинки;
- прописывание соответствующего имени/названия;
- уменьшение размера и веса;
- прописывание тегов Alt и Title, написание подписи, если это необходимо;
- публикация на странице – выбор параметров отображения, отступа текста;
- проверка файла robots.txt.
Обо всем этом и многом другом я подробно рассказываю на своем онлайн-тренинге, как сделать сайт своими руками. Не стоит думать, что для участия в нем нужны начальные знания! Нет, принять участие в тренинге может каждый. Ведь сайт создается буквально с нуля. Для этого не нужны знания программирования или других направлений.
Тренинг построен на практических заданиях. Вам нужно только повторять за мной. Спустя 4 дня у вас будет свой работающий, красиво оформленный, яркий проект. С первыми опубликованными статьями, картинками и первыми посетителями и комментариями.
Если у вас что-то не будет получаться, служба поддержки тренинга оперативно отреагирует на вопросы. Поможет решить любую проблему. От вас – только желание и присутствие на обучении. Оно проводится по вечерам, в удобное время.
Чтобы принять участие в тренинге, перейдите по ссылке и оставьте свой адрес электронной почты. На него придет уведомление о старте обучения и ссылка на трансляцию.
Добавить комментарий