Welcome to, the number one resource for all news, information, and happenings regarding HTML.

Updates: has just been relaunched. Subscribe to our RSS Feed to stay on top of HTML news and techniques.

Semantic HTML

Author: Editor | Files under HTML Tutorials
Tags for this article: , , , , ,

To begin with, there is no existence of a term called “Semantic HTML” in Hyper Text Markup Language. Basically, the term is in reference to the effort made to produce documents in HTML which are completely devoted to the writer’s intended meaning without any slight indication as to how the meaning is being conveyed. If one tries to draw a comparison between the emphasis element (<em>) and the italics element (<i>), it can be observed that the emphasis element is drawn in italics bringing in a lot of typical similarity into the presentation.

But what really makes the difference is the same element of presentation that was talked above. A classic example of this would be a book title which would be displayed in a different element than emphasized text, which would again be displayed in a different element so that both of them end up looking unique just like their meanings.

Semantic HTML basically requires two things while working on:

. Avoidance of the use of presentational markup, i.e. attributes, elements and other entities.
. Creation of a visible difference between the structure of the document and the meaning of the phrases by making use of the available markup.

This form of HTML also requires some minute specifications and compliance of software. The development of CSS (Cascading Style Sheets) has in many ways increased the demand of semantic HTML as the CSS caters to the needs of the designers by providing them with a rich language enabling them to alter the presentation of the documentation prepared on semantic HTML. The need for inclusion of presentational properties in a document has been virtually eliminated with the eventual development of CSS. Using semantic HTML not only leads to consistency in representation of phrases and statements having the same meaning but also gives the authors the freedom from the mentally draining concern of the details of presentation.

An example might make things easier. The number 2, when being written should be written in words as two or in numeric form as 2? In this case, the semantic markup might portray it as <number>2</number> and let the stylesheet designers do the honors when it comes to presentation details.
So if this is co-related to the authors, then all they need to do is indicate quotations and stop thinking about presentations.

Another additional advantage is the repurposing of documents that can be done and the allotment of device independence. The pairing of a semantic HTML document can be done with any number of sheets so that the output comes on the computer screens via web browsers, devices that can be handheld and also printers having a high resolution. Not many changes are required in an HTML document to accomplish this feat as the readily available stylesheets simplify this by pairing semantic HTML documents with appropriate stylesheets.

There are certain aspects of authoring documents which make the separation of semantics from presentation complicated. One can also find certain hybrid elements which make use of presentation in their very meaning. The separation of the actual meaning from their presentation becomes tough in case of these types of elements. But for many, the process of translation becomes extremely smooth.