Building sites

18th February 2000 at 00:00
I love newspapers for their looks - the infinite variation in balance between headline, photograph, and text - as well as for what they say.

In comparison, the design of webpages is constrained both by HTML, the language used to create them, and by the size of the monitor on which they are viewed.

Too many sites, trying to accommodate those viewing on laptops or small monitors, design pages with a fixed width. The result on a 17 or 19-inch monitor is a miserably pinched column with almost half the screen space unused. The alternative, which I prefer, is to make the page proportional, so that it voluptuously fills the width of the screen whatever the size. The downside of this is that the exact positioning of line-breaks is hard to determine as individual columns on the page shrink or broaden, depending on the screen size.

Too many people fight shy of HTML and let a program such as Frontpage do the work for them. This is silly, because learning the basics of HTML consists of little more than memorising a dozen or so tags, some of which are stunningly easy to remember. . LESS THAN LESS THAN

and . LESS THAN DI LESS THAN

are the tags for bold and italic, for instance. . LESS THAN LESS THAN P

is the paragraph tag and . LESS THAN LESS THAN H1

the largest heading or headline tag. Basic HTML sets the screen to display text in a size relative to the browser's settings. Anyone who has designed a web page will have been disappointed by the maximum default size of text displayed bythe . LESS THAN LESS THAN H1

tag. To produce larger text, some sites create image files, which can take more time to download.

The answer is to use a "cascading style sheet" - a collection of rules that defines how HTML tags should be displayed. In this way the . LESS THAN LESS THAN H1

tag can be set to display text of any size desired. But what should really grab the attention of designers of school websites is the ability of a style sheet to attribute background and border colours to different elements of the page. This means that it is easy to give a whole site a uniform colour theme, perhaps using the school's colours. An example of this can be seen on the main page of my children's books site www.achuka.co.ukindex2.html where each headline is displayed using the website's colour theme of green and pink. This is achieved with just six lines of style coding. The same effect could be achieved using tables, but it would be a nightmare to execute.

There are a number of online tutorials that will show you how to create a style sheet. The ones I have found most useful are: Webmonkey: http:hotwired.lycos.comwebmonkeyauthoringstylesheetstutorialstutorial 1.html Joe Expert: www.joeexpert.com John C Gilson: www.bfree.on.caHTMLlesson30.htm And when you've finished, another site - www.htmlhelp.comtoolscsscheck - will check it for you. For a handy listing of HTML tags and style sheet syntax, nothing can beat the Hip Pocket Guide to HTML4 (IDG Books pound;13.99).

MICHAEL THORN


Subscribe to get access to the content on this page.

If you are already a Tes/ Tes Scotland subscriber please log in with your username or email address to get full access to our back issues, CPD library and membership plus page.

Not a subscriber? Find out more about our subscription offers.
Subscribe now
Existing subscriber?
Enter subscription number

Comments

The guide by your side – ensuring you are always up to date with the latest in education.

Get Tes magazine online and delivered to your door. Stay up to date with the latest research, teacher innovation and insight, plus classroom tips and techniques with a Tes magazine subscription.
With a Tes magazine subscription you get exclusive access to our CPD library. Including our New Teachers’ special for NQTS, Ed Tech, How to Get a Job, Trip Planner, Ed Biz Special and all Tes back issues.

Subscribe now