HOW TO BUILD A PROFESSIONAL WEB SITE     Rel. 1.1

LESSON 04 - Chapter g

How to build a Professional Web Site by Carlo Scodanibbio Valid XHTML 1.0!
home course program course leader enquiries enrol testimonials download

Lessons
welcome
1 - chapter a
1 - chapter b
1 - chapter c
1 - chapter d
1 - chapter e
1 - chapter f
1 - chapter g
1 - chapter h
1 - chapter i
1 - chapter j
1 - chapter k
2 - chapter a
2 - chapter b
2 - chapter c
2 - chapter d
2 - chapter e
2 - chapter f
2 - chapter g
2 - chapter h
3 - chapter a
3 - chapter b
3 - chapter c
3 - chapter d
3 - chapter e
3 - chapter f
3 - chapter g
3 - chapter h
4 - chapter a
4 - chapter b
4 - chapter c
4 - chapter d
4 - chapter e
4 - chapter f
4 - chapter g
4 - chapter h
4 - chapter i
4 - chapter j
4 - chapter k
5 - chapter a
5 - chapter b
5 - chapter c
5 - chapter d
5 - chapter e
5 - chapter f
5 - chapter g
6 - chapter a

other formatting tools : preformatting

As said before, the Browser doesn't understand formatting, it just displays text in a steady stream, unless you make appropriate use of the BR and P Tags and the   Special Character.
So, for instance, this code:

<BODY BGCOLOR="#FFFFFF">


 x | o | x
- - - - - - -
 o | x | o
- - - - - - -
 x | o | x
</BODY>

would be displayed by the Browser as a continuously flowing string of text like this:

x | o | x - - - - - - - o | x | o - - - - - - - x | o | x

But with the <PRE> PREFORMAT Tag and, generally, on condition that a TT type of Font is used, it is possible to transform the Browser into a more human and friendly tool, and make it display our stuff the way we type it. For instance, this code:

img

would be displayed by the majority of Browsers like this:

img

and this code:

img

would be rendered like this:

img

REMARKS:

  • You may notice that in both cases I have "forced" a monospaced font (Tag TT), but in the one case outside the PRE Tag and in the other case inside. Obviously, in both cases I have respected the nesting rule.
    Now, which fashion is the correct one ?
    According to the HTML Standard the right way is to have your PRE Tag outerly, containing the TT Tag (which is then innerly) - like in the last example.
    Browsers display well your work irrespective of the correct relative positioning of the 2 Tags.
    With most recent Browsers you don't even need to use the TT Tag at all: when you insert a PRE Tag modern Browsers will force automatically the use of a monospaced font.
  • In any case, the use of the PRE Tag is a delicate issue. I do not recommend its use at all, especially if you had in mind to get rid of the classic formatting tools (BR, P and &nbsp;). DON'T DO THAT !!!!
  • However its use (with some risk) is necessary in certain cases. I may mention two:
    1 - the one case is for displaying textual works of modern art (like the little face in the second example above) - in fact there are Web Sites that have become popular because they publish collections of these computerised masterpieces
    2 - the other case is to display programming language scripts, like for instance JavaScripts: being space sensitive, they must be displayed as they are typed. Doing it with formatting tags like BR and P and &nbsp; would be a pain in the neck. So the PRE Tag is just ideal.
    An example of (part of) a JavaScript is below, rendered as it should through a pair of PRE Tags.
if(!window.JSFX)
	JSFX=new Object();
if(!JSFX.Browser)
	JSFX.Browser = new Object();

JSFX.Browser.mouseX = 0;
JSFX.Browser.mouseY = 0;

if(navigator.appName.indexOf("Netscape") != -1)
{
	JSFX.Browser.captureMouseXY = function (evnt) 
	{
		JSFX.Browser.mouseX=evnt.pageX;
		JSFX.Browser.mouseY=evnt.pageY;
	}

Huh, huh, heavy stuff this.....

And this is all for the PRE Tag.


previousgo back to previous chapter shut-down this HTML story ! go to next chapter - if you still have enough energy....next

http://webbuildcourse.tripod.com

full details of this Course at
http://www.scodanibbio.com/webbuild


Copyright © 2001 onwards Carlo Scodanibbio | All Rights Reserved