SpyreStudios

Web-Design and Development Magazine

  • Design
  • Showcase
  • Inspirational
  • Tutorials
  • CSS
  • Resources
  • Tools
  • UX
  • More
    • Mobile
    • Usability
    • HTML5
    • Business
    • Freebies
    • Giveaway
    • About SpyreStudios
    • Advertise On SpyreStudios
    • Get In Touch With Us

30 Must See HTML5 Tutorials

July 26, 2011 by Brant Wilson 11 Comments

HTML5 and CSS3 expanded the possibilities of web design. There are lots of designers and developers who started practicing HTML5 and implementing it in their web designs. In this roundup we have featured 30 useful HTML5 tutorials that will definitely help developers increase their skills..

Making a Beautiful HTML5 Portfolio

Create Vector Masks using the HTML5 Canvas

Create a Stylish Contact Form with HTML5 & CSS3

Create a Grid Based Web Design in HTML5 & CSS3

Fullscreen Slideshow with HTML5 Audio and jQuery

Build a Neat HTML5 Powered Contact Form

HTML5 & CSS3 envelope contact form

How to Build Cross-Browser HTML5 Forms

Banish JavaScript in Web Forms with HTML5

HTML5 Grayscale Image Hover

Cross-Browser HTML5 Placeholder Text

Build your First Game with HTML5

How to create a Progress bar with HTML5 Canvas

An HTML5 Slideshow w/ Canvas & jQuery

Rethinking Forms in HTML5

Implementing HTML5 Drag and Drop

How to Make an HTML5 iPhone App

Blowing up HTML5 video and mapping it into 3D space

Create a Sticky Note Effect in 5 Easy Steps with CSS3 and HTML5

A Drag and Drop Planning Board with HTML5

Responsive Web Design with HTML5 and the Less Framework 3

One Page Portfolio with HTML5 and CSS3

Lights Off – A puzzle game using HTML5 canvas

How To Create A HTML5 Contact Form

Detect Geolocation On Web Browser Using HTML5

How to Create a Drop-down Nav Menu with HTML5, CSS3 and jQuery

How to Code a Clean Website Template in HTML5 & CSS3

Design & Code a Cool iPhone App Website in HTML5

How To Create a Cute Popup Bar With HTML5, CSS3 and jQuery

Create a Posticks (Sticky Notes) app with HTML5, CSS3 and jQuery

Author: Brant Wilson

Brant Wilson is a staff writer for DesignM.ag, Dzineblog and SpyreStudios. You can follow him on Twitter @SpyreStudios.

Filed Under: HTML5, Tutorial

Comments

  1. Lefrein says

    July 26, 2011 at 2:52 pm

    Hi, I think there is a little problem with the link on the iPhone App tutorial… Nice post by the way.

  2. Sagar Ranpise says

    July 27, 2011 at 12:58 am

    Hi, great roundup!
    Check one more html5 and CSS3 tutorial.
    http://www.alldesignstuffs.com/2011/creating-html5-page-with-css3/

  3. Hubert says

    July 27, 2011 at 3:26 am

    You have a little bug with this adress : http://spyrestudios.com/Documents and Settings/Prakash/Desktop/How to Make an HTML5 iPhone App
    for the tutorial How to Make an HTML5 iPhone App spyrestudios

  4. Webrunner says

    July 27, 2011 at 5:19 am

    Really useful roundup, I had already bookmarked some of them but it is nice to have them all together.

  5. chithara says

    July 27, 2011 at 8:21 am

    Very much needed tutorials for me. Tanks.

  6. Catalin says

    July 27, 2011 at 8:35 am

    Nice collection Brant! Also, thanks for adding one of my articles here.

  7. Illustratør says

    July 28, 2011 at 9:11 am

    Ah, I’ve been looking for a brief overview of the new web-technologies so this was just what I needed. Much appreciated!

  8. David says

    July 28, 2011 at 12:57 pm

    Thanks for sharing these. I need to work on my form styles and these are great.

  9. jeroen says

    July 29, 2011 at 5:47 am

    Sigh. Again the iPhone html5 development link is not working. Getting a 404 now. “How to Make an HTML5 iPhone App”

  10. Robin says

    July 29, 2011 at 4:26 pm

    Totally stunning and all of them are looking great. Making a choice is pretty tough though.

    Cheers.

    Robin.

  11. Creative Automaton Design + Illustration says

    August 2, 2011 at 6:45 pm

    This pretty much sums up what needs to be seen around some parts of the web today, and even I could benefit from some of it http://www.creativeautomaton.com.

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Please prove you're human *

SpyreStudios © 2019