<strong>

Семантически выделяет важный текст.

Время чтения: меньше 5 мин

Кратко

Скопировано

Тег <strong> добавляет обёрнутому в него слову или фразе очень высокую важность. Он может использоваться для выделения предупреждений или части документа, которую пользователь должен увидеть раньше остального. При этом обозначение части текста тегом <strong> не должно изменять смысла предложения.

Пример

Скопировано
        
          
          <p>Эта правка <strong>критически важна</strong> для проекта!</p>
          <p>Эта правка <strong>критически важна</strong> для проекта!</p>

        
        
          
        
      
Открыть демо в новой вкладке

Как пишется

Скопировано

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

Скопировано

Теги <strong> и <b> внешне похожи: оба по умолчанию имеют стиль font-weight: bold. Но по смыслу эти теги отличаются. Тег <b> только внешне выделяет текст, а тег <strong> добавляет важности обёрнутому в него тексту.

Не используйте тег <strong> только для визуального выделения текста.

Атрибуты

Скопировано

Тег <strong> поддерживает глобальные атрибуты и события.

Доступность

Скопировано

Хотя <strong> считается элементом семантической вёрстки, у него пока нет встроенной роли strong. Так что для скринридеров это простой текст, который они никак не выделяют интонацией.

Чтобы магия произошла и скринридер понял, что слово или фраза крайне важные, достаточно стилизовать элемент с помощью font-weight: bold. Если у пользователя скринридера включена специальная настройка, он услышит небольшое изменение в озвучивании такого текста.

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