Your part of the playground – what can be done with the different web technologiesThursday, August 4th, 2005 at 11:54 am
In a nutshell, the technology of creating web sites is cut up into three layers (five if you include the information architecture and backend logic):
The structure – defined by (x)HTML.
All you can do with that is define what a text is and leave the browser to make something good out of it.
- You can define interactive elements like buttons, form fields or even frames containing other pages with it, but you cannot change the document dynamically or re-use data that was sent to the document.
- What you do here is the most important of all, good, clean, semantic HTML is what turns mumbo jumbo into a readable, browse able and style able document. HTML is not there to paint with it, it is there to give the document structure and meaning.
A construct like
is not a navigation,
is, as the links are separated from another by more than white space and they are grouped inside a parent element – the list – indicating that they are part of a logical unit.
The presentation – defined by Cascading Style Sheets (CSS)
CSS is primarily there to tell the user agent how something should be visually represented.
- You define measurements, position, how it should behave in the document flow and colours with it.
- You cannot reach anything outside the current document with it, and that includes documents inside IFRAMES or other FRAMES.
More modern CSS allows for creation of content and interactivity via the :before, :after, :hover, :focus and :active pseudo classes. However the support for those is still flaky and there is no way to delay effects or make them optional – if CSS is supported visitors will have to deal with your interactivity – even if they are physically incapable to do so.
- You can copy, replace, remove and create texts, elements and attributes of everything inside the document, and – security settings permitting – some parts of the browser itself.
- Via XHR or AJAX you can pull in content from other documents and send or retrieve information to backend scripts without leaving the current page.
- Via event handlers you can add own keyboard functionality and create hitherto unreachable web functionality like drag and drop interfaces.
This comes with a price though:
- You are also likely to disturb conventions of web usage by either turning non-interactive elements into interactive ones without telling the visitors about it or breaking the functionality of browser tools like the back button or bookmarking facilities.
Pushing the boundaries
There are examples on the web where clever web developers pushed the boundaries of the layers and glanced over the fence. Stu Nichols for example repeatedly pushes CSS to its limits and the scripalicious libraries turn HTML web sites into rich user interfaces close to Flash .
However, all of these are exercises in what is possible, not necessarily what makes sense in your work environment. They are important as a scientific experiment and an outlook of things that might be possible, but should be taken with a pinch of salt.