Day 1/30 — Let’s start with HTML(5)

This is my 1st day of 30 days coding challenge. I am starting with the basic HTML5 structure. Why? every web project you start you need HTML for that. HTML is the base of every web project.

http://codepen.io/NehhaSharma/pen/MbOMxY

What is HTML5?

HTML5 is the improved version of HTML4 and XHTML. It is know as Hyper Text Markup Language.

HTML5 vs XHTML

HTML5 is very powerful in comparison to the XHTML. Where XHTML was limited in tags, HTML5 is filled with new tags. HTML5 makes the webpage semantic which results in SEO friendly websites as well as easy to read by the developers too.

HTML5 changes the way we are coding or using the web. It gives developers lot of power such as forms. Forms are now not just limited to the Text/textarea/Radio buttons/Checkbox. You can now have form input for- color, date, range , password etc. Also, required, placeholder, validation check etc on the client-side by HTM5 only.

HTML5 is not just limited to forms and tag. When HTML5 is used with Javascript it unleashed a very powerful web for developers and users. HTML5 has <Canvas> for animations and graphics through coding only. It has the storage at client side.

And HTML5 is not stopping here only. Everyday it is doing something new and innovative.

What is NEW in HTML5

As stated above — there are lot of things in HTML5 to summarize few new elements:

1. New semantic tags , more than just DIV , — <header>, <footer>, <nav>, <article>, <main>, <canvas> and many more
2. New form elements — password, date, range, number, and many more.
3. Placeholder and required life saver — now you don’t need to write that extra code in javascript for validation or placeholder as HTML5 itself give you attribute for same
4. Canvas — animate the web, create graphics — bye bye flash
5. Storage at client side and more
6. Mobile friendly :)

How it is beneficial for developer?

Less coding, more power

SEO Friendly

Easy to do more

More power at client-side

In the above codepen I have used simple HTML5 tags to make the structure of the webpage.

What’s Next?

Will add some styling by CSS as it is too blah!! :)