Wednesday, 07 March 2007

Why Structural HTML matters

Having just learnt about xhtml, I am slightly intimidated by the thought of CSS (cascading style sheets). If it’s anything like learning to utilise basic xhtml, then it can only be challenging and ummm … fun? But, before I embark on my CSS adventure, I have to look at the theoretical aspect, namely why is it important from the perspective of design/style of a webpage, to critically think about the structure of your content, navigation and other sections?

In her discussion of web page design, Debolt[1], emphasises the need to separate the structural content and design when developing a web page. This is effectively done through the use of a Cascading Style Sheet (CSS), which may be defined as “a simple style sheet mechanism”[2] that allows web page developers and users the ability to attach style to web pages. A CSS basically functions to give web site developers more control over how web pages are displayed[3].

Debolt says that it is common for web page developers, when starting to think about creating a web page, to first think of what they want the layout and style of their pages to be with regard to colours and fonts. She, however, says that it is essential for web page developers to first consider the semantic organisation and structural content of their pages before beginning to think about visual presentation.

According to Debolt, the design of a web page is the least important aspect of web page development and that a great deal of attention needs to be placed on creating a well-structured html page that focuses on content, navigation and other sections. Without a well-structured and organised html page that logically sets out the content, navigation and other sections, a CSS cannot be utilised. Once an html page is well-structured and has been ordered into content blocks, these blocks can then be positioned and styled in any position on the page. Each content block in the html page can then be assigned colours, fonts, margins and backgrounds with the implementation of a CSS[4].

The chief advantage of a CSS is that it allows web page designers to better maintain the appearance of a web site[5]. Once a CSS has been created, it can be applied to any number of web pages and if the web page designer wants to change a specific stylistic element, he/she merely has to change the CSS without altering the structure of the html page[6]. However, a well-structured html page is essential to the smooth-functioning of a CSS. If your web page is not properly structured, the CSS will not work.

Another reason why it is important to think structurally about the content, navigation and other sections of a web page in terms of design and layout is that with the emergence of other digital mediums such as PDAs and cellphones, a well-structured html document is vital if it is to have the ability of being displayed in any digital medium. The use of a CSS allows for web pages to be more easily rendered on digital mediums such as PDAs and cellphones[7].

While web page styles and layouts may be fun and exciting, it is essential to first consider the structure of one’s html page. Without a well-structured html page, the CSS will not work and the presentation of one’s web page will be problematic.




[1] Debolt, V. 2004. “The Early Bird Catches the CSS: Planning Structural HTML”. Wise Women Tutorials. Retrieved 4 March, 2007 from the World Wide Web: http://www.wise-women.org/tutorials/cssplanning/index.shtml
[2] “Cascading Style Sheets” Web Developer’s Virtual Library. Retrieved 4 March, 2007 from the World Wide Web: http://www.wdvl.com/Authoring/Style/Sheets/
[3] “Cascading Style Sheet” Netlingo. Retrieved 4 March, 2007 from the World Wide Web: http://www.netlingo.com/lookup.cfm?term=CSS
[4] Debolt. 2004.
[5] See footnote 3
[6] See footnote 2
[7] Kelly, B. 2006. “Use of Cascading Style Sheets”. UKOLN. Retrieved 4 March, 2007 from the World Wide Web: http://www.ukoln.ac.uk/qa-focus/documents/briefings/briefing-34/html/

No comments: