Tell me more ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.
up vote 6 down vote favorite
3

I want to know what HTML tags are "compulsory" a web-page should have, in order for it to be displayed by a web-browser.

Also, what is the difference between different versions of HTML, in general?

share|improve this question

4 Answers

up vote 13 down vote

The absolute minimum HTML you need to create a page that the W3C's validator considers valid is:

<!doctype html><title></title>

The doctype declaration says that we're using HTML5. The <title> tag would contain the page title. However, since such a page is practically useless, it's much more common to see a simple document structure containing <head> and <body> tags, like this:

<!doctype html>
<html>
    <head>
        <title>Your page title</title>
    </head>
    <body>
        <p>Your page content</p>
    </body>
</html>

You can improve on this further by telling the browser that we're using a UTF-8 character set, and that the primary language of the document is English:

<!doctype html>
<html lang="en">        
    <head>
        <meta charset="utf-8">
        <title>Your page title</title>
    </head>
    <body>
        <p>Your page content</p>
    </body>
</html>

Next, we'll add an external stylesheet and tell Internet Explorer to use the Chrome Frame Plugin if the visitor's using it, which tends to improve page layout glitches:

<!doctype html>
<html lang="en">        
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

        <title>Your page title</title>
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <p>Your page content</p>
    </body>
</html>

This is now approaching the minimum I'd start with. In practice, I'd normally set up a container div element called "content" to hold the rest of my layout:

<!doctype html>
<html lang="en">        
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

        <title>Your page title</title>
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <div id="content">
            <p>Your page content</p>
        </div>
    </body>
</html>

This gives you more control over the central page element -- you can centre all page content (and have a full-width background image in the page body) by editing your style.css file to look like this:

#content{
    width: 960px;
    margin: 0 auto;
}

Regarding different HTML versions, they are simply incremental revisions. 'HTML5' is the fifth revision of the HTML specification, with a wide range of differences and improvements over HTML4. As such, it almost always makes sense to use the latest version (by starting your document with <!doctype html>) when you can.

share|improve this answer
Is the meta tag for IE useful? Doesn't IE render with the latest version by default? – Kevin Jun 23 '11 at 12:23
@Kevin You're right. On its own, IE=edge isn't necessary. But, at the moment, IE=edge,chrome=1 is the only way to tell IE visitors using the Google Chrome Frame plug-in that you want their browser to render the page with the Chrome engine instead of the latest IE one. Since that usually results in a better experience for those users, I got into the habit of including it on all of my projects. But it's certainly not compulsory. Have updated my answer accordingly. – Nick Jun 23 '11 at 12:56
1  
The edge seems redundant, wouldn't IE=chrome=1 be suffice? This has nothing to do with your answer(+1), I just became curious :). – Kevin Jun 23 '11 at 13:45
@Kevin You're absolutely right (+1). You can just use chrome=1. I added edge because both the Chrome Frame docs and the HTML5 Boilerplate mention it. You're completely right to question it, though; there is little point to include edge that I can find. Microsoft's official docs don't appear to help either. – Nick Jun 23 '11 at 14:04
up vote 3 down vote

I'm going to say none.

I want to know what HTML tags are "compulsory" a web-page should have, in order for it to be displayed by a web-browser.

Just create a .html file and put in it:

Hello world

It will display in all web browsers. If you want to drop lines:

Hello world<br><br>This is my next paragraph

I'd say that's the bare minimum as a direct and probably unpopular answer to your question. The other answers have more what you should have as a standards compliant minimum.

share|improve this answer
1  
+1 for answering the actual question that was asked, and not just pushing what we know-it-alls hold up our nose about. – Mufasa Jun 23 '11 at 22:27
up vote 2 down vote

The bare essentials you need for a valid HTML5 document, as oulined in Bruce Lawson's blog are

<!doctype html>
<html lang=en>
<meta charset=utf-8>
<title>blah</title>
<body>
<p>I'm the content

The unclosed <html>, <body> and <p> elements are invalid in older versions of HTML though (specifically XHTML1), so Bruce recommends closing these and also including a <head> section.

In reality any web page that has more than just a few paragraph of text will also heavily use <div> elements to lay out content, as well as <a href="link"> (anchor) tags for hyperlinks and probably <img src="image.jpg"> for images.

The website html5.org has a useful list of all currently valid HTML elements, including the new HTML5 ones.

share|improve this answer
up vote 1 down vote

By the letter of the HTML 4.01 standard, the only compulsory element is <title> (with a corresponding </title> tag), however browsers will display as HTML anything that looks like HTML* or is served with a text/html content type.

  • ‘Looking like HTML’ is a browser-dependant heuristic.
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.