Тег strong html: Теги strong и b, важность и выделение — Разметка текста — HTML Academy

— HTML | MDN

Элемент сильной значимости (<strong>) указывает на то, что его содержание имеет большое значение, серьёзность или срочность. Браузеры обычно отображают содержимое жирным шрифтом.

Этот элемент включает в себя глобальные атрибуты.

Элемент <strong> предназначен для контента, который имеет «большое значение», включая вещи большой серьёзности или срочности (например, предупреждения). Это может быть предложение, которое имеет большое значение для всей страницы, или вы можете просто попытаться указать, что некоторые слова имеют большее значение по сравнению с соседним контентом.

Обычно этот элемент отображается по умолчанию с использованием жирного шрифта. Однако, он не должен быть использован просто для применения жирного стиля; используйте свойство CSS font-weight для этой цели. Используйте элемент <b>, чтобы привлечь внимание к определённому тексту без указания более высокого уровня важности. Используйте элемент <em> element для выделения текста, который имеет выраженный акцент.

Другим приемлемым использованием для <strong> является обозначение ярлыков абзацев, которые представляют заметки или предупреждения в тексте страницы.

<b> против <strong>

Это часто путает новых разработчиков, почему существует так много способов выразить одно и то же на представленном веб-сайте. <b> и <strong> возможно, является одним из наиболее распространённых источников путаницы, заставляя разработчиков задавать себе вопрос: «Должен ли я использовать <b> или <strong>? Разве они не делают одно и тоже?»

Не совсем. Элемент <strong> для контента, который имеет большее значение, в то время как элемент <b> используется для привлечения внимания к тексту, не указывая на то, что это более важно.

Это может помочь понять, что оба являются правильным и семантическими элементами в HTML5, и это совпадение, что оба они имеют одинаковый стиль (полужирный) в большинстве браузеров (хотя некоторые старые браузеры фактически подчёркивают <strong>). Каждый элемент предназначен для использования в определённых типах сценариев, и если вы хотите жирный шрифт просто для украшения, вместо этого вы должные использовать свойства CSS font-weight.

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

<em> против <strong>

Добавление к путанице заключается в том, что, хотя HTML 4 определяет <strong> как просто указывающий на более сильный акцент, HTML 5 определяет <strong> как представляющий «большое значение для его содержимого». Это важное различие.

В то время, как <em> используется для изменения значения предложения, поскольку делается устный акцент («Я люблю морковь» против «Я люблюморковь«), <strong> используется, для придания предложению порции особого значения (например, «Предупреждение! Это очень опасно. «) Оба элемента <strong> и <em> могут быть вложены для увеличения относительной степени важности или усиленного акцента, соответственно.

Основной пример

<p>Прежде чем продолжить, <strong>убедитесь, что вы надели защитные очки</strong>.</p>

Результат:

Маркировочные предупреждения

<p><strong>Важно:</strong> прежде чем продолжить, убедитесь, что вы добавили много масла.</p>

Это приведёт к:

Specification
HTML Standard
# the-strong-element

BCD tables only load in the browser

with JavaScript enabled. Enable JavaScript to view data.

  • Элемент <b>
  • Элемент <em>
  • Элемент font-weight

Last modified: , by MDN contributors

Как использовать основные теги HTML для SEO — STRONG, B, EM, I

23860

How-to – Читать 6 минут

Прочитать позже

ЧЕК-ЛИСТ: КОНТЕНТНАЯ ЧАСТЬ → ИСПРАВЛЕНИЕ

Теги <STRONG>, <B>, <EM>, <I> следует использовать для визуального форматирования текста на странице сайта. Они необходимы для расстановки смысловых и зрительных акцентов. Неправильное использование тегов часто вводит читателя или поисковую систему в заблуждение. Почему? Разберемся в этой статье.

HTML — это язык разметки гипертекста. С его помощью мы сообщаем браузеру, какие элементы веб-страницы ему предстоит отобразить. Если ранее он отображал только визуальные элементы и текст, то сегодня язык HTML способен передавать и смысловую нагрузку наполнения страницы. Для этого разработчики используют специальные элементы для форматирования текста.

Текст форматируется по трем причинам:

Чтобы акцентировать внимание читателя на определенном слове или фразе.

Чтобы акцентировать внимание поисковых роботов и помогать им понять смысл того, что размещено на странице.

Чтобы создавать семантически правильный код, согласно требованиям W3C (World Wide Web Consortium).

Значение и отличия тегов

До недавнего времени язык HTML предлагал использовать теги <B> и <I> для написания текста жирным или курсивом. С появлением новой версии языка разметки HTML5, появились дополнительные теги, которые образовали близкие по своему предназначению пары: <STRONG> и <B>, <EM> и <I>.

Их появление обусловлено развитием поисковых систем, которые сегодня стремятся понимать смысл того, что размещено на странице. Создатели предложили различать HTML-теги для текста, имеющие семантическое и визуальное форматирование. Теперь с помощью тегов визуального форматирования (<B>, <I>) мы выделяем часть текста визуально, а теги семантического форматирования (<STRONG>, <EM>) передают эмоции.

Визуально вы никогда не сможете различить, какой тег использован на странице. Жирный шрифт в HTML можно сделать и с помощью <STRONG>, и с помощью <B>, а курсив — и через <EM>, и через <I>. Тогда зачем же так усложнять?

Разгадка есть. Если включить голосовое озвучивание текста, то слова и фразы, выделенные тегами <STRONG> и <EM>, компьютер прочтет с особо эмоциональной интонацией и громкостью. Вся суть заключается в этом, так как семантическое форматирование помогает поисковым системам понять контекст написанного (смысл).

  • <STRONG> — тег семантического форматирования. Он передает высокую важность выделенного текста. Визуально выглядит жирнее, чем основной текст.
  • <B> — тег визуального форматирования. Просто выделяет текст жирным и не придает ему особой важности.
  • <EM> — тег семантического форматирования. Предназначен для передачи большей экспрессивности слова или фразы относительно остального текста. Визуально слово/фраза отображаются курсивом.
  • <I> — тег визуального форматирования. Используется для выделения курсивом, но не акцентирует внимание на слове или фразе.

В спецификации W3C все теги HTML размещены в двух разделах. <EM> и <STRONG> находятся в разделе «Структурированный текст». Это значит, что они определяют внешний вид, а также учитываются специальными программами, которые предназначены для изменения интонации и громкости.

Внешний вид необязательно будет жирным или курсивом. Он может регулироваться стилями CSS, но по-прежнему передавать браузеру значение большей важности выделенного тегами текста, относительно другого. <B> и <I> вынесены в раздел «Форматирование» и указывают браузеру, как отобразить фрагмент текста.

    Какой тег лучше использовать с точки зрения SEO?

    Со стороны поисковых систем нет существенных указаний, как использовать основные теги HTML для оптимизации страниц. Сотрудники Google отрицают какую-либо разницу и разрешают использовать любые из них. Тем не менее трансформация алгоритмов дает повод усомниться.

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

    Однако существуют рекомендации W3C:

    В HTML5 тег <STRONG> используйте для особо важных фрагментов. Это наиболее актуально:

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

    Тег <B> используйте для выделения:

    • ключевых слов;
    • имен и названий;
    • призыва к действию.

    Используйте тег <EM>, когда вам надо обратить внимание на определенную часть текста. Особенно если это может указать на смысл. Продемонстрируем на простом примере:

    Задано предложение: «Кошки — милые животные». В зависимости от того, где поставлен тег <EM> изменится смысл.

    «<EM>Кошки</EM> — милые животные» — если кто-то утверждает, что милы другие животные.

    «Кошки — <EM>милые</EM> животные» — Если кто-то утверждает, что кошки — противные животные.

    «Кошки — милые <EM>животные</EM>» — Если кто-то утверждает, что кошки — милые овощи.

    Если делать смысловой акцент не надо, используйте тег <I>. Он уместен для выделения цитаты, фразы, обозначения и т. п.

    Заключение

    Если вы хотите выделить ключевые слова, несущие смысл — используйте тег <STRONG> или <EM>. Не используйте эти теги HTML для типовых фраз, например, «10% скидка», «распродажа складских остатков». Выделяйте их с помощью тегов <B> и <I>.

    Избегайте вложений одинаковых тегов: <em><i>фраза или слово</i></em>. Поисковые системы воспринимают такие конструкции как спам и переоптимизацию. Ориентируйтесь на официальные рекомендации W3С.

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

    » title = «Как и в каких случаях использовать HTML-теги STRONG, B, EM, I 16261788165787» />

    «Список задач» — готовый to-do лист, который поможет вести учет
    о выполнении работ по конкретному проекту. Инструмент содержит готовые шаблоны с обширным списком параметров по развитию проекта, к которым также можно добавлять собственные пункты.

    Начать работу со «Списком задач»

    Сэкономьте время на изучении Serpstat

    Хотите получить персональную демонстрацию сервиса, тестовый период или эффективные кейсы использования Serpstat?

    Оставьте заявку и мы свяжемся с вами 😉

    Оцените статью по 5-бальной шкале

    4.58 из 5 на основе 11 оценок

    Нашли ошибку? Выделите её и нажмите Ctrl + Enter, чтобы сообщить нам.

    Кейсы, лайфхаки, исследования и полезные статьи

    Не успеваешь следить за новостями? Не беда! Наш любимый редактор подберет материалы, которые точно помогут в работе. Только полезные статьи, реальные кейсы и новости Serpstat раз в неделю. Присоединяйся к уютному комьюнити 🙂

    Нажимая кнопку, ты соглашаешься с нашей политикой конфиденциальности.

    Поделитесь статьей с вашими друзьями

    Вы уверены?

    Спасибо, мы сохранили ваши новые настройки рассылок.

    Сообщить об ошибке

    Отменить

    &двоеточие; Элемент Strong Importance — HTML: Язык гипертекстовой разметки

    HTML-элемент указывает, что его содержимое имеет большую важность, серьезность или срочность. Браузеры обычно отображают содержимое жирным шрифтом.

    Этот элемент включает только глобальные атрибуты.

    Элемент предназначен для контента, который имеет «большую важность», включая очень серьезные или срочные вещи (например, предупреждения). Это может быть предложение, имеющее большое значение для всей страницы, или вы можете просто попытаться указать, что некоторые слова имеют большее значение по сравнению с ближайшим содержанием.

    Обычно этот элемент отображается по умолчанию жирным шрифтом. Однако для применения жирного стиля следует использовать , а не ; используйте свойство CSS font-weight для этой цели. Используйте элемент , чтобы привлечь внимание к определенному тексту без указания более высокого уровня важности. Используйте элемент , чтобы пометить текст с ударением.

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

    vs.

    Новые разработчики часто сбиваются с толку, почему существует так много способов выразить одно и то же на отрендеренном веб-сайте. и , пожалуй, один из самых распространенных источников путаницы, заставляющий разработчиков задаваться вопросом: «Должен ли я использовать или ? Разве они оба не делают одно и то же? вещь?»

    Не совсем так. Элемент предназначен для более важного контента, а элемент 9Элемент 0004 используется для привлечения внимания к тексту без указания того, что он важнее.

    Это может помочь понять, что оба являются допустимыми и семантическими элементами в HTML и что это совпадение, что они оба имеют одинаковый стиль по умолчанию (жирный шрифт) в большинстве браузеров (хотя некоторые старые браузеры фактически подчеркивают ). Каждый элемент предназначен для использования в определенных типах сценариев, и если вы хотите выделить текст жирным шрифтом для украшения, вместо этого вам следует использовать CSS 9.0004 свойство font-weight .

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

    против

    Путаницу усугубляет тот факт, что в то время как HTML 4 определил как указание на более сильное выделение, HTML 5 определяет как представляющий «большую важность для его содержание». Это важное различие.

    В то время как используется для изменения смысла предложения, как это делает ударение в речи («Я люблю морковей» против «Я люблю морковей »), используется для порций предложения с добавленной важностью (например, « Предупреждение! Это очень опасно. «). И , и могут быть вложены друг в друга для увеличения относительной степени важности или ударения соответственно.

    Базовый пример

     

    Прежде чем продолжить, наденьте защитные очки.

    Результат:

    Маркировка предупреждений

     

    Важно! Прежде чем продолжить, убедитесь, что вы добавили достаточно масло.

    Результат:

    Спецификация
    Стандарт HTML
    # the-strong-element

    Таблицы BCD загружаются только в браузере

    с включенным JavaScript. Включите JavaScript для просмотра данных.

    • Элемент
    • Элемент
    • Свойство font-weight

    Последнее изменение: , участниками MDN

    HTML: тег


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

    Описание

    HTML-тег выделяет текст, что традиционно означает, что браузер выделяет текст жирным шрифтом. Этот тег также часто называют элементом .

    Синтаксис

    В HTML синтаксис тега :

     
    

    Выделенный текст идет здесь, но не здесь

    Пример вывода

     

    Атрибуты

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

    Примечание

    • HTML-элемент находится внутри тега.
    • Тег используется для отделения текста от остального содержимого. Браузеры традиционно выделяют жирным шрифтом текст внутри тега . Вы можете изменить это поведение с помощью CSS.

    Совместимость с браузерами

    Тег имеет базовую поддержку со следующими браузерами:

    • Chrome
    • Андроид
    • Firefox (Геккон)
    • Firefox Mobile (Геккон)
    • Internet Explorer (IE)
    • Пограничный мобильный телефон
    • Опера
    • Опера Мобайл
    • Сафари (веб-кит)
    • Сафари Мобильный

    Пример

    Мы обсудим тег ниже, исследуя примеры использования тега в HTML5, HTML 4.01 Transitional, XHTML 1.0 Transitional, XHTML 1.0 Strict и XHTML 1.1.

    • HTML5
    • HTML4
    • XHTML

    Документ HTML5

    Если вы создали новую веб-страницу в HTML5, ваш тег может выглядеть следующим образом:

     
    
    <голова>
    <мета-кодировка="UTF-8">
    Пример HTML5 от www.techonthenet.com
    
    <тело>
    

    Заголовок 1

    Мы хотим выделить этот текст.

    В этом примере документа HTML5 мы создали тег , заключающий в себе текст «этот текст». Ваш браузер по умолчанию будет отображать «этот текст» жирным шрифтом. Вы можете перезаписать это поведение с помощью CSS.

    HTML 4.01 Transitional Document

    Если вы создали новую веб-страницу в HTML 4.01 Transitional, ваш тег может выглядеть следующим образом:

     
    
    <голова>
    
    Переходный пример HTML 4.01 от www.techonthenet.com
    
    <тело>
    

    Заголовок 1

    Мы хотим выделить этот текст.

    В этом примере переходного документа HTML 4.01 мы создали тег , заключающий в себе текст «этот текст». Ваш браузер по умолчанию будет отображать «этот текст» жирным шрифтом. Вы можете перезаписать это поведение с помощью CSS.

    Документ XHTML 1.0 Transitional

    Если вы создали новую веб-страницу в XHTML 1.0 Transitional, ваш тег может выглядеть следующим образом:

     
    
    <голова>
    
    Переходный пример XHMTL 1.0 от www.techonthenet.com
    
    <тело>
    

    Заголовок 1

    Мы хотим выделить этот текст.

    В этом примере переходного документа XHTML 1.0 мы создали тег , заключающий в себе текст «этот текст». Ваш браузер по умолчанию будет отображать «этот текст» жирным шрифтом. Вы можете перезаписать это поведение с помощью CSS.

    XHTML 1.0 Strict Document

    Если вы создали новую веб-страницу в XHTML 1.0 Strict, ваш тег может выглядеть так:

      0 Strict// RU" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    
    <голова>
    
    Строгий пример XHTML 1.0 от www.techonthenet.com
    
    <тело>
    

    Заголовок 1

    Мы хотим выделить этот текст.

    В этом примере XHTML 1.0 Strict Document мы создали тег , заключающий в себе текст «этот текст». Ваш браузер по умолчанию будет отображать «этот текст» жирным шрифтом. Вы можете перезаписать это поведение с помощью CSS.

    Документ XHTML 1.1

    Если вы создали новую веб-страницу в XHTML 1.1, ваш тег может выглядеть следующим образом:

     

    <голова>

    Пример XHTML 1.1 с сайта www.<img class="lazy lazy-hidden" loading='lazy' src="//consei.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/luxe-host.ru/wp-content/uploads/4/a/a/4aa8ed3fb9b009c79492491c1b5323ca.jpeg' /><noscript><img loading='lazy' src='/800/600/http/luxe-host.ru/wp-content/uploads/4/a/a/4aa8ed3fb9b009c79492491c1b5323ca.jpeg' /></noscript></p><div class="clear"></div><p class="inner-meta">This entry was posted in <a href="https://consei.ru/category/populyarnoe" rel="category tag">Популярное</a></p></div><div class="post comments" id="comments"></div></div></div></div><div id="sidebar" class="profile"><ul><li class="widget png_scale" id="widget_categories"><h2 class="blocktitle"><span>Рубрики</span></h2><ul><li class="cat-item cat-item-23"><a href="https://consei.ru/category/adsense">Adsense</a> (3)</li><li class="cat-item cat-item-20"><a href="https://consei.ru/category/chrome">Chrome</a> (2)</li><li class="cat-item cat-item-19"><a href="https://consei.ru/category/direkt">Директ</a> (86)</li><li class="cat-item cat-item-18"><a href="https://consei.ru/category/dorvei">Дорвеи</a> (39)</li><li class="cat-item cat-item-15"><a href="https://consei.ru/category/klyuchevye-slova">Ключевые слова</a> (238)</li><li class="cat-item cat-item-14"><a href="https://consei.ru/category/lendingi">Лендинги</a> (78)</li><li class="cat-item cat-item-12"><a href="https://consei.ru/category/populyarnoe">Популярное</a> (12 235)</li><li class="cat-item cat-item-17"><a href="https://consei.ru/category/prodvizhenie">Продвижение</a> (498)</li><li class="cat-item cat-item-22"><a href="https://consei.ru/category/rsya">Рся</a> (6)</li><li class="cat-item cat-item-13"><a href="https://consei.ru/category/semanticheskoe-yadro">Семантическое ядро</a> (366)</li><li class="cat-item cat-item-21"><a href="https://consei.ru/category/spam">Спам</a> (10)</li><li class="cat-item cat-item-16"><a href="https://consei.ru/category/ssylochnoe">Ссылочное</a> (73)</li><li class="cat-item cat-item-11"><a href="https://consei.ru/category/ticz">Тиц</a> (381)</li></ul></li></ul></div><div class="clear"></div></div><div class="clear"></div></div><div id="footer"><div class="wrapper" style="margin: auto;"><p style="margin-left: 50px; padding-top: 10px;"></p><div style="margin-left: 50px; padding-bottom: 10px; border-bottom: 1px solid #444;"><ul class="clearfix"><li style="padding-right: 8px; height: 32px; padding-left: 43px; margin: 17px 0 0 0; float: left; background-image: ; background-repeat: no-repeat;">Подписаться на RSS <br><span>100+ Подписчиков</span></li><li style="padding-right: 8px; height: 32px; padding-left: 43px; margin: 17px 0 0 0; float: left; background-image: ; background-repeat: no-repeat;">Услуги и реклама<span><br>Я свободен</span></li><li style="padding-right: 8px; height: 32px; padding-left: 43px; margin: 17px 0 0 0; float: left; background-image: ; background-repeat: no-repeat;">Контакты <span><br>Скажи мне привет!</span></li></ul></div><p></p> <br><p style="margin-left: 50px; padding-top: 10px;"></p><p style="margin-left: 50px; color: #ffffff;">© Копирование моих статей приветствуется, если вы поставите ссылку на мой блог будет просто математично!</p><div class="clear"></div></div></div> <noscript><style>.lazyload{display:none}</style></noscript><script data-noptimize="1">window.lazySizesConfig=window.lazySizesConfig||{};window.lazySizesConfig.loadMode=1;</script><script async data-noptimize="1" src='https://consei.ru/wp-content/plugins/autoptimize/classes/external/js/lazysizes.min.js'></script> <script defer src="https://consei.ru/wp-content/cache/autoptimize/js/autoptimize_988c07d7b1b333dca6c8c05f09c6266e.js"></script></body></html>