Top Banner
HTML5 Microdata and Schema.org Jason Ronallo Associate Head, Digital Library Initiatives NCSU Libraries
32
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: HTML5 Microdata and Schema.org

HTML5 Microdata and Schema.org

Jason RonalloAssociate Head, Digital Library InitiativesNCSU Libraries

Page 2: HTML5 Microdata and Schema.org

HTML5 Microdata and Schema.org

1. HTML52. Microdata3. Schema.org

Page 3: HTML5 Microdata and Schema.org

Rich Snippets

Page 4: HTML5 Microdata and Schema.org

Digital Collection Rich Snippet

Page 5: HTML5 Microdata and Schema.org

Embedded Semantic Markup

Page 6: HTML5 Microdata and Schema.org

HTML Semantics

Page 7: HTML5 Microdata and Schema.org

HTML5 Semantics

<nav> <header>

<article> <section> <section> <footer>

Page 8: HTML5 Microdata and Schema.org

HTML5 Microdata

Page 9: HTML5 Microdata and Schema.org

Example HTML Snippet

Page 10: HTML5 Microdata and Schema.org

Simple Microdata Example

Page 11: HTML5 Microdata and Schema.org

Display Before and After

Code4Lib Code4Lib

Page 12: HTML5 Microdata and Schema.org

itemscope

Page 13: HTML5 Microdata and Schema.org

itemtype

Page 14: HTML5 Microdata and Schema.org

itemprop

Page 15: HTML5 Microdata and Schema.org

JSON and DOM API

Page 16: HTML5 Microdata and Schema.org

COMPLETE MICRODATA DATA MODEL

Page 17: HTML5 Microdata and Schema.org

itemref

Page 18: HTML5 Microdata and Schema.org
Page 19: HTML5 Microdata and Schema.org

Making Senseof Microdata

Page 20: HTML5 Microdata and Schema.org

Schema.org

Page 21: HTML5 Microdata and Schema.org

Schema.org Hierarchy of Types

Page 22: HTML5 Microdata and Schema.org

http://schema.org/Organization

YKK

Page 23: HTML5 Microdata and Schema.org

Example Using Schema.org

Page 24: HTML5 Microdata and Schema.org

What does Schema.org mean for the cultural heritage sector?

1. No Rich Snippets2. Generic types3. Sparse properties

Page 25: HTML5 Microdata and Schema.org

1. Types That Trigger Google Rich Snippets

ApplicationsAuthorsEventsMovieMusic

PeopleProductsRecipesReviewsTV Series

Page 26: HTML5 Microdata and Schema.org
Page 27: HTML5 Microdata and Schema.org

2. Generic types for objects

● Thing○ CreativeWork

■ Article■ Book■ Map■ MediaObject■ Movie■ Painting■ Photograph■ Sculpture■ TVSeries■ WebPage

Missing types● drawing● blueprint● pamphlet● postcard● poster● photographic

negative● suit of armor● etc. ad infinitum

Page 28: HTML5 Microdata and Schema.org

3. Sparse Properties

Extensions in the wild from cultural heritage sites● rights● OCLC (oclcID)● copyright● dimensions● materials

Page 29: HTML5 Microdata and Schema.org
Page 30: HTML5 Microdata and Schema.org

Callto

Action!

Page 31: HTML5 Microdata and Schema.org

Bonus slide!

itemid

Page 32: HTML5 Microdata and Schema.org

Jason RonalloAssociate Head of Digital Library InitiativesNCSU Libraries My blog and bookmarks:

http://go.ncsu.edu/jasonr @ronallo