Friday Link Round-up: Periodic HTML5 Problems and Pac-Man Demystified

It’s Friday, so here are a few random links and stories which caught my eye during the past week…

The HTML5 Periodic Table

This is glorious: it’s a list of all 104 HTML5 elements shown as a periodic table. Click any element for a brief description, links to the specification and other resources.

You can also enter a URL to show which elements were used to create the page — take a look at the analysis for SitePoint’s home page.

The table’s been created by Australian web developer Josh Duck. Great stuff.

Firefox 4.0, beta 4

The fourth beta of the fourth Firefox browser was released by Mozilla earlier this week. The main changes: improved HTML5 rendering, WebM video support, better plug-in crash protection, integrated tab and bookmark synchronization, “Panorama” — a grouped visual overview of your opened tabs, and many other features.

The browser also includes Direct2D graphics acceleration on Windows — something the IE team have been bragging about for a while. Mozilla has disabled it by default but, for the fully accelerated experience, set the following configuration options in about:config:

• mozilla.widget.render-mode — change to 6
• gfx.font_rendering.directwrite.enabled — set to true.

The HTML5 innerShiv

There’s a slightly peculiar problem in IE (aren’t they all). You can use HTML5 in the browser if you include the following JavaScript shiv:

<!--[if lt IE 9]>  
<script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script>  
<![endif]-->  

However, the shiv doesn’t work when an HTML5 element is added to a node using innerHTML then appended to the document, e.g.

var s = document.createElement('div');
s.innerHTML = "<section>Hi!</section>";
document.body.appendChild(s);

Fortunately, web developer Joe Bartlett has solved the problem with HTML5 innerShiv — a small function which makes IE happy again.

Safari Browser Extensions

Do you use Safari? Me neither, but we might be tempted now the browser has extensions enabled in version 5.0.1.

A few dozen extensions are available now but, since they’re built using HTML, CSS and JavaScript, you can expect many Chrome add-ons to migrate to Safari. If you feel like building one yourself, you’ll need to sign up to the Safari Developer Program. It’s free and Apple provide a comprehensive development guide.

The Pac-Man Dossier

This is a little off-topic, but do you know Pac-Man? The Pac-Man Dossier from Jamey Pittman will make you think again!

The page contains interesting facts for programmers and fans of the game. Did you know there are 256 levels, although every level beyond 21 is identical and level 256 is broken? Were you aware that each ghost has a different behavioral pattern? Have you discovered that eating a regular dot slows Pac-Man for 1/60 of a second so ghosts catch up quicker? Perhaps you didn’t care, but this is an amazing insight into how the game was developed 30 years ago.