Dr. Sabin Buragawww.purl.org/net/busaco

Dezvoltarea aplicațiilor Web

date structurate în cadrul documentelor HTML
micro...
Albert Einstein

Dr. Sabin Buragawww.purl.org/net/busaco

“Imaginația este mai importantă ca erudiția.”
Dr. Sabin Buragawww.purl.org/net/busaco

Constatare

clientul care consumă (accesează) reprezentări
de resurse Web nu tre...
Dr. Sabin Buragawww.purl.org/net/busaco

Cum am putea descrie conținutul resurselor Web
astfel încât să poată fi procesat...
Dr. Sabin Buragawww.purl.org/net/busaco

Idee:
specificarea unor meta-date (date privind datele)
direct în cadrul documen...
soluții:
microformate
scheme de microdate HTML5
RDFa

Dr. Sabin Buragawww.purl.org/net/busaco

Idee:
specificarea unor me...
(Tantek Çelik & Kevin Marks, 2004)

www.microformats.org

Dr. Sabin Buragawww.purl.org/net/busaco

Microformate
utilizarea de marcaje (X)HTML pentru a desemna
semantica și/sau structura conținutului

Dr. Sabin Buragawww.purl.org/net/...
utilizarea de marcaje (X)HTML pentru a desemna
semantica și/sau structura conținutului

“curentul” POSH (Plain Old Semanti...
reutilizarea unor vocabulare de termeni,
disponibile liber și standardizate

Dr. Sabin Buragawww.purl.org/net/busaco

Mic...
reutilizarea unor vocabulare de termeni,
disponibile liber și standardizate
realizarea de adnotări semantice direct în HTM...
“clase” CSS pentru prezentare
și asocierea de descrieri
ale meta-datelor

structurarea
paginilor Web:
precizarea
înțelesul...
elementare (desemnează o singură caracteristică)
+
compuse (specifică mai multe proprietăți
care modelează un aspect de in...
asociază unei legături hipertext un termen (tag)
– cuvânt-cheie ori subiect – ales liber de autor
(tagging content)

Dr. S...
<a href="http://technorati.com/tag/fish" rel="tag">fish</a>
<a href="http://en.wikipedia.com/wiki/UNIX" rel="tag"
class="s...
relații între “prieteni”: colaboratori, rude, cunoscuți,…
<a href="http://www.infoiasi.ro/~dlucanu/"
rel="met, colleague, ...
Dr. Sabin Buragawww.purl.org/net/busaco

recurgerea la XFN în cadrul sistemului WordPress
desemnează evenimente & orare
vezi formatul iCalendar – RFC 2445

Dr. Sabin Buragawww.purl.org/net/busaco

hCalendar
<div class="vevent">
<a class="url" href="http://profs.info.uaic.ro/~web/2007/">
<abbr class="dtstart" title="20061117">No...
informații de contact despre persoane, organizații etc.
în conformitate cu formatul vCard – RFC 2426

Dr. Sabin Buragawww...
Dr. Sabin Buragawww.purl.org/net/busaco

specificarea informațiilor despre o persoană via hCard
modelează informații despre un CV
folosit în conjuncție cu hCard și hCalendar

Dr. Sabin Buragawww.purl.org/net/busaco

h...
desemnează opinii emise despre „ceva”
(produs, locație, eveniment, persoană,…)

Dr. Sabin Buragawww.purl.org/net/busaco

...
Dr. Sabin Buragawww.purl.org/net/busaco

<div class="hreview">
<!-- resursa recenzată -->
<h1 class="item">Recenzie despr...
definește coordonatele geografice ale unui loc

Dr. Sabin Buragawww.purl.org/net/busaco

geo
Dr. Sabin Buragawww.purl.org/net/busaco
simplifică maniera de specificare (2012)

http://microformats.org/wiki/microformats2

Dr. Sabin Buragawww.purl.org/net/bu...
vocabularele sunt definite pe baza unor prefixe

hpudte-

includerea unui microformat
specificarea unei proprietăți simple...
exemplu concret de utilizare a microformatului hCard
(în ambele versiuni)
preluat de la https://webfwd.org/about/experts/
...
vocabulare predefinite (în stadiu de ciornă):

h-adr
h-geo
h-resume

h-card
h-item
h-review

h-entry
h-event
h-product h-r...
Dr. Sabin Buragawww.purl.org/net/busaco

<!-- specificarea unui eveniment via microformate versiunea 2 -->
<section class...
}

"items": [ {
"type": [ "h-event" ],
"properties": {
"name": [ "Potop – ediția 2013" ],
"url": [ "http://potop.info/2013...
Apple
Google
Intel
Last.fm
Six Apart
Yahoo!
XWiki
și multe altele
detalii la http://microformats.org/wiki/implementors

Dr...
Desigur, putem definite microformate proprii:
hLocation – referențierea (în termeni fuzzy) a locațiilor
(S. Dumitriu, M. G...
Dr. Sabin Buragawww.purl.org/net/busaco

microformate: utilizări

detectarea și exportul de microformate cu extensia
Oper...
alternativă la microformate
specificație W3C în stadiu de ciornă (octombrie 2012)

www.w3.org/TR/microdata/

Dr. Sabin Bur...
posibilitatea de a specifica perechi de proprietăți
(nume, valoare) “scufundate” în HTML

Dr. Sabin Buragawww.purl.org/ne...
grupurile de perechi de proprietăți nume—valoare
sunt denumite items

Dr. Sabin Buragawww.purl.org/net/busaco

Microdata ...
grupurile de perechi de proprietăți nume—valoare
sunt denumite items
creare via atributul itemscope
specificarea unei prop...
grupurile de perechi de proprietăți nume—valoare
sunt denumite items
asocierea unui tip de date se face cu atributul itemt...
ca tipuri de date se pot folosi microformatele

Dr. Sabin Buragawww.purl.org/net/busaco

Microdata HTML 5
Dr. Sabin Buragawww.purl.org/net/busaco

<section itemscope itemtype="http://microformats.org/profile/hcard">
<h1 itempro...
Dr. Sabin Buragawww.purl.org/net/busaco

Există o serie de modele de date
(exprimate via microformate sau microdate)
ce p...
colecție de vocabulare (scheme de date)
– e.g., Book, Event, LocalBusiness, Movie, Offer, Person,
Place, Recipe, Review, T...
Dr. Sabin Buragawww.purl.org/net/busaco

a se studia și http://www.w3.org/wiki/WebSchemas
Dr. Sabin Buragawww.purl.org/net/busaco

<body itemscope itemtype="http://schema.org/WebPage">
<header>
<h1 itemprop="nam...
<div itemscope itemtype="http://schema.org/Product">
<img itemprop="image" src="tux-de-catifea-cu-paiete.jpg" />
<span ite...
adnotarea semantică via microdate HTML5 a datelor
în contextul interacțiunii om-calculator
persona & teste de utilizabilit...
Dr. Sabin Buragawww.purl.org/net/busaco
Dr. Sabin Buragawww.purl.org/net/busaco

<article itemscope itemtype="http://schema.org/Persona">
<section id="personal-i...
Dr. Sabin Buragawww.purl.org/net/busaco

extragerea/verificarea de date structurate
via Structured Data Testing Tool
http...
Dr. Sabin Buragawww.purl.org/net/busaco

Alte resurse de interes,
inclusiv instrumente de validare și conversie,
sunt ofe...
Dr. Sabin Buragawww.purl.org/net/busaco

Folosind modelul RDF (subiect, predicat, obiect),
n-am putea include triplele RD...
reprezintă un alt format de serializare a modelului RDF
RDF + HTML = RDFa

Dr. Sabin Buragawww.purl.org/net/busaco

Speci...
recomandări ale Consorțiului Web

RDFa 1.0 (2008)
RDFa 1.1 (2012 – prima ediție; 2013 – a doua ediție)
www.w3.org/TR/rdfa-...
“punte” între Web-ul social și Web-ul datelor

www.w3.org/TR/rdfa-primer/

Dr. Sabin Buragawww.purl.org/net/busaco

RDFa
utilizarea unor atribute HTML specifice menite a modela
datele disponibile într-o pagină Web
în vederea procesării acestor...
minimal, se pot utiliza atributele specificate de RDFa Lite

www.w3.org/TR/rdfa-lite/

Dr. Sabin Buragawww.purl.org/net/b...
minimal, se pot utiliza atributele specificate de RDFa Lite
vocab – precizează URL-ul vocabularului de date folosit
exempl...
minimal, se pot utiliza atributele specificate de RDFa Lite
typeof – desemnează un tip de date (clasă de „lucruri”)
de exe...
minimal, se pot utiliza atributele specificate de RDFa Lite
property – specifică o proprietate asociată tipului de date
e....
minimal, se pot utiliza atributele specificate de RDFa Lite
resource – indică un identificator de resursă (subiectul)
desp...
minimal, se pot utiliza atributele specificate de RDFa Lite
prefix – desemnează un vocabular specific
e.g., rdf pentru RDF...
minimal, se pot utiliza atributele specificate de RDFa Lite
prefix – desemnează un vocabular specific
e.g., rdf pentru RDF...
<p vocab="http://schema.org/" typeof="Person"
resource="#tux">
Salut, eu sunt
<span property="name">Tuxy Pinguinescu</span...
<div vocab="http://xmlns.com/foaf/0.1">
<div resource="#busaco" typeof="Person">
<a property="url" href="http://purl.org/n...
date adnotate
semantic via RDFa

triplele RDF extrase

http://rdfa.info/play/
un instrument Web de editare și vizualizare ...
graful RDF
corespunzător
Dr. Sabin Buragawww.purl.org/net/busaco
Dr. Sabin Buragawww.purl.org/net/busaco

Exemplu: specificarea “punctajului” dat unei resurse
(adnotare semantică via rev...
Dr. Sabin Buragawww.purl.org/net/busaco

rdf: utilizari

corelarea și accesarea cunoștințelor
despre e-commerce via RDF –...
Dr. Sabin Buragawww.purl.org/net/busaco

<div typeof="gr:Offering" about="#fabulous-offer">
<div rev="gr:offers" resource...
exemplificări:
BestBuy, CheapToTravel, Magento Shop, O’Reilly Media,
Overstock, ProductDB, Yahoo! Real Estate

Dr. Sabin B...
acces la date structurate, nu doar la conținut textual

http://rdfa.info/
diverse biblioteci: http://rdfa.info/dev/

Dr. ...
Dr. Sabin Buragawww.purl.org/net/busaco

Există o serie de studii de caz
privitoare la RDFa?
abordare WYSISYG (What You See Is What You Get)
generează reprezentări RDFa – inclusiv rNews

recurge la API-uri de adnota...
Dr. Sabin Buragawww.purl.org/net/busaco

Generarea de constructii RDFa
pe baza editorului on-line RDFaCE

A. Khalili, S. ...
<li about="/issues/59939" typeof="g:Issue" property="g:hasPublicationDate"
content="2011-10-14" rel="g:hasNotice"><a href=...
extragerea de triple RDF din construcții RDFa
via instrumentul RADiFy – http://code.google.com/p/radify/
(în acest caz, se...
Dr. Sabin Buragawww.purl.org/net/busaco

vizualizarea triplelor RDF incluse într-un document HTML
cu extensia Green Turtl...
Dr. Sabin Buragawww.purl.org/net/busaco

recomandări de resurse pe baza marcajelor RDFa Lite
extensia RuleTheWeb pentru F...
model de date pentru includerea de meta-date
din domeniul publicațiilor
(e.g., știri, articole, periodice) în documentele ...
pe bazează pe microdate HTML5 și/sau RDFa

Dr. Sabin Buragawww.purl.org/net/busaco

rNews

detalii în prezentarea E. Sand...
Dr. Sabin Buragawww.purl.org/net/busaco

Microformatele, microdatele HTML5 și aserțiunile RDF(a)
sunt indexate de motoare...
Microformatele pot fi exprimate
via microdate HTML care, la rândul lor,
pot avea asociate construcții RDF(a)

Dr. Sabin Bu...
Cel mai expresiv – general – model este RDF(a)

Dr. Sabin Buragawww.purl.org/net/busaco

microformate↔microformate↔RDFa
<!-- microdate HTML5 -->
<div itemscope itemtype="http://schema.org/Person">
<p>Nume: <span itemprop="name">Sabin Buraga</...
modelarea unui eveniment via microdate HTML5,
pe baza schemelor de date oferite de schema.org
(Jeni Tennison, 2011)

Dr. S...
</2011/oscon/> a
s:url
s:name
s:location
s:startDate
s:endDate
</places/portland/> a
s:url
s:name

s:Event ,
s:SocialEvent...
"http://schema.org/Event",
"http://lanyrd.com/2011/oscon/",
{
[ "http://lanyrd.com/2011/oscon/" ],
[ "OSCON 2011" ],
[
"ht...
proiect realizat de Ionuț-Cosmin Atomei (absolvent FII, 2013)

Dr. Sabin Buragawww.purl.org/net/busaco

vizualizarea date...
Dr. Sabin Buragawww.purl.org/net/busaco

extragere & export de microformate, microdate HTML5
și RDFa cu extensia POSHex –...
Alte resurse de interes privind modelarea și procesarea
datelor structurate disponibile pe Web
sunt disponibile la
http://...
Dr. Sabin Buragawww.purl.org/net/busaco

rezumat

modelarea (meta-)datelor în cadrul paginilor Web
Upcoming SlideShare
Loading in …5
×

Dezvoltarea aplicațiilor Web (supliment): Modelarea datelor în HTML: microformate, scheme de microdate HTML5 şi RDFa

586 views

Published on

Dezvoltarea aplicațiilor Web (supliment) — detalii la http://profs.info.uaic.ro/~busaco/teach/courses/wade/web-film.html

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
586
On SlideShare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
5
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Dezvoltarea aplicațiilor Web (supliment): Modelarea datelor în HTML: microformate, scheme de microdate HTML5 şi RDFa

  1. 1. Dr. Sabin Buragawww.purl.org/net/busaco Dezvoltarea aplicațiilor Web date structurate în cadrul documentelor HTML microformate, microdate HTML5 & RDFa
  2. 2. Albert Einstein Dr. Sabin Buragawww.purl.org/net/busaco “Imaginația este mai importantă ca erudiția.”
  3. 3. Dr. Sabin Buragawww.purl.org/net/busaco Constatare clientul care consumă (accesează) reprezentări de resurse Web nu trebuie obligatoriu să fie uman
  4. 4. Dr. Sabin Buragawww.purl.org/net/busaco Cum am putea descrie conținutul resurselor Web astfel încât să poată fi procesat “inteligent”?
  5. 5. Dr. Sabin Buragawww.purl.org/net/busaco Idee: specificarea unor meta-date (date privind datele) direct în cadrul documentelor HTML
  6. 6. soluții: microformate scheme de microdate HTML5 RDFa Dr. Sabin Buragawww.purl.org/net/busaco Idee: specificarea unor meta-date (date privind datele) direct în cadrul documentelor HTML
  7. 7. (Tantek Çelik & Kevin Marks, 2004) www.microformats.org Dr. Sabin Buragawww.purl.org/net/busaco Microformate
  8. 8. utilizarea de marcaje (X)HTML pentru a desemna semantica și/sau structura conținutului Dr. Sabin Buragawww.purl.org/net/busaco Microformate
  9. 9. utilizarea de marcaje (X)HTML pentru a desemna semantica și/sau structura conținutului “curentul” POSH (Plain Old Semantic HTML) Dr. Sabin Buragawww.purl.org/net/busaco Microformate
  10. 10. reutilizarea unor vocabulare de termeni, disponibile liber și standardizate Dr. Sabin Buragawww.purl.org/net/busaco Microformate
  11. 11. reutilizarea unor vocabulare de termeni, disponibile liber și standardizate realizarea de adnotări semantice direct în HTML și alte limbaje similare prelucrare mai faciltă a reprezentărilor resurselor Dr. Sabin Buragawww.purl.org/net/busaco Microformate
  12. 12. “clase” CSS pentru prezentare și asocierea de descrieri ale meta-datelor structurarea paginilor Web: precizarea înțelesului (semanticii) conținutului Dr. Sabin Buragawww.purl.org/net/busaco marcaje HTML (<div>, <span>) pentru specificarea datelor & structurii lor
  13. 13. elementare (desemnează o singură caracteristică) + compuse (specifică mai multe proprietăți care modelează un aspect de interes – e.g., un concept: persoană, eveniment,…) Dr. Sabin Buragawww.purl.org/net/busaco Microformate
  14. 14. asociază unei legături hipertext un termen (tag) – cuvânt-cheie ori subiect – ales liber de autor (tagging content) Dr. Sabin Buragawww.purl.org/net/busaco rel-tag
  15. 15. <a href="http://technorati.com/tag/fish" rel="tag">fish</a> <a href="http://en.wikipedia.com/wiki/UNIX" rel="tag" class="skill">UNIX</a> <a href="http://flickr.com/photos/tags/Penguin" rel="tag"> <img src="tux.jpg" alt="Foto cu un pinguin" /></a> Dr. Sabin Buragawww.purl.org/net/busaco rel-tag
  16. 16. relații între “prieteni”: colaboratori, rude, cunoscuți,… <a href="http://www.infoiasi.ro/~dlucanu/" rel="met, colleague, co-worker, neighbor"> Dorel Lucanu</a> Dr. Sabin Buragawww.purl.org/net/busaco XFN (XHTML Friend Network)
  17. 17. Dr. Sabin Buragawww.purl.org/net/busaco recurgerea la XFN în cadrul sistemului WordPress
  18. 18. desemnează evenimente & orare vezi formatul iCalendar – RFC 2445 Dr. Sabin Buragawww.purl.org/net/busaco hCalendar
  19. 19. <div class="vevent"> <a class="url" href="http://profs.info.uaic.ro/~web/2007/"> <abbr class="dtstart" title="20061117">November 17</abbr> -<abbr class="dtend" title="20061118">18, 2006</abbr> <span class="summary">Summer Web 2007</span> la <span class="location">Sala Romtelecom</span></a> <div class="description">Se anunță ediția a VII-a a workshop-ului dedicat tehnologiilor Web!</div> </div> Dr. Sabin Buragawww.purl.org/net/busaco hCalendar
  20. 20. informații de contact despre persoane, organizații etc. în conformitate cu formatul vCard – RFC 2426 Dr. Sabin Buragawww.purl.org/net/busaco hCard
  21. 21. Dr. Sabin Buragawww.purl.org/net/busaco specificarea informațiilor despre o persoană via hCard
  22. 22. modelează informații despre un CV folosit în conjuncție cu hCard și hCalendar Dr. Sabin Buragawww.purl.org/net/busaco hResume
  23. 23. desemnează opinii emise despre „ceva” (produs, locație, eveniment, persoană,…) Dr. Sabin Buragawww.purl.org/net/busaco hReview
  24. 24. Dr. Sabin Buragawww.purl.org/net/busaco <div class="hreview"> <!-- resursa recenzată --> <h1 class="item">Recenzie despre <a class="fn url" title="Situl FII" href="http://www.info.uaic.ro/">situl Web al FII</a></h1> <p> <!-- 'punctajul' obținut (5 din 5), sumarul & data recenziei --> <abbr class="rating stars" title="5">* * * * *</abbr> <span class="summary title">Modern</span>, <abbr class="dtreviewed" title="20100518T224500">18 mai</abbr> </p> <!-- autorul recenziei marcat prin hCard --> <p class="reviewer">Autor al recenziei: <span class="vcard"> <a class="url fn n" href="http://www.purl.org/net/busaco" title="Spre situl Web al lui Sabin Buraga"> <span class="given-name">Sabin</span> <span class="family-name">Buraga</span></a></span></p> <div class="description"> <!-- detalii despre recenzie --> </div> </div>
  25. 25. definește coordonatele geografice ale unui loc Dr. Sabin Buragawww.purl.org/net/busaco geo
  26. 26. Dr. Sabin Buragawww.purl.org/net/busaco
  27. 27. simplifică maniera de specificare (2012) http://microformats.org/wiki/microformats2 Dr. Sabin Buragawww.purl.org/net/busaco Microformate 2
  28. 28. vocabularele sunt definite pe baza unor prefixe hpudte- includerea unui microformat specificarea unei proprietăți simple desemnarea unui URL definirea de valori privind data & timpul specificarea de proprietăți compuse Dr. Sabin Buragawww.purl.org/net/busaco Microformate 2
  29. 29. exemplu concret de utilizare a microformatului hCard (în ambele versiuni) preluat de la https://webfwd.org/about/experts/ Dr. Sabin Buragawww.purl.org/net/busaco <div class="h-card vcard"> <img src="/content/content_about-experts/brendaneich.jpg" alt="Brendan Eich"> <h5><a href="http://brendaneich.com/" class="p-name fn u-url url">Brendan Eich</a></h5> <p class="p-note note"> Created JavaScript, co-founded the mozilla.org project…</p> <span class="p-category category">Technology</span> </div>
  30. 30. vocabulare predefinite (în stadiu de ciornă): h-adr h-geo h-resume h-card h-item h-review h-entry h-event h-product h-recipe h-review-aggregate Dr. Sabin Buragawww.purl.org/net/busaco Microformate 2
  31. 31. Dr. Sabin Buragawww.purl.org/net/busaco <!-- specificarea unui eveniment via microformate versiunea 2 --> <section class="h-event"> <a class="p-name u-url" href="http://potop.info/2013/"> Potop – ediția 2013</a> de la <time class="dt-start">2013-10-28</time> până la <time class="dt-end">2013-11-01</time>, fiind organizat la <span class="p-location h-card"> <a class="p-name p-org u-url" href="http://www.info.uaic.ro/"> Facultatea de Informatică</a>, <span class="p-street-address">Strada Berthelot, 16</span>, <span class="p-locality">Iași</span>, <abbr class="p-region" title="Iași">IS</abbr> </span> </section>
  32. 32. } "items": [ { "type": [ "h-event" ], "properties": { "name": [ "Potop – ediția 2013" ], "url": [ "http://potop.info/2013/" ], "start": [ "2013-10-28" ], "end": [ "2013-11-01" ], "location": [ { "value": "Strada Berthelot, 16, Iași, IS", "type": [ "h-card" ], "properties": { "name": [ "Facultatea de Informatică" ], "org": [ "Facultatea de Informatică" ], "url": [ "http://www.info.uaic.ro/" ], "street-address": [ "Strada Berthelot, 16" ], "locality": [ "Iași" ], "region": ["Iași" ] } aceleași date în format JSON }] } rezultate în urma procesării }] marcajelor HTML Dr. Sabin Buragawww.purl.org/net/busaco {
  33. 33. Apple Google Intel Last.fm Six Apart Yahoo! XWiki și multe altele detalii la http://microformats.org/wiki/implementors Dr. Sabin Buragawww.purl.org/net/busaco microformate: utilizări
  34. 34. Desigur, putem definite microformate proprii: hLocation – referențierea (în termeni fuzzy) a locațiilor (S. Dumitriu, M. Gîrdea & S. Buraga, 2007) hMusic – specificarea datelor privind producții muzicale (S. Buraga, 2008) Dr. Sabin Buragawww.purl.org/net/busaco microformate: utilizări
  35. 35. Dr. Sabin Buragawww.purl.org/net/busaco microformate: utilizări detectarea și exportul de microformate cu extensia Operator pentru Firefox
  36. 36. alternativă la microformate specificație W3C în stadiu de ciornă (octombrie 2012) www.w3.org/TR/microdata/ Dr. Sabin Buragawww.purl.org/net/busaco Microdata HTML 5
  37. 37. posibilitatea de a specifica perechi de proprietăți (nume, valoare) “scufundate” în HTML Dr. Sabin Buragawww.purl.org/net/busaco Microdata HTML 5
  38. 38. grupurile de perechi de proprietăți nume—valoare sunt denumite items Dr. Sabin Buragawww.purl.org/net/busaco Microdata HTML 5
  39. 39. grupurile de perechi de proprietăți nume—valoare sunt denumite items creare via atributul itemscope specificarea unei proprietăți prin atributul itemprop referire cu ajutorul atributului itemref Dr. Sabin Buragawww.purl.org/net/busaco Microdata HTML 5
  40. 40. grupurile de perechi de proprietăți nume—valoare sunt denumite items asocierea unui tip de date se face cu atributul itemtype pentru identificarea unui item se folosește itemid Dr. Sabin Buragawww.purl.org/net/busaco Microdata HTML 5
  41. 41. ca tipuri de date se pot folosi microformatele Dr. Sabin Buragawww.purl.org/net/busaco Microdata HTML 5
  42. 42. Dr. Sabin Buragawww.purl.org/net/busaco <section itemscope itemtype="http://microformats.org/profile/hcard"> <h1 itemprop="fn"> <span itemprop="n" itemscope> <span itemprop="given-name">Tuxy</span> <span itemprop="family-name">Pinguinescu</span> </span> </h1> <img itemprop="photo" alt="Portretul lui Tux" src="tux.jpg"> <p itemprop="org" itemscope> <span itemprop="organization-name">Linux</span></p> <h2>Detalii & contact:</h2> <ul> <li><a itemprop="url" href="http://en.wikipedia.org/wiki/Tux"> Wikipedia</a></li> <li itemprop="email"><a href="mailto:tux@penguin.org"> tux AT penguin.org</a></li> </ul> <address><span itemprop="adr" itemscope> <span itemprop="street-address">Penguins Blv., 33</span> <span itemprop="locality">Penguin City</span>, <span itemprop="postal-code">740033</span> </span> </address> </section>
  43. 43. Dr. Sabin Buragawww.purl.org/net/busaco Există o serie de modele de date (exprimate via microformate sau microdate) ce pot fi indexate și folosite de actualele motoare de căutare?
  44. 44. colecție de vocabulare (scheme de date) – e.g., Book, Event, LocalBusiness, Movie, Offer, Person, Place, Recipe, Review, TVSeries,… – recunoscute și indexate de roboții principalelor motoare de căutare Bing, Google, Yahoo!, Yandex Dr. Sabin Buragawww.purl.org/net/busaco schema.org
  45. 45. Dr. Sabin Buragawww.purl.org/net/busaco a se studia și http://www.w3.org/wiki/WebSchemas
  46. 46. Dr. Sabin Buragawww.purl.org/net/busaco <body itemscope itemtype="http://schema.org/WebPage"> <header> <h1 itemprop="name"> <a href="index.html" title="…">Dezvoltarea aplicațiilor Web</a> </h1> <p class="slogan" itemprop="description">prezentările aferente cursului</p> </header> <article> <!– conținut propriu-zis --> specificarea faptului că Sabin Buraga </article> este o persoană <footer> <h6> <span itemscope itemtype="http://schema.org/Person"> <a href="http://www.purl.org/net/busaco" title="…" itemprop="url" accesskey="S"> <span itemprop="name">Sabin Buraga</span> </a> </span> </h6> </footer> </body> recurgerea la elemente structurale și scheme de microdate HTML5
  47. 47. <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> Dr. Sabin Buragawww.purl.org/net/busaco <div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating"> <span itemprop="ratingValue">74</span> din <span itemprop="bestRating">100</span> de puncte pe 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 groază pentru toți, acum cu paiete</a> </div> </div> </div>
  48. 48. adnotarea semantică via microdate HTML5 a datelor în contextul interacțiunii om-calculator persona & teste de utilizabilitate (Ștefan Negru & Sabin Buraga, 2012) http://blankdots.com/open/schema/ Dr. Sabin Buragawww.purl.org/net/busaco Studiu de caz:
  49. 49. Dr. Sabin Buragawww.purl.org/net/busaco
  50. 50. Dr. Sabin Buragawww.purl.org/net/busaco <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-23">23 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>
  51. 51. Dr. Sabin Buragawww.purl.org/net/busaco extragerea/verificarea de date structurate via Structured Data Testing Tool http://www.google.com/webmasters/tools/richsnippets
  52. 52. Dr. Sabin Buragawww.purl.org/net/busaco Alte resurse de interes, inclusiv instrumente de validare și conversie, sunt oferite de situl Web http://getschema.org/
  53. 53. Dr. Sabin Buragawww.purl.org/net/busaco Folosind modelul RDF (subiect, predicat, obiect), n-am putea include triplele RDF în paginile Web?
  54. 54. reprezintă un alt format de serializare a modelului RDF RDF + HTML = RDFa Dr. Sabin Buragawww.purl.org/net/busaco Specificarea construcțiilor RDF direct în (X)HTML RDFa
  55. 55. recomandări ale Consorțiului Web RDFa 1.0 (2008) RDFa 1.1 (2012 – prima ediție; 2013 – a doua ediție) www.w3.org/TR/rdfa-core Dr. Sabin Buragawww.purl.org/net/busaco RDFa
  56. 56. “punte” între Web-ul social și Web-ul datelor www.w3.org/TR/rdfa-primer/ Dr. Sabin Buragawww.purl.org/net/busaco RDFa
  57. 57. utilizarea unor atribute HTML specifice menite a modela datele disponibile într-o pagină Web în vederea procesării acestora de către un program Dr. Sabin Buragawww.purl.org/net/busaco RDFa
  58. 58. minimal, se pot utiliza atributele specificate de RDFa Lite www.w3.org/TR/rdfa-lite/ Dr. Sabin Buragawww.purl.org/net/busaco RDFa
  59. 59. minimal, se pot utiliza atributele specificate de RDFa Lite vocab – precizează URL-ul vocabularului de date folosit exemplificări: http://schema.org/ http://open.vocab.org/terms/ Dr. Sabin Buragawww.purl.org/net/busaco RDFa
  60. 60. minimal, se pot utiliza atributele specificate de RDFa Lite typeof – desemnează un tip de date (clasă de „lucruri”) de exemplu: Event, Person, Product etc. Dr. Sabin Buragawww.purl.org/net/busaco RDFa
  61. 61. minimal, se pot utiliza atributele specificate de RDFa Lite property – specifică o proprietate asociată tipului de date e.g., pentru tipul Event sunt definite proprietățile duration, location, startDate, endDate, performers,… (conform http://schema.org/Event) Dr. Sabin Buragawww.purl.org/net/busaco RDFa
  62. 62. minimal, se pot utiliza atributele specificate de RDFa Lite resource – indică un identificator de resursă (subiectul) despre care se “vorbește” în termeni de meta-date Dr. Sabin Buragawww.purl.org/net/busaco RDFa
  63. 63. minimal, se pot utiliza atributele specificate de RDFa Lite prefix – desemnează un vocabular specific e.g., rdf pentru RDF, rdfa – RDFa, xsd – XML Schema Dr. Sabin Buragawww.purl.org/net/busaco RDFa
  64. 64. minimal, se pot utiliza atributele specificate de RDFa Lite prefix – desemnează un vocabular specific e.g., rdf pentru RDF, rdfa – RDFa, xsd – XML Schema lista prefixelor predefinite: www.w3.org/2011/rdfa-context/rdfa-1.1 Dr. Sabin Buragawww.purl.org/net/busaco RDFa
  65. 65. <p vocab="http://schema.org/" typeof="Person" resource="#tux"> Salut, eu sunt <span property="name">Tuxy Pinguinescu</span> și vă invit să vizitați <a property="url" href="http://tux.info/">situl meu</a>. </p> Dr. Sabin Buragawww.purl.org/net/busaco Exemplu recurgând la vocabularul schema.org adaptare după (Manu Sporny, 2012)
  66. 66. <div vocab="http://xmlns.com/foaf/0.1"> <div resource="#busaco" typeof="Person"> <a property="url" href="http://purl.org/net/busaco"> <span property="name">Sabin Buraga</span></a> îi are drept cunoscuți pe <a property="knows" href="#alecsandru">Alecsandru</a> și <a property="knows" href="#blankdots">Ștefan</a>. </div> <p resource="#alecsandru" typeof="Person"> <span property="name">Alecsandru Grigoriu</span></a> </p> … </div> Dr. Sabin Buragawww.purl.org/net/busaco Exemplu: modelarea grafului social al unui utilizator pe baza vocabularului FOAF (Friend Of A Friend)
  67. 67. date adnotate semantic via RDFa triplele RDF extrase http://rdfa.info/play/ un instrument Web de editare și vizualizare a construcțiilor RDFa Dr. Sabin Buragawww.purl.org/net/busaco redarea conținutului marcat
  68. 68. graful RDF corespunzător Dr. Sabin Buragawww.purl.org/net/busaco
  69. 69. Dr. Sabin Buragawww.purl.org/net/busaco Exemplu: specificarea “punctajului” dat unei resurse (adnotare semantică via review vocabulary de la Google) <div xmlns:v="http://rdf.data-vocabulary.org/#" typeof="v:Review"> <span rel="v:itemreviewed"> <span about="urn:ISBN:978-973-46-0249-0" typeof="bib:book"> Titlu: <span property="v:name" xml:lang="ro">Tehnologii XML</span> </span> </span> Evaluare: <span property="v:rating" content="5">*****</span> <span property="v:summary">…</span> </div>
  70. 70. Dr. Sabin Buragawww.purl.org/net/busaco rdf: utilizari corelarea și accesarea cunoștințelor despre e-commerce via RDF – @kidehen & @mfhepp (2010)
  71. 71. Dr. Sabin Buragawww.purl.org/net/busaco <div typeof="gr:Offering" about="#fabulous-offer"> <div rev="gr:offers" resource="http://www.undeva.biz#business"> <span property="gr:validFrom" datatype="xsd:dateTime" content="2012-11-20T00:00:00Z"></span> <span property="gr:validThrough" datatype="xsd:dateTime" content="2013-11-20T00:00:00Z"></span> </div> <div rel="gr:hasPriceSpecification"> <span typeof="gr:UnitPriceSpecification" about="#UnitPriceSpec"> Pret: <span property="gr:hasCurrencyValue" datatype="xsd:float"> 33.33</span> <span property="gr:hasCurrency" datatype="xsd:string">Euro</span> </span> </div> <a rel="product:specification" href="http://undeva.biz/product#spec">Specificațiile produsului</a> </div> modelarea în RDFa a unei oferte de e-business pe baza Good Relations – după Martin Hepp (2009)
  72. 72. exemplificări: BestBuy, CheapToTravel, Magento Shop, O’Reilly Media, Overstock, ProductDB, Yahoo! Real Estate Dr. Sabin Buragawww.purl.org/net/busaco O listă a siturilor/aplicațiilor care recurg la adnotări semantice RDFa referitoare la produse via Good Relations poate fi consultată la http://notes.3kbo.com/goodrelations-sites
  73. 73. acces la date structurate, nu doar la conținut textual http://rdfa.info/ diverse biblioteci: http://rdfa.info/dev/ Dr. Sabin Buragawww.purl.org/net/busaco RDFa transformă o pagină Web într-un API
  74. 74. Dr. Sabin Buragawww.purl.org/net/busaco Există o serie de studii de caz privitoare la RDFa?
  75. 75. abordare WYSISYG (What You See Is What You Get) generează reprezentări RDFa – inclusiv rNews recurge la API-uri de adnotare a conținutului textual (e.g., Alchemy, Open Calais, Ontos, DBpedia) disponibil și ca extensie pentru WordPress http://aksw.org/Projects/RDFaCE.html Dr. Sabin Buragawww.purl.org/net/busaco Generarea de construcții RDFa pe baza editorului on-line RDFaCE
  76. 76. Dr. Sabin Buragawww.purl.org/net/busaco Generarea de constructii RDFa pe baza editorului on-line RDFaCE A. Khalili, S. Auer & D. Hladky (2012)
  77. 77. <li about="/issues/59939" typeof="g:Issue" property="g:hasPublicationDate" content="2011-10-14" rel="g:hasNotice"><a href="/issues/59939/notices/1457466/…" about="/issues/59939/notices/1457466" typeof="g:Notice">…</a></li> Dr. Sabin Buragawww.purl.org/net/busaco rdf: utilizari – rdfa inspectarea construcțiilor RDFa din cadrul unui document HTML via RDFa Highlight bookmarklet
  78. 78. extragerea de triple RDF din construcții RDFa via instrumentul RADiFy – http://code.google.com/p/radify/ (în acest caz, se folosesc vocabulare ca FOAF și Good Relations) Dr. Sabin Buragawww.purl.org/net/busaco <#offering> gr:name "Ty Pennington Style Mayfield 4 Pc. Deep Seating Set" <#offering> gr:hasCurrency "USD" <#offering> gr:hasCurrencyValue "849.99"
  79. 79. Dr. Sabin Buragawww.purl.org/net/busaco vizualizarea triplelor RDF incluse într-un document HTML cu extensia Green Turtle RDFa pentru Chrome aici se recurge la Open Graph Protocol – http://opengraphprotocol.org/
  80. 80. Dr. Sabin Buragawww.purl.org/net/busaco recomandări de resurse pe baza marcajelor RDFa Lite extensia RuleTheWeb pentru Firefox http://ruletheweb.org/
  81. 81. model de date pentru includerea de meta-date din domeniul publicațiilor (e.g., știri, articole, periodice) în documentele HTML standard IPTC (International Press Telecommunications Council) – octombrie 2011 rnews.org Dr. Sabin Buragawww.purl.org/net/busaco rNews
  82. 82. pe bazează pe microdate HTML5 și/sau RDFa Dr. Sabin Buragawww.purl.org/net/busaco rNews detalii în prezentarea E. Sandhaus, S. Myles & A. Gebhard, “The State of rNews”, Semantic Technology & Business Conference, San Francisco (2012) https://speakerdeck.com/u/agebhard/p/the-state-of-rnews
  83. 83. Dr. Sabin Buragawww.purl.org/net/busaco Microformatele, microdatele HTML5 și aserțiunile RDF(a) sunt indexate de motoarele de căutare Bing – http://tinyurl.com/b9mx2f2 Google rich snippets – http://tinyurl.com/3c6naq7 Yahoo! BOSS (Build your Own Search Service) http://developer.yahoo.com/search/boss/
  84. 84. Microformatele pot fi exprimate via microdate HTML care, la rândul lor, pot avea asociate construcții RDF(a) Dr. Sabin Buragawww.purl.org/net/busaco microformate↔microformate↔RDFa
  85. 85. Cel mai expresiv – general – model este RDF(a) Dr. Sabin Buragawww.purl.org/net/busaco microformate↔microformate↔RDFa
  86. 86. <!-- microdate HTML5 --> <div itemscope itemtype="http://schema.org/Person"> <p>Nume: <span itemprop="name">Sabin Buraga</span></p> <p>Titlu academic: <span itemprop="title">Dr.</span></p> </div> <!-- aceleași construcții exprimate via RDFa --> <div xmlns:v="http://rdf.data-vocabulary.org/#" typeof="v:Person"> <p>Nume: <span property="v:name">Sabin Buraga</span></p> <p>Titlu academic: <span property="v:title">Dr.</span></p> </div> adaptare după Marco Lisci & Luisa Scarlata (2011) Dr. Sabin Buragawww.purl.org/net/busaco <!-- microformate (utilizarea microformatului hCard) --> <div class="vcard"> <p>Nume: <span class="fn">Sabin Buraga</span></p> <p>Titlu academic: <span class="title">Dr.</span></p> </div>
  87. 87. modelarea unui eveniment via microdate HTML5, pe baza schemelor de date oferite de schema.org (Jeni Tennison, 2011) Dr. Sabin Buragawww.purl.org/net/busaco <li class="conference" itemscope itemid="/2011/oscon/" itemtype="http://schema.org/Event" itemclass="SocialEvent BusinessEvent EducationEvent"> <h2><a itemprop="url" href="/2011/oscon/"> <span itemprop="name">OSCON 2011</span></a></h2> <p itemprop="location" itemscope itemid="/places/portland/" itemtype="http://schema.org/Place"> <span itemprop="name"><a href="/places/usa/">USA</a> / <a itemprop="url" href="/places/portland/">Portland</a></span></p> <p class="date"> <time itemprop="startDate" datetime="2011-07-25">25</time> – <time itemprop="endDate" datetime="2011-07-29">29 iulie</time> </p> ... </li>
  88. 88. </2011/oscon/> a s:url s:name s:location s:startDate s:endDate </places/portland/> a s:url s:name s:Event , s:SocialEvent , s:BusinessEvent , s:EducationEvent ; <http://lanyrd.com/2011/oscon/> ; "OSCON 2011" ; </places/portland/> ; "2011-07-25"^^xsd:date ; "2011-07-29"^^xsd:date . s:Place ; <http://lanyrd.com/places/portland/> ; "United States / Portland" . construcțiile RDF echivalente pe baza asocierilor (mappings) realizate – Jeni Tennison, 2011 Dr. Sabin Buragawww.purl.org/net/busaco @prefix s: <http://schema.org/>
  89. 89. "http://schema.org/Event", "http://lanyrd.com/2011/oscon/", { [ "http://lanyrd.com/2011/oscon/" ], [ "OSCON 2011" ], [ "http://schema.org/Place", "http://lanyrd.com/places/portland/", : { : [ "United States / Portland" ], : [ "http://lanyrd.com/places/portland/" ] } : : [ "2011-07-25" ], [ "2011-07-29" ] Dr. Sabin Buragawww.purl.org/net/busaco { "type" : "id" : "properties" : "url" : "name" : "location" : { "type" : "id" : "properties" "name" "url" } ], "startDate" "endDate" } } modelul de date exprimat în JSON (accesat via un serviciu Web respectând paradigma REST)
  90. 90. proiect realizat de Ionuț-Cosmin Atomei (absolvent FII, 2013) Dr. Sabin Buragawww.purl.org/net/busaco vizualizarea datelor structurate cu SmartWebBrowser
  91. 91. Dr. Sabin Buragawww.purl.org/net/busaco extragere & export de microformate, microdate HTML5 și RDFa cu extensia POSHex – Tiberiu Pasat (2013) http://students.info.uaic.ro/~constantin.pasat/wad/
  92. 92. Alte resurse de interes privind modelarea și procesarea datelor structurate disponibile pe Web sunt disponibile la http://structured-data.org/ Dr. Sabin Buragawww.purl.org/net/busaco microformate↔microformate↔RDFa
  93. 93. Dr. Sabin Buragawww.purl.org/net/busaco rezumat modelarea (meta-)datelor în cadrul paginilor Web

×