Home » Archive

Articles Archive for July 2010

Cool & Future Tech, Featured, Headline, html5, Web Experiments »

[24 Jul 2010 | 4 Comments | ]
Create CSS Rules from an HTML5 Canvas

Here I show how you can re-use your Canvas images as CSS backgrounds using another interesting feature coming in HTML5. You’ll need a browser supporting CSS3 and Canvas, Chrome, Opera, Safari or Firefox will do.

Cool & Future Tech, Featured, Headline, html5, Web Development, Web Experiments »

[21 Jul 2010 | One Comment | ]
Identicon5 – Identicons using HTML5 Canvas & JQuery

What do you get when you combine Digital Identity, MD5 Hashes, the Canvas element, JQuery and Quilting? Answer: My first JQuery plugin – “Identicon5″ for want of a better name.
Identicon5 is a JQuery plugin that takes an MD5 hash and converts it to a unique image. It’s called Identicon5 since it works through the HTML5 Canvas element.
Working Demo is here: http://francisshanahan.com/identicon5/test.html
Project page is here: http://francisshanahan.com/index.php/identicon5
JQuery Plugin page is here: http://plugins.jquery.com/project/identicon5
Identicons provide a nice visual representation of a user’s identity, that’s unique to that user, without divulging any …

Cool & Future Tech, Featured, Headline, Web Development »

[15 Jul 2010 | No Comment | ]
New Input Types in HTML5

I’ve recently been doing a lot of digging into quote/unquote “newer” browser capabilities, some of which are very cool. I will share what I’ve discovered as I go.
As always I’m using a little “test project” as my sandbox, this is a real-world website that’ll use all these features and I’ll share that when it’s done.  So far I’m using oAuth/Twitter integration, ASP.NET MVC/JQuery as a basic stack and am adding in HTML5 and CSS3 features. The resulting site will not be pretty but the point for me is always to …

Cool & Future Tech, Featured, Headline, html5, Web Development, Web Experiments »

[13 Jul 2010 | One Comment | ]
HTML5 Canvas vs SVG

What is the new Canvas tag in HTML5 all about? And why would I use it over SVG (scalable vector graphics)? I took a look and here’s what I found out…

Cool & Future Tech, Featured, Headline, Web Development »

[2 Jul 2010 | 3 Comments | ]
Converting the WordPress Arthemia Theme to HTML5

The other day I converted the current WordPress theme of this site from XHTML Transitional 1.0 to HTML5. It was fairly easy so here’s what I did.
An XHTML 1.0 transitional website was a great place to start. I used the trusty w3c validator located at http://validator.w3.com.
First thing was to get the Doctype fixed up: I changed
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
to
<!DOCTYPE html>
and bingo, we’re recognized as HTML5 instead of XHTML. Not compliant yet though. I removed the profile attribute from my head tag as so:
<head profile=”http://gmpg.org/xfn/11″> which wasn’t …