MDCM2002 : Web XHTML/CSS Module Week 2 Page 1
A Recap and an Introduction:
Last week we ended our tutorial having produced a mini hypertext. You did well to get that far and I hope that during the week you expanded your hypertext a little more, added some more pages and so on. Its really is a terrific medium for writing and developing ideas - a little like mind mapping but with the added bonus that we can develop it into a fully formed (well as much as hypertext can ever be concieved as fully formed) production piece.
Although we came a long way last week we still ended up with a few very plain looking pages. Of course Dostoyevsky's Crime and Punishment isn't much to look at either and so while the design aspects of the last week were very basic, I hope you started to think a little more about what happens to text when it becomes networked in this way - I hope it read in interesting ways and prompted some thought.
There is one very good reason we didn't jump in and format the page from the outset. If you don't know what the content is how can you design for it?
Another reason is that the power of the internet as a medium is that it is what we might call a non-rendered medium. When film is exposed to light a reaction occurs sees that impression imprinted on its surface. When words are commited to a page thats where they stay.
Digital media in general made media less fixed to its mode of delivery. Music no longer relied on the vibrations of a needle on a record, the cinema no longer relied on a chemical reaction that fixed colour to film. Content could be endlessly reproduced on any medium capable of recording ones's and zero's. It could also be reconfigured much more easily than in the analog world.
The internet is perhaps the ultimate expression of this digital non-fixity. Its parts are never rendered into a finshed form, it is endlessly rewriteable, extensible, and reconfigurable...in short the web is endlessly dynamic and always unfinsihed.
This is more than just hyperbole. The modern web has moved gradually toward a realization of the potential these qualities promised.
The Old Days: About Five Years Ago.
In the old days we used to use HTML to markup all our HTML pages. Every time we wanted a new font, or a new size for a font or a border we'd use a markup tag to that stipulated the new size, the new font, bold, italic.
In other words we wrote the form into the content so the two were inseparable. Rewriting or reconfiguring those pages meant going through and changing each instance of a font change or any other change. We tended to use elaborate tables that divided content into seperate boxes or frames.
Many pages are still written this way. Because the form of these pages is written into and integrated with the content we can't easily grab the content and use it in another form, we can't customize the content according to user preference, we can't easily add to the content without repeating the task of writng in new form.
In order for the web to acieve the potential promised in those qualitites we discussed, its dynamism, extensibilty and configurabilty we need to seperate form from content and keep it seperate.
Cascading Style Sheets were introduced to answer that need. CSS allows us to take all that information about form and put it in a seperate file. The HTML can therefore be kept to holding content alone and that content can then be reconfigured, extended, and rewritten as much as we like.
When we use Styles we tell the content (images or text) in our HTML pages what it is not what it should look like. For example; we tell a section of text that its a heading rather than Helevetica 18px. Then in our CSS files we teel the whole site what form a heading should take (possibly Helevetica 18px).
It seems like we are adding a step here needlessly. But by identifying content semantically - according to what it means rather than how it looks we can change ALL the headings ALL at once rather than going through individually. By telling our HTML that some text requires emphasis rather than just telling it to display italics we can chage the from that emphasis takes throughout the site in one simple step. Powerful Huh?
Today we will learn how to make the most of all this seperation of form and content.
Its important to stick to the steps closely and accurately so we all get the most out of this exercise. You'll need the files your used last time and any extras you've developed.
Grab the unedited files from last week here.