Pages

Wednesday, April 18, 2012

The simplified pattern HTML5, a derivative of Boilerplate

The simplified pattern HTML5
This material is the translation of articles Louis Lazaris , a famous author, who, including writing articles for Smashingmagazine.

I'll be the first to recognize that HTML5 Boilerplate made ​​me a fountain of emotion.

On the one hand, a frightening amount of information and narobotok that have been collected in one place for the benefit of developers (front-end developers). So much that I wondered, what do I do in this industry, so I showed myself retarded.

But on the other hand, I am impressed with how much to learn, and how many grains I add to my toolkit. So, I can not wait to zaroyus in the book and will add to their knowledge. It's easier on the soul and the fact that others feel the same as me. But back to topic.

Due to the fact that in the Boilerplate is much that I do not quite fully understand, and also, what I most likely will use in the future, I decided to make their own little HTML5 template that will be my own «rock- solid »by default. Let's be frank, Boilerplate is not just HTML5, as well as the basic framework for creating killer cross-platform and high-performance Web applications. Sometimes I do not need it all. And I need something more basic.

Code

My creation is not intended to compete with other patterns. This is a simple template that focuses on HTML5 with basic CSS reset (zeroing styles) and a few scripts attached, including jQuery, and Modernizr. As well as the source JavaScript file with basic JavaScript template, which I use lately.
For your start in addition to the basic HTML5 code, I have also included extensive comments, and some educational materials that will use the new tags, as well as the modified tag in HTML5 . Many of the comments are too detailed, because I wanted to use a template, and new to HTML5 .

To view the code, click "view demo" . Also, there is no need to view the source code. "View Demo" and is the source code, which is available in the document for viewing. So if you are disabled in your browser is not JavaScript, you will see exactly what you would normally see by looking at the page code.
As an alternative, you can download and "clean" version, without comment.
only comments that are submitted are necessary in my opinion. So it's not completely clean version, but quite erased. You can download it from the original article.

Yes, I borrowed a few things from the Boilerplate, but it is inevitable due to the inherent Boilerplate's kitchen sink-ness.

This code was taken from this source


Want some more?

Use HTML5 Reset .
HTML5 Reset is another project that was launched at about the same time as the Boilerplate, but it is simpler and easier to digest. Funny, I did not even pay attention to the HTML5 Reset, yet created your project. I thought that it is similar to Boilerplate, but in fact HTML5 Reset it even easier than mine. starwebdesign.com.ua
So, use it if you need some mobile-related features that it includes.
Work in progress

In the future I will continue to study and improve my work.
So if you want 100% of pre-defined template, or use the Boilerplate HTML5 Reset. Or, adjust, alter, modify my template to suit your needs. This is my personal starting point from which to continue building.