Attention Firefox 2 user: your browser is out of date. Please visit http://getfirefox.com to get the newest version!

webbunny tumblelog

 
10 HTML5 Games Paving The Way

HTML5 is still a developing technology and we’re barley beginning to see its capabilities in more advanced uses such as games. Though HTML5 isn’t even in its infancy yet, it’s beginning to emerge and here are 10 HTML5 games paving the way.

 
The real situation is that today, two and a half years after the iPhone debuted, web developers can no longer count on every viewer being able to render Flash. The percentage of web user agents with Flash installed is now going down, not up. My money says that trend is permanent, and further, it’ll reach a tipping point in the not-so-distant future and Flash will turn into something like Internet Explorer.
John Gruber
 
How would you use flash on an iPad or iPhone though? Anything Flash that requires the keyboard and the mouse at the same time wouldn’t work… Anything that uses arrow keys wouldn’t work… Hovering over controls for drop down menus on flash websites wouldn’t work… Enabling Flash wouldn’t do ***** all but enable ads, why exactly do we want this so bad?
One of the best arguments against flash on the iPhone/iPad yet (apart from the fact that flash is not a web standard, not open source, slow and buggy on the Mac and is fast becoming obselete)
 
No, no, no! You’re doing it wrong!

You may want orange text, and that may be a lovely orange, but this is completely the wrong way to go about doing it. The whole point of CSS is that it should be a separate layer of styling which is added to your website, and can be interchangeable. You should be able to change the colour of that orange text some day.

To use a class name such as ‘orangetext’ you are completely missing the point. When it comes to changing that orange to perhaps a blue or green, you are going to either:
Have something in your HTML called ‘orangetext’ that is blue, causing confusion to anyone else looking at your code (and to your future self, when you forget why you did this)
Or you have to go through your website replacing ‘orangetext’ with something elseNeither of these outcomes are desirable.

So what should I do?

Solution 1: Use class and id names that describe the content, not the presentation. Perhaps simply use the <em> tag, which implies an emphasis; or <strong>, which implies a strong emphasis

Solution 2: Use HTML5 and CSS3 to completely eradicate class names. It can be done (that website has no <divs>, no classes, no ids). This not only makes your code future-proof, but also beautiful.I have not yet got to the point where I am building websites without classes (one major hurdle is Internet Explorer support, as usual) but at the very least you should make sure your class names are representative of the content and not the presentation. A couple of examples follow:

BAD: <span class='orangetext'>     GOOD: <em>
BAD: <p class='title'>     GOOD: <h1>

No, no, no! You’re doing it wrong!

You may want orange text, and that may be a lovely orange, but this is completely the wrong way to go about doing it. The whole point of CSS is that it should be a separate layer of styling which is added to your website, and can be interchangeable. You should be able to change the colour of that orange text some day.

To use a class name such as ‘orangetext’ you are completely missing the point. When it comes to changing that orange to perhaps a blue or green, you are going to either:

  • Have something in your HTML called ‘orangetext’ that is blue, causing confusion to anyone else looking at your code (and to your future self, when you forget why you did this)
  • Or you have to go through your website replacing ‘orangetext’ with something else

Neither of these outcomes are desirable.

So what should I do?

  • Solution 1: Use class and id names that describe the content, not the presentation. Perhaps simply use the <em> tag, which implies an emphasis; or <strong>, which implies a strong emphasis
  • Solution 2: Use HTML5 and CSS3 to completely eradicate class names. It can be done (that website has no <divs>, no classes, no ids). This not only makes your code future-proof, but also beautiful.

I have not yet got to the point where I am building websites without classes (one major hurdle is Internet Explorer support, as usual) but at the very least you should make sure your class names are representative of the content and not the presentation. A couple of examples follow:

BAD: <span class='orangetext'>     GOOD: <em>
BAD: <p class='title'>     GOOD: <h1>

 
If Daring Fireball looks goofy in your browser, you’re likely using a shitty browser that doesn’t support web standards. Internet Explorer, I’m looking in your direction. If you complain about this, I will laugh at you, because I do not care. If, however, you are using a modern, standards-compliant browser and have trouble viewing or reading Daring Fireball, please do let me know.
John Gruber’s bit on Web Standards. Love it. (Daring Fireball: Colophon)

about shaun…

Name: Shaun Robinson

Age: 25

Occupation: Web Designer / Developer

Location: Ipswich, United Kingdom

Living with: My partner Andrew, and two kids Elliot and Oliver.

contact me