1. MICRODATA IN HTML 5.0 Technologies for Web Application Development Martin Nečaský Department of Software Engineering, Faculty of Mathematics and Physics, Charles University in Prague, Czech Republic

2. Machine-readability machine readability of HTML page means capability of machines to interpret data on that page HTML 5.0 elements allow for machine readability only partly, e.g. time element address element we could continuously standardize new and new semantic elements … … but it would be wrong it is not possible to standardize everything we need a way for free extensibility towards machine readability

3. Machine-readability Hi, I’m Martin Nečaský and I work at Charles University in Prague. Interesting Events DATESO 2011 After a year, we will again meet at DATESO 2011. We... When: April 20th 2011 to April 24th 2011 Where: Hotel OtavArena, Burketova 303, 397 01, Písek

4. Machine-readability it is useful to increase machine-readability of your web pages by annotating content with machine-readable values How to achieve machine-readability? microformats microdata RDFa

5. Microdata for machine-readability microdata allows nested groups of name-value pairs to be added to documents in addition to “classical” content basic microdata concept is item group of name-value pairs item ~ object name-value pair ~ attribute value value: atomic value (integer, string, date, …) or another item

6. Microdata for machine-readability attribute itemscope any HTML element having this attribute represents single item

7. Microdata for machine-readability Hi, I’m Martin Nečaský and I work at Charles University in Prague. Interesting Events DATESO 2011 After a year, we will again meet at DATESO 2011. We... When: April 20th 2011 to April 24th 2011 Where: Hotel OtavArena, Burketova 303, 397 01, Písek

8. Microdata for machine-readability each item has its type type ~ class, item ~ class instance attribute itemtype type should be from a standardized vocabulary otherwise no one will be able to interpret our content e.g. http://data-vocabulary.org http://data-vocabulary.org/Person http://data-vocabulary.org/Address http://data-vocabulary.org/Event http://data-vocabulary.org/Product http://data-vocabulary.org/Review

9. Microdata for machine-readability Hi, I’m Martin Nečaský and I work at Charles University in Prague. Interesting Events DATESO 2011 After a year, we will again meet at DATESO 2011. We... When: April 20th 2011 to April 24th 2011 Where: Hotel OtavArena, Burketova 303, 397 01, Písek

10. Microdata for machine-readability each item has set of properties name/value pairs attribute itemprop property name should be from a standardized vocabulary otherwise no one will be able to interpret our data e.g. item of type http://data-vocabulary.org/Person has following properties: name photo url friend Address : street-address, city, region, postal-code, country-name …

11. Microdata for machine-readability Welcome, my name is Martin Nečaský and I work as an assistant professor at Charles University in Prague.

12. Microdata for machine-readability and item of type http://data- vocabulary.org/Event has following properties: summary url startDate endDate location Description …

13. Microdata for machine-readability DATESO 2011 After a year, we will again meet at DATESO 2011. We... When: April 20th 2011 to April 24th 2011 Where: Hotel OtavArena, Burketova 303, 397 01, Písek

14. Microdata for machine-readability let’s get a deeper insight – where is property value for a property? let E be element with itemprop attribute. Then value V is determined by following table EV E has itemscope attribute item created by E meta value of content attribute or empty img, audio, video, embed, iframe, source, track URL of src attribute or empty a, link, area URL of href attribute or empty object URL of data attribute or empty time value of datetime attribute all other casestext content of E

15. Microdata for machine-readability let’s get a deeper insight – what if data is separated from my item (e.g. due to page layout)? no problem, use itemref attribute to refer other elements with item properties

16. Microdata for machine-readability <div itemscope itemtype="http://data-vocabulary.org/Person" itemref="myfriendsA myfriendsB"> Welcome, my name is Martin Nečaský and I work as an assistant professor at Charles University in Prague. My friends: John Black Bill White My other friends: Joe Pink

17. Projects Who considers working with machine-readable web pages? Google Rich Snippets Yahoo SearchMonkey Facebook Open Graph Protocol DBPedia.org … Are there any other standards? http://www.foaf-project.org/ http://trac.usefulinc.com/doap http://www.heppnetz.de/projects/goodrelations/ …

18. Projects - Google Rich Snippets consume microformats, microdata, RDFa data from your web pages may be used by Google for searching and displaying search results

19. Projects – Yahoo SearchMonkey consume microformats project has been stopped in 2010 but it is integrated to Yahoo and Microsoft products and further developed http://www.ysearchblog.com/2010/08/17/news-about-our- searchmonkey-program http://www.ysearchblog.com/2010/08/17/news-about-our- searchmonkey-program

20. Projects – FB Open Graph Protocol enables integrate your web pages into FB social network own way to achieve machine-readability (via meta elements) <html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml"> The Rock (1996) <meta property="og:description" content="A group of U.S. Marines, under..."/>......