В HTML-разметке теги <figure>
и <figcaption>
используются для группирования медиаконтента (например, изображений) с подписями. Эти теги позволяют семантически ассоциировать медиаэлементы (как правило, графические изображения) с их описанием или подписью, что улучшает структурирование контента и доступность веб-страницы.
<figure>
Тег <figure>
предназначен для включения иллюстраций, диаграмм, фотографий и прочего медиаконтента в документ, при этом данный контент может быть независимым от основного текста, то есть его можно перемещать в другой раздел страницы или даже на другую страницу без потери понимания. Также <figure>
может содержать любые HTML-элементы, включая <figcaption>
для подписи.
Пример использования:
<figure>
<img src="path/to/image.jpg" alt="Описание изображения">
<figcaption>Подпись к изображению.</figcaption>
</figure>
<figcaption>
Тег <figcaption>
представляет собой подпись к медиаконтенту внутри тега <figure>
. Этот тег должен быть первым или последним элементом внутри <figure>
, таким образом указывая, что подпись относится именно к содержимому данного контейнера. <figcaption>
может содержать как простой текст, так и разметку, включая ссылки и другие элементы.
Пример использования:
<figure>
<figcaption>Это пример подписи, идущей перед изображением.</figcaption>
<img src="path/to/image.jpg" alt="Описание изображения">
</figure>
Использование этих тегов не только способствует лучшему пониманию структуры страницы поисковыми системами и программами чтения с экрана, но и облегчает стилизацию и управление медиаконтентом на веб-странице.