XML For Designers: From Syndication to Services

1
XML For Designers From Syndication to Services

• Joe Marini
• Web Design World 2006

2
Common XML Questions

• What is XML?
• What does XML do?
• Why should I, as a designer, care about XML?
• How does XML work with other technologies, like
  HTML, JavaScript, and CSS?
• When should I use XML? When should I not use it?

3
Session Overview

• What XML is and isnt
• Benefits and drawbacks of using XML
• How you can use XML today
• Where XML is going and why you should care
• Places where you can see XML being used today

4
Why Should Designers Care?

• XML is widespread
• It is the foundation for several next-generation
  web technologies
• XHTML
• AJAX
• RSS (blogs)
• Web Services (WSDL)
• Microsoft Windows Presentation Foundation (XAML),
  Macromedia Flex, Laszlo LPS
• XML has become a skills issue, just like
  JavaScript before it

5
What is XML?

• The eXtensible Markup Language
• Tag-based syntax, like HTML
• Used to describe data
• You get to make up your own tags
• Behold! An XML file in one line!

6
Example of Describing Data

• Typical Business Card Contact Info

Joe Marini
[phone]
(mobile)
[phone]
(work)
[phone]
(fax)
joem_at_joemarini.com
7
Describing Information With XML

• ltBusinessCardgt
• ltnamegtJoe Marinilt/namegt
• ltphone typemobilegt(415) 555-4567lt/phonegt
• ltphone typeworkgt(800) 555-9876lt/phonegt
• ltphone typefaxgt(510) 555-1234lt/phonegt
• ltemailgtjoe_at_joe.comlt/emailgt
• lt/BusinessCardgt

8
Benefits of XML

• Separate content from presentation
• Create tag sets that target specific problems
• Store information in human-readable format
• Exchange data among disparate systems (i.e., web
  services)
• Open format can be read and processed by any
  XML-aware program

9
Drawbacks of XML

• Not good for storing large amounts of data
• Performance can be slower than other methods of
  storing and retrieving data
• Might not be the best format for representing
  certain data types
• Images and other binary data

10
Basic Rules of XML

• XML documents must be well-formed
• Tags must be properly nested
• Attribute values must be inside quotes
• Attributes cannot be minimized
• Empty tags always end with /gt
• XML documents can be valid
• Compared against a list of allowable conditions
• XML documents have a single root tag

11
Giving XML an Appearance

• Using CSS
• Using the browsers built-in capabilities
• Using scripting techniques and the DOM
• Using XSLT (eXtensible Stylesheet Language
  Transformations)
• Or a combination of all of the above (theyre not
  mutually exclusive you can mix n match)

12
XML and CSS

• Define CSS styles using the names of XML tags
• Can use CSS2 to alter the content
• Associate the XML file with the stylesheet
• The lt?xml-stylesheet?gt directive does this
• lt?xml-stylesheet type"text/css"
  hrefstyle.css"?gt

13
XML and the Browser

• Certain browsers have the ability to work with
  XML directly in their pages (IE6, Netscape7)
• Called Data Islands, these are pieces of XML
  that are embedded directly into a web page
• In IE 5, these islands can be displayed by
  attaching them to certain HTML structures, like
  tables

14
XML and Scripting

• Appropriate for working with XML in web pages
  when
• A) the browser does not have the capability built
  in
• B) the desired functionality goes beyond just
  display
• Using the browsers DOM you can access and
  manipulate the XML directly

15
How XML Represents a Document

• The Document Tree
• Each circle in the diagram represents a node in
  the document
• Nodes are tags, comments, text, etc.
• The DOM provides standard ways to access and
  manipulate these nodes

HTML
HEAD
BODY
META
TITLE
text
16
XML and XSL

• XSL is the eXtensible Stylesheet Language
• Uses XML tag syntax (unlike CSS)
• Advantages over CSS
• Uses templates instead of rules to format data
• Can operate on complex XML documents
• Can dramatically rearrange document output from
  original
• Can use logic to decide how to format something
• Its not one or the other you can use both XSL
  and CSS
• Safe to use in IE6 and Netscape 7, Firefox 1.0

17
Working with XHTML

• HTML 4.01 with XML syntax applied
• Became a W3C Standard in January 2000
• You should be using it
• It is the future of HTML
• Designed for use across devices, not just PCs
• XHTML requires quality code

18
RSS and Web Services

• RSS (Rich Site Summary, Really Simple
  Syndication) is used to publish content
  information
• Formats for doing this include ATOM and RDF, as
  well as 4 different RSS versions (.9, .93, 1.0,
  2.0)
• RSS versions .9x and 2.0 are generally
  compatible, but 1.0 is very different

19
RSS and Web Services

• Web Services are a way of providing some defined
  functionality in a way that can be accessed via
  standard XML.
• These are defined using the Web Services
  Description Language (WSDL)
• Web Services are accessed using the Simple Object
  Access Protocol (SOAP)

20
Where to get more information

• The W3C web site http//www.w3.org/XML
• W3 Schools http//www.w3schools.com
• Microsofts IE site (e.g. IE Data Islands)
  http//msdn.microsoft.com/ie/
• Mozillas site http//www.mozilla.org/developer
• XML.com site http//www.xml.com
• XMethods http//www.xmethods.net
• My site http//www.joemarini.com