How to Build a Vibrant Professional HTML5 Web Design

Dec 10 2010 by Jacob Gube | 11 Comments

How to Build a Vibrant Professional HTML5 Web Design

This 2-part tutorial on Design Instruct, our other site, will walk you through the creation of a Photoshop mock-up as well as provide you with a detailed guide on how to convert the design into an HTML5 template.

Final Result

Click the preview image below to go to Part 1 of the tutorial series on Design Instruct (or go to Part 2 instead).

Final Result

Other Things to Do

Related Content

About the Author

Jacob Gube is the Founder and Chief Editor of Six Revisions. He’s also a web developer/designer who specializes in front-end development (JavaScript, HTML, CSS) and also a book author. If you’d like to connect with him, head on over to the contact page and follow him on Twitter: @sixrevisions.


Michael Tuck

December 10th, 2010

All the more reason for me to learn to more effectively PS, so I can do this kind of thing. :)

Michael Tuck

December 10th, 2010

“Learn to more effectively PS”? Sounds like I’m writing with Babelfish. Sorry about that.

Allan Crabtree

December 11th, 2010

Fantastic tutorial, love these! :)


December 12th, 2010

Nice tutorial, however a bit to colorfull, the footer should only have one simple color. But that’s my opinion of course :)

Curtis Scott

December 13th, 2010

Great tutorial, Man that site has grown, you guys have shown some great tutorials in the past, but I think this one is one of the best!


December 27th, 2010

I love the final effect above. But when I doing this, I just can’t make site like you. Only 80% similarity, maybe I should learn more photoshop tutorial in the future

Victor Castillejos

January 17th, 2011

Nice tutorial, nice background effect, thanks


February 1st, 2011

fresh idea on web development. love it!


April 18th, 2011

great tutorial thank you very much


August 5th, 2011

Great! I like your tutorial and I read it again and again.


September 6th, 2011

great tutorial.
six revisions why you are not making more web interfaces tutorials and then xhtml to css.

Leave a Comment

Subscribe to the comments on this article.