What Markup Actually Does On A Web Page

by John Medina August 8th, 2014 

HTML Markup. To the end user, it's pretty much invisible. Usually we take it for granted or forget that it's there, doing its thing behind the scenes. It's easy forget that there is so much more to a web page than just visible content. What we see in our browsers is only a part of what the computer sees.

So, if we don't always see what HTML tags do, what are they doing?

Tags — like <title>, <h>, <p>, and others — but all have a common purpose: they are containers that define the function and hierarchy of their contents. Some of these tags have attributes. Those attributes can further define the role, relationship, or unique identity of that particular element.

html5layout

Tags can even serve meta information — content about content — an abstraction of the document itself, much like the synopsis on the back of a novel.

HTML Markup tells browsers what a container is. A title? A paragraph? Emphasised text? A link? CSS markup (or rules) tells the browser how to display each of those containers.

When a web page has logical HTML markup that follows the flow of the document it displays, you can remove all the CSS (styling) and it would still remain readable. On other sites that follow a less logical, less organized markup, entire pages could end up terribly messy, making the site difficult to navigate.

SNAGHTML8a05ace6

SEP page with CSS…

SNAGHTML8a06a8ab

The same page without CSS

SNAGHTML8a0a9dba

The heavier in "style" a page is, the less it "works" without (CSS) styling[/caption

SNAGHTML8a0bbe4dWithout the CSS this page falls apart in loose elements

You May Also Like

Leave a Reply