Skip to content


Basic HTML page template

I’m taking a break from conference websites to confess one of my (many) bad web designer habits.

I still hand-roll everything in vi. Which isn’t the bad habit, as most of what I do is heavily script-oriented. However last night I had to create a page in a hurry, and did my usual hand typing of

<html><head><title>...</title></head><body>...</body></html>

which is adequate, but could be better. It also is time consuming when doing something urgent (Like a service outage page, in this case). I remembered a friend of mine used to keep a blank page template to make sure all his pages started life as valid documents.  I think that’d be a useful habit to get into, and that this blog post may be a convenient place to keep it. I’ll update the template below if I get any good suggestions:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
  <title>..</title>
  <style type="text/css">
    body { font-family: sans-serif; }
  </style>
</head>
<body>
  <h1>..</h1>
</body>
</html>

At this stage I’ve not put in an meta tags. I’m considering an http-equiv text/html; charset=urf8

Posted in Best Practice, Templates.


8 Responses

Stay in touch with the conversation, subscribe to the RSS feed for comments on this post.

  1. Ian Stuart says

    Transitional? Go on… push the envelope and code for Strict 😉

  2. Richard M. Davis says

    Careful with that metatag, Eugene!

    Seems to me a neat précis of the difference between HTML and XHTML – and between the Old Web, and whatever today’s name is for the New One (2.0, 3.0, Semantic, etc): one you could handcode from memory, the other not so much (readable, yes, writeable, hardly). Like you I’ve been bashing out quick templates of the first kind for years, but now you really need an XML editor/IDE/CMS to have a chance of doing it right first time.

    The world’s moved on, obviously – but it was the ease with which working (if not necessarily valid) HTML could once be bashed out – in Notepad or vi – that made the Web work. Microformatted semantic goodness comes at a price.

  3. Dave Dupplaw says

    Any reason you didn’t go for XHTML Strict instead of Transitional?

    • Christopher Gutteridge says

      Yes, it’s intended for pages being written by hand, often in a hurry. I’m not going to manage to write anything close to XHTML-strict without a textbook.

  4. JAMIE says

    I’ve been looking all over for this!

    Thanks.

  5. Randolf says

    Thanks. I used it, but I must admit that it doesn’t yet look too pretty on http://www.macs.co.za/

    I’m just looking for a template that uses some header CSS formatting to create a page really fast that does not look like pre 2001 but has a big formatted title, pretty colours, fonts to setup a page in a hurry with no externcal css files to upload…



Some HTML is OK

or, reply to this post via trackback.