Для заголовков в html есть специальные теги семейства <h>(<h1>, <h2>, <h3>, <h4>, <h5> и др.), рассмотренные в прошлой статье, но при их чрезмерно высокой концентрации поисковые системы могут занижать позиции сайта. Поэтому когда между тегами <h> менее, чем 3-4 абзаца текста, вместо них лучше использовать безопасный вариант заголовка, а именно: блочный тег <div> или строчный <span>. Подробная информация о безопасной концентрации тегов <h> была ранее рассмотрена в статье, посвященной созданию заголовков.
Теги <h>, отличаются от или <div> отступами, размером и начертанием шрифта, которые уже заданы по умолчанию. Тег <span> отличается от <h> теми же свойствам, что и <div>, плюс видом отображения(span — строчный; h, div — блочные). То есть <div> ближе к <h>, чем <span>.
Но если для <span> или <div> прописать в свойствах такие же: размер и начертание шрифта, отступы и вид отображения(для span), то никаких внешних отличий от <h> не будет.
Отличия тегов span и div между собой минимальные: span «строчный» и не имеет свойств, заданных по умолчанию, а div «блочный» и содержит свойство, заданное по умолчанию style="display:block". Если говорить о схожести, то для замены <h>, лучше использовать div, т. к. он тоже является блочным и не потребуется писать дополнительные свойства style="display:block", которые уже заданы по умолчанию у div, в отличие от span.
Блочные элементы отличаются от строчных следующими параметрами:
- Наличие перевода строки до и после;
- Занимают всю ширину родительского слоя.
Сейчас мы рассмотрим свойства, которые нужно прописать, чтобы использовать теги div или span вместо h, при этом сохранив точной такой же внешний вид заголовка.