CSS Convention

With the popularity of CSS, the Div tag has been painfully overused. Here is a list of HTML tags that will help you use HTML the way it was intended.

<abbr>

This HTML tag defines an abbreviated phrase.
The <abbr title=”Abbreviation”>Abbr.</abbr> HTML tag gives the full definition of  abbreviated text.
 
<acronym>

This HTML tag defines an acronym. The difference between an acronym and an abbreviation is that it can be spoken as if it was a word. Can I get this

<acronym title=”as soon as possible”>ASAP</acronym>
 
<address>

This HTML tag defines user contact information

<address>
        <a href=”
mailto:us@example.org”>Email us</a>
        Address: Box 564, NoWheresville
        Phone: 123-555-1234
</address>

<base>

This HTML tag specifies the default target for links or default address.

<head>
        <!– default address for images –>
        <base href=”
http://www.example.com/images/” />
      
        <!– default target for links –>
        <base target=”_blank” />
</head>

<body>
        <!–Actual address is
http://www.example.com/images/logo.gif –>
        <img src=”logo.gif” />
      
        <!– Target for link will be _blank –>
        <a href=”
http://www.example.com”>Link</a>
</body>

<blockquote>

This HTML tag defines a long quotation.

<blockquote>
        Lorem ipsum dolor sit amet,
        consectetur adipiscing elit.
        Morbi pellentesque vehicula porttitor.
        Nam turpis ante, volutpat id blandit eget.
</blockquote>
 
<cite>

This HTML tag defines a citation.

<cite>This is a citation.</cite> 
 
<del>

This HTML tag defines deleted text, default style is a strike through.

<del>This text is no longer relevant.</del>
 
<fieldset>

This HTML tag defines a border around elements in a form.
<form>
        <fieldset>
                Name: <input type=”text” size=”30″ />

                <p><input type=”submit” value=”Submit”></p>
        </fieldset>
</form>
 
<ins>

This HTML tag defines newly added content.The default style is an underline.

<ins>Recently updated content</ins>
  
<legend>

This HTML tag defines a caption for a form’s fieldset.
<form>
        <fieldset>
                <legend>This is a caption</legend>
                Name: <input type=”text” size=”30″ />

                <p><input type=”submit” value=”Submit”></p>
        </fieldset>
</form>
 

Hopefully these will help. Using the proper tags for the proper content makes sense of your content, and you can style them just as well as a Div. Start using these and make the web a more beautiful place for developers.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: