Developing Web Applications With XHTML: Problems and Benefits

1
Developing Web Applications With XHTMLProblems
and Benefits

• Ian GRAHAM
• Senior Manager, eSolutions Group
• Emfisys, Bank of Montreal
• E ian.graham_at_bmo.com or utoronto.ca
• W http//www.utoronto.ca/ian/talks/
• T 416.513.5656 / F 416.513.5590

2
Talk Outline

• Introduction
• Technical and process issues
• Browsers and XHTML
• Server-side data management
• Dynamic content generation
• Conclusions

3
Browsers and XHTML

• Data delivered to browsers as one of two MIME
  types
• text/html (HTML data)
• text/xml (XML data)
• Two types handled in very different ways

4
Browsers and XHTML

• HTML Channel Support
• Navigator 1--6
• Opera 3--6
• Lynx
• IE 3--5.5
• ...
• Basically every browser

• XML Channel Support
• Navigator 6
• IE 5/5.5
• Opera 4
• Fewer browsers, with caveats (rendering /
  processing problems)

5
HTML vs. XML Channels
6
XHTML via XML Channel

• Mozilla/NN6
• namespace support for XHTML namespace
• default formatting properties
• Restricted CSS support
• No support (yet) for style, link elements
• lt?xml-stylesheet .... ?gt

• IE 5/5.5
• No special support for XHTML (use CSSXML)
• No standardized support for functional markup
• Transform XML into HTMLXMLXSLT ? HTML

7
Browser Conclusions

• Deliver data as text/html
• Must avoid many XML features
• CDATA sections
• DTD internal subsets (and DTD functionality)
• Not supported by HTML processors

8
XHTML as text/html

• Be aware of some XHTML features
• xmllang vs. lang attributes (use both)
• XML declarations (avoid them)
• empty element tag notation (add space before
  trailing / character)
• non-minimized attribute assignments (some bugs
  with Opera 3.6)
• DTD declaration (rendering concerns)

9
Safe XHTML example

• lt?xml version "1.0" encoding "utf-8" ?gt
• lt!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
  Strict//EN"
• "DTD/xhtml1-strict.dtd" gt
• lthtml xmlns "http//www.w3.org/1999/xhtml1"
• xmllang "en-ca" lang "en-ca" gt
• ltheadgt
• lttitlegt ... lt/titlegt
• ltmeta http-equiv "content-type"
• content "text/htmlcharsetutf-8" /gt
• lt/headgt
• ltbodygt
• .....
• lt/bodygt
• lt/htmlgt

whitespace before slash
10
DOCTYPE Switching

• New HTML processors render differently depending
  on DOCTYPE value
• quirks mode -- (reproduces various CSS and
  other layout errors of older browsers)
• standards mode -- (correct behavior, no quirks
  supposedly! )

11
DOCTYPE Switching

• All XHTML DTDs get standard mode. Thus the
  following rule
• quirks mode omit DOCTYPE
• strict mode include an XHTML DOCTYPE
  declaration

12
Summary

• Seems like a lot of problems....
• Not so bad ...
• Have to deal with most anyway (e.g., quirky vs.
  strict)
• patching often easy to automate
• Benefits
• Reduced markup errors (well-formedness)
• Migration path to future delivery channels

13
Markup Guidelines

• Use external scripts and CSS style sheets
• Avoid CDATA sections
• External script, style sheet files
• On output, auto-adjust syntax
• insert space at end of empty-element tags
• duplicate lang-related attributes
• strip/insert appropriate DOCTYPE declaration
• strip XML declaration

14
Talk Outline

• Introduction
• Browsers and XHTML
• Server-side data management
• Dynamic content generation
• Conclusions

15
Server-Side Management

• XHTML reduces errors in composition and rendering
  phases
• Well-formedness ensures unambiguous processing by
  an HTML or XML processor
• Barring CSS errors, this means fewer browser
  formatting problems
• Problems
• support by content generation tools

16
Issues

• Limited pool of XHTML authoring tools
• Most popular page authoring tools designed for
  HTML (DreamWeaver, FrontPage etc.)
• XHTML conversion adds process steps to authoring
• Too complex for most Web authors/designers
• Not an issue for organizations with existing
  XML/SGML processes

17
Processing Content
18
Alternatives

• Use XML-aware authoring tools
• Issues Cost, non-WYSIWYG nature
• Create tightly controlled page templates and
  limit authoring responsibilities
• Reduces likelihood of markup error
• Dynamic content generation
• Fragment authoring only -- with validation

19
Talk Outline

• Introduction
• Browsers and XHTML
• Server-side data management
• Dynamic content generation
• Conclusions

20
Dynamic Content

• Content from databases
• SQL, XML, files (plain text or XML fragments)
• Can enforce well-formedness in software
• Either via structured markup generating functions
  or true XML-based tools

21
Server-Side Management
text strings
Page generation engine
XHTML Fragment
XHTML Fragment
HTML / XHTML to browser
XHTML Fragment
HTML / XHTML page template
Reduced number of markup/formatting errors
22
XHTML Fragments

• XHTML helps reduce errors in composition of pages
  from fragments
• Checking fragment well-formedness ensures
  well-formedness of composed content
• Even if template is not well-formed,
  well-formedness of fragments increases rendering
  reliability of composed product
• Easier to control fragment authoring

23
Roles Responsibilities

• Fragment creation
• Many individual writers requires little markup
  knowledge WYSIWYG often not as important
• Template creation / Management
• Fewer, more technically skilled people can
  enforce well-formedness

24
Fragment Creation

• Common use case in content creation
• e.g., Newspaper articles, weblogs
• Subset of XHTML (e.g., p, a, br, h3, b, i, img,
  em)
• few attributes
• Easy to write
• Easy to dynamically correct markup

25
Example Web Interface

• Advantages
• Centralized code
• Single interface
• Disadvantages
• Crappy editor
• Need to know markup to write content

26
Future Alternatives

• Editable Web content (IE 5.5, Mozilla)
• http//standardbrains.editthispage.com/
• Accessing DOM tree to build an editor
• DOM ensures validity / well-formedness of markup
• With Mozilla, will work with XML

27
Content Assembly

• Many tools (JSP, php, ASP, zope ...)
• Not many that guarantee well-formed XML output
• Obvious choice XSLT
• Guarantees well-formedness of output
• HTML output mode allows for most issues described
  earlier

28
Server-Side Management
29
XSLT Advantages

• Always well-formed!
• Abstraction layer between content and output
• Easier adjustment for future delivery channels

XSLT
XSLT (1)
Output (1)
30
XSLT Caveats

• Non-trivial language
• (well, at least to page developers/designers)
• Unclean separation between designer and
  programmer
• Lack of easy integration to common editing tools

31
Alternative Approach

• Procedural page template designs
• XHTML-compliant design tools
• Escape to XSLT for content components
• Prototype-based transformations

32
Markup Model

• ...regular markup ....
• ltxslprototypegt
• lttablegt
• ... Example table content goes here ...
• lt/tablegt
• lt/xslprototypegt
• ... More XHTML markup ....

33
Talk Outline

• Introduction
• Browsers and XHTML
• Server-side data management
• Dynamic content generation
• Conclusions

34
Conclusions

• XHTML provides pragmatic advantages
• Improved content reliability, at several layers
  migration path to XML-centric world
• Several disadvantages in near-term
• Poor integration with authoring tools no easy
  XSLT-design separation

35
Developing Web Applications With XHTMLProblems
and Benefits

• Ian GRAHAM
• Senior Manager, eSolutions Group
• Emfisys, Bank of Montreal
• E ian.graham_at_bmo.com or utoronto.ca
• W http//www.utoronto.ca/ian/talks/
• T 416.513.5656 / F 416.513.5590