Interacting with Linked Data via semantically annotated widgets

ϕArmin Haller | δTudor Groza | ξFlorian Rosenberg
Interacting with Linked Data via
Semantically Annotated Widgets
Joint International Semantic Technology Conference

ϕCSIRO ICT Centre, Australia|W3C Australia
δQueensland University, Australia

ξIBM T.J. Watson, NY, USA

A little motivation for the work…
… why interacting with the Linked
data Web?

Linked data Web
Building a Web of Data …

… four principles
Publishing, interlinking data in RDF
via de-referenceable URIs

Publishing RDF
Two (standardised) serialization
formats to publish RDF (graphs)
1. RDF/XML
2. RDFa

RDF/XML
Widely used to publish linked data

All benefits of XML, but …
… syntax difficult for humans to read
and write
… additional to HTML
… needs full control over publishing
infrastructure (Rewrites etc.)

RDFa
Relatively new format, but used by
already 5% of web sites

Interwoven within the HTML DOM …
… existing content within the page
can be marked up with RDFa
… no additional control over
publishing infrastructure needed

RDFa example
Simple page about a book
<html>
<head>
<title>The Art of Computer Programming, Volume 1:
Fundamental Algorithms</title>
</head>
<body>
<div><img src="theartofprogramming.jpg" /></div>
<div>Donald E. Knuth</div>
<div>Edition 3</div>
<div>Addison-Wesley Professional</div>
<div>672 pages</div>
<div>ISBN-10: 0201896834</div>
</body>
</html>

RDFa example
Simple page about a book
<html>
<head prefix="dc: http://purl.org/dc/terms/“
base="http://example.org/book/TAoCP>
<title about="" property="dc:title">The Art of
Computer Programming, Volume 1: Fundamental
Algorithms</title>
</head>
<body>
<div about="">
<div><img src="theartofprogramming.jpg" /></div>
<div property="dc:creator">Donald E. Knuth</div>
<div>Edition 3</div>
<div property="dc:publisher">Addison-Wesley
Professional</div>
<div property="dc:SizeOrDuration">672 pages</div>
<div property="dc:identifier">ISBN-10:
0201896834</div>
</div>
</body>
</html>

Embedded triples
@prefix dc: <http://purl.org/dc/terms/> .
@prefix : <http://example.org/book/> .

:TAoCP dc:title "Art of Computer Programming, Volume 1: Fundamental Algorithms" .

:TAoCP dc:creator "Donald E. Knuth" .

:TAoCP dc:publisher "Addison-Wesley Professional" .

:TAoCP dc:SizeOrDuration ”672 pages" .

:TAoCP dc:identifier "ISBN-10: 0201896834" .

RDFa – provider vs. user content
RDFa only usable for provider created
content

Ideally, all user input data should be
part of the RDF graph, …
… currently no mechanism in RDFa
to type user created content (within
the DOM)

Example user created content in Web forms
e.g. Buy a TV online (e.g. Amazon, Ebay)
First Name: Jane
Last Name: Doe

Email: jane.doe@example.com

Password: ********
Gender: Male Female
Birthday: 03 04 1976

First Name: Jane
Last Name: Doe


Password: ********
Gender: Male Category:
Female
Female LCD Television

Birthday: 03 04 Product1976
1976 Name: Sony Bravia LX9000
Description: Your complete 3D
experience from Sony
Price: 1500 USD

Amount 1
Delivery 10 Downing Street
Address:
London
SW1A 2AA
United Kingdom

First Name: Jane
Last Name: Doe


Password: ********
Gender: Male Category:
Female
Female LCD Television

Birthday: 03 04 Product1976
1976 Name: Sony Bravia LX9000
Description: Your complete 3D
Price: Price:
1500 USD 25 GBP
Type: Mastercard
Amount 1
Delivery Cardholder:
1
04 1976 Jane Doe
10 Downing Street
Address: CC Number: 5999 9999 9999 9999
London
SW1A 2AAExpiry Date: 04 13
CVV:
United Kingdom 999

No annotation for user created content
Form input elements can be annotated
with RDFa …
… but, RDFa annotations for input data
are not possible no binding
mechanism in RDFa

No annotation for user created content (cont’d)
Provider content vs. User created content

Category:
Female LCD Television Provider data | RDFa
Product1976 Sony Bravia LX9000
Name: Provider data | RDFa
Description: Your complete 3D Provider data | RDFa
Price: 1500 USD Provider data | RDFa
Amount 1 User data | Key/Value pair
Delivery 10 Downing Street User data | Key/Value pair
Address:
London User data | Key/Value pair
SW1A 2AA User data | Key/Value pair
United Kingdom User data | Key/Value pair

No annotation for user created content (cont’d)
e.g. “Jane” can not be defined as
foaf:firstName

First Name: Jane
Last Name: Doe


Password: ********
Gender: Male Female
Birthday: 03 04 1976

<div about="" property="foaf:firstName" content="">
<input type="text" name=“First Name" value="" />
</div>span>

No binding!

Publishing and Reusing user
created content on the Linked
Data Web!

Model and System for semantic Web applications
– RDF-based model for forms (RaUL)
http://purl.org/NET/raul#

– RESTful Web service (ActiveRaUL)
http://w3c.org.au/raul

– Client-side JavaScript RDFa API

ActiveRaUL system architecture

Controller:
Web service that maps HTTP terms to
CRUD operations on RaUL widgets

Model: View:
RaUL RDF model Rendering service to
serialise RaUL-based
widgets in
XHTML+RDFa

Usage Scenario
1. Form Modeling:
Model widgets (forms)
in RDF based on the
RaUL ontology
2. Form Deployment:
Submit form with
HTTP POST to
ActiveRaUL
3. Form Usage:
Access/Use a form
model with GET/POST
to ActiveRaUL

Form Modeling
• RDFa User Interface Language
(RaUL) Ontology for widget
(form) control elements
• Data binding mechanism to
reference external schemas for data
(e.g. foaf:firstname, gr:category)

RaUL Form Model
Widget (form) meta model

RaUL Form Model
– Triples defining the form structure

Category: LCD Television raul:textbox

Product Name: Sony Bravia LX9000 raul:textbox

Description: Your complete 3D raul:textbox

Price: 1500 USD raul:textbox/raul:listbox

Amount 1 raul:textbox

RaUL Form Model
– Triples defining the form input data

Category: LCD Television gr:category

Product Name: Sony Bravia LX9000 rdfs:label

Description: Your complete 3D rdfs:comment

Price: 1500 USD gr:currency/gr:hasUnitOfMeasurement

Amount 1 gr:amountOfThisGood

Form Deployment
• RESTful service for managing
Web widgets (forms)
• Maps HTTP verbs to SPARQL
queries on RaUL model
• Algorithm for generating widget models
from arbitrary RDF graphs
• Example: Form upload
POST /public/forms HTTP/1.1
Host: w3c.org.au/raul
Content-Type: application/xml
<rdf:…/>

Form Deployment
• RESTful service for managing
Web widgets (forms)
• Maps HTTP verbs to SPARQL
queries on RaUL model
• Algorithm for generating widget models
from arbitrary RDF graphs
• Example: Form upload

Created (201)
Location: http://w3c.org.au/raul/public/forms/add-product

Form Usage
1. Web user retrieves Web forms
(and content) using ActiveRaUL
(via browser)
2. ActiveRaUL returns web form in:
• RDF/XML, RDF/JSON
• HTML+RDFa view rendering

3. User fills out forms and
submits data to ActiveRaul

HTML+RDFa view rendering
<html>
<head>
<base href="#addProduct"/>
<meta property="raul:title" content="Add Product"/>
<title>Add Product</title>
</head>
<body>
…
<div xmlns=http://www.w3.org/1999/xhtml
about="http://w3c.org.au/forms/productAdd1#product" typeof="raul:Textbox">
<span property="raul:label">Product URI:</span>
<span style="display:none;">
<span property="raul:id">product</span>
<span property="raul:name">product</span>
<span property="raul:value">http://w3c.org.au/forms/productAdd1#value_product</span>
</span>
</div>
…
<div xmlns="http://www.w3.org/1999/xhtml" about="http://w3c.org.au/forms/productAdd1#product_name"
typeof="raul:Textbox">
<span property="raul:label">Product Name:</span>
<span style="display:none;">
<span property="raul:id">product_name</span>
<span property="raul:name">product_name</span>
<span property="raul:value">http://w3c.org.au/forms/productAdd1#value_product_name</span>
</span>
</div>
<div style="display:none;" about="http://w3c.org.au/forms/productAdd1#value_product_name">
<span xmlns="http://www.w3.org/1999/xhtml"
property="rdf:subject">http://w3c.org.au/forms/productAdd1#defaultSubject</span>
<span xmlns="http://www.w3.org/1999/xhtml" property="rdf:predicate">gr:name</span>
<span xmlns="http://www.w3.org/1999/xhtml" property="rdf:object"></span>
</div>

Form Usage
Data Reuse
• Link to existing, local data or data in the
Linked Data Web
– Client-side JS RDFa API can retrieve data directly
from URI or via Sindice and prefills form controls

Product:
Category:
Product Name:
Description:
Price: USD
Amount

Form Usage
Data Reuse
Linked Data Web
– Client JS API retrieves data directly from URI or via
Sindice and prefills form controls

Product: http://bestbuy.com/…

Category:
Product Name:
Description:
Price: USD
Amount

Form Usage
Data Reuse
Linked Data Web
– Client JS API retrieves data directly from URI or via
Sindice and prefills form controls

Product URI: http://bestbuy.com/…

Category: LCD Television
Product Name: Sony Bravia LX9000
Your complete 3D
Description: experience from Sony

Price: USD
Amount

Evaluation
Quantitative evaluation to analyse possible
performance issues of our approach

Performance of the ActiveRaUL framework is
influenced by two factors:
(i) overhead introduced by the RDFa annotations
(ii) performance of the widget/model generation

Evaluation - Overhead
• Comparison of request sizes for HTTP GET
requests and HTTP PUT/POST requests and
responses

Form XHTML XHTML + # of Triples Overhead in %
Element (in Byte) RDFa (Byte)
min max min max min max min max
Widget 72 115 251 376 3 6 248% 226%
Textbox 41 100 88 377 2 7 114% 277%
Listbox 49 125 228 459 5 9 365% 367%
Button 48 81 98 415 2 8 104% 412%

Evaluation - Overhead
• Comparison of request sizes for HTTP GET and
HTTP PUT/POST requests and response

Form XHTML XHTML + # of Triples Overhead in %
Element (in Byte) RDFa (Byte)
min max min max min max min max
Widget 278 321 525 617 3 6 89% 92%
Textbox 239 298 454 613 2 7 90% 105%
Listbox 274 323 656 758 5 9 139% 135%
Button 245 278 459 720 2 8 87% 159%

Evaluation – Overhead – Discussion

• Content overhead a result of using
RDFa for the annotation of the
semantic forms/widgets
• We talk about adding one/two digit
numbers of Kilobytes!
– Acceptable in most cases
– Common and accepted practice to add
RDFa to HTML

Evaluation – Performance of view generation
Measured time required to
generate an increasing number
(1, 10 and 100) of widget
elements
Results
• linear scalability for all
widget elements
• Listbox and Listitems, also
linear, but with a much
higher factor (100x10)
In reality (for usability reasons)
interesting ranges are between
10 and 30 widget elements

Conclusion
ActiveRaUL combines Web engineering with
principles of Linked Open Data/Semantic Web
• RDFa annotated Web forms
• well-defined publishing and usage lifecycle

Advantages:
(a) full machine understandable structured form data
(b) structured form data is encoded directly in the Web page
and usable to any SW application
(c) typing of the form data via reference to standard
ontologies
(d) automatic retrieval of form data from the Linked Data
Web, and
(e) fully browser agnostic approach (rendering in XHTML +
RDFa)

Interacting with Linked Data via semantically annotated widgets

Recommended

Recommended

More Related Content

Similar to Interacting with Linked Data via semantically annotated widgets

Similar to Interacting with Linked Data via semantically annotated widgets (20)

Recently uploaded

Recently uploaded (20)

Interacting with Linked Data via semantically annotated widgets