WMLHTML and XML

1
WML/HTML and XML

• Multiplatform Applications

2
Agenda

• XML History and purpose
• What have HTML, WML and XML got to do with each
  other
• Why useful for multiplatform development
• XML and DTD
• XML and XSLT
• HTML, XML and XHTML
• Exercises in XML

3
XML - History

• XML - Extensible Markup Language
• Designed to allow the transmission of data rather
  than data and associated formatting (like HTML)
• A variant of SGML Standard Generalized Markup
  Language (ISO 88791985)
• An international open standard language
• Designed by the W3C and approved in 1998

4
Why XML?

• Designed as a metalanguage
• Tags can be created and defined by a user (unlike
  HTML)
• Designed to make data interchange between systems
  easier
• Not designed to replace HTML!
• Is a lot stricter than HTML in terms of syntax
  and execution

5
A metalanguage?

• You define what is held in the file not how it is
  displayed
• You can define your own language for use in an
  application e.g. WML for WAP
• Separates the data from the presentation layer
• Allows multiple applications to access and
  process the same data
• Can you see where this is heading?

6
XML code

• ltmailgt
• lttogtPatricklt/togt
• ltfromgtMicklt/fromgt
• ltheadinggtMeetinglt/headinggt
• ltbodygtDon't forget we need to meet tonightlt/bodygt
  
• lt/mailgt

7
XML

• lt?xml version"1.0" encoding"ISO-8859-1"?gt
• ltcollectiongt
• ltdiscgt
• lttitlegtGreatest Hitslt/titlegt
• ltartistgtFivelt/artistgt
• ltcountrygtUKlt/countrygt
• ltcompanygtTelstarlt/companygt
• ltpricegt4.99lt/pricegt
• ltyeargt2003lt/yeargt
• lt/discgt
• .
• .
• lt/collectiongt

8
The plan
Datasource in XML
WML
XSLT
XML
HTML
DB
Conversion
???
9
XML and DTD

• DTD - Document Type Definition
• Similar to a CSS but describes the data structure
  not the format of the file
• A XML file can be syntactically correct but is
  not a valid XML file until it has been validated
  against a DTD
• These are the rules for the document to adhere to

10
DTD 2 - example
Document type is mail

• lt?xml version"1.0"?gt
• lt!DOCTYPE mail
• lt!ELEMENT mail (to,from,heading,body)gt
• lt!ELEMENT to (PCDATA)gt
• lt!ELEMENT from (PCDATA)gt
• lt!ELEMENT heading (PCDATA)gt
• lt!ELEMENT body (PCDATA)gt
• gt
• ltmailgt
• lttogtPatricklt/togt
• ltfromgtMicklt/fromgt
• ltheadinggtMeetinglt/headinggt
• ltbodygtDon't forget we need to meet tonightlt/bodygt
  
• lt/mailgt

Has 4 elements to, from, heading and body
The elements are of type PCTYPE
11
XML and XSLT

• XML is to XSLT as HTML is to XSLT (nearly!)
• XSLT stands for eXtensible Stylesheet Language
  (XSL) Transformations
• It can turn an XML document into XHTML, WML or
  whatever you want
• Became a W3c standard in Nov 1999

12
XSLT

• Can use either ltxslstylesheetgt or
  ltxsltransformgt in Doctype
• Combines the XML with formatting to present the
  information to the user
• Taking the XML example we used earlier we can
  combine it with XSLT

13
XML

• lt?xml version"1.0" encoding"ISO-8859-1"?gt
• lt?xml-stylesheet type"text/xsl"
  hrefstyle1.xsl"?gt
• ltcollectiongt
• ltdiscgt
• lttitlegtGreatest Hitslt/titlegt
• ltartistgtFivelt/artistgt
• ltcountrygtUKlt/countrygt
• ltcompanygtTelstarlt/companygt
• ltpricegt4.99lt/pricegt
• ltyeargt2003lt/yeargt
• lt/discgt
• .
• lt/collectiongt

14
XSLT file

• lt?xml version"1.0" encoding"ISO-8859-1"?gt
  ltxslstylesheet version"1.0" xmlnsxsl"http//ww
  w.w3.org/1999/XSL/Transform"gt ltxsltemplate
  match"/"gt
• lthtmlgt
• ltbodygt
• lth2gtMy CD Collectionlt/h2gt
• lttable border"1"gt lttr bgcolorred"gt
• ltth align"left"gtTitlelt/thgt ltth
  align"left"gtArtistlt/thgt
• lt/trgt
• ltxslfor-each selectcollection/disc"gt
• lttrgt
• lttdgtltxslvalue-of select"title"/gtlt/tdgt
• lttdgtltxslvalue-of select"artist"/gtlt/tdgt
• lt/trgt
• lt/xslfor-eachgt
• lt/tablegt
• lt/bodygt
• lt/htmlgt
• lt/xsltemplategt lt/xslstylesheetgt

15
XML XLST

• Produces this in a browser

My CD Collection
16
What have HTML, WML and XML got to do with each
other?

• Well not much and a lot!
• HTML allows you to wrap data and its
  presentation system into one page e.g.
• ltbgt Hello lt/bgt
• Format Content Format
• XML just presents the data but in a structured
  way leaving the application to process it e.g.
• lttogtDavelt/togt
• ltfromgtMicklt/fromgt

17
XHTML

• Extensible Hypertext Mark-up Language
• Designed to replace HTML
• Pretty similar to html v4.01
• XHTML 1.0 became an official W3C Recommendation
  January 26, 2000
• Allows HTML browser and XML apps to read XHTML
  doc
• Cleaner HTML that applies XML rules to it

18
XHTML - 2

• So no missing tags
• All lowercase tags
• use style sheets to form pages where possible
• Insert a space in final tags for current browsers
  to understand i.e. ltp /gt
• All name tags are now id tags
• All XHTML documents must have a DOCTYPE
  declaration

19
XHTML - 3

• 3 types of Doctype
• Strict, Transitional, and Frameset
• Strict use HTML for data and CSS for styling
• Transitional Uses HTYML styling as well as for
  Data for non CSS browsers
• Frameset from frames based rendering
• Look at W3schools conversion at
  http//www.w3schools.com/xhtml/default.asp
• Or the HTML tidy tool to help you convert your
  current HTML at http//tidy.sourceforge.net/

20
Exercises in XML

• Like you to look at the online tutorial at
• http//www.w3schools.com/xml/default.asp
• And for XSLT
• http//www.w3schools.com/xsl/xsl_languages.asp
• And for DTD
• http//www.w3schools.com/dtd/default.asp
• But what do I code in

21
Tools

• You can use Dreamweaver MX
• Or the (free) Altova XMLSpy (available from
  http//www.altova.com/support_freexmlspyhome.asp)
• Or a text editor and the online Tryit coder at
  http//www.w3schools.com/xml/tryit.asp?filenameno
  te