Что хуже: скрытие текста или удаление текста?

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

Используя логотип этого сайта, Сценарий 1:

<div id="hlogo">
    <a href="/">Stack Overflow</a>
</div>

#hlogo a {
    width:250px;
    height:61px;
    display:block;
    background-position:0 0;
    text-indent:-999999em;
    float:left;}

Или лучше избегать сокрытия текста и просто использовать атрибут rel в теге привязки?

<div id="hlogo">
    <a href="/" rel="Stack Overflow"></a>
</div>

#hlogo a {
    width:250px;
    height:61px;
    display:block;
    background-position:0 0;
    float:left;}

Мне интересно, будет ли удаление реального текста "Переполнение стека" большим ударом по SEO, чем сокрытие текста. Кажется, что все используют метод text-indent, хотя Google говорит, что нет-нет. Какой лучший способ добиться этого для семантической разметки и SEO?

6 ответов

Я просто выхожу на конечность, но если она "скрыта", она, по крайней мере, существует для поиска. Если вы удалите его, его просто нет. Отметим, что вам не нужно использовать этот метод противного отступа. Вы можете установить пункт на display: none;

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

Эмпирическое правило: если вы беспокоитесь о SEO, а Google говорит, что что-то нет, вам, вероятно, не следует этого делать.

Я думаю, что ваш второй вариант будет хорошо работать для целей SEO.

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

http://www.seomoz.org/article/search-ranking-factors

10) Скрытие текста с помощью CSS путем смещения пиксельного дисплея за пределами видимой области страницы - низкая важность

Также, если вы хотите использовать второй пример, я бы предложил атрибут title вместо атрибута rel. Атрибут rel ожидает тип ссылки, а не случайные данные.

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

Я бы предпочел использовать ОБА текста и атрибут заголовка (а не rel). Вы можете скрыть текст от просмотра, используя один из многих доступных методов замены изображения. см. http://css-discuss.incutio.com/wiki/Image_Replacement.

Если вам просто нужно спрятать какой-то текст, лично я нахожу этот трюк очень удобным:

.some-element { 
    display: block;
    overflow: hidden;
    height: 0;
}

Я бы использовал ваше первое решение каждый раз. Это лучше для доступности и бесконечно более семантически. Они находятся на относительно равных условиях с точки зрения SEO (при использовании предложения @simplemotives об использовании атрибута title вместо rel).

И, конечно, нет ничего "хакерского" в использовании text-indent. Это в значительной степени считается стандартным методом замены изображений и единственным, который учитывает доступность и портативность.

Google(поисковый бот) нуждается в том же контенте, который должен быть предоставлен боту, так как он предоставляется пользователю. Отступ от текста (любой текст) заставляет бота думать, что это спам или вы предоставляете разный контент пользователю и боту.

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

Это прямо изо рта лошади: http://www.youtube.com/watch?v=fBLvn_WkDJ4

Другие вопросы по тегам