SPARQL Web Pages (SWP)
A text templating technology that makes it easy to build powerful and flexible web applications that interact with RDF data
SPARQL Web Pages are used for creating model-driven data services and transformations and for building user interfaces.
Services scripting in SWP is an alternative to using SPIN templates and SPARQLMotion when the required logic is too complex for a single query or a visual programming paradigm. Most SPARQLMotion modules can be used in SWP scripts. Just like SPARQLMotion, SWP services output RDF, JSON, XML and other formats.
SPARQL Web Pages make it possible to define user interfaces by annotating semantic models with appropriate visualizations. TopBraid uses the annotations to generate HTML, SVG, JSON and other representations delivering the vision of dynamic model-based user interfaces.
What user interface challenges are addressed by SWP
The vision of Linked Data and the Semantic Web is to create an open network of information resources. While this web of data is growing rapidly, there are few effective user interfaces for interaction with the resulting information spaces. Existing applications are either:
- Hard-coded viewers against some specific vocabularies – not able to deliver on the promise of evolvable and a flexible information web; or
- Custom user interfaces that rely on complex client-side scripting that duplicates the knowledge already existing in ontology models – not taking advantage of the power of self describing data; or
- Entirely generic data browsers that present RDF-based content in a uniform display of name/value pairs – missing usability requirements and disappointing users who expect context-specific rendering
The generic browsers typically rely on introspection of the data, and possibly consult the associated models to learn about the available properties for a resource or class. However, to avoid simplistic renderings with flat lists of properties, more information is needed than typically stored in an ontology. Consider, for example, a class that defines properties ex:firstName and ex:lastName. Without either hard coding or having additional information, it is impossible for a browser to understand that those belong together and should be rendered as text fields side by side.
How SWP solves the challenges
SPARQL Web Pages address these challenges by using semantic annotations. SWP delivers the vision of dynamic user interfaces that adjust their behavior driven by the data and context.
With SWP, user interface snippets are attached directly to class definitions in ontology models. The framework can then automatically discover and select the most appropriate user interface for any given resource. User interface code becomes extremely flexible, modular and model-driven.
A key strength of SWP is its ability to define custom tags used alongside of HTML elements to insert snippets of reusable application building blocks into web pages. These building blocks are called SWP Application Components and can be used to quickly assemble powerful web applications. Included with TopBraid is a growing SWP Application Component Library with pre-built trees, forms, grids components as well as more sophisticated visualizations.
What Is SWP?
SPARQL Web Pages is a model-driven template language and engine. RDF-based instructions are attached to ontology classes as templates to enable generic code to display attractive and context-appropriate visualizations of information. SWP is not limited to creating read-only HTML pages. It also:
- Generates any format including LATex, SVG, plain text
- Supports editing of RDF data and models
Dedicated properties such as ui:view or ui:instanceView are used to link resources with ui:Elements, which provide a data model that can be rendered into a variety of views. The UI elements are driven by SPARQL queries represented in SPIN.
Different styles of development are supported:
- For a quick demo, queries can be embedded directly into HTML
- To create maintainable and scalable systems, SPIN templates encourage query re-use and support the division of labor between HTML designers and the query experts
Users exploring a Linked Data space benefit from customized visualizations such as nicely laid-out forms, statistical charts and business intelligence reports.
How To Use SWP?
SWP is supported by all TopBraid products. In TopBraid Composer, IDE for TopBraid platform, you only need to click on the Browser tab to see SWP-based HTML view of the displayed resource.
To create a custom display for your resources, follow the steps outlined in the SWA forms tutorial. A comprehensive user guide to SWP is available here. It describes all the key elements of the SPARQL Web Pages framework with instructions on:
- How to structure SWP documents and use SPARQL queries
- How to connect resources with their SWP views
- How to define and instantiate customized object types – a key benefit of SWP compared to other template languages
- How to create multipage SWP applications
- Object-Oriented model of SWP, its document syntax and functions
SWP can be used to generate more than HTML. It has been used in the following ways:
- Generation of Markdown and LaTeX documentation
- Creation of batch files
- Generation of XML
- Generation of SPARQL queries
While you can begin developing applications by reading through the technical materials listed on this site and consulting the Help facility in TopBraid Composer, for best results we recommend taking TopBraid Platform and Tools training.
SKOS Concepts Example in HTML
SWP example code for generating HTML list of SKOS concepts from a SPARQL query. Iteration over each result of the query is done with ui:forEach. ?this variable binds to a specific instance of the class (in this case, skos:Concept) associated with the ui:instanceView.
Blog: Defining SPARQL Functions with SWP
Read more >>.
Screenshot: Website SWP TabsView Prototype
This page, and a number of other pages on TopQuadrant website, was generated using SWP. To do this, we have created RDF model describing page layouts. This page, for example, has tabs. Each tab is generated by the ui:prototype shown in the screenshot.