Html is a relatively simple technology to learn, so easy in fact that once people get just a very basic understanding, they jump into building web pages without much thought about learning anything more about the fundamentals of HTML. As such, most web designers are not taking full advantage of HTML and CSS, wasting their time, money, and generally making their lives more difficult.

The differences between logical and physical tags is one of the fundamental concepts in HTML that, when understood, can have a huge impact on a web designer's way of doing things.

Logical Inline Tags vs. Physical Inline Tags

Logical Tags:

In HTML there are both logical tags and physical tags. Logical tags are designed to describe (to the browser) the enclosed text's meaning. An example of a logical tag is the <strong> </strong> tag. By placing text in between these tags you are telling the browser that the text has some greater importance. By default all browsers make the text appear bold when in between the <strong> and </strong> tags, but the point to take away from this is that the strong tag implies that importance of that text. This has impact with search engines like Google who look for such tags to help figure out what the page is about.

There are many logical tags and they include:

<strong> : Strong - as above.

<em> : emphasize - usually renders (made to look like by the browsers) as italic.

<span> : a neutral inline container. - read about this distinction below.

<div> : a neutral block element. - read about this distinction below.

Logical tags, as mentioned above, have default ways in which browsers (like IE or Opera) render them. But it is understood that CSS should be used to give them their style, or in other words their 'look'.