Running order
Background All about XML All about XSL Hands-on XML and XSL Publishing engines Example applications Crystal balls
XML and XSL
W3C specifications Separation of Concerns
Reuse of data Multiple output formats Styles tailored to reader / Standardised styles
Applications of XML and XSL
Static information Institutional web sites Prospectuses Course catalogues
Dynamic information News or event information services Course catalogues Staff directories
Benefits of XML and XSL
Standards-based, format-independent Serve sites and formats based on user need
Text-based (text readers, slow links, low-tech) Netscape / Internet Explorer specifc TV, Phone, PDA PDF, SVG, VRML, ...
Simplification of web site management...
The management bit
Management Decide what the site
should contain, how it should behave and how it should appear
Content Responsible for
writing, owning, managing the site content
The management bit
Logic Responsible for
integration with dynamic content generation
Style Responsible for
information presentation, look & feel, site graphics and maintenance
What is XML?
eXtensible Markup Language Not a fixed format 'Metalanguage' For describing information
XML Design Goals
1 XML shall be straightforwardly usable over the Internet.
2 XML shall support a wide variety of applications.
3 XML shall be compatible with SGML.
4 It shall be easy to write programs which process XML documents.
5 The number of optional features in XML is to be kept to the absolute minimum, ideally zero.
XML Design Goals
6 XML documents should be human-legible and reasonably clear.
7 The XML design should be prepared quickly.
8 The design of XML shall be formal and concise.
9 XML documents shall be easy to create.
10Terseness is of minimal importance.
Structure of an XML document
<?xml version="1.0"?>
<PARENT>
<CHILD>
This is content.
</CHILD>
<EMPTY/>
</PARENT>
A first XML document
Construct a well-formed XML document using the following tags: xml opening tag page title content para
Don't forget to add the closing tags!
Differences to HTML
Order:<tag1><tag2></tag1></tag2> WRONG
<tag1><tag2></tag2></tag1> RIGHT
Balance<tag1><tag2></tag2> WRONG
<tag1><tag2></tag2></tag1> RIGHT
Case<tag1><tag2></TAG2></TAG1> WRONG
<tag1><tag2></tag2></tag1> RIGHT
Differences to HTML
Attributes<tag1 class=wrong> WRONG
<tag1 class="right"> RIGHT
Empty Tags<tag1 class="wrong"> WRONG
<tag1 class="wrong" /> RIGHT
XML is stricter
...and therefore better!
Well-formed vs. Valid
Exactly what they say: Well-formed means it's written correctly Valid means we can validate it
A well-formed example
<?xml version="1.0"?>
<PARENT><CHILD>
<MARK NUMBER="1" LISTED="yes" TYPE="natural"/>
<NAME>
<LASTNAME>child</LASTNAME>
<FIRSTNAME>second</FIRSTNAME>
</NAME>
</CHILD>
</PARENT>
A valid example
<?xml version="1.0"?><!DOCTYPE PARENT [
<!ELEMENT PARENT (CHILD*)><!ELEMENT CHILD (MARK?,NAME+)><!ELEMENT MARK EMPTY><!ELEMENT NAME (LASTNAME+,FIRSTNAME+)*><!ELEMENT LASTNAME (#PCDATA)><!ELEMENT FIRSTNAME (#PCDATA)><!ATTLIST MARK
NUMBER ID #REQUIREDLISTED CDATA #FIXED "yes"TYPE (natural|adopted) "natural">
<!ENTITY STATEMENT "This is well-formed XML">]><PARENT>
&STATEMENT;<CHILD>
<MARK NUMBER="1" LISTED="yes" TYPE="natural"/> <NAME>
<LASTNAME>child</LASTNAME><FIRSTNAME>second</FIRSTNAME>
</NAME></CHILD>
</PARENT>
Document Type Definitions
First standard mechanism for XML validation Define the role and structure of XML
elements Sufficient for simple XML schemas Don't support namespaces Use non-XML syntax
XSchema
XML structural definition language of choice Defines a class of XML document Supports name spaces More powerful
Xschema example
<?xml version="1.0"?>
<xsd:schema xmlns:xsd="http://www.w3.org/2001/XMLSchema"> <xsd:annotation> <xsd:documentation xml:lang="en"> Example Schema for IWM workshop </xsd:documentation> </xsd:annotation>
<xsd:element name="page" type="page"/>
<xsd:complexType name="page"> <xsd:sequence> <xsd:element name="title" type="xsd:string"/> <xsd:element name="content" type="pageContent"/> </xsd:sequence> </xsd:complexType>
<xsd:complexType name="pageContent"> <xsd:sequence> <xsd:element name="para" type="xsd:string" minOccurs="0"/> </xsd:sequence> </xsd:complexType>
</xsd:schema>
What is XSL?
Preferred style sheet language of XML a method for transforming XML documents a method for defining XML parts and patterns a method for formatting XML documents
An application of XML (same formatting rules)
Hands-on XML
Create the following XML document:
<?xml version="1.0"?>
<page>
<title>Hello</title><content><para>This is my first XML page!</para></content>
</page>
Save it as hello_world.xml
Uploading the file
Navigate to the site provided Click on "upload.html" Beside the "file to upload" box, click on
"choose" Select the file you want to upload Click on "upload"
Viewing the file
If you see the file you wanted to upload and receive a "File written successfully" message...
Click on "Content", then the name of the file
Structure of an XSL stylesheet
Most templates have the following form:<xsl:template match="emphasis">
<i><xsl:apply-templates/></i>
</xsl:template>
The whole <xsl:template> element is a template
The match pattern determines where this template applies
Structure of an XSL stylesheet
Literal result element(s) come from non-XSL namespace(s)
XSLT elements come from the XSL namespace
Hands-on XSL
Create the following XSL stylesheet:<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="page"><html>
<head><title><xsl:value-of select="title"/></title>
</head><body bgcolor="white" alink="red" link="blue" vlink="blue">
<xsl:apply-templates/></body>
</html></xsl:template>
</xsl:stylesheet>
Uploading the file
Navigate to the site provided Click on "upload.html" Beside the "file to upload" box, click on
"choose" Select the file you want to upload Click on "upload"
Viewing the file
If you see the file you wanted to upload and receive a "File written successfully" message...
Click on "View site in cocoon" Select the file you uploaded and the
stylesheet you want to view it in
Hands-on XSL
Add the following to the XSL stylesheet:
<xsl:template match="title"><h2 style="color: navy; text-align: center">
<xsl:apply-templates/></h2>
</xsl:template>
<xsl:template match="para"><p align="left">
<i><xsl:apply-templates/></i></p>
</xsl:template>
New platforms, new beginnings?
The old way of publishing Repurposing
The new way of publishing Target multiple platforms Multiple stylesheets Multiple formats
Browser-specific content
<map:select>
<map:when test="lynx">
<map:transform src="stylesheets/simple-page2html-lynx.xsl"/>
</map:when>
<map:otherwise>
<map:transform src="stylesheets/simple-page2html.xsl"/>
</map:otherwise>
</map:select>
Lynx-friendly XSL stylesheet
Add the following to your XSL stylesheet:
<h2>This site is lynx-friendly</h2>
Save the stylesheet as
simple-page2html-lynx.xsl
Uploading the file
Navigate to the site provided Click on "upload.html" Beside the "file to upload" box, click on
"choose" Select the file you want to upload Click on "upload"
Viewing the file
If you see the file you wanted to upload and receive a "File written successfully" message...
Click on "View site in cocoon" Select the file you uploaded and the
stylesheet you want to view it in
References
http://www.ibm.com/developerworks/papers.nsf/dw/xml-papers-bytopic?OpenDocument&Count=500
http://www.xml101.com/ http://nwalsh.com/docs/tutorials/xsl/