json-ld e schema.org per il web semantico: smx milano 2015

31
13 Novembre, 2015 Modellazione Semantica con JSON-LD Sante J. Achille Search Marketing Consultant @sjachille

Upload: sante-j-achille

Post on 21-Jan-2018

4.144 views

Category:

Marketing


1 download

TRANSCRIPT

Page 1: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

13 Novembre, 2015

Modellazione Semanticacon JSON-LD

Sante J. Achille

Search Marketing Consultant

@sjachille

Page 2: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

• Ingegnere, Search Marketing Specialist

• Ha analizzato, ottimizzato e gestito numerosi siti in 20 anni di attività

professionale

• Ama proverbi ed usanze della tradizione popolare

• Motto: Why Be Normal?

http://achille.name/

Oggi parliamo di semantica per il web

Page 3: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Dati

Informazioni

La più grande sfida dei motori di ricerca?

Ridurre “Incertezza” e “Ambiguità”

Page 4: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

“Your web pages have an underlying meaning thatpeople understand when they read the web pages.

But search engines have a limitedunderstanding of what is being discussed on thosepages.”

Perché dati Strutturati?

Page 5: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015
Page 6: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Perché dati Strutturati?

By adding additional tags to the

HTML of your web pages … you can

help search engines and other

applications better understand

your content and display it in a

useful, relevant way.

Page 7: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Dati

Informazioni

Requisiti

Disponibilità

Consistenza

Non Ambiguità

Affidabilità

Page 8: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Dati

Informazioni

Attributi

Proprietà (persona, animale, o cosa)

Caratteristiche (dimensioni, peso, nome, … )

Location (Continent, Country, City … )

Page 9: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Dati

Informazioni

Entità

Page 10: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

http://schema.org/docs/full.html

Page 11: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

JSON (JavaScript Object Notation) is a

lightweight data-interchange format. … It is

easy for machines to parse and generate. It is

based on …

JSON is a text format that is completely

language independent but uses conventions

that are familiar to programmers of the C-

family of languages, including C, C++, C#,

Java, JavaScript, Perl, Python, and many

others.

These properties make JSON an ideal data-

interchange language.

Page 12: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

“JSON-LD is a lightweight

Linked Data format that is easy

for humans to read and write”

http://www.w3.org/TR/2013/CR-json-ld-20130910/

http://www.w3.org/TR/2013/CR-json-ld-api-20130910/

Creating semantic sites with Web Components and JSON-LD

Page 13: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Schema.org e JSON-LD

Page 14: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Schema.org …

<div itemscope itemtype="http://schema.org/Movie"><h1 itemprop="name">Avatar</h1>

<div itemprop="director" itemscopeitemtype="http://schema.org/Person">

Director: <span itemprop="givenName"> James</span> <spanitemprop="familyName">Cameron</span> (born August 16, 1954)

<meta itemprop="birthDate" content ="1954-08-16" /></div>

<span itemprop="genre">Science fiction</span><a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a>

</div>

Page 15: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

JSON-LD…

{"@context":{

"rdf": "http://www.w3.org/1999/02/22-rdf-syntax-ns#","foaf": "http://xmlns.com/foaf/0.1/","rel": "purl.org/vocab/relationship/","schema": "https://www.schema.org/"

},"@id": "http://example.com/people/mario-rossi/","@type" : "foaf:Person",

"foaf:name": ”Mario Rossi","foaf:based_near": "http://www.geonames.org/3333125","rel:employerOf": "http://example.com/people/joe-smoe/","schema:worksFor" : {

"@type" : "schema:Organization","schema:legalName" : ”Mario Rossi Inc.","schema:vatID" : "XXXXXXXXX","schema:email" : “[email protected]","schema:telephone" : "+39.xxx xx xx xxx"} } } }}

Page 16: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Page 17: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

The Resource Description Framework (RDF) is a framework for expressing information about resources. Resources can be anything, including documents, people, physical objects, and abstract concepts.

http://www.w3.org/TR/rdf11-primer/

• Le informazioni sono rappresentate ed interconnesse utilizzando il

modello vettoriale Nodo - Arco del Grafo

Page 18: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

In RDF la descrizione di una risorsa è rappresentata da una serie di triple.

Le componenti di ciascuna tripla sono il Soggetto - Predicato - Oggetto

Una tripla emula la struttura di una frase semplice come questa:

Page 19: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Il Soggetto della tripla è la URI che identifica la risorsa che si sta descrivendo

L’Oggetto può essere un valore (stringa, numero, data, …) oppure la URI di un’altra

risorsa che in qualche modo è in relazione con il soggetto

Il Predicato esplicita la relazione che intercorre tra soggetto ed oggetto ed è una URIscelto tra quelli disponibili nei vari Vocabolari …

Page 20: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

{"@context":{

"rdf": "http://www.w3.org/1999/02/22-rdf-syntax-ns#","foaf": "http://xmlns.com/foaf/0.1/","rel": "purl.org/vocab/relationship/","schema": "https://www.schema.org/"

},"@id": "http://example.com/people/mario-rossi/","@type" : "foaf:Person",

"foaf:name": ”Mario Rossi","foaf:based_near": "http://www.geonames.org/3333125","rel:employerOf": "http://example.com/people/mario-rossi/","schema:worksFor" : {

"@type" : "schema:Organization","schema:legalName" : "Mario Rossi Srl","schema:vatID" : "XXXXXXXXX","schema:email" : “[email protected]","schema:telephone" : "+39.123 45 67 890"} } } }}

JSON-LD @work…

Page 21: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Specifica di JSON-LD: http://www.w3.org/TR/json-ld/#syntax-tokens-and-keywords

3.3 Syntax Tokens and Keywords

@contextUsed to define the short-hand names that are used throughout a JSON-LD document…

@idUsed to uniquely identify things that are being described in the document with IRIs …

@typeUsed to set the data type of a node or typed value…

@vocabUsed to expand properties and values in @type with a common prefix IRI…

JSON-LD @work…

Page 22: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Usare JSON-LD per lo sviluppo del modello semantico dei contenuti per minimizzare

ambiguità ed indeterminazione

JSON-LD @work…

Page 23: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

{"@context": {

"schema": "https://schema.org/"},

"@id" : "https://mywebsite.com/blogposturl/","@type": "schema:BlogPosting","schema:datePublished" : "YYYY-MM-DD","schema:name": "BLOGPOST NAME","schema:headline" : "POST TITLE","schema:description": "A DESCRIPTION - LIKE META DESCRIPTION TAG","schema:mainEntityOfPage" : "URL","schema:image" : "https://mywebsite.com/wp-content/themes/DD-MM-YYYY/images/majestic_large.png",

JSON-LD @work…

Page 24: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

"schema:isPartOf" : {"@id" : "https://mywebsite.com/","@type" : "schema:Blog","schema:name" : "My Blog",

"schema:description": "A DESCRIPTION OF MY BLOG - HOW BEAUTIFUL AND INTERESTING MY CONTENT IS AND WHY EVERBODY SHOULD READ IT!"

},

JSON-LD @work…

Page 25: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

"schema:author" : {"@id" : "http://blog.achille.name/","@type" : "schema:Person",

"schema:givenName": "FIRST NAME","schema:additionalName": "MIDDLE NAME OR INITIAL","schema:familyName": "FAMILY NAME (SURNAME)","schema:jobTitle" : "SEARCH MARKETING CONSULTANT","schema:sameAs" : "https://twitter.com/sjachille","schema:sameAs" : "https://plus.google.com/+SanteJAchille/","schema:sameAs" : "https://www.facebook.com/sjachille"

}}

JSON-LD @work…

Page 26: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Page 27: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Usare SCHEMA.org per ulteriori informazioni di dettaglio “in line” nelle pagine (definizione della struttura della pagina, informazioni su prodotti per Ecommerce… in generale tutto

quello che può essere caratterizzato per fornire contesto e struttura alle informazioni)

SCHEMA.org @work…

Page 28: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Schema Markup Model for IMAGES

Page 29: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Schema Markup for Documents<div itemprop="image" itemscope="" itemtype="http://schema.org/ImageObject"><meta itemprop="description" content="I-797, Notice of Action: I-601, application for travel document: approval notice. " /><div itemprop="exampleOfWork" itemscope="" itemtype="http://schema.org/CreativeWork" ><meta itemprop="isBasedOnUrl" content="http://www.uscis.gov/i-601" /></div> [caption]<a itemprop="url" href="XXX"><img itemprop="image" src="XXX" alt="XXX" width="" height="" class="XXX" /></a> [/caption]</div>

Page 30: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A

Il processo è iterativo - quasi impossibile arrivare ad un modello definitivo subitoNuove proprietà sono introdotte di continuo su schema.orgI modelli vanno aggiornati periodicamente

Prova, Riprova ed Aggiorna!

Page 31: JSON-LD e Schema.org per il Web Semantico: SMX milano 2015

smxmilan.it@sjachille

#SMX #22A