<i> для курсивного выделения без смысловой нагрузки. <em> для логического выделения текста, которое браузеры обычно отображают курсивом.
<b> для жирного выделения без смысловой нагрузки. <strong> для логического выделения текста как важного или срочного, которое браузеры обычно отображают жирным.
Ключевое отличие в семантике: <em> и <strong> несут смысл, а <i> и <b> — только визуальное оформление. При использовании вспомогательных технологий (скринридеров) содержимое <em> и <strong> может быть прочитано с особой интонацией, тогда как <i> и <b> воспринимаются как обычный текст.
Рекомендуется использовать <em> и <strong> для смыслового выделения и CSS для стилизации (font-style: italic;, font-weight: bold;) при необходимости.