|
|
|
In HTML, there are some coding styles which are considered to be better than others, especially when you are hand-coding.
You already know not to indent tags at this time; tag indenting should be postponed until current HTML standards have been fully implemented and older browsers have been completely retired. As long as we are supporting any version 4 browsers (IE or Netscape), tag indenting must be prohibited.
In addition, there is good coding style, and bad coding style. Good coding style is illustrated in the first and second examples following; weak coding style is illustrated in the third example following, and bad coding style is illustrated in the fourth example following.
Tags should either mark content like this (Style 1):
<tagname> Content </tagname>
Or like this (Style 2):
<tagname>Content</tagname>
Don't do this (Style 3 -- Weak):
<tagname> Content</tagname>
Or this (Style 4 -- Bad):
<tagname>Content </tagname>
Style 1: Use for tags marking structure, such as BODY, HEAD, TABLE, FORM, MAP, etc.
Style 2: Use for tags formatting text or pictures, particularly A, P, B, I, etc.
Style 3 -- Weak: This syntax will operate correctly for MOST tags (except P), but it proves hard to debug when code becomes complex and is considered poor form.
Style 4 -- Bad: This syntax follows terrible form, and will cause many tags to malfunction.
When all browsers are 100 percent standards-compliant, all four examples above will operate identically. Since current browsers do not render these four styles identically, however, you should restrict yourself to coding styles (1) and (2); in addition, coding styles (1) and (2) are much easier to debug when hand-coding.
If you follow a consistent coding practice, you will find it easier to edit and understand your code over the long haul.
As I introduce tags in this course, I will show you the correct form for that tag.
According to the XHTML standards, there may be no untagged text at the BODY tag level; all text must have some tag surrounding it.
The following code is correct because text in the BODY of an HTML page is formatted using the P tag:
<body> <p>Here is a paragraph of text.</p> </body>
The following code is incorrect because text is residing at the BODY tag level without the benefit of any tag surrounding it:
<body> Here is a paragraph of text. </body>
I mention this limitation because many currently-available HTML books, as well as some HTML instructors, do not observe this particular rule, which can be very confusing to beginning students. Remember, don't put text at the BODY level without some sort of tag surrounding it!
The P tag is something of a freak, because it MUST be coded in one particular manner in order to function properly on all browsers on all platforms.
Theoretically, either of the following coding styles should operate correctly for the P tag:
Style 1
<p> This is a paragraph of text. </p>
Style 2
<p>This is a paragraph of text.</p>
As it turns out, only Style 2 operates correctly on all browsers. Style 1 will break on some versions of Internet Explorer, even though the coding style in Style 1 is standards-compliant, and is recommended by me for many purposes.
Whenever formatting text specifically, therefore, it is usually important to follow coding style 2.
Remember: Laying out STRUCTURE, use coding style (1); formatting TEXT, use coding style (2).
In the future, carriage returns will be allowed inside of tags. According to XHTML standards, the following coding style is permissible:
<body
bgcolor="white"
text="black"
>
<p>
This is a paragraph of text.
</p>
</body>
Notice the indents and carriage returns inside the BODY tag, and the indented P tag with its indented content? Some programmers favor this style because it makes tags with many attributes easier to read; with child elements indented one level from their parent element, object-oriented structures can be much clearer as well. However, this syntax is not properly supported by all web browsers, so don't use it; you'll get VERY irregular results on older (version 4) browsers!
Never place carriage returns inside of an opening or closing tag. Don't indent tags.
 |
 |
Copyright © 2001 Michael Masumoto. All Rights Reserved.