While HTML5 is a language that has been developing for more than six years , its application in real systems and popularization came after his triumph over XHTML2 to become the new standard markup language for web development.
Because of their relatively recent entry into the world of development, there are few who know exact science full properties of this new language. That is why in this article we have decided to list the key features of this markup in order to lay the groundwork necessary for proper development.
Several new elements included this language, which today are compatible with all popular browsers in their latest versions. Firefox, Chrome, Safari and Opera have supported this language for some time, while Internet Explorer gave support since September 2010 with the beta version of IE9.
HTML 5 and multimedia content
HTML5 have introduced two new labels here whose names are ’audio’ and ‘video’ , its function is to allow us to add audio and video to a web page without using long codes ’embed’ , as is commonly done today to include flash videos or preloaded on a server.
The label ’video’ brings several attributes, among which are
- ‘control’
- ‘autoplay’
- ‘src’
- ‘height’
- ‘width’
- ‘loop’
- ‘preload’
- ‘audio’
which gives us the opportunity to modify the player at will without resorting to CSS or Javascript . Besides this, ‘video’ allows the addition of text between the opening and closing tag.
For its part, the label ‘audio’ works similarly to sound content and has five attributes on their own, ‘autoplay’, ‘controls’, ‘loop’, ‘preload’ and ‘src’ .
Site structure with HTML 5
With new labels like HTML5 provides new levels of structuring. These labels are responsible for defining the different sections of a website, and many of them come with their own position in the defined page.
- ‘section’
- ‘footer’
- ‘header’
- ‘nav’
- ‘article’
- ‘aside’
- ‘figure’,
Forms with HTML 5
As regards forms, labeled ‘input’ remains the basis of everything, but with the difference that now has new ways to declare its type, which adds flexibility and facilitates the validation.
A total of twenty-three types of ‘input’ that can be used in a form, among which we find the types’date,’ ‘datetime’ ‘datetimelocal’, ‘time’, ‘month’, ‘week’, ‘url ‘,’ range ‘,’ number ‘and’ email ‘ that were included with this release. With this there is no need to declare an input type ’text’ , condition characters it receives with Javascript and then validate the server side the value we are really hoping, just carefully define the type and the browser will process correctly data.
Inline elements
The labels ’meter’, ‘time’, ‘mark’ and ‘progress’ were included to be used in representations of figures, dates, time, lists or progress bars, and so achieve better semantic structure. Generally used to wrap similar content, and as its name says each has a related content.
Charts
Perhaps one of the best projects presented is HTML5 tag ’canvas’ , considered by far the baby darling of this new standard because of its potential and great usability.
The label ’canvas’ allows us to display graphics by plane code to just giving us the opportunity to define a height and width for the area of stroke, allows the use of HTML5 events and when combined with Javascript you can create pure magic .
Your accede to this tag through the stroke of Javascript functions, serves as a 2D drawing surface for presentation graphics, games, animations and image compositions.
Interactive Elements
Labels for this function are presented as ’datagrid’ , which can be used to provide an interactive data set. We also have the label ’details’ allows us to provide advice and other useful information.
The label ’menu’ , which had previously been declared obsolete, returns with a new functionality. It has two attributes, which are ’label’ and ‘type’ , and is used to define menu lists with controls.
Charset and HTML5 DOCTYPE
The charset of the site is defined with a fairly easy label to remember, meta charset = ‘UTF-8’ , while the new DOCTYPE is defined in a simpler way, simply stating that our website is HTML type! doctype html .
Changes to attributes of existing elements in HMTL 5
HTML5 added some new attributes to elements that existed in the previous version of the language. For example, anchor type elements as ’a’ and elements of type ’area’ have received a new attribute that is called ’media’ , the item ’base’ now has an attribute ’target’ and the element ’meta ‘ has a ’charset’ as an attribute.
Moreover there are certain attributes that deprecator, such is the case the attribute ’language’ label ‘script’, ‘border’ label ‘inc’, ‘name’ of the anchor type ‘a’ and ‘type’ as an attribute of ‘style’ and ‘script’ ,
Elements deprecated in HTML 5
There are several elements that quedaro out of this new version, traditional labels like ‘font’ became better life, acompletan labels list
- ’acronym’
- ‘applet’
- ‘basefont’
- ‘big’
- ‘center’
- ‘dir’
- ‘font’
- ‘frame’
- ‘frameset’
- ‘isindex’
- ‘noframes’
- ‘noscript’
- ‘s’
- ‘strike’
- ‘tt’
- ‘u’.
