Steven Pemberton, CWI, Amsterdam and W3C
To the world's largest SIGCHI Local SIG
To the world's largest SIGCHI Local SIG
From the world's 2nd largest SIGCHI Local SIG (SIGCHI.NL)
But what a mess!
Both in design and use ...
XHTML is trying to improve the situation
Forrester did research among 8000+ users on why they chose one website above another equivalent one. Reasons were:
Forrester did research among 8000+ users on why they chose one website above another equivalent one. Reasons were:
Forrester did research among 8000+ users on why they chose one website above another equivalent one. Reasons were:
Forrester did research among 8000+ users on why they chose one website above another equivalent one. Reasons were:
Forrester did research among 8000+ users on why they chose one website above another equivalent one. Reasons were:
Forrester did research among 8000+ users on why they chose one website above another equivalent one. Reasons were:
All other reasons were 14% or lower.
XHTML is a family of XML-based markup languages.
Currently:
And soon:
We are currently working on a new member of the XHTML family, in our minds the real XHTML.
Our aims are:
In fact as I will show, many of these things are intertwined.
There are two 'users' of XHTML:
observe incorrect current use; identify other areas
the design of the markup can affect the end user's experience (e.g. client-side image maps; frames)
By 'generic XML' we mean: if a facility exists in XML technologies, and it is suitable, use it and not a special-purpose XHTML facility. Try to get missing functionality added to XML.
Examples:
Major missing functionality: Linking (XLink insufficient for XHTML's needs).
Advantages: less variability; more interoperability; much of XHTML 2 works already; opportunity to make a cleaner break.
Remove all presentation-only markup.
Use stylesheets to define presentation.
Advantages: possible to author once, and display on different devices; better presentation possibilities; device presentation not hardwired; CSS has support for devices; more accessibility.
Power of CSS currently seriously underappreciated.
(Note: doesn't require CSS to be implemented; just uses its model)
Add more semantically-oriented markup to make documents richer.
Examples: <line> element instead of <br>. <section> and <h> elements instead of <h1> <h2> etc
Not
I think that I shall never see<br> A poem lovely as a tree
but
<line>I think that I shall never see</line> <line>A poem lovely as a tree</line>
Advantages: more presentational opportunities (folding, marquee, numbering)
As an example of poor usability, current frames are a disaster!
Currently devising a replacement for Frames.
Advantages: all of the above.
This largely falls out automatically from other aims.
For instance <h1>, <h2> etc are mostly terrible for accessibility, because no one uses them right, and it is hard to work out document structure from so little information.
<h2>Chapter 1</h2> ... <h3>Section 1</h3> ...
is now:
<section> <h>Chapter 1</h> .... <section> <h>Section 1</h> ... </section> </section>
More structure gives more accessibility. So does device independence.
Observe how scripting is currently used.
Identify missing markup/functionality.
Add it where possible; try to cover 80% mark
Examples: menus for navigation; forms data checking; folding presentation.
Advantages: more devices, more presentational variations, better search
Less scripting
No hard-wired presentation
Events
New Forms
Current HTML events are a disaster
Problems include:
XML markup binding to DOM2 Events
Extensible for new event types
'Abstract' events can replace the old device-dependent ones (e.g. 'activate' instead of 'click')
Independent of scripting language
Can entwine event markup in document, or can separate it out
Advantages: more types of events, other types of scripting (e.g. declarative)
<a onClick="...javascript..." ...>
becomes
<a ev:event="activate" ev:handler="#myhandler" ...>
HTML forms have proven their worth.
XForms improves this:
Essentially defines two separate parts: the 'real' form (data, datatypes and submission details), and form controls bound to the data.
A language may define its own set of form controls.
XForms 'native' form controls are device-independent, and accessible.
<input ref="order/shipTo/street"> <label>Street</label> <hint>Please enter the number and street name</hint> </input>
A user agent has a default presentation.
If the user agent supports it, a stylesheet can be used to define other presentations.
<select ref="icecream/flavors"> <label>Flavours</label> <item><label>Vanilla</label><value>v</value></item> <item><label>Strawberry</label><value>s</value></item> <item><label>Chocolate</label><value>c</value></item> </select>
This example covers both radio-button style selection, and menu selection: not encoded in the control.
More usability
Division of content and presentation
More accessibility
More thought put into websites
But can we achieve this?
"Google is, for all intents, a blind user. A billionaire blind user with tens of millions of friends, all of whom hang on his every word. I suspect Google will have a stronger impact than [laws] in building accessible websites."
...
"In a world where Google likely has a valuation several orders of magnitude higher than any chrome such as flash, graphics, audio, interactivity, or "personalization", I see a heady revision."
Karsten M. Self
Things to avoid:
Usability and the Web Workshop
NIST, Gaithersburg (near Washington D.C.), Maryland, USA
4th and 5th November, 2002
(September 13 - position papers submitted to the organizers)
http://www.nist.gov/uig_w3c
HTML was originally designed as a structure description language, not a presentational language.
The design of XHTML is truly 'radical': taking HTML back to its roots.
Device independence and accessibility are surprisingly closely related, as are accessibility and usability.
Even though website builders may not yet know it, device independence, accessibility and usability have a major economic argument in their favour. Spread the word!
More information: www.w3.org/Markup