First Steps in Formatting
The formatting of words has always been an integral part of the writing/ reading process: think about hand-written medieval manuscripts with their beautiful illuminated texts, or consider the design of the inside pages of contemporary novels or, indeed, of your essays and dissertations (page size, title page, contents, bibliography, font size, punctuation ...). We have become so familiar with certain print conventions that the medium has become largely transparent or, when it does assert itself we tend to 'feel' it as a sensual artifact ("I like taking books to bed").
A new medium such as the web demands self-conscious attention to the format of its text, and millions of words (print and online) are dedicated to the topic of 'web design'. More precisely, within the genre of web-specific fiction, formatting techniques are used to generate literary/ artistic meaning, and explicit attention to formatting is the first characteristic of web writing.
This lesson will teach you simple formatting:
To change the body colo(u)r you need to add the attribute to the < BODY > tag, like this:
< BODY BGCOLOR="black" >
You can specify the font colour by using the BODY tag:
< BODY BGCOLOR="black" TEXT="green" >
Or you can stipulate the attributes of different chunks of text throughout the body of the page.
You type the font tag at the beginning and end of your text to change features such as colour and size. For example:
< FONT COLOR="red" SIZE="4"> This is quite bold and bright < /FONT >
< B > bold < /B>
< I > italic < /I >
< U > underline < /U >
< H > Heading tags can be used from a large < H1> down to a very small font < H6 >, and tags must always be closed.
< H1 > BIG HEADING < /H1 >Try the out the other sizes, and note the space above and below the typed line.
< BR > This forces a line break.
< P > Starts a paragraph. Close like so: < /P >
< P > Then repeat to start the next paragraph, and pay attention to the line spacing that results from this technique. < /P >
< P> Are you getting the hang of this? It is quite a challenge to position text accurately with these basic techniques - not like word processing at all. Later on you can learn how to draw TABLES - a grid which enables the precise setting of web page elements - but, for now, see how much you can do with a few simple tricks. < /P >
< PRE >
This enables you to have some control over the positioning of text. BUT the font, as you see, is mono-type. Remember to close the tag.< /PRE >
Don't forget - there is no space between the brackets and the text inside.
and just for fun: < HR > draws a horizonal line across the page. No need to close this tag.
EXERCISEHave some fun and produce a web page that exploits the colour and font attributes you have learnt.
Take a piece of print writing - your own or a found text - and convert it into HTML. Stretch the simple techniques of this lesson. Focus on the process: play and make mistakes and see where such mistakes take you. When you have written something you like, or you get bored and want to move on, save your page in your WEBPAGES folder.
COLOUR: There are more complicated and subtle ways of choosing and writing colo(u)rs than by using their ordinary names. This involves specifying the 'hexadecimal' number of each of the 216 web-safe colo(u)rs. When you are ready, check out these pages by Kaz Madigan (opens in new browser). Click on the 'web safe colours' link.
In the next lesson we look at how to make links to other pages (your own pages and those already on the web).