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

Alt-текстом называют краткое описание любого изображения. Термин произошел от словосочетания «альтернативный текст». Он не отображается на сайте и не виден посетителям, это вид мета-данных, скрытых от посторонних глаз. Но несмотря на то, что практически никто не читает alt-тексты, они очень важны по двум причинам:

Это полезный инструмент для SEO. Поисковые системы не умеют распознавать изображения и реагируют исключительно на слова. Добавляя к картинке alt-текст, вы делаете ее «заметной» для Яндекса или Google, и в результате ваш сайт начинает подниматься в результатах поиска.

Они делают сайт доступным. Люди с нарушениями зрения пользуются специальными программами для чтения, когда выходят в интернет. Эти программы, как и поисковики, не умеют распознавать картинки. Выручают alt-тексты. Они описывают изображение, и человеку, который плохо видит, все становится понятно.

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

Не будьте многословны . Добавляя alt-текст, постарайтесь уложиться максимум в 15 слов.

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

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

Не спамьте . Не добавляйте ключевые слова и мета-теги в поле для alt-текста даже если очень хочется. Вместо этого придумайте хорошее описание и аккуратно включите в него пару подходящих для продвижения слов.

Не уходите от сути . У вас не так много места, поэтому сделайте акцент на самом главном. Это могут быть люди, предметы, места, цвета, автор снимка или атмосфера. В общем, не разбрасывайтесь и отмечайте то, на что нужно обратить внимание.

В добавить alt-текст очень просто. Вот инструкция.

Для Wix-сайта:

Щелкните мышкой по изображению.

Нажмите на иконку «Настройки».

Добавьте alt-текст в поле «Тексты фото» - «Опишите картинку поисковикам».

Для блога на Wix:

Откройте новый или уже написанный пост в редакторе блога.

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

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

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

Какая не внимательность? Например, название картинки должно состоять из ключевого запроса, под который заточена статья. Яндекс, Гугл обращают на это свое внимание, а люди в блогосфере даже не задумываются.

Приступим!

Что такое alt и title для изображений?

Атрибут «alt»!

Его предназначение для отображения фрагмента текста картинки. Чаще всего, это описание изображения.Вашим пользователям он не заметен. Подобные теги очень важны для поискового продвижения. Для людей они практически ничего не значат.

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

Таким образом поисковая проверка будет захватывать всю вашу статью и там не будет каких-то недочетов и мелких погрешностей. Исходя из этого странница будет находиться близ ТОПА-10 или вовсе будет туда вылетать.

ТОП — это высокая посещаемость. А, как её нарастить я писал в статье про

Атрибут title!

«title» — это заголовок. Наверное, каждый об этом знает. В картинке — это название, которое доступно каждому, допустим, когда мы наводим курсор мыши на изображение появляется короткий текст, который и является title. С этим все ясно. Указать название можно у себя на ПК или ноутбуке, а потом вы закидываете картинку в сам пост и опять же прописываете заголовок и описание (alt).

Что касается того, что-куда писать, то с этим не волнуйтесь.

В Титле укажите какой-нибудь ключевой запрос. Написали пост про карту сайта для людей, тогда в титле и заполняете поле, тем же словосочетанием, карта сайта для людей. Описание или alt никому не видно, кроме робота, следовательно, можно что-то вроде этого:

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

Вот еще на счет «title». Они не должны быть длиннее 5 слов. А также желательно, чтобы вы их прописывали на латинском языке, то есть английском. И самое важное формат изображения должен быть jpg. Это снижает вес, а значит и загрузка будет быстрее, что оказывает немалое влияние на трафик сайта.

Снизить массу картинки можно в фотошопе. Открываем его. Кликаем файл и далее Сохранить для WEB. Там, где написана цифра 50, 60 или какая-нибудь другая вы её можете регулировать, чем меньше, тем вес ниже. Если у вас еще нет фотошопа, тогда вперед овладевайте им. Ведь это неотъемлемый элемент любого вебмастера.

Если кто-то сомневается в том, что оптимизация картинок оказывает большое влияние на продвижение блога, то могу сказать одно — не сомневайтесь. Попробуйте проверить, проведите эксперимент. Главное не закрывать на это глаза, ведь лишние 5 минут потратить не жалко. Тем более если вы перед этим написали статью и вложили туда частичку себя. Думаю, не будет лишним, как можно лучше оформить её, а вы как думаете?

Почему важно прописывать теги title и alt? Как они добавляются к изображениям?

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

Вот и они:

• Первым делом, конечно, надо написать статью и найти уникальную картинку. Как правило, все делают стандартный шаблон, свой, и туда уже вставляют изображение, скрины, например, или рисуют что-то, либо вовсе заказывают у художника.
• Посмотрели на ключевые фразы, которые вы использовали для поста и один прописали в title;
• Второй ключ прописали в alt, в описание и добавили еще несколько слов, одним словом разбавили запрос.
• Теперь сохраняем изменения и добавляем картинку в текст, потом просматриваем статью и наводим курсор на изображение, смотрим: какой title отображается. Все готово.

Короче преимущества в следующем, это для тех, кто еще не убедился до конца.

1. Трафика больше;
2. Качество его выше, так как вы указали точные ключи, которым и посвящена статья, посетитель будет забивать их в поиск и найдет у вас нужную инфу, значит пробудет на вашем блоге дольше и число отказов будет меньше;

Эта инфа для тех, кто работает над свои сайтом не первый год, а результата нет. Возможно, проблема именно в этом!

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

С уважением, Жук Юрий.

Прописываем alt и title

При SEO продвижении статьи в блоге, или товара в интернет-магазине, значительную роль играют изображения. Существуют пользователи, ищущие товар по картинке. И чтобы ваша продукция или блог были выше в поисковой выдаче, стоит уделить внимание тегам изображений. Речь идет об alt и title. От того, как мы прописываем alt и title, зависит успех в поисковой выдаче.

Что представляют из себя теги? Говоря обобщенно, когда мы , поисковик видит, что картинка в статье отражает ее заголовок, тему. Атрибут направлен на роботов и прямо влияет на ранжирование сайта. А когда мы прописываем title, при наведении курсора на фотографию, появляется всплывающая подсказка с текстом. Если alt направлен на ботов систем, то title улучшает юзабилити (удобство использование сайта). Если мы продуманно прописываем title, мы лучше раскрываем тему, о которой говорится в статье.

Прописываем alt тег

Главная особенность данного атрибута - значительное влияние на поисковые системы и помощь в выведении статьи в топ Яндекса или Google . Считывая тег, поисковая машина понимает, что изображено на картинке. Если прописать alt грамотно, в соответствии с тематикой статьи, ее релевантность значительно вырастет. Приятный бонус – на сайт придут пользователи из раздела Поиск по картинкам. Оттого применение тега alt особенно выгодно интернет-магазинам.

Чем еще полезен тег? Дело в том, что не у всех пользователей браузер загружает картинки. По разным причинам: из-за экономии трафика, из-за низкой скорости соединения, либо если сам пользователь отключил отображение картинок. В таком случае вместо фотографии показывается текстовое описание, заданное тегом. Прописывать alt полезно для посетителей, сидящих с мобильных устройств, старающихся экономить трафик. Ваш сайт будет загружаться в разы быстрее. А ведь именно скорость загрузки ресурса весомо влияет на поведенческие факторы и число постоянных посетителей.

Рассмотрим пример продуманной SEO оптимизации. Мы выбрали сайт о цветах. На скриншоте ниже виден хорошо заполненный атрибут title, речь о котором пойдет в отдельном абзаце.

При наведении курсора на изображение, появляется всплывающий текст: какие цветы дарить. Проверим, как прописан alt. Нажимаем сочетание клавиш Ctrl+U. Открывается код сайта. Теперь жмем Ctrl+F для поиска по странице. При наборе фразы какие цветы купить, видим правильно заполненный тег alt.

Т.е. администратор сайта позаботился о заполнении обоих тегов, тем самым улучшив как позицию в поисковой выдаче, так и поведенческие факторы. А как обстоят дела с ранжированием? Заходим в поиск по картинкам в Google. Вводим запрос какие цветы дарить, и первое же изображение – с обозреваемого нами сайта.

Как видите, оптимизация по тегам прекрасно работает. Достаточно со знанием дела прописать alt . Как это сделать?

• Краткость – сестра таланта. И хорошего SEO продвижения. Приемлемое количество слов – 3-5. Лимит тега составляет 250 символов.
• Наличие поисковой фразы или слова. Если у title фраза во всплывающем тексте больше влияет на пользователя, то у alt – напрямую на поисковик. Но не стоит перебарщивать с ключевыми словами, иначе робот определит это как спам.
• Как и в случае с title, прописывать alt нужно в соответствии с изображением на странице.

Как прописать title тег

Атрибут title не влияет на продвижение напрямую. Поисковые боты не учитывают его при ранжировании статьи или товара в поисковой выдаче. По сути, мы прописываем title по желанию. Но его роль на посетителей сайта высока, ибо улучшает удобство использования сайта. Когда вы наводите курсор на изображение в статье, появляется подсказка, раскрывающая суть изображения – собственно так и работает тег title.

Как правильно прописать title?

Это пример хорошей оптимизации, поскольку на сайте хорошо расставлен и тег alt, о котором мы рассказывали выше. Если вы грамотно пропишите title, это улучшит статью в плане поведенческих факторов и станет приятным дополнением к полезности статьи.

Подведем итоги. Тег alt предназначен для прямого влияния на позицию в поиске, он обращен к роботам. Тег title используется по желанию, но является хорошим бонусом к качеству статьи. Он создается для посетителей.

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

Здравствуйте, уважаемые друзья. Сегодня, по просьбе одного из моих подписчиков, расскажу про тег (атрибут) ALT, который должен присутствовать в параметрах каждого изображения на сайте.

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

И если, размещая изображения в статье, вы можете сразу указать желаемый альтернативный текст, то вот с изображениями (элементами) дизайна будет сложней. Бывает так, что именно у этих элементов дизайна отсутствует тег alt. И многие новички даже не знают о наличии этих ошибок у них на сайтах.

Зачем нужен атрибут alt

Всё дело в механизме загрузки страницы сайта браузером. Когда загружается страница, вначале загружается текст из атрибута alt, а уже после идёт смена текста на изображение. Если в браузере отключена загрузка изображений, то на месте изображения будет альтернативный текст (из атрибута alt).

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

Alt="значение"

Как проверить изображения на наличие атрибута alt

Самый простой и доступный каждому способ – это проверить исходный код страницы (валидация кода) на ошибки.

Для этого нужно открыть сервис проверки кода W3C и ввести url страницы.

После проверки исходного кода, указанной странице, на экране откроется отчёт о наличии и сведения об ошибках (если такие есть). И если на странице, хотя бы у одного изображения отсутствует тег alt, вы увидите вот такую ошибку:

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

А вот ещё один способ, который позволит узнать об ошибках в исходном коде вашего сайта. Но, для использования этого инструмента нужно зарегистрироваться в кабинете веб-мастера Bing. И в этом самом кабинете есть инструмент «Средства анализа SEO» .

Где вы также вводите адрес страницы сайта для анализа и получаете отчёт. И если где-то отсутствует тег alt , вы это увидите.

Можно также посмотреть исходный код страницы, увидеть, где именно нужно искать. Для этого нужно перейти в закладку «Код страницы» и найти, где допущена ошибка. Сделать это легко, нужный код будет выделен жёлтым цветом.

Как найти нужный фрагмент исходного кода и добавить атрибут alt

Прежде всего, нужно внимательно посмотреть на данные, которые вы получили из средств анализа. Обратить внимание:

— на имя файла изображения,

— на название класса, блока в котором размещено изображение,

— на соседние элементы.

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

В качестве примера, посмотрите на размещённый выше скриншот. Код, который нам нужен, ничем не примечателен. Да, мы знаем, что это баннер на новую бесплатную книгу Азамата . Более того, мы знаем, что баннер расположен в сайтбаре. Но представим, что я не обратил на это внимание. Так что можно узнать из этого кода?

Прежде всего, мы знаем имя файла изображения. И неважно, что расположено изображение на другом сайте. Также мы видим, блок ДИВ с классом

. И то, что этот блок находится внутри списка, элемент которого имеет идентификатор id=»text-10″ .

И уже по классу «textwidget» становится понятно, что нужный нам код расположен в Виджетах. А раз так, то искать все эти элементы, на которые мы обратили внимание – бесполезно. Так как в большинстве тем WordPress виджеты в сайтбаре формируются динамически. А значит, в коде файла, отвечающего за cайтбар (sidebar.php ) будет преимущественно php код. Который никак не укажет на конкретный виджет.

Следовательно, идём в административную панель WordPress – «Внешний вид» — «Виджеты» и ищем нужный виджет.

И вот здесь к параметрам изображения добавляем атрибут alt.

До После alt="Инфомаркетинг 20/80" />

Вот и всё готово.

Но, с виджетом всё понятно, тут любой справится. А как быть с конкретными элементами дизайна?

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

Открываем вкладку «Код страницы» и анализируем код. Ищем элементы, за которые можно зацепиться, по которым можно найти нужный файл и код.

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

Далее, лучше сделать резервную копию файл (скопируйте отдельно на компьютер) и можно приступать к редактированию. В Total Commander достаточно выбрать файл и нажать клавишу F4. Или можно скопировать файл на компьютер и открыть его через Notepad++. Ну, или на крайней случай, через Блокнот.

Итак, открываем файл и ищем нужный код. Можно использовать поиск CTRL+F.

Нашли, и вставляем нужный атрибут alt. Итак, со всеми изображениями, у которых он отсутствует.

После того как изменения внесены, сохраняете файл и снова проверяете инструментами анализа.

Вот так друзья и добавляются атрибуты alt к изображениям. В качестве наглядного примера посмотрите видеоурок. И помните, что все эти доработки шаблона лучше делать на

И конечно, почитайте статью про в целом. Узнаете, что изображения многих шаблонов не только не имеют тегов alt, но вовсе не оптимизированы.

А у меня на этом сегодня всё. Жду ваших комментариев. Всех успехов и хорошего настроения! До встречи в новых видео и статьях.

Тема сегодняшней статьи – SEO - оптимизация изображения с помощью атрибута ALT. Многие не знают, что при оптимизации данного атрибута вы повышаете вероятность посещения вашего сайта. Итак, более подробнее расскажу далее в статье:

Что такое атрибут ALT?

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

Как правильно прописывать описание картинки

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

Пустые атрибуты ALT и TITLE . Как правило, многие SEO оптимизаторы не заморачиваются по поводу этого тега. Да, возможно, если ваш сайт очень крупный имеет посещаемость 100000 в сутки заморачиваться не стоит, но если вы только раскручиваетесь и вам нужен первый трафик, то указать атрибуты все же стоит.

Не соответствие изображения и атрибутов. Допустим если на вашей картинке отображена BMW X5, а в атрибуте прописываете Audi A3, то не ждите что человек перейдет по вашей картинке на сайт.

Переоптимизация . Часто встречающаяся проблема, можно ставить прям в пример как не нужно делать. Оптимизаторы надеясь получить заветный трафик прописывают по несколько ключевых слов в атрибут “alt” и ждут, когда позиции в выдаче среди картинок начнут расти. Вы должны понимать, что данный текст будут читать люди, которые оценивают несколько картинок и если там сплошь спам никто не перейдет по ссылке. Добавлять коммерческие слова “купить, заказать, цена, стоимость, наименование города” не рекомендуется.

Так же поисковые системы могут наложить на вас санкции, поэтому не увлекайтесь.

А как же нужно прописывать теги для картинок?

Краткое и понятное описание картинки. Как можно точнее опишите изображение и если ALT был создан автоматически перепроверьте все страницы.

Длина атрибута ограничена. Поисковые системы учитывают 3-4 слова (около 250 символов) что затрудняет описание картинки.

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

Например:

alt=”Ремонт компьютеров в Чебоксарах”

Уникальные атрибуты для каждой картинки. Так же важная составляющая, самая встречающаяся проблема у SEO-оптимизаторов. На примере я вам покажу как ее решить.

Карточка товара содержит много картинок

Как же разделять картинки одного и того же товара, если спамить нельзя и нужно прописывать все уникальное? Допустим “Сплит-система HYUNDAI H-AR6-07H” можно расписать так:

“Сплит-система HYUNDAI H-AR6-07H Вид 1”

“Сплит-система HYUNDAI H-AR6-07H Вид 2”

Помимо картинок товара, есть у вас на сайте имеются элементы: похожие товары, с этим товаром чаще смотрят и так далее. Данный вид картинок не стоит сбрасывать со счетов и SEO оптимизировать их прописав ALT и Title. Причем стоит уделить время прописать конкретно: бренд, модель, номер товара, все важные параметры, которые люди могут вбивать в поиск.

Размер изображения – чем больше разрешение картинки, тем лучше. В любом случае ее отображение можно подкорректировать благодаря атрибутам “width” и “height”. Но не стоит делать картинку слишком маленькой, в противном случае поисковые системы не будут учитывать изображение меньше 150 пикселей и будут считать ее за иконку.

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

Текст заголовка с ключевым словом

Дальнейшее описание

Уменьшение веса изображения. Размер картинки играет ключевую роль, ведь если она будет весить очень много, что даже будет тормозить скорость загрузки сайта это скажется на ранжировании всего сайта. Да-да бывало и такое!

Подпись под картинкой

Если на вашем сайте очень много картинок и почти нет текста, подпись картинкой будет полезна, поэтому именно с точки зрения SEO необходимо ее оптимизировать:

• Указать ключевые слова. Вхождение ключевиков в подпись обязательно, так как данный текст сыграет роль в ранжировании всей страницы;
• Указать какой-либо факт/преимущество о картинке.

Например, у вас картинка динамиков Iphone 7.

В подписе укажите данный факт: “Звучание звука в Iphone 7 стало заметно лучше благодаря Lighting” Отношение Яндекса к атрибуту ALT

“Как поместить мою картинку на первое место?"

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

Текст под картинкой несет гораздо большую пользу для поисковика, чем собственно сам ALT.

Ранжирование картинок в Google

Помимо вышеупомянутого ALT, вот что учитывает Google в ранжировании изображений.

Давайте пробежимся по главным факторам для Google.

Фотографии хорошего качества – это должно быть понятно, итак. Никому не будут интересны размытые фотографии или просто плохого качества. Здесь скорее качество картинки играет на ее кликабельность, некий CTR.

Отдельные страницы для каждой картинки – интересная мысль, но честно редко встречаю такие сайты. Проблематичным становится оптимизировать: интернет-магазины, одностраничные сайты, сайты каталоги, где хранится большое количество изображений.

А что по поводу атрибута Title

Google не упомянул, а Яндекс по минимуму атрибут Title. (Не путать с тегом ). Указать лишним точно не будет, только можно по тому что Title при наведении на картинку отображается и несет в себе смысл. В этом плане, как и с текстом под картинкой можно экспериментировать, указывать полезную информацию: различные факты, преимущества и так далее.

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

Вот и все. Задавайте вопросы в комментариях, кто что думает по поводу атрибутов ALT, TITLE. Как вы оформляете изображения?