Introduction to XSL

In a nutshell: XSL is a W3C specification that describes a method for visually presenting XML documents.

This tutorial will cover:

An overview of the XSL spec (including XSLT and XPath)
Examples of various use cases
Relationship with other XML technologies
A detailed example

XML Documents

XML (eXtensible Markup Language) adds information to text files, using tags and attributes [example1], [example2]
Tag names are defined for a specific document type.
Uses the Unicode character set
Designed to be easily processed by machine while remaining readable.

Styling XML Documents

XML documents are ideally semantic. For example, this bit of HTML is wrong:

Do not smoke, eat or drink in this room.

CSS

With CSS one can associate properties to tags: refer to hamlet example

TITLE

Simple model: properties are associated to tags or attributes.

CSS lacks complex page layout, i18n properties, and the capability to perform complex styling operations. Like TOCs (not styling per se, but which should not be written by the author, but rather by the process that produces the actual document)

XSL is an alternative to CSS that allows greater control over the presentation of the XML data.

What can it do?

[like CSS] allow changing presentation without changing the XML source, and display documents on various media,
also: I18N features (writing modes, text alignment, hyphenation), complex page layout, footnotes, automatic generation of content (index)

Who is it for?

Applications that require high-level quality formatting:

Publishing industry (books, technical documentation) not newspapers or magazines: too complex for XSL 1.0
Publication on different media: paper, web, mobile devices application: news service .

But is it not meant to be used where presentation is deeply tied to the contents (like graphic design).

Example I: Hamlet

  A room in the castle. Enter KING CLAUDIUS, QUEEN GERTRUDE, POLONIUS, OPHELIA, ROSENCRANTZ, and GUILDENSTERN And can you, by no drift of circumstance, Get from him why he puts on this confusion, Grating so harshly all his days of quiet With turbulent and dangerous lunacy?  .

This Example could be done in CSS, but the next two can't

Formatted for paper output (PDF), formatted for the Web (XHTML)

Example II: Mixed Writing Modes

mixed writing modes

Example III: database

Complex transforms, 2-key sorting (artist/year), grouping (by artist)

. Sundays, The Blind  (Various) The Glory of Gershwin Compilation  Kamen, Michael Brazil  .

Other Examples

W3C specs (one DTD, output formats: HTML, sliced HTML, text, PDF), e.g MathML 2.0, XML 1.0
This slideshow show HTML in browser and style sheet

How do they do that?

An XSL stylesheet is an XML File Show play stylesheet. Can be quite complex, but that's what you need for extended features.
It is associated to an XML document with a Stylesheet Processing Instruction (like CSS)

   A room in the castle.

The XSL Process(es)

XSL transformation and formatting

The result tree is an XML document in which the markup has information about how to display the document: what font to use, the size of a page, etc. This markup is called Formatting Objects (elements) and Properties (attributes). For example:

ACT III Scene 1: A room in the castle Enter KING CLAUDIUS, QUEEN GERTRUDE, POLONIUS, OPHELIA, ROSENCRANTZ, and GUILDENSTERN .

  A room in the castle. Enter KING CLAUDIUS, QUEEN GERTRUDE, POLONIUS, OPHELIA, ROSENCRANTZ, and GUILDENSTERN .

deliberately simplified. Note the automatic numbering.

Server-Side/Client-Side XSL

Off-line (e.g. for printing)
Server-side: server transforms, client renders (not recommended)
Client-side: client transforms and renders (allows user styles)

XSL and other W3C specs

XSL uses CSS properties to express formatting information, and uses the CSS inheritance model.

TITLE

XSL and SVG, MathML

XSL can import images and other types of known XML documents: SVG and MathML. show CD list or MathML spec
Up to the renderer to handle other namespaces

Transformations: XSLT

XSLT is a transformation language originally designed to transform any XML document into another XML document containing formatting objects: pages, blocks, graphics, text, etc.

XSLT transformation from one XM

General-purpose XSLT

XSLT has evolved to become a general-purpose transformation language from XML to XML.

Many users use it to transform their own XML document type to HTML for viewing within a browser

XSLT stylesheets use XML syntax

A stylesheet is a list of templates

Templates

A template says: "when you find this in the input file, then output this

Each template applies to a type of nodes in the input document
When matches are made, the templates contains desired output.

meaning: when you read a tag named 'title' print a block start, continue the matching process for what's inside the and close the block

Note the use of namespaces to differentiate between formatting objects and transformation instructions. XSL defines both

So this will transform:

Hamlet

 Hamlet

HTML can also be generated very simply in the template, using for instance instead of

means: apply other templates to contents.

Implicit rule: text is copied from input to output: a style sheet with no rules will only return the character data of the input.

XSLT statements

Allow navigation and iteration within the input document tree

Gets a value (node contents or attribute) from the input tree.
Loops over the nodes in the select expression
. Conditional

"Play" to HTML

Very simple one-template example using the 'pull' method:

The Tragedy of Hamlet, Prince of Denmark

Elsinore. A platform beforethe castle.

BERNARDO

Who's there?

FRANCISCO

Nay, answer me: stand, and unfold yourself.

This uses the 'push' method where structure follows the input. Roughly there is one template for each tag type in the input

XPath

. is another W3C specification;
an expression language to selects parts of an XML document tree;
is used in or , etc.;
and can be as simple as TITLE , or as complex as / ACT[3]/SCENE[position() < 5 and position() > 2]/SPEAKER[@name="Hamlet"]/ LINE[contains(.,"shoe box")]

Formatting Objects basics

Tree of Formatting Objects

the FO vocabulary is one special type of output from XSLT
FOs are organized as an XML tree:
Each node has associated properties, either directly specified (by attributes) or inherited.

The area model

On the page will be layed out , that contain text, images and other areas. An area is a rectangle, with padding and border:

Area: border, padding and conte

Block/inline areas

The concept of relative orientation and writing-modes. Where CSS defines top, bottom, left, right, XSL adds before, after, start and end. Areas can be of type: block or inline. Blocks are stacked from the 'before' side to the 'after' side, inlines are stacked orthogonally.

Inline and block areas

Formatting Objects:

Define the layout

fo:layout-master-set fo:page-master fo:page-sequence

fo:block fo:inline fo:character

fo:page-number fo:external-graphics

Properties

Each area has a set of traits: color, background, font-size, etc.
Areas are inherited down the FO tree using the CSS inheritance model
They are specified in the source as attributes associated to Formatting Objects.

 This is Helvetica 14pt text. This is Helvetica 28pt text.

Example: Play to FO

The style sheet has the same structure as play2html, but HTML output is now FO. @@internationalisation of generated texr (Act, Scene) refer to DocBook

                             Table of Contents                                                Scene        - Act        Act       Act  p. "/>    Scene  p. "/>

Top-level Template

For the sake of simplicity, we use one type of page, one size, no alternatives.

Page Format

Page Sequence Master

A sequence of a single page. We could have made 2 page-masters (odd and even) and used a alternating page sequence master

Page Sequence

Contains static-content (headers, footers, siders)
And main text flow

Flow

Contains blocks, which contains text and inlines

I18N Formatting Objects and Properties

fonts and Unicode character sets: [example1], [example2]
writing-mode
baseline control The text-align property. refer to StreveZ's paper. OpenType fonts have a set of baselines for alignment with other fonts: hanging (e.g gumurkhi: northern indic, math, middle (for graphics), alphabetic (roman), etc. dominant-baseline (of the principal font) Modified font size. Baseline table is scaled and realigned on the dominant baseline:

Apguru Exji

Alignment Baselines

Horizontal and Vertical baselin

Other Formatting Objects

fo:leader
fo:external-graphic, fo:instream-foreign-object
fo:footnote
fo:page-number, fo:page-number-reference
fo:list, fo:table, fo:float
Dynamic properties (e.g. links)

And Properties

Aural Properties (pitch, azimuth, etc.)
Hyphenation control (country, hyphenation-character)
Keeps and Breaks

Example: mixed writing modes

Go to Windows

If you are still interested.

Status of the specifications

XSLT 1.0 and XPath 1.0 are W3C recommendations
Requirement documents for XSLT2.0 and XPath2.0 are available
XPath2.0 is now being developed (with XML Query)
XSL 1.0 (FO) is a Candidate Recommendation

Implementations

Many implementations of XSLT1.0 exist: xt, Saxon, Oracle, Sun, Mozilla, (client side), MSXML (client side), Lotus, Unicorn, libxml, most of them free
XSL 1.0: 7+ implementations: RenderX, Antenna House, FOP (does SVG), PassiveTeX (does MathML), etc.

The Future

XSL 1.0 will move to Recommendation
Interoperability: include SVG and MathML in XSL.
Applications: publishers will be able to put publications on the web as easily as printing them