Slide 1

Slide 1 text

STRUCTURED DATA HTML5 @VIPickering VINCENT PICKERING A Quick Primer On: @VIPickering VINCENT PICKERING

Slide 2

Slide 2 text

WHAT IS STRUCTURED DATA?

Slide 3

Slide 3 text

THINGS LOTS of

Slide 4

Slide 4 text

MADE UP OF • Microformats • Schema.org • RDFa & (RDFa lite) • Microdata • JSON for Linked Data

Slide 5

Slide 5 text

MICROFORMATS of www.microformats.org

Slide 6

Slide 6 text

HUMAN CONTEXT MACHINE CODE to Give Microformats

Slide 7

Slide 7 text

SCHEMA.ORG of www.schema.org

Slide 8

Slide 8 text

SCHEMA.ORG Documentation is maintained by Google, Yahoo!, Bing and Yandex

Slide 9

Slide 9 text

Resource Description Framework in Attributes www.rdfa.info

Slide 10

Slide 10 text

MARKUP SYNTAX STRUCTURED DATA for RDFa

Slide 11

Slide 11 text

RDFa lite Use

Slide 12

Slide 12 text

Vincent Pickering

Portrait Image

Blog

!

Slide 13

Slide 13 text

Vincent Pickering

Portrait Image

Blog

!

Slide 14

Slide 14 text

In RDFa you have to select vocab type You can reference this definition like an ID using resource property Definition type

Slide 15

Slide 15 text

Vincent Pickering

Portrait Image

Blog

Slide 16

Slide 16 text

Vincent Pickering

Portrait Image

Blog

defines the persons name the url belongs to the person the persons photo

Slide 17

Slide 17 text

MICRODATA

Slide 18

Slide 18 text

Microdata annotates the DOM with scoped name/value pairs from custom vocabularies ~ Mark Pilgrim diveintohtml5

Slide 19

Slide 19 text

SHARE CONTEXT SEARCH ENGINES with

Slide 20

Slide 20 text

Vincent Pickering

Portrait Image

Blog

!

Slide 21

Slide 21 text

Vincent Pickering

Portrait Image

Blog

!

Slide 22

Slide 22 text

The definition only exists within these tags The type of definition we are declaring

Slide 23

Slide 23 text

Vincent Pickering

Portrait Image

Blog

Slide 24

Slide 24 text

Vincent Pickering

Portrait Image

Blog

defines the persons name the url belongs to the person the persons photo

Slide 25

Slide 25 text

JUST REMEMBER itemscope - *Required* when you define a schema type schema type - Always in the form of: http://www.schema.org/xxx properties - In the form itemprop=“xxx”

Slide 26

Slide 26 text

GIVE CONTEXT TO: • Creative works • Events • Health & medical types • Organisations • People • Places • Products • Reviews

Slide 27

Slide 27 text

MICRODATA MICROFORMATS

Slide 28

Slide 28 text

STRUCTURED DATA

Slide 29

Slide 29 text

DATA HIGHLIGHTER GOOGLE NOW CARDS RICH SNIPPETS

Slide 30

Slide 30 text

LETS TALK BEER Over www.vincentp.me @VIPickering