WADe 2017-2018 Tutorial (2/3): Data Modeling in HTML: Schema.org HTML5 Microdata
46
Dr. Sabin Buragaprofs.info.uaic.ro/~busaco Dezvoltarea aplicațiilor Web </> date structurate în cadrul documentelor HTML scheme de microdate HTML5
-
Upload
sabin-buraga -
Category
Technology
-
view
69 -
download
3
Transcript of WADe 2017-2018 Tutorial (2/3): Data Modeling in HTML: Schema.org HTML5 Microdata
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Dezvoltarea aplicațiilor Web
</>date structurate în cadrul documentelor HTML
scheme de microdate HTML5
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
„Imaginația este mai importantă ca erudiția.”
Albert Einstein
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Constatare
clientul care consumă (accesează) reprezentăride resurse Web nu trebuie obligatoriu să fie uman
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Cum am putea descrie conținutul resurselor Webastfel încât să poată fi procesat „inteligent”?
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Idee:specificarea unor meta-date direct în cadrul
documentelor HTML pentru a „explica” unui program (software – e.g., motor de căutare)
conținutul unei resurse Web
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Soluții actuale aliniate problematicilor Web-ului semantic – Web of Data
microformate – microformats.org
scheme de microdate HTML5 – schema.org
RDFa (standard al Consorțiului Web) – rdfa.info
săptămânaviitoare
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Microdata HTML 5
specificație HTML Living Standard (octombrie 2017)https://html.spec.whatwg.org/multipage/microdata.html
a se studia și http://html5doctor.com/microdata/
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Microdata HTML 5
posibilitatea de a specifica perechi de proprietăți(nume, valoare) „scufundate” în HTML
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Microdata HTML 5
grupurile de perechi de proprietăți nume—valoare sunt denumite items
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Microdata HTML 5
grupurile de perechi de proprietăți nume—valoare sunt denumite items
creare via atributul itemscope
stabilește și domeniul de vizibilitate
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Microdata HTML 5
grupurile de perechi de proprietăți nume—valoare sunt denumite items
specificarea unei proprietăți prin atributul itemprop
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Microdata HTML 5
grupurile de perechi de proprietăți nume—valoare sunt denumite items
referire cu ajutorul atributului itemref
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Microdata HTML 5
grupurile de perechi de proprietăți nume—valoare sunt denumite items
asocierea unui tip de date se face cu atributul itemtype
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Microdata HTML 5
grupurile de perechi de proprietăți nume—valoare sunt denumite items
pentru identificarea unui item se folosește itemid
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Există o serie de modele de date(exprimate via microdate)ce pot fi indexate și folosite
de actualele motoare de căutare?
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
schema.org
colecție de vocabulare (scheme de date)– e.g., Book, Event, LocalBusiness, Movie, Offer, Person,
Place, Recipe, Review, TVSeries,… – recunoscute șiindexate de roboții principalelor motoare de căutare
istoric și viziune:R. Wallis, “Schema.org: Where did that come from?”,
LODLAM Summit 2017www.slideshare.net/rjw/schemaorg-where-did-that-come-from-77955231
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
schema.org
colecție de vocabulare (scheme de date)– e.g., Book, Event, LocalBusiness, Movie, Offer, Person,
Place, Recipe, Review, TVSeries,… – recunoscute șiindexate de roboții principalelor motoare de căutare
Bing, Google, Yahoo!, Yandex
amănunte la https://schema.org/docs/gs.html
modeleconceptuale
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
de explorat și http://www.w3.org/wiki/WebSchemas
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
tipurile primare de date definite de schema.org
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
diverse proprietăți ce relaționează Integer cu alte concepte
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Thing – schema cea mai generală, incluzând conceptualizări(clasificări realizate riguros)
Action
BroadcastService
CreativeWork
Event
Intangible
MedicalEntity
Organization
Person
Place
Product
Class
Property
modelare de cunoștințe(via o ontologie)
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Person – modelează conceptul „persoană”http://schema.org/Person
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
schema.org
relațiile dintre entități sunt precizate via proprietăți
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
<div itemscope="" itemtype="http://schema.org/RealEstateAgent"><span itemprop="name">Tuxy Unlimited</span><div itemprop="address" itemscope=""
itemtype="http://schema.org/PostalAddress"><span itemprop="streetAddress">Banchiza, 1</span><span itemprop="addressLocality">Iasi</span>,<span itemprop="addressRegion">Iasi</span><span itemprop="postalCode">700550</span>
</div>Phone: <span itemprop="telephone">+4032201090</span><a href=
"http://www.openstreetmap.org/way/243817200#map=18/47.17493/27.57378" itemprop="maps">Details on OpenStreetMap</a>
</div>
fapte vizând domeniul imobiliar
…pe baza modelului conceptual schema.org
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
<p itemid="#busaco" itemscope="" itemtype="http://schema.org/Person">This discipline is taught by
<span itemprop="honorificPrefix">Dr.</span> <a href="https://profs.info.uaic.ro/~busaco/"
title="Visit the Website of Sabin-Corneliu Buraga" itemprop="url"><span itemprop="name">
<span itemprop="givenName">Sabin</span>-<span itemprop="additionalName">Corneliu</span> <span itemprop="familyName">Buraga</span>
</span></a>.
</span></p>
specificarea (adnotarea explicită a) faptului: „entitatea având numele Sabin-Corneliu Buraga este o persoană, posedă titlul Dr. și are situl Web propriu
disponibil la adresa https://profs.info.uaic.ro/~busaco/”
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
extragerea/verificarea de date structurate via Structured Data Testing Tool
https://search.google.com/structured-data/testing-tool
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
<section id="week3"><h2>Săptămâna 3</h2><ul>
<li itemscope="" itemtype="http://schema.org/CreativeWork"itemid="#cliw-lecture3" class="lecture"><aside class="menu">concurs:
<a href="web-contest.html" title="Detalii">SEO @ CLIW</a></aside><p>Curs: <a itemprop="url" title="Prezentare în format PDF"
href="presentations/web03-…-MicrodateHTML5.pdf"><span itemprop="name">(Re)găsirea resurselor Web</span></a>
</p><div class="terms" itemprop="keywords">Web search, robot,
search engine, SEO, HTML5 microdata, schema.org</div></li>…
</ul></section>
specificarea în HTML5 a lucrărilor creative de tip CreativeWork conform schema.org
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
extragerea informațiilor din HTML5aici, despre prelegerile materiei Tehnologii Web
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
<article itemscope="" itemtype="http://schema.org/Event"><section id="contest">
<h2>Tema</h2><p itemprop="description">Concursul este destinat studenților<span itemprop="location" itemscope="" itemtype="http://schema.org/Place">
<a href="http://www.info.uaic.ro/" itemprop="url" title="Spre situl FII><span itemprop="name">FII</span></a> (UAIC <span itemprop="address">Iași, România</span>)</span>
și constă în optimizarea conținutului și structurii unui sit Web.</p>…<p>Perioadă de desfășurare: <span itemprop="startDate" content="2017-10-14T00:00">14 octombrie 2017</span>—<strong><span itemprop="endDate" content="2018-01-07T17:00">7 ianuarie 2018, ora 17:00</span></strong>.</p>
</section>…</articol>
pe baza schema.org, se pot modela în HTML date vizând un eveniment (Event) și locul de desfășurare a acestuia (Place)
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
date pentru „consum” uman vs. date structurate interpretate și prelucrate, ulterior, de algoritmi
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
acțiuni asociate vizualizării unui produs (instanță a Product)
detalii la http://schema.org/docs/actions.html
caz concret: eBay
acțiuni ce pot fi efectuate de utilizator(ViewAction e sub-concept al Action)context: dispozitive mobile, e-mail,…
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
<div itemscope="" itemtype="http://schema.org/Product"><img itemprop="image" src="tux-de-catifea-cu-paiete.jpg" /><span itemprop="name" lang="ro">Tux de catifea cu paiete</span>
<div itemprop="aggregateRating"itemscope="" itemtype="http://schema.org/AggregateRating"><span itemprop="ratingValue">74</span>din <span itemprop="bestRating">100</span> de punctepe baza a <span itemprop="ratingCount">33</span> de evaluări ale utilizatorilor
</div>
<div itemprop="offers" itemscope=""itemtype="http://schema.org/AggregateOffer">disponibil de la
<span itemprop="lowPrice">30</span> la <span itemprop="highPrice">130</span> de RON pe baza ofertei a <span itemprop="offerCount">10</span> comercianți
Oferta zilei:<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<a itemprop="url" href="http://jucarii.biz/tucsi/tux-catifea-paiete">Jucării de sărbători pentru toți, acum și cu paiete!</a>
</div></div>
</div>modelarea cunoștințelor privind
produse și oferte comerciale
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
inspectarea datelor structurate cu OpenLink Structured Data Sniffer– extensie de browser Web: http://osds.openlinksw.com/
exemple reale: pinterest.com/kidehen/structured-metadata-related/
specificarea meta-datelor privitoare la instanța de Articol
construcții RDFa utilizând Open Graph Protocol (Facebook) – ogp.me
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
extragerea de microdate HTML5, plus convertirea în triple RDF via Microdata2RDF Service (serviciu REST)
disponibil la http://getschema.org/microdataextractor/about
@prefix rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#>.
@prefix schema: <http://schema.org/>.
<_:gs0>
rdf:type <http://schema.org/WebPage>;
schema:name "Web Application Development";
schema:description "syllabus (aka the WADe film)";
schema:license <https://creativecommons.org/licenses/by-nc-sa/4.0/>;
schema:author "#busaco".
"#wade-lecture5"
rdf:type <http://schema.org/CreativeWork>;
schema:url <https://profs.info.uaic.ro/~busaco/teach/.../web05ModelulRDF.pdf>;
schema:name "Data Modeling in RDF (Resource Description Framework)";
schema:keywords "Web, model, RDF, vocabulary, DCMI, FOAF, DOAP, SIOC, JSON-LD".
"#busaco"
rdf:type <http://schema.org/Person>;
schema:url <https://profs.info.uaic.ro/~busaco/>;
schema:name "Sabin-Corneliu Buraga".
detalii în cursul despre RDF
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Studiu de caz:adnotarea semantică via microdate HTML5 a datelor
în contextul interacțiunii om-calculator
persona și teste de utilizabilitate(Ștefan Negru & Sabin Buraga, 2012)
http://blankdots.com/open/schema/
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
model de cunoștințe + proprietăți specifice asociate conceptului Persona
detalii în cadrul disciplineiHuman Computer Interaction
profs.info.uaic.ro/~busaco/teach/courses/hci/
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
<article itemscope itemtype="http://schema.org/Persona"><section id="personal-info">
<h3>Type: <strong itemprop="personaType">Primary</strong></h3><figure><img itemprop="image" src="teacher.jpg" alt="persona image" /></figure><h4>Identity: <span itemprop="givenName">Tuxy</span>
<span itemprop="familyName">Pinguinescu</span></h4><h4>Background</h4><ul>
<li>Date of Birth: <time itemprop="birthDate" datetime="1980-10-30">30 octombrie 1980</time></li>
<li>Gender: <span itemprop="gender">Male</span></li><li itemprop="location" itemscope itemtype="http://schema.org/Place">
Location: <span itemprop="name">Iasi, Romania</span></li><li>Tech Level:<span itemprop="technicalLevel">Advanced</span></li>
</ul></section><section id="goals">
<h4>Goals</h4><ul>
<li>Practical Goals: <span itemprop="endGoal">…</span></li><li>Personal Goals: <span itemprop="experienceGoal">…</span></li>
</ul></section>
</article>
moștenite de la Person
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
coObservație: construcțiile schema.org
pot fi „scufundate” în documentele HTML
și ca date JSON-LD
exemplificare:exprimarea acțiunii de
interacțiune dintre persoana Tuxy și organizația UAIC
<script type="application/ld+json">
{
"@context" : "http://schema.org",
"@type" : "InteractAction",
"agent" : {
"@type" : "Person",
"name" : "Tuxy"
},
"participant" : {
"@type" : "Organization",
"name" : "UAIC"
}
}
</script>
concept
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
generarea de construcții JSON-LD ce recurg la schema.orgwww.microdatagenerator.com
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Diverse utilizări practice:
artefacte culturaleA. Isaac, Europeana and Schema.org, DCMI 2013
www.slideshare.net/antoineisaac/europeana-and-schemaorg-dc2013
http://www.few.vu.nl/~aisaac/#pub
biblioteci digitale (digital libraries)R. Wallis, prezentări la ELAG 2014, Smart Data 2015 etc.
www.slideshare.net/rjw/why-schemaorg-for-libraries
www.slideshare.net/rjw/schemaorg-extending-benefits
lucrări științificeformatul Scholarly HTML
http://scholarly.vernacular.io/
medicină computaționalăhttp://schema.org/docs/meddocs.html
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Diverse utilizări practice:
finanțeextensia schema.org privitoare la FIBO
(Financial Industry Business Ontology)http://www.edmcouncil.org/financialbusiness
https://schema.org/FinancialProduct
industria autohttp://auto.schema.org/
IoT (Internet of Things)http://iot.webschemas.org/docs/iot-gettingstarted.html
http://iot-datamodels.blogspot.com/
turismC. Bizer, Schema.org Annotations in Websites. Opportunities
& Challenges for the Tourism Industry, TFF’15www.slideshare.net/TourismFastForward/bizer-christian-schema-orgtourism
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
A se studia și inițiativa Web Data Commons
extragere cu Common Crawl – http://commoncrawl.org/ –și acces la seturi de date modelate
via microformate, microdate și RDFa
webdatacommons.org/structureddata/
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
extragere și export de microformate, microdate HTML5 și RDFa cu extensia POSHex
proiect al absolventului FII Tiberiu Pasat (2013)
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
Inclusiv, suport pentru scheme de microdate HTML5implementat în sistemele de management de conținut(e.g., DokuWiki, Drupal, Joomla, TYPO3, WordPress)
M. Mössmer, Schema.org Plugins for CMS Systems (2014)http://oc.sti2.at/sites/default/files/schemaorg_cmsplugins.pdf
exemple practice:https://www.dokuwiki.org/plugin:semantic
https://extensions.joomla.org/extension/google-structured-data-markup
https://wordpress.org/plugins/all-in-one-schemaorg-rich-snippets/
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
statistici vizând includerea de meta-date
direct în codul HTMLtrends.builtwith.com/docinfo
Dr.
Sab
in B
ura
ga
profs.in
fo.uaic.ro/~busa
co
rezumat
</>specificarea (meta-)datelor
în cadrul documentelor HTML
