Это плохая практика для SEO использовать <i> в элементах заголовка?


11

Для создания удобного веб-сайта я должен использовать некоторые шрифты Font Awesome в <h>таких элементах, как этот:

<h2>
<i style="color: rgb(102, 149, 45); vertical-align: inherit;" class="fa fa-gear"></i>
 Performance
</h2>

На самом деле это обзорная статья. Можно ли поставить эти шрифты (или <i>элементы) во внутреннем HTML элементов заголовка , как <h1>, <h2>, <h3>и т.д.?

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


3
Лучше использовать <span>для FontAwesome, его глупое использование <i>Using <h2><span class="fa fa-gear"> </span></h2>будет работать так же хорошо.
Саймон Хейтер

Ответы:


11

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

Вместо этого вы можете добавить значок шестеренки непосредственно в H2:

h2.Geared:before{
    display: inline-block;
    color: rgb(102, 149, 45); 
    font-family: "FontAwesome";
    content: "\f013"; /*The actual character FontAwesome uses */
}

<h2 class="Geared">This text will have the gear</h2>

3
Пользователь действительно должен использовать CSS, а не раздувать свой HTML. В то время как стилизация тега заголовка не вызовет ожога сердца, раздутый HTML будет.
closetnoc

1
Я не согласен в некоторой степени. Потому что вы оба упустили из виду тот факт, что вы просто уменьшаете HTML, но затем увеличиваете CSS, фактически вы увеличиваете больше, чем уменьшаете. Если вы делаете это, чтобы потреблять гораздо меньше байтов, тогда используйте SASS и используйте единственную строку в CSS, например, так: .h2.geared:before, .fa-gear:before,.fa-cog:before{content:"\f013"}Кроме того, не было бы ничего плохого в использовании <h2>Title <span class="fa fa-gear"> <span></h2>полностью корректного и не повредит SEO в малейшей степени.
Саймон Хейтер

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

Предполагать, что html и css можно уменьшить с помощью sass, абсурдно. Sass расширяется до CSS, поэтому он не экономит пропускную способность, просто печатает. Это ценно, конечно, но не связано с обсуждением.
Нейт

6

Google почти не обращает внимания на то, какие теги вы используете в эти дни. Google заботится о том, как страница выглядит для пользователей. Это заботится о том, какой текст большой. Это заботится о том, какой текст является выдающимся. Это заботится о том, какой текст скрыт. Недавние SEO-тесты показали, что нет никакой разницы между использованием <div>тега, который выглядит как заголовок, и использованием <h1>тега в том, что касается Google.

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


Это ответ. <i> является стандартным элементом HTML и НИКОГДА не повлияет на ваш SEO. Кроме того, CSS-стиль НИКОГДА не повлияет на SEO, за исключением случаев, когда он используется для скрытия контента. Наиболее значимым ключом всегда будет контент, контент, контент.
Роб

-1

Да, это плохая идея. Используйте четкие <h>теги утверждений , это одно из правил Google.


2
Этот ответ неверен
Джон Конде

1
Я никогда не слышал о <h>тегах, не говоря уже о правилах Google для их использования. Можете ли вы дать ссылку на некоторую документацию?
Стивен Остермиллер
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.