Divitis – Too Much Div’s… why? (Follow Semantics)

Divitis

Div?

Div means division. Div is HTML tag that is used put content into sections that goes together. It broadly breaks a HTML structure into Header, Body, Sidebars and Footer etc.

Divitis ?

Divitis is a term used to define the excessive use of <div> tags into your HTML document.

Generally the frond end programmers or designers who don’t know or understand the semantic meaning of other block level elements often use more and more div’s. Some programmers assumes that there is No problem in using N no of <div>’s and it will not effect any thing in the structure or with the layout. True or False?

  • If True where is the Flexibility and why W3C define other elements to describe your components onto the web (<p>,<span>,<h1> etc)

Ex- For a paragraph we have <p> tag, which is corresponding to put the text in paragraph manner.

If one will warp the text into a <div> instead of  <p> there is no use of other available tags.

  • If False there is No doubt to say you are Correct and you are very good at understanding of Semantics….

Include perfection and create your structure flexible –

Do’s

  1. Make full use of available HTML tags
  2. Consider whether a container div is really necessary
  3. Make full use of CSS selectors
  4. Reconsider your browser support standards
  5. Reconsider your design choices

Wake Up –

A block example having head,text and a link.

Divitis way -

<div class=”container”>

<div class=”head”>My Heading</div>

<div class=”body”>

<div class=”text”> Text goes here </div>

</div>

</div>

Good Semantics  -

<div class=”container”>

<h1>My Heading</h1>

<p>My Paragraph</p>

</div>

This was just a short article on the best practices that we keep in mind at E-nova Technologies offshore web agency Dev Team. We hope that it will be of some use for you. Please leave comments.

Rahul
Web Developer E-nova Technologies

Related Posts:

Tags: , , , , , ,

Leave a Reply

CommentLuv Enabled

Notify me of followup comments via e-mail. You can also subscribe without commenting.