Geek Answers Handbook

Structured data for semantic html hours

I have to mark the hours of the company using HTML5 microdata. After some searching on Google and schema.org, I wrote the following code:

<time itemprop="openingHours" datetime="Mo 13:00-17:30"><span class="day">Maandag:</span> <span class="hours">13:00-17:30</span></time> <time itemprop="openingHours" datetime="Tu 09:00-17:30"><span class="day">Dinsdag:</span> <span class="hours">09:00-17:30</span></time> <time itemprop="openingHours" datetime="We 09:00-17:30"><span class="day">Woensdag:</span> <span class="hours">09:00-17:30</span></time> <time itemprop="openingHours" datetime="Th 09:00-17:30"><span class="day">Donderdag:</span> <span class="hours">09:00-17:30</span></time> <time itemprop="openingHours" datetime="Fr 09:00-21:00"><span class="day">Vrijdag:</span> <span class="hours">09:00-21:00</span></time> <time itemprop="openingHours" datetime="Sa 08:30-15:00"><span class="day">Zaterag:</span> <span class="hours">08:30-15:00</span></time>

When I test a website with the Google Structured Data Testing Tool, I see that structured data is recognized correctly. The problem is that one of the requirements for this assignment is that it complies with the HTML W3C validator. For each time element, I get the following error.

 Bad value Mo 13:00-17:30 for attribute datetime on element time: The literal did not satisfy the time-datetime format.

I get, why I get this error, what I am not getting is how I can specify the time of my opening so that they are marked with Microdata HTML data and that they are also valid HTML according to the HTML5 validator.

Hope you guys can help me with this. :)

+7
html5 w3c-validation microdata structured-data
source share
3 answers

Supporting W3C HTML Checker (aka validator). I wrote code that performs this check. The Mo 13:00-17:30" value is Mo 13:00-17:30" in the question does not comply with the HTML specification rules, giving valid datetime values .

The Mo 13:00-17:30 value of Mo 13:00-17:30 seems to be trying to indicate a special time range: day of the week plus time range.

However, the HTML specification does not allow the use of a value in this format. The closest format that it allows is a length string in ISO8601 format .

Duration string to be valid: datetime="4h 30m" .

This is approximately the same as you can get, because in the HTML specification the rules for specifying the duration are such that it should be a single expression of several hours + minutes + seconds. So:

  • duration expression that indicates a couple of times (as a question) is not valid
  • because the duration expression indicating the day of the week is not valid
+3
source share

I used data instead of time - it works for validator.w3.org , as well as for www.google.com/webmasters/tools/richsnippets : <data itemprop="openingHours" value="Mo-Su 07:00-22:00">7 days a week, 7 am to 22 pm</data> Thanks to Hixie on freenode # whatwg.

+1
source share

If the datetime format causes the validation to fail, you can put the hours of operations in the meta tag element:

  <meta itemprop="openingHours" content="Mo,Tu 11..." /> <meta itemprop="openingHours" content="We,Th 12..." /> ...

According to the specifications, the meta element will be valid there if it has the itemprop attribute.

+1
source share

More articles:


All Articles