Приветствую вас, друзья. Как ни крути, а изображения для сайта играют очень важную роль не только для визуального восприятия, но и для успешной поисковой оптимизации.
В прошлой статье я писал о том, что такое скорость загрузки сайта, и как она влияет на поисковое продвижение. При проверке своего блога, заметил, что блог неслабо нагружают изображения, которые неплохо было бы оптимизировать, чем сейчас и занимаюсь, а в процессе работы появилась вот эта статья.
К оптимизации изображений можно отнести:
- Уникальность;
- Качество;
- Размер и формат изображений;
- Количество изображений;
- Директория изображений;
- Название и описание картинок;
- Использование водяного знака;
Уникальность изображений.
Уникальность изображений так же важна, как и уникальность текста. Конечно, поисковые ситемы не делятся своими алгоритмами проверки уникальности изображений, но даже поразмыслив немного логически, и проведя несколько анализов, можно сделать вывод, что у Яндекс и Google похожие алгоритмы проверки изображений, но есть и различия.
Я для себя сделал следующие выводы. При проверке и изображений на уникальность и их ранжирование, поисковые системы обращают внимание в первую очередь на:
Название картинки. То есть изображения нужно называть своими именами, а не набором символов. Вот, к примеру, я нашел правильно оптимизированное изображение, где название соответствует содержимому. В названии я вижу – «ford_mustang».
Title изображения. Здесь правила те же, что и при оптимизации текста. Title тоже должен соответствовать. В примере на картинке он следующий – «фото Ford Mustang Shelby GT500».
Alt изображения. Это правильное соответствующее действительности описание изображение. На примере оно такое – «Форд Мустанг Шелби GT500 фото».
Это изображение хороший пример того как правильно оптимизировать картинки, и результат налицо, картинка на первых местах в поиске по ВЧ запросу.
Правильный код изображения должен выглядеть так:
1 | <img class="класс картинки, если есть" title="титл картинки" src="ссылка на изображение" alt="описание изображения" width="ширина картинки" height="высота картинки" /> |
Качество изображений.
Изображения, используемые для сайтов, относятся к растровой графике (форматы png, jpeg, gif). Растровые изображения состоят из большого количества квадратов – пикселей. Качество изображений зависит от количество пикселей на 1 квадратный дюйм. Оптимальное разрешение – 72 ppi. Чем оно меньше, тем соответственно и хуже качество изображения.
При создании нового изображения в фотошопе, у вас появиться вот такая табличка, где и нужно указать разрешение.
Размер изображения.
Многие вебмастера и блоггеры допускают распространенную ошибку. Загружают изображения на хостинг одного размера, а на странице отображения указывают другое. Это не просто лишняя нагрузка на хостинг из-за веса картинки, но и более длительная обработка изображения браузером.
Всегда загружайте изображение, уже подогнанное под размер. При изменении размера, меняйте и формат. Это значительно снизит вес картинок. В скором будущем я напишу как изменить вес изображения без потери качества.
Оптимизация формата изображения.
Если поисковые системы умеют определять формат изображения, таких как png, jpeg, gif, то я думаю с уверенностью можно сказать, что при поисковом ранжировании картинок, они учитывают и формат изображений.
Каждый формат обычно предназначен для определенных целей.
PNG – чаще используется для элементов дизайна сайта.
JPEG – применяется для объемных фотографий, в статьях на сайте.
GIF – применяется для аннимации.
Влияние количества изображений на оптимизацию.
Каждое изображение при открытии его браузером, требует обработки, соответственно, чем больше изображений на странице, тем дольше она грузится, это касается и изображений в дизайне сайта.
В какой директории размещать изображения, и как это влияет на загрузку?
Размещать картинки можно в любой директории, но если вы хотите ускорить их загрузку, то размещайте в одной папке, например, images. Это уменьшит количество запросов браузера и увеличит скорость загрузки сайта.
Стоит ли использовать водяной знак?
Использовать водяной знак или нет, ваш выбор. Я его использую только для главных картинок, а в остальных не вижу смысла, так как у меня преимущественно скриншоты, которые вряд ли кто-то будет воровать.
Водяной знак придаст уникальности вашему изображению. Но если вы просто скопировали картинку из поиска Google и влепили свой водяной знак, то она от этого не станет уникальной.
Как проверить уникальность изображений?
Самым лучшим вариантом проверки уникальности изображения я считаю всемирно известный Google.
Просто переходим по ссылке – проверить уникальность картинки, загружаем изображение, и гугл выдаст результаты.
Есть еще несколько онлайн сервисов для проверки уникальности изображения, но они менее эффективны.
А вы оптимизируете изображения? Какие еще фишки используете?
P.S. В ближайшее время планирую начать монетизировать блог. Будут большие скидки моим подписчикам на баннерную рекламу – 70 %. Подписывайтесь на обновления блога и получите скидку!
Добрый вечер, Андрей! Подробненько все описали. Я еще использую TinEye.com для проверки изображения на уникальность. Вы не используете его?
Привет, Антон. Раньше пользовался, но сейчас нет. До Google ему далеко.
Я тоже использую tineye.com, очень нравится. Если честно про проверку уникальности картинок от Гугла раньше и не знал
Попробуй Google, он намного точнее. tineye.com не видит картинок на страницах которые закрыты в robots.txt, а google, сам знаешь, не всегда следует правилам robots.txt
Но что самое интересное даже tineye выдает что на фотобанках нет уникальных картинок какую не введи он находит кучи уже на других сайтах, а если в гугл проверить там наверное вообще ужас будет, для чего тогда деньги отдавать если у изображения миллион копий?
Вообще согласен с тобой. Бывает на не уникальную картинку выдает уникальность. Google рулит! А программой ETXT не пробовал проверять?
А там можно картинки проверять?
Я тоже впервые слышу об этом, нужно попробовать
Да есть там такая функция, только я ей никогда не пользовался. Судя по тому сколько она текст по времени проверяет, думаю с картинками такая же беда.
Спасибо за наводку, надо проверить.
Андрей, а у меня такая странная проблема. Я делаю картинку, она значит четкая, все хорошо. Как только я ее выкладываю на блог, почему то есть легкое размытие такое, и картинка не такая четкая, с чем это может быть связано, подскажи плиз, если знаешь.
Диана, а размер загружаемой картинки и на странице одинаковый?
Сначала я тоже думала, что это из-за размера. У меня сначала стояла настройка, чтобы автоматически менять картинку на средний размер. Думала из-за этого все. Убрала эту настройку, то есть поставила галочку, чтобы загружалась полная картинка и все равно такая же беда.( Мне не нравится это совсем, смотришь на картинку, как будто слегла туман в глазах, такое вот ощущение.
Нужно серьезно заняться оптимизацией картинок, я уже и забыл про них) Статья хорошая подробно описано.
Спасибо, Руслан.
При добавлении картинки на сайт как правильно поступить в параметрах изображения с ссылкой? оставить по умолчанию или убрать ссылку?
Смотря куда ведет ссылка. Если это ссылка на само изображение, которое открывается в этом же или в новом окне, то лучше убрать. Если же это ссылка-картинка на какую-то страницу или сайт, то она не навредит.
спасибо большое,я стараюсь убирать ссылки на картинки если они никуда не ведут,были сомнения правильно я делаю или нет но теперь все понятно.
Всегда, пожалуйста.
Интересно, буду знать что и картинки нужно оптимизировать...
Но вот в Title нужно писать что на картинке нарисовано? У меня вот в последней статье картинка где нарисован человечек с мешком, а название статьи «Эффективные способы увеличить словарный запас» Подскажи Андрей что бы ты в Title написал бы???
Не всегда в title, прописывается, то что изображено на картинке. Картинки ведь могут быть разные — скриншоты, карикатуры и т. д. Главное, чтобы была логическая связь картинки и текста, тогда можно и ключевые слова прописывать в alt.
В твоем случае, в alt прописано — slovarni_zapas. Это неверно, так прописывается название загружаемой картинки, а описание желательно писать кириллицей — словарный запас.
Оптимизированные картинки — это дополнение к релевантности текста, но не более. То есть если картинка заточена под поисковый запрос: alt, title, само изображение, то такая картинка делает текст релевантнее, чем если бы ее не было.
Далек я от полной оптимизации картинок. Раньше еще что то делал а теперь вот времени нет кидаю в посты все как попало. Поэтому работы с изображениями предстоит мне очень много
Андрей, у меня конкретный вопрос, чисто практически, ка себя верно вести. Например, я пишу статью о прогулке в лесу и выставляю фото дуба, березы, гриба. Мне что, в названии, title и alt изображений писать , что это «дуб, гриб» и так далее, причем на русском языке, а не ключевое слово "прогулка в лесу.
И спасибо за подсказку о проверке уникальности в гугле. буду пользоваться.
Здравствуйте, Зоя.
Фото дуба, березы имеет ведь отношение к прогулке в лесу, значит есть логическая связь, это главное. В Title, alt нужно прописывать ключевые слова. Но избегайте точного вхождения ключевиков, избыточное их количество ПС не любят. Пишите их разные вариации — прогулка в лесу, грибы в лесу, прогулка возле дуба и т. д.
Title и alt пишутся на русском за исключением иностранных слов. То есть нужно писать так, как эти слова будут искать в поисковых системах. Например, искать точно будут такие варианты: прогулка в лесу, форд мустанг, ford mustang. Но точно никто не будет искать такой вариант — progulka v lesu.
Я бы водяные знаки на скриншоты как-раз ставил. Это уникальная картинка, а при воровстве статей их тащат вместе с картинками, часто вырезая все внутренние ссылки. А вот по картинке как раз и видно источник.
Кстати, Андрей, у Вас есть уязвимость в блоге в плане СЕО, конкуренты могут этим воспользоваться.
Могу указать на неё и сказать как убрать. Только пишите мне на мыло: adobe-master[гав-гав]ukr.net
Спасибо, Владислав, попробую сам найти.
Прочитала статью, поставила себе новую конкретную цель — привести в порядок картинки на сайте. Частая ошибка, которую я допускаю: загружаю в большем размере, чем необходимо. а потом в админке выставляю размеры для публикации. Вот здесь и нужно навести порядок. С оптимизацией дела более-менее, но тоже нужно пересмотреть, особенно старые картинки. Спасибо, Андрей, за эти советы.
Пожалуйста, Елена.
Спасибо что посоветовали еще один способ проверки уникальности картинок, я до этого пользовалась другим, теперь попробую с этим поработать.
Всегда пожалуйста!