Как сделать машиночитаемые «Часы работы» в HTML?

Question

[selezn]

Есть элемент макета с указанным на нем временем работы кампании, как правильно обернуть промежуток работы в тег <time> или другие теги, чтобы сделать время работы машиночитаемым?

Answer 1

[Василий Банников]

https://developer.mozilla.org/en-US/docs/Web/HTML/...

Ещё можно добавить микроразметку через itemProp
https://schema.org/LocalBusiness

Получится что-то типа

<time itemprop="openingHours" datetime="Mo, Tu, We, Th, Fr, Sa 7:00-18:00"> Mon. - Sat. 7:00 am - 6:00 pm</time>

Comments

[selezn]

Второй вариант подходит, спасибо)

Answer 2

[Sozdavan]

Вы можете использовать HTML-элементы time и span для создания машиночитаемых часов работы в HTML. Элемент «time» можно использовать для указания времени начала и окончания события, а элемент «span» можно использовать для переноса часов работы в определенный день. Вот пример:

<p>Opening Hours:</p>
<ul>
  <li>Monday - Friday: <time>9:00</time> - <time>17:00</time></li>
  <li>Saturday: <span class="closed">Closed</span></li>
  <li>Sunday: <time>10:00</time> - <time>16:00</time></li>
</ul>

В этом примере часы работы каждого дня заключены в элемент «li», а время начала и окончания указано с помощью элемента «time». Элемент «span» используется для обозначения того, что магазин закрыт в субботу. Вы также можете использовать атрибут datetime, чтобы указать дату и время в машиночитаемом формате, например:

<p>Opening Hours:</p>
<ul>
  <li>Monday - Friday: <time>9:00</time> - <time>17:00</time></li>
  <li>Saturday: <span class="closed">Closed</span></li>
  <li>Sunday: <time>10:00</time> - <time>16:00</time></li>
</ul>

В этом примере часы работы каждого дня заключены в элемент «li», а время начала и окончания указано с помощью элемента «time». Элемент «span» используется для обозначения того, что магазин закрыт в субботу. Вы также можете использовать атрибут datetime, чтобы указать дату и время в машиночитаемом формате, например:
<time datetime="2022-09-12T09:00">9:00</time>

Рекомендуется также включать aria-label для специальных возможностей и поисковых систем:

<time datetime="2022-09-12T09:00" aria-label="Open at 9:00">9:00</time>

Кроме того, вы можете использовать элемент «meta» с атрибутом «itemprop», чтобы указать часы работы вашего веб-сайта в машиночитаемом формате:

<meta itemprop="openingHours" content="Mo-Fr 09:00-17:00">

Также важно использовать правильный формат для атрибута контента, который можно найти в документации Schema.org для спецификации часов работы

Comments

[selezn]

Ля, ты серьезно? Вот сверху уже есть ответ, мне сейчас до конца жизни получать уведомления на почту от невнимательных экспертов?

[selezn]

span вообще не семантический элемент, при чем тут спан при чем тут список? Где ты увидел что в субботу выходной? Пожалуйста, не пиши чтобы написать

[Sozdavan]

selezn, примеры это. тут пользователи разные задают вопросы и не всегда удаётся определить уровень только по одному сообщению.