Tips & Tricks on HTML5

Website Design + Development HTML5 is a strong and powerful new standard of HTML. It has a lot of new tools to build better user experience. HTML5 simply builds on HTML4, so the old markup can stay in place as you develop the new features. Mobile phone applications will be much more accessible if written in HTML5. You have more flexibility in creating your website. Video, audio and images are all easily written right into the code, eliminating the need for any third party software. Now below are some tips and tricks for HTML5: 1) HTML5 Doctype: The line of code for Doctype in html5 has become concise, identical for all and without a url. The new doctype declaration is lovely. Use it freely. It works!!! 2) Render Graphics easily using HTML5: HTML5 has introduced a canvas element, a resolution dependent bitmap which can be used to render graphics, graphs, visual images. It is basically a rectangle in the page where you can use Javascript and draw whatever you want. It has no content and no border at all. It can be rendered as follow: 3) Make your content editable with HTML5: The new browsers now have a new attribute that can be applied to elements called contenteditable. This allows the user to edit any of the text contained within the element including its children. This can be helpful in any app such as making a to-do list, adding a reminder and so on. 4) Improved Forms: Forms in HTML5 allow for new attributes such as placeholders, autofocus, required. Also it has various other new input types such as email, url, date and search. This makes the applications more user friendly without having to rely on extra javascript to accomplish it. 5) Use HTML5 Media: HTML5 video and audio tags were designed to make seamless integration of videos and audios in the website. This gives user a faster experience and eradicates the use of other flash plugins. These audio and video tags makes embedding for audio and video as simple as embedding an image. Below is the markup for both the tags: Note: To make these tags work in all major browsers, use the below script tag in the head of your document. 6) Limiting the number of div tags on the page: Avoid using div tag and creating multiple layers that are caused by div tags. Instead you can start using different tags that are available in HTML5 such as Header, Footer, Section, Nav, Article. This can place everything in order and reduce the unnecessary use of div tags.