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

Многие поговаривают о том, что 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. Качество его выше, так как вы указали точные ключи, которым и посвящена статья, посетитель будет забивать их в поиск и найдет у вас нужную инфу, значит пробудет на вашем блоге дольше и число отказов будет меньше;

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

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

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

Тема сегодняшней статьи – 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. Как вы оформляете изображения?

>> Оптимизация картинок | Атрибуты ALT и TITLE для описания изображений

Как правильно оптимизировать картинки для сайта.

Приветствую Вас, уважаемый читатель моего сайта!

В данной статье, я хочу Вам рассказать о том, для чего используются картинки на сайтах, какую роль они играют для SEO-оптимизации. Рассмотрим важность использования атрибутов html кода alt и title, приведу примеры использования оптимизированных и не оптимизированных изображений, узнаете в каком качестве нужно использовать картинки, и как это сказывается на работе сайта.

Плюсы и минусы использования картинок на сайте:

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

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

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

И если Вы хотите чтобы Ваши картинки были незабываемые и красивые нужно использовать их по возможности в хорошем качестве.

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

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

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

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

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

Атрибуты alt и title в SEO-оптимизации изображений:

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

Атрибут ALT : Данный атрибут входит в язык html. Назначение его заключается в описании какого-то объекта с целью дать дополнительную информацию о данном объекте (в нашем случае изображений). Как данный атрибут работает? Работает он очень просто: Вы берете нужную картинку, которая находится у Вас на жестком диске или носителе (флэшка) и вставляете на нужную страницу сайта в нужное место.

Потом Вы берете, находите код данной картинки и прописываете туда такое значение alt=" Описание данной картинки с использованием ключевых слов " . Но описание не нужно делать слишком большим (максимально пару предложений) и тулить туда много ключевых слов, так как поисковые системы этого не любят, что в итоге может сказаться на Вашем сайте.

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

Атрибут TITLE: Данный атрибут title также входит в язык html. Назначение его такое же, как и атрибут alt, но с той разницей, что данное описание будет показываться пользователю сайта при наведении на картинку курсором. Данный атрибут не участвует в продвижении сайта, но он позволяет увеличивать поведенческий фактор, который также влияет на позицию сайта в поисковой системе. Пишется оно так title=" Описание картинки " . Поэтому оптимизация изображений играет тоже большую роль при продвижении сайта в поисковых системах.

Образец SEO-оптимизированной картинки с использованием атрибутов alt и title:

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

C атрибутом title (наведите на картинку курсором)

title="Кот гимнаст" >

С атрибутом alt (без картинки)

Обрацец кода данной картинки:

Без атрибута alt (без картинки)

Образец кода данной картинки:

В каком качестве нужно использовать картинки и изображения на сайте.

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

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

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

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

Кстати если Вы не знаете, как уменьшить качество картинки то воспользуйтесь программой Фотошоп. Для этого заходите в меню "Файл" и там выбираете пункт "Сохранить для Web и устройств".

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

Другие страницы сайта:

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

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

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

Для начала возьмем любую картинку и в качестве примера разберем, что прописывать в тег alt, а что явно не стоит.

  1. «Фото №1» , или что-либо в этом духе. Так точно не стоит прописывать атрибут alt! Описывает картинку чисто технически и абсолютно не раскрывает ее содержание.
  2. «Маленький мальчик в шапочке» - такое описание с одной стороны хорошо описывает изображение, но с другой стороны не захватывает ни одного значимого запроса, что совершенно не подходит для коммерческих проектов. Да и инфо-сайтам я бы такого тоже не посоветовал. Скорее всего аудитория будет искать шапочку которую рекламирует маленький мальчик и запрос будет задан другим образом. При этом, милых мальчиков и девочек на фотосеты приглашают с целью повысить конверсию.
  3. «Шапка вязаная», «шапка детская» - такие запросы близки к теме. Пользователи действительно задают вопросы таким образом и Вы точно сможете привлечь целевую аудиторию и направить ее внимание на свой продукт. Однако, шапочек много. Даже на вашем сайте может быть раздел посвященный только детским шапочкам, поэтому лучше запрос несколько конкретизировать в угоду пользователям, которые точно знают чего хотят.
  4. «Вязаная шапочка компании Bizonoff» - данный вариант представляется оптимальным, так как точно отражает как изображенное на фотографии, так и в максимальной степени удовлетворяет запросам пользователей. Такой alt отражает название компании, слово «шапочка» отражает габаритные размеры изделия (по крайней мере намекает, что эти размеру не большие), а также каким образом выполнено приведенное изделие. Если на вашем интернет-магазине, landing page или просто информационном сайте существуют типовой продукт отличающийся цветом Вы можете отразить это в атрибуте alt – «вязаная шапочка компании Bizonoff коричневого цвета» .
  5. «Вязаная шапочка, детская шапка, детские шапочки отзывы, шапочка для ребенка» - Вы занимаетесь «душевным онанизмом» чем-то необъяснимым. Толку от такого длинномера не будет и в народе это называется переоптимизация. За такие вещи можно в худшем случае нарваться на санкции поисковиков. В лучшем санкций не будет, но и выхлопа от таких действий тоже.

Как прописывать атрибут alt

  1. Длина текста в атрибуте alt должна составлять до 230-250 символов. При этом минимальная длина 3-4 слова. Это объясняется чисто практическими наблюдениями – очень тяжело написать alt, отражающий всю суть изображенного объемом менее 3х слов.
  2. Текст должен содержать ключевые запросы по которым пользователи смогут отыскать картинку. Важно понимать, что ключи в атрибуте alt и ключи страницы это разные вещи.
  3. Отсутствие спама. Очень важно! Не добавляйте слова «цена», «стоимость», «отзывы», «прайс» … Эти слова никак не характеризуют фото, если на изображении не представлен реальный скриншот ценников, прайсов и отзывов. Тогда конечно можно и нужно.
  4. На Вашем ресурсе всегда есть технические изображения - иконки, картинки, стрелочки, фоновые изображения и т.п. Для них советую в атрибут alt не писать ничего. Так вы покажете технический характер изображений. Некоторые люди умудряются туда вставлять ключевики страницы, но это не айс. Не связывайтесь с поисковыми роботами – они реально крутые ребята.

Несколько слов насчет атрибута title для изображений

Основываясь на собственных экспериментах в области продвижения можно с уверенностью сказать, что title учитывается только поисковым алгоритмом Яндекса и полностью игнорируется гуглом. Лично я использую title только для юзабилити. Если же говорить о том, что писать в title, то я вставляю в него тоже, что и в alt. Это объясняется тем, что написать что-то отличное от текста в альте просто очень и очень тяжело. Да и можно сказать незачем.

Здравствуйте, уважаемые друзья. Сегодня, по просьбе одного из моих подписчиков, расскажу про тег (атрибут) 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, но вовсе не оптимизированы.

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



Эта статья также доступна на следующих языках: Тайский

  • Next

    Огромное Вам СПАСИБО за очень полезную информацию в статье. Очень понятно все изложено. Чувствуется, что проделана большая работа по анализу работы магазина eBay

    • Спасибо вам и другим постоянным читателям моего блога. Без вас у меня не было бы достаточной мотивации, чтобы посвящать много времени ведению этого сайта. У меня мозги так устроены: люблю копнуть вглубь, систематизировать разрозненные данные, пробовать то, что раньше до меня никто не делал, либо не смотрел под таким углом зрения. Жаль, что только нашим соотечественникам из-за кризиса в России отнюдь не до шоппинга на eBay. Покупают на Алиэкспрессе из Китая, так как там в разы дешевле товары (часто в ущерб качеству). Но онлайн-аукционы eBay, Amazon, ETSY легко дадут китайцам фору по ассортименту брендовых вещей, винтажных вещей, ручной работы и разных этнических товаров.

      • Next

        В ваших статьях ценно именно ваше личное отношение и анализ темы. Вы этот блог не бросайте, я сюда часто заглядываю. Нас таких много должно быть. Мне на эл. почту пришло недавно предложение о том, что научат торговать на Амазоне и eBay. И я вспомнила про ваши подробные статьи об этих торг. площ. Перечитала все заново и сделала вывод, что курсы- это лохотрон. Сама на eBay еще ничего не покупала. Я не из России , а из Казахстана (г. Алматы). Но нам тоже лишних трат пока не надо. Желаю вам удачи и берегите себя в азиатских краях.

  • Еще приятно, что попытки eBay по руссификации интерфейса для пользователей из России и стран СНГ, начали приносить плоды. Ведь подавляющая часть граждан стран бывшего СССР не сильна познаниями иностранных языков. Английский язык знают не более 5% населения. Среди молодежи — побольше. Поэтому хотя бы интерфейс на русском языке — это большая помощь для онлайн-шоппинга на этой торговой площадке. Ебей не пошел по пути китайского собрата Алиэкспресс, где совершается машинный (очень корявый и непонятный, местами вызывающий смех) перевод описания товаров. Надеюсь, что на более продвинутом этапе развития искусственного интеллекта станет реальностью качественный машинный перевод с любого языка на любой за считанные доли секунды. Пока имеем вот что (профиль одного из продавцов на ебей с русским интерфейсом, но англоязычным описанием):
    https://uploads.disquscdn.com/images/7a52c9a89108b922159a4fad35de0ab0bee0c8804b9731f56d8a1dc659655d60.png