Best Tutorials To Step Into HTML5 And CSS3


Here are links which I read to make my WordPress theme which based on HTML5/CSS3. The images are my old theme and new HTML5 based flexible theme.

Let me quote some important part.


Need to know these facts before dive into it.

There’s also the fact that by using HTML5 code right now your website gets stuck in some kind of “limbo” since even though your browser will render HTML5, it does not understand it as of yet. This may also apply to other software such as screenreaders and search engines.

Lastly you must consider that HTML5 is still under heavy development, and it’s probably the “most open” project the W3C has ever done.

Progressive Enhancement and Graceful Degradation

These concepts made the HTML5 more attractive.

Graceful Degradation is a widely used term which ideology is basically using the latest technologies first, and then fix anything that needs fixing for older browsers. We do this on a daily basis: most of us code for Firefox first, then fix Internet Explorer.

Progressive Enhancement refers to the habit of building first for the less capable, outdated browser and then enhance for the latest technologies. We, too, use this on a daily basis. For example, most of the times we code a website we start with the markup and then apply an external CSS file where we add all the styling.


To use framework is one option when you start to build a web site. I recommend to use a framework especially for beginners because it’s a faster way to launch and you can learn a lot from the framework. I choose Less Framework to build a flexible layout.

Grid System

This is not related to HTML5/CSS3 but if you wanna make a beautiful web site, 960 grid system may help you.

I made the image for Pixcel Perfect to figure out width etc.

More Resources

My friend Oli told me these links to learn HTML5. Thanks Oli!

Oli’s intro articles

HTML5 and Firefox

2 replies on “Best Tutorials To Step Into HTML5 And CSS3”

Leave a ReplyCancel reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.