You can’t go anywhere these days without someone talking about HTML5 and CSS3. OK, Maybe YOU can, but I can’t. So if you don’t know your pseudo-class selectors from your attribute selectors then here are a few links to the kind of things that may be appearing in your browser over the next few years.
Before we start, a little introduction to what I am talking about:
What is HTML5? the proposed next major revision of HTML (Hypertext Markup Language), the core markup language of the World Wide Web. Or in layman’s terms, it’s the code we write to structure the web pages you see in your browser.
What is CSS3? the latest version of the Cascading Style Sheets (CSS) standard, a presentational language which we use to make the HTML we wrote look like the design we created.
In short, HTML and CSS are the standards used to build the webpages you browse every day, and HTML5 and CSS3 are the future of those standards. Exciting eh?
Before you can take part in this round of future gazing, your going to need a modern browser, so no Internet Explorer people. Try the latest version of Firefox (download), Opera (download) or Safari (buy a mac). Make sure you update to the latest versions.
If you want to know what exciting new stuff your browser can handle, you can get loads of great info at http://www.findmebyip.com/ just navigate to that page and find out all about your browser. If you see lots of red crosses, it may be time to upgrade!
Alternatively you could check out Deep Blue Sky’s handy guide to HTML5 and CSS3 support – http://www.deepbluesky.com/blog/-/browser-support-for-css3-and-html5_72/
and now some examples:
Pure CSS Coke Can – http://www.romancortes.com/blog/pure-css-coke-can/
See what you can achieve without even needing the new standards!
CSS3 Examples and Progressive Enhancement – http://csswizardry.com/css3/
A number of examples of great additions to the CSS standard.
Create an animated pile of photographs using only HTML and CSS3 – http://media.24ways.org/2009/14/3/index.html
A whole bunch of HTML5 examples to check out – http://html5demos.com/
YouTube – http://www.youtube.com/html5
Try out YouTube without any Flash player, using the new embedded video tag in HTML5
HTML5 Graphs – http://www.rgraph.net/
Draw straight onto the canvas in HTML5. Get dynamically created graphs directly from your data, no images!
Star Wars Opening Crawl – http://www.gesteves.com/experiments/starwars.html
This only works in WebKit browsers (safari) at the moment, but it’s worth downloading the browser just for this.
That’s it for now. Happy Clicking Geeks, and see you in the Future!
Tags A whole bunch of HTML5 examples to check out attribute selectors Cascading Style Sheets Create an animated pile of photographs using only HTML and CSS3 css css3 CSS3 Examples and Progressive Enhancement dev development Firefox front-end HTML html5 HTML5 Graphs Hypertext Markup Language IE Internet Explorer Opera pseudo-class Pure CSS Coke Can Safari selectors Star Wars Opening Crawl World Wide Web YouTube without Flash