Home Webmaster SIG Tools & Tips

November 18, 2004 

W3C Standards & Specifications 
www.w3c.org    The Basic 7 Points

Version Date Description
HTML 1.0 1989-1994 The first public version of HTML which included browser support for inline images and text controls.
HTML 2.0 1995 The first version supported by all graphical browsers. It introduced interactive form elements such a option buttons and text boxes. A document written to the HTML 2.0 specifications is compatible with almost all browsers on the WWW.
HTML 3.0 1996 A proposed replacement that was never widely adopted.
HTML 3.2 1997 This version included additional support for creating and formatting tables and expanded the options for interactive form elements. It also supported limited programming using scripts.
HTML 4.01 1999 This version added support for style sheets to give Web designers greater control over page layout. It added new features to tables and forms and provide support for international features. This version also expanded HTML's scripting capability and added increased support for multimedia elements.
XHTML 1.0 2001 This version is a reformulation of HTML 4.01 in XML and combines the strength of HTML 4.0 with the power of XML. XHTML brings the rigor of XML to Web pages and provides standards for more robust Web content on a wide range of browser platforms.
XHTML 1.1 2002 A minor update to XHTML 1.0 that allows for modularity and simplifies writing extensions to the language.
XHTML 2.0 2004 The latest version, designed to remove most of the presentation features left in HTML.
 

Short Version:    The HTML tag is to be used to inform the browser of content
                           Styles is to inform how to render that content

Examples of Changes Regarding Style Attribute:

  1. <Center>
    <H1>Sale</H1>
    </Center>
     
  2. <H1 align="center">Sale</H1>
     
  3. <h1 style="text-align: center">Sale</h1>
     

Examples of Changes Regarding Tags:

  1. No Change to two-sided tags

    <element>content</element>      <p>Write your paragraph</p>

     
  2. Change to one-sided tags

    <element />       <hr />   <br />

     
  3. All tags to be written in lower case!


Element Attribute Examples:

  1. Paragraphs

    <p>

    <p id="title">Write your text.</p>

    <p style="text-align: center">Write your text.</p>    (left, center, right, justify)
     
  2. Ordered List

    <ol style="list-style-type: lower-alpha">
    <li>Item
    <li>Item
    </ol

    (disc, circle, square, dicimal, decimal-leading-zero, lower-roman, upper-roman, lower-alpha, upper-level, none)

    <ol style="list-style-image: url(file)">

     
  3. Definition List

    <dl>
    <dt>Conceptual Chemistry</dt>
    <dd>An introductory course requiring basic mathematics.</dd>
    </dl>

    Conceptual Chemistry
         An introductory course requiring basic mathematics.

     
  4. Insert an Image

    <img src="file" alt="text" />

     
  5. Insert Horizontal Line

    <hr style="color: color; width: value; height: value" />  
                                                               (Color is RGB  or name color value)

    <hr color="color" size="value" width="value"  />   (#FFFFFF color value)

     
  6. You are familiar with META tag format

    <meta name="author" content="John Henderson" />
     
  7. Bookmarks

    Link:  <a href="#contact">Contact Us</a>

     - - - - - - - - - -

    <a name="contact"><h2>Contact Us</h2></a>     Current
    <h2 id="contact">Contact Us</h2>                        New XHTML
     

Logical elements versus Physical elements
    What is the purpose of the element in the document?

Inline Element Identifies Visual Appearance
<abbr>   </abbr> an abbreviation Plain text
<acronym>   </acronym> an acronym Plain text
<b>   </b> boldfaced test Boldfaced Text
<big>   </big> big text Larger text
<cite>   </cite> a citation Italicized text
<code>   </code> program code text Fixed width text
<del>   </del> deleted text Strikethrough text
<dfn>   </dfn> a definition term Italicized text
<em>   </em> emphasized text Italicized text
<i>   </i> italicized text Italicized text
<ins>   </ins> inserted text Underlined text
<kbd>   </kbd> keyboard style text Fixed width text
<q>   </q> quoted text "Quoted text"
<s>   </s> strikethrough text Strikethrough text
<samp>   </samp> sample computer code Fixed width text
<small>   </small> small text Smaller text
<span>   </span> a generic inline element Plain text
<strike>   </strike> strikethrough text Strikethrough text
<strong>   </strong> strong emphasized content Boldfaced Text
<sub>   </sub> subscript Subscripted text
<sup>   </sup> superscripted Subscripted text
<tt>   </tt> teletype text Fixed width text
<u>   </u> underlined text Underlined text
<var>   </var> programming variables Italicized text
  1. Logical:  <cite>   An area of the page for listing page references
     
  2. Physical:  <i> or <b>  Displaying the reference in italic or bold


     

Tips for HTML Code

  • Use line breaks and indented text to make your HTML file easier to read
  • Insert comments into your HTML file to document your work
          <!-- Written by John Henderson
           --->
  • Enter all tags and attributes in lowercase
  • Place all attribute values in quotes
  • Close all two-sided tags
  • Make sure that nested elements do not cross
           <i>This is <bold>important!</i></bold>    Wrong
           <i>This is <bold>important!</bold></i>    Correct
  • Use styles in place of presentational attributes when ever possible
  • Use logical elements to describe an element's content. Use physical elements to describe the element's appearance.

Return to page top