HTML 5: What are the first to be in the know?

HTML 5: What are the first to be in the know?


Currently anyone who has never heard of HTML 5? The next generation of HTML has been much to the ease and joy in most of the Developer. Like or not like HTML 5 will still go ahead and replace HTML predecessors. Because, the needs of web users will continue to rise and do not necessarily like the previous versions of HTML can meet that need (even though it can probably not as easy as one might imagine).

This time I will discuss some fundamental differences from its predecessor HTML 4.0 and XHTML 1.0, so armed with a basic knowledge of HTML 5, you are a web developer and web designers can quickly make the transition on your website or in your work.

There are three things which I will discuss today, namely:

1.  API in HTML 5
2.  The new elements in HTML 5
3.  semantic change 
4. Do it and use it now

API in HTML 5 

 In HTML 5 there is some API that integrates with some elements of HTML 5, and this is the API (this information from www.w3.org):

• 2D Drawing API, the API that can be used for 2D image manipulation that is integrated with the canvas element.
• Audio and Video API, the API that can be used to play and play video and audio media. This API has been integrated with audio and video elements of HTML 5.
• API that allows to create offline web applications.
• API that enables web application can register itself for certain types of protocols and media.
• Editing API in combination with the attributes of a new global editable content.
• Drag and Drop API in combination with a drag-able attributes.
• API that can expose the history of the browser to add a web page that is being accessed so that it can add the Back button on web pages.
• Cross-document messaging.

As you can see, the principle of API provided from HTML 5 is to make developers more easily create a web application. Please refer to the third point for offline web application API, this is good news for users and developers or programmers because it can create a full-featured web applications on the offline environment. You can expect a lot of your favorite applications to follow in introducing offline Gmail access.

 New elements in HTML 5

HTML 5 just introduced some new elements that are available, and this is a brief introduction you to the elements - these elements:

• <article>, defines the external content.
• <aside>, defining content to be displayed next to or parallel to the web page article (perhaps as an illustration of this is the sidebar).
• <audio>, defines the sound files such as music or other audio streaming.
• <canvas>, defines the 2D images such as graphics or other images.
• <command>, defining button commands such as radio buttons, checkbox, or button.
• <datagrid>, defines the data selectable list. DataGrid is displayed as a tree-list.
• <datalist>, defines the data selectable list. Use of these elements together - the same as the input elements, to create a dropdown list for the input value.
• <datatemplate>, defines the container of the template data. This element must have the elements to define the template below: <rule> element.
• <details>, defining the details of an element, which can be viewed by the user, and can be hidden when clicked on.
• <dialog>, defines the dialog, just like all the talk.
• <embed>, defines embedded content, such as a plug-in.
• <eventsource>, defines the source for the event which is sent by the server.
• <figure>, used for grouping several elements.
• <footer>, defines the footer of a document. Usually contains the name of the author, date of document or information made contact.
• <header>, defines the header of a document.
• <mark>, defining text in the mark, use it to provide highlights on some part of your text.
• <meter>, defining measurement. Use only for measurements with minimum and maximum values ​​are already in the know.
• <nav>, defining the navigation links.
• <nest>, defines the nesting point in the data template for the child element. Use together - together with the elements and <rule> <datatemplate>.
• <section>. defines part of the document. Just as a header and footer.
• <source>, defining element for media resources, as well as <video> and <audio>.
• <time>, defines the time or date, or both.
• <video>, defines the video media, such as video clips or other streaming video.

Semantic changes

 
This is the part that should change your ways to make the fundamental structure of the website. Included in the list below are the six elements that can help you to be more consistent in making the basic structure of the website. Element - element are:

•      <nav>
•      <section>
•      <article>
•      <header>
•      <footer>
•      <aside>

Element - This element will replace the current <div> elements often do you use to create the basic structure of the website. So instead of making <div class="header">, you can shorten it by making <header>. Watch me make <div> use "class" rather than using the "id" is because the element can be repeated on a page (I will try to discuss further in another article).

Do it and use it now

Do not be too happy with the title of the chapter that I wrote above is, as is already known by a good developer that each browser is different (some are even worse than some others) in support for HTML4 and XHTML 1.0, although it is a browser - the browser including the most widely used browser and the general use by the user.

Now try to imagine how a major change from HTML 4 to HTML 5 is on the browser - the browser? despite the push for the use of HTML 5 is despite the fact Google is one of the "king" of the virtual world will not instantly make any compatible browser directly in HTML 5 shows this perfectly. But, although these are not reasons to not immediately begin to prepare for major changes right now, and also does not mean there is no way of "smart" and tricks to be able to make sense - HTML 5 deceivingly so that you create can run on all browsers.

Posted in: html tutorial