What is HTML5?
What is HTML5?…HTML is the latest version of HTML, Hypertext Markup Language. This is the language used to communicate with web browsers to display web documents displayed in pages. The W3c as of December 2012 has recommended the use of HTML5 for all new and existing websites.
HTML5 has a number of new features:
- Section and Article tags
- API’s that assist with web apps
- Support for audio and video
- Reduces the need for plugins
What is HTML5? Structural tags:
Structural tags refer to the structure of the web document, HTML 5 has made structuring the website based on the modern format of web documents.
New HTML5 Structural Tags:
- Section: Generic Section, splits into distinct regions or chapters.
- Article: Forum posts, Magazine Articles, Blog entry, Comment for syndication, anything that can be republished on it’s own.
- Aside: Content related to main content – quotes, ads, relational groupings.
- Header: Introductory or navigational Aids, wraps tables, search form or logos.
- Hgroup: heading of a section, group set of headings, related headings.
- Footer: Information about the writer or copyright information for specific section of whole page.
- Nav: Section of page providing navigational links to other pages or parts within a page.
What is HTML5? Content tags:
- Figure: Grouping visual content
- Video: Media element video and audio
- Audio: Media element video and audio
- Embed: Integration point for external non-HTML application
- Canvas: Resolution dependent bitmap canvas, rendering graphs, graphics etc.
puts canvas on page
What is HTML5? Application focused tags:
- Meter: scalar measurement of known range, disk usage,
relevance, gauge [only use when range is known] - Progress: Completion of a task [use when range not known]
- Time: Time(24h) or date – machine readable way only gregorian
[too specific] - Details: Widget displaying extra help info
- Command: Command a user can invoke, toolbars, icons
- Menu: Represents list of commands
What is HTML5? Depreciated HTML tags (Still supported but use is not recommended):
- basefont
- big
- center
- font
- s
- strike
- tt
- u
- frame
- frameset
- noframes
- acronym
- applet
- isindex
- dir
What is HTML5? debated tag attribute removals:
- rev, charset : FROM : a , link
- longdesc, name : FROM : img
- version : FROM : html
- abbr : FROM : th
- scope : FROM : td
- align : FROM : all block elements
- background : FROM : body
- hspace, vspace : FROM : img
- bgcolor : FROM : table, tr, th, td
- border, cell padding, cell spacing : FROM : table
- height, width : FROM : td, th
- valign : FROM : table
What is HTML5? New integrated API’s:
- Video and Audio playback
- inline editing: edit text without use of an editor
- Offline and History API
- Web protocol API: Application can register the protocol they use
- Drag and Drop API
What is HTML5? Associated API’s:
- Geolocation API
- 2D Canvas API
- local Storage API
- Messaging API
What is HTML5? Content Models:
- Metadata – presentation of rest of content [base, command, link, meta, script, noscript, style, title]
- embeded – content that imports [audio, canvas, embed, iframe, img, object, video]
- interactive – user interaction [a, audio, button, details, embed, iframe, img, input, keygen, label, menu object, select, textarea, video]
- heading – [h1 – h6, hgroup]
- phrasing – text and text markup, eg. inline [a, abbr, command, code, select, small, object, var, textarea]
- flow – included in normal flow, in body tag [majority of html: a, article, size, details, div]
- sectioning – defines scope of headings and footers [article, aside, nav, section]
Display is now controlled with CSS – HTML5 and CSS must work together!
Easy HTML5 character encoding:
- Usually http header deals
- Easier html 5: <meta charset=”utf-8″>
Please check the following links to find out about other new developments and how to apply the new HTML5 tips in your website:
http://www.w3schools.com/html/html5_intro.asp
http://www.w3.org/html/wg/drafts/html/master/
Find out about HTML6 here: