HTML5 is the next major version of HTML. HTML5 provides some great new features for web designers who love to create readable code and semantically-meaningful layouts. HTML 5 introduces and enhances a wide range of features including: form controls, APIs, dragging and dropping, multimedia, drawing graphics on screen and a lot more.
The new specifications has added quite a few interesting and useful tags for structuring your markup.
In today’s post, we would like to present 12 elegant, free and high quality HTML5+CSS3 Templates for your next project, some of these templates include a step by step tutorials to teach you how to create your own.
1. Touch The Future: Create An Elegant Website With HTML 5 And CSS3
The aim of this tutorial is to create an elegant blog/portfolio for an efficient professional (graphic and web designer or photographer). You will can download the template at the end of the tutorial.
2. Free 2 Column & 3Column HTML5 template
2 column layout and another 3 column with a little contact box, .psd file is included with each template.
3. One-Page Website Template
An HTML5 web template, using some of the new features brought by CSS3 and jQuery, with the scrollTo plug-in.
4. EarthDay HTML5 and CSS3 Template
EarthDay is a 3-column HTML5 and CSS3 template designed to honor Earth Day. Sporting the blues and greens we’ve come to expect from eco-friendly sites, the template should work well for any green inspired content.
A very basic layout which covers most of the elements we can start coding using HTML5. Basically: the page’s name and it’s slogan, a menu, a highlighted (featured) area, a post listing, an extras section with some external links, an about box and finally a copyright statement.
6. FlipThru HTML5 and CSS3 Template
FlipThru is a 1-column business-oriented HTML5 and CSS3 template that makes extensive use of CSS3 to create a horizontal accordion effect. This effect does work in IE as well.
In this tutorial, we are going to learn how to build a blog page using next-generation techniques from HTML 5 and CSS 3. Pretty much your every day blog design. Header with title, horizontal navigation, content area with comments and form, sidebar and a footer.
Take a look at the markup:
<!doctype html> <html> <head> <title>Page title</title> </head> <body> <header> <h1>Page title</h1> </header> <nav> <!-- Navigation --> </nav> <section id="intro"> <!-- Introduction --> </section> <section> <!-- Main content area --> </section> <aside> <!-- Sidebar --> </aside> <footer> <!-- Footer --> </footer> </body> </html>
8. Simple Website Layout Tutorial
A very Simple web page with HTML 5 and styling with CSS3.
9. Gotta’ love HTML5 & CSS3
It’s always useful to have a base to start a new website build from and what better way to encourage people to use HTML5 and CSS3 than sharing my basic HTML5/CSS3 template.
11. H5 WordPress Theme Template
The H5 Theme Template provides everything you need to create beautiful themes with HTML 5 right now. H5 contains a complete set of theme files and folders, and each file has been meticulously crafted with all of the latest and greatest WordPress functionality.
12. A free HTML5 and CSS3 theme
A truly HTML5 and CSS3 elegant theme with a Fully working Ajax PHP contact form, Uses the ChunkFive font to headings and IE6 & IE7 warning.
- - 5 Advanced CSS Pseudo Classes that will Save your Day
- - Designing for the Future with HTML5+CSS3 : Tutorials and Best Practices