The KIRUPA orange logo! A stylized orange made to look like a glass of orange juice! Tutorials Books Videos Forums

Change the theme! Search!
Rambo ftw!

Customize Theme


Color

Background


Done

Revisiting Some (Old) Tags in HTML5

by kirupa   |   6 March 2011 (updated on 12 September 2012)

  Have questions? Discuss this HTML5 tutorial with others on the forums.

There are many changes HTML 5 brings to the table that earlier incarnations of HTML, CSS, and even JS may not have provided. While everyone tends to focus only on the changes that have been added, there have been some changes made to things such as tags that you use frequently.

In this short article, let's look at the changes that your existing HTML tags may need to undergo on the path to HTML 5 greatness.

Doctype Declaration

At the very top of your page, you will have a doctype declaration that lets your browser know how to read your page. Pre-HTML 5, you may have used a doctype declaration that looked as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

There were several variations depending on which HTML or XHTML version you were targeting. In HTML 5, the declaration has been simplified to the following:

<!DOCTYPE html>

There are no weird modifiers or anything beyond the word html.

The Charset Meta Tag

The charset meta tag is no longer what it used to be. It used to be more elaborate:

<meta content="text/html; charset=utf-8" http-equiv="Content-Type">

Given that only two people in the world knew what the content and http-equiv tags even did, in HTML5, it has been shortened down to:

<meta charset="utf-8">

The most common charset value is utf-8, and you can read more about it in the UTF-8 Wikipedia article.

Style Tag

In the past, your style tag may have looked as follows:

<style type="text/css"> 
.fontModifier { 
	font-family: Arial, Helvetica, sans-serif; 
	font-size: large;
} 
</style>

In HTML 5, you can ignore the type attribute and its value and just go with only style:

<style> 
.fontModifier { 
	font-family: Arial, Helvetica, sans-serif; 
	font-size: large;
} 
</style>

This simplification makes sense, for when was the last time anything under than CSS (which is text based) was used for styling a page?

Script Tags

You used to be able to specify the language in your script declarations:

<script language="JavaScript"> 
	launchNewWindow(); 
</script>

 In HTML5, your script tag is literally just a script tag:

<script> 
	launchNewWindow(); 
</script>

This applies to any external script files you may be interested in referencing as well:

<script src="kirupaUIScripts.js"></script>

If you have been dying to use vbscript in your pages, you are going to be out of luck. Sigh.

Conclusion

That's all there is to this list for now. While the number of changes to the HTML 5 specification have slowed down, there may be some changes down the road where this list may grow or shrink depending on the nature of those changes.

Just a final word before we wrap up. If you have a question and/or want to be part of a friendly, collaborative community of over 220k other developers like yourself, post on the forums for a quick response!

Kirupa's signature!

The KIRUPA Newsletter

Thought provoking content that lives at the intersection of design 🎨, development 🤖, and business 💰 - delivered weekly to over a bazillion subscribers!

SUBSCRIBE NOW

Serving you freshly baked content since 1998!
Killer icons by Dark Project Studios

Twitter Youtube Facebook Pinterest Instagram Github