HTML And XHTML Doctypes

I was working on a web page generation program recently and was looking for a way to present different versions of the same page with slight differences in the markup and styles. Although using the iframe element came to mind I wasn't keen on rendering out lots of different versions of the page and then referencing them individually in each iframe. I did think about creating using an API to send back each page on request but I thought that this might just overcomplicate the program.

After a little bit of research I came across the srcdoc attribute of the iframe, which solved the problem quite neatly.

The iframe is normally used with a src attribute, which points to some external page. The following example will render the page at example.com within the page.

If you are running FireFox (or Chrome) then there is a handy little short cut you can use to view the source of a page you are looking at. If you add the text view-source on any web address then you will see the equivalent of viewing the source of a page (perhaps by pressing Ctrl+u). Although not entirely useful, it does have a couple of benefits, such as being able to view your code in another tab, rather than another window.

Unfortunately, this only works in FireFox up to the latest version (currently 3). I have tested this in IE 7, Opera and Safari and they all complain about invalid protocols. Apparently it used to work in IE 6 before SP2, but was removed with that patch. This leads me to believe that it is not really a protocol, but a command that the browser understands on a local level. Much in the same way as about:config works.

To get a webpage to refresh every few seconds you can use a meta tag with the attribute http-equiv and a value of refresh. The number of seconds to delay can be put into the content attribute. This meta tag (as will all meta tags) goes into the head section of the document.

Here is an example that refreshes the page every 2 seconds.

<meta http-equiv="refresh" content="2" />

It is also possible to make the browser refresh to another page by including the string:

url=url or filename

Within the content attribute. Here is an example that redirects the page to google.com after a 5 second delay.

<meta http-equiv="refresh" content="5;url=http://www.google.com" />

To include a JavaScript file into a HTML page you can use the script tag with the src parameter pointing towards the source code file. However, there is a subtle difference between the script tag in HTML and XHTML. This is because the language attribute is not supported in XHTML, so if you just copy the code from HTML to XHTML the page won't validate. The solution here is to just leave it out.

For HTML

<script language="JavaScript" type="text/javascript" src="scripts/javascript.js"></script>

For XHTML

<script type="text/javascript" src="scripts/javascript.js"></script>

The type attribute is the mime type of the script, which is always text/javascript. Although there is come discussion about what the mime type is supposed to be, best results are usually obtained by just sticking with text/javascript.

Adding a hyper link for an RSS or Atom feed on your web page works, but that's not all you can do. By adding a link to the head section of the page you can allow your users an alternative method of picking up your feed.

To add an RSS feed use this.

<link rel="alternate" type="application/rss+xml" href="http://www.example.com/rssfeed.xml" />

To add an Atom feed use this.

<link rel="alternate" type="application/atom+xml" href="http://www.example.com/blog/wp-atom.php" />

These are both XHTML examples. To do this in HTML just remove the slash on the right hand side like this.