1. Способ получить себя забаненным
2. Правильное использование замены изображений CSS

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

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

Таким образом, использование CSS для оптимизации вашей страницы незаконно в глазах Google? Считаете ли вы, что вы пытаетесь запутать поисковые системы для целей SEO, а значит, забанить себя в поисковой выдаче? Ответ на этот вопрос заключается в том, как вы это делаете, и вопрос, который вы себе задаете, состоит в том, пытаетесь ли вы быть хитрым?

Способ получить себя забаненным

В Google Webmasters, помогите под скрытый текст и ссылки , довольно ясно, каковы критерии, чтобы забанить себя. Хотя этого нет в списке, я бы не использовал text-indent: -9999px, чтобы скрыть текст, а вместо этого использовал display: none.

Я бы сказал, что причина этого в том, что свойство text-indent в соответствии с w3c должен использоваться для форматирования текста, а не для визуального форматирования. Тем не менее отображать свойство вместо этого используется для визуального форматирования, что соответствует цели использования его для «замены» текста изображениями, поскольку это визуальный аспект.

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

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

Правильное использование замены изображений CSS

Давайте посмотрим на домашнюю страницу Allianz, основной страховой провайдер и как они правильно использовали CSS замену.

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

Когда вы отключите CSS, посмотрите на версию, отличную от CSS, и увидите ниже (выделено красным), что эти навигационные меню на самом деле являются якорными текстами. С текстовой точки зрения это, по сути, то, что видят поисковые системы при сканировании сайта.

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

Теперь давайте посмотрим на пример, который в настоящее время не использует замену CSS, но имеет потенциал для этого. Когда вы смотрите на Домашняя страница Fallout Вы заметите, что навигационные меню и ссылки состоят из изображений, а текста вообще нет. Даже атрибуты alt изображения не оптимизированы, что означает, что поисковые системы не могут определить, что представляют собой изображения, а внутренние ссылки вообще не оптимизированы!

Если посмотреть более конкретно на заголовочные разделы документа (выделены красным полем), вы можете увидеть, что здесь есть возможность использовать CSS-замену для оптимизации с помощью тегов заголовка (т. Е. H1, h2, h3). По сути, они могли бы создать контейнер div в качестве родителя тегов заголовка, использовать CSS для отображения фонового изображения контейнера и использовать display: none в тегах заголовка. Конечный результат с CSS, он все еще выглядит так же, но без CSS, разделы заголовка оптимизированы для поисковых систем.

Глядя на текущие заголовки разделов без CSS, вы можете видеть, что это все еще изображения, не распознаваемые поисковыми системами.

Однако, когда вы оптимизируете его с помощью замены изображения CSS, вы увидите, что разделы заголовка находятся в тексте и оптимизированы. Это тогда читается поисковыми системами и сообщает им, что эти разделы важны, поскольку они являются заголовками.

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