Оформление: оптимизация графики для сайта

Оптимизация изображений в SEO

Поисковая оптимизация изображений в SEO-практике совсем не так давно стала входить в моду. Как оптимизировать графические изображения и продвигать картинки в поисковиках в ранжировании по рисункам? Графическая оптимизация картинок, поисковое продвижение по картинкам и раскрутка изображений в поисковых системах лишь с виду кажется сложными и малопонятными задачами для SEO-оптимизатора. В результате многочисленных экспериментов, изучения опыта коллег-СЕОшников был выработан алгоритм уверенного показа рисунков на хороших позициях в поиске по картинкам. Этот метод поисковой оптимизации графики и продвижения по картинкам лучше работает в Google, но вполне пригодна и для Яндекса. Методика оптимизации картинок полностью согласуется с руководствами для веб-мастеров от этих поисковиков и не содержит моментов, которые могут повлечь пессимизацию страницы в поисковых системах. Следует отметить такой малоизвестный факт в пользу web-графики: страницы с грамотно прописанными графическими изображениями ранжируются в текстовом поиске несколько выше тех, на которых картинки не установлены. Логика поисковиков понятна: иллюстрированный текст более привлекателен для пользователя, чем контент без картинок.

Как делается оптимизация картинок для продвижения по графике?

Может, для кого-то это станет открытием, но поисковое продвижение по изображениям чрезвычайно тесно связано с текстовым контентом на странице, где размещена графика. Как раскрутить картинку в поиске по изображениям? По сути задача оптимизатора сводится к тому, чтобы грамотно расположить графическое изображение на странице и правильно его оформить (прописать атрибуты тега IMG) - а остальное продвижение сделает текстовое окружение рисунка. Поэтому логично разделить подготовку страницы с картинкой на две составляющие: поисковую оптимизацию изображения и размещение его на веб-странице наилучшим для раскрутки образом.

1. Поисковая оптимизация картинок и изображений

1.1. Желательно, чтобы изображение было оригинальным, поскольку поисковики (например, Яндекс) учатся находить дубликаты рисунков в веб-сети. Если используется заимствованная картинка, лучшим вариантом будет осуществить ее поворот на 1...2 градуса, и если это возможно - зеркальное отображение. Откуда брать такие картинки или фото? Фотографии можно сделать и самому - как, например, это делает фотограф в Василькове с сайта http://vasilkov.com.ua/lana_foto/, а вот с рисунками сложнее. Хороший вариант - перевести их из вектороной графики в растровое изображение.

1.2. Размер рисунка имеет значение! Чем больше места занимает графика на странице - тем выше она будет ранжироваться в поиске по картинкам, поскольку большие графические изображения для пользователей являются более значимыми и заметными. Однако нельзя забывать и об обратной стороне медали: текст ниже крупной картинки будет иметь меньший вес, поскольку расположен на экране уже не так высоко, как раньше (см. также п.2.1 и п.2.2).

1.3. Вес картинки должен быть минимально-возможным при приемлемом качестве. Помните, что формат JPG трактуется как фотография, и потому имеет больше шансов на высокие позиции в поисковом ранжировании изображений. Форматы GIF и PNG поисковики трактуют как вспомогательную графику (элементы дизайна, кнопки, логотипы).

1.4. Очень желательно на картинку нанести имя домена (адрес сайта). Для продвижения по изображениям это никак не поможет - поисковые системы не знают, что изображено на рисунке, - но вот от копирования и показа на других сайтах с Вашего частично защитит, да и в плане имиджевой рекламы сыграет не последнюю роль.

1.5. Теперь о самом главном: в атрибут ALT включите осмысленную поисковую фразу из заголовка страницы TITLE, и, если возможно, какое-нибудь из слов-маркеров для изображений и фотографий. В атрибут TITLE тега IMG включите примерно то же самое, но обязательно в измененном виде. Как это делается - видно из примера, который разберем ниже.

1.6. Допустимая длина текста в ALT и TITLE графики напрямую зависит от размера изображения: слишком короткий текст - недобор, слишком длинный - перебор. Можно посоветовать такой способ: при соотношении сторон 4 к 3 содержимое атрибута ALT, выполненное примерно таким шрифтом, как в примере, должно укладываться (или быть чуть меньшим) по ширине изображения. К тому же так подпись к рисунку смотрится гармонично и красиво.

1.7. Имя графического файла всегда делайте осмысленным, близким по звучанию к тому тексту, который прописали в поле ALT. Как вариант, очень неплохо смотрится точное совпадение названия файла с URL страницы. Это даст дополнительный небольшой бонус Вашему рисунку со стороны поисковика. Надеюсь, все понимают, что URL страниц должны иметь чисто статический вид и быть также "говорящими"?

1.8. В обязательном порядке указывайте в явном виде поля WIDTH, HEIGHT и BORDER. Зачем это нужно, а также разъяснения относительно всех элементов HTML-тега IMG, Вы найдете на странице "Назначение ALT и TITLE картинки" в этом разделе сайта про поисковую оптимизацию графики и продвижению по картинкам.

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

2. Расположение рисунка или фотографии на странице

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

2.2. Если же графика нужна лишь как иллюстрация, чтобы лучше подвигалась текстовая составляющая - надеюсь, никто не сомневается, что иллюстрированный текст ценится поисковиками выше? - то крупные изображения ставьте в нижней части страницы, чтобы не страдал основной индексируемый текст, а мелкие - в средней, лучше с обтеканием текстом.

2.3. Помните, что короля играет свита, а тематичность изображению придает окружающий его текст. Вы же делает не что иное, как иллюстрацию? Поэтому логично окружить фото или рисунок высоко-релевантным контекстом. В частности, заголовок H2 или H3 того абзаца, где расположена картинка, лучше делать близким по набору слов с атрибутом ALT изображения.

2.4. Особое значение имеет текстовая подпись к картинке. Дело в том, что поисковые системы расценивают текст сразу под картинкой как наиболее значимый по отношению к ней элемент текстового окружения. Так пользуйтесь этим! Лучший вариант - это добуквенно продублировать содержимое ALT в подпись. Обязательно, чтобы подпись находилась в той же ячейке таблицы TD, абзаце P или теге DIV, что и рисунок или фотография.

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

3. Пример SEO-оптимизации иллюстрированной страницы

3.1. Заметьте, что после п.2.5 мы уже не разделяем графику и текст, а говорим об "иллюстрированной странице". Приведем пример, как это делается (помните, что говорилось о расположении рисунков в п.2.2? Это тоже пример), а также некоторые замечания, чтобы остудить пыл слишком оптимистично настроенных SEO-оптимизаторов.

Поисковая оптимизация изображений и фото: IMG и пример текста с картинками

3.2. Вот полный HTML-код тега IMG приведенного изображения:
<img src="http://com-seo.ru/raskrutka/kartinka-seo-image-raskrutka-risunok-foto-img.jpg" title="SEO-оптимизация и раскрутка изображений и фото, иллюстрированный текст и IMG" alt="Поисковая оптимизация изображений и фото: IMG и пример текста с картинками" width="640" height="480" border="0" />.
Подпись отделена от графики тегом BR и находится с рисунком в одном контейнере DIV. Таким образом удается гармонично и эстетично вписать картинку на веб-страницу, не попортив дизайна. Обратите внимание, что рисунок на сервере лежит не абы где, а в папке с названием из очень важного для сайта слова, которое поисковики понимают на транслите.

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

3.4. Поисковое ранжирование по фотографиям и картинкам происходит гораздо медленнее, чем по тексту, и может пройти до двух месяцев прежде, чем картинка займет достойное положение в поиске по рисункам. В связи с этим актуально сразу делать оптимальные SEO-маневры и размещение графики на страницах сайта.

3.5. Существует мнение, что поисковые системы с предпочтением относятся к периодической смене иллюстраций. Я не могу привести доказательств или опровержений этому; сам это мнение не разделяю, но для объективности о существовании его сказать обязан.

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