Good HTML structure is based on logic, order, and using semantically correct markup. If you have a heading use the heading element, beginning with the H1 element. If you have a paragraph, use a paragraph element. If you have a list, use a list item element. If you’re quoting a few lines, use a blockquote element. Those elements provide meaning to the content, making them semantically correct, in addition to being solid HTML structure.

Semantic HTML does not only relate to content, element and it’s relation.  At the time of writing HTML we should not think about styling the content.  Like many people code their HTML on the basis of their styling because the structure of the page should be the same even without using the CSS. For example, on most of the sites, you can see that there are 2 columns and the second column is placed in the first HTML structure so that at the time of styling, they would give float:left; to the first column, in that way it will save one declaration and even their time but in any case if CSS file does not load then the column’s places would be reversed. So this is not a good sign of semantic HTML. For more reference see the book “Pro CSS Techniques” by Jeff Croft, Ian Lioyd and Dan Rubin.

I am refering  2 urls related to the first paragraph.
http://www.webdesignfromscratch.com/html-css/semantic-html/.
http://brainstormsandraves.com/articles/semantics/structure/.

Latest posts by Sraddha Agrawal

  • Share/Bookmark