SlideShare uma empresa Scribd logo
1 de 20
Baixar para ler offline
HTML5 Introduction – Features and
Resources for HTML5
What is HTML5?
HTML5 is the fifth revision and newest version of the HTML standard. It offers new
features that provide not only rich media support, but also enhance support for creating
web applications that can interact with the user, his/her local data, and servers, more
easily and effectively than was possible previously.
Because HTML5 is still being developed, changes to the specifications are inevitable.
Therefore, not all of its features are supported by all browsers yet. However, Gecko, and
by extension, Firefox, has very good initial support for HTML5, and work continues
toward supporting more of its features. Gecko began supporting some HTML5 features in
version 1.8.1. You can find a list of all of the HTML5 features that Gecko currently
supports on the main HTML5 page.
HTML5 is the successor of HTML 4.01, released for the first time in 1999. The internet
has changed significantly since 1999 and it seemed like the creation of HTML5 was
necessary. The new markup language was developed based on pre-set standards:







New features should be based on HTML, CSS, DOM, and JavaScript.
The need for external plugins (like Flash) needs to be reduced.
Error handling should be easier than in previous versions.
Scripting has to be replaced by more markup.
HTML5 should be device-independent.
The development process should be visible to the public.

A Brief History of HTML
In addition to this official work on HTML, the browsers have been making their own
additions to HTML. Some changes were eventually adopted into W3C HTML
Recommendations; others remain proprietary coding aspects that only the individual
browsers recognize. The browsers' versions of HTML changed, too, in a game of
marketing and programming one-upmanship, hoping to lock Web developers into using
one browser or the other exclusively.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
Timelines:























Creation of language in conjunction with Berners-Lee's WWW program - Oct.->Dec.
1990
Specification for HTML released on the Internet - Summer, 1991
Draft defining HTML released (Internet draft later expired) - June, 1993
Initial document for 'HTML 2.0' released - April, 1994
Draft for HTML 2.0 cleaned up and released - July, 1994
HTML 2.0 draft further refined with plans to release as an RFC - February, 1995
HTML 2.0 (RFC 1866) approved as a proposed standard - September, 1995
HTML 3.0 draft released (later expired) - March, 1995
HTML 3.2 draft released - May, 1996
HTML experimental DTD 'Cougar' released - July, 1996
W3C recommendation for HTML 3.2 (Wilbur) - January, 1997
HTML 4.0 draft (evolved from Cougar) released - July, 1997
HTML 4.0 becomes W3C proposed recommendation - November, 1997
HTML 4.0 becomes W3C recommendation - December, 1997
HTML 4.0 revised and certified W3C recommendation - April, 1998
Draft released for 'Reformulating HTML in XML' (codename Voyager) - December,
1998
XHTML 1.0 first working draft released - January, 1999
XHTML 1.0 becomes W3C Proposed Recommendation - August, December 1999
XHTML 1.1 first working draft released - September, 1999
XHTML 1.0 becomes W3C Recommendation - January, 2000
XHTML 1.1 becomes W3C Proposed Recommendation - April, 2001
XHTML 1.1 becomes W3C Recommendation - May, 2001

What HTML is today
The standards for HTML are currently being developed by a worldwide industry
consortium known as the W3C. This work was carried out previously by the IETF. The
W3C places several requirements on HTML:
"The document format should be, as far as practical, backwards compatible with
existing HTML documents. It should support both paged and scrolling layout models...A
simple, scaleable document format that can be used for information exchange on virtually
any platform."
The W3C goes on to list the proposed range of these platforms, which include:





Graphical User Interfaces, such as Windows, Macs and X11/Unix
Text only systems, such as VT-100 terminals
Text to Speech devices
Rendering to Braille

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
The Success of HTML
In hindsight, the following quote by Berners-Lee from the original CERN proposal shows
how far things have progressed in less than a decade:
"In 10 years, there may be many commercial solutions to the problems above, while
today we need something to allow us to continue."
The WWW and HTML solutions that Berners-Lee created have evolved into that solution.
HTML is now becoming the primary document format of choice not only on the Web,
but also elsewhere in both personal and commercial uses. Despite its current limitations,
HTML has become the most popular and widely used rich text format ever.

What’s new?
HTML5 was created to make the coding process easier and more logical. You will see a bit
later that many syntaxes are now deprecated and soon to be kicked out through the back
door. The unique and impressive features HTML5 comes with are in the multimedia
department. Many of the features it comes with have been created with the consideration
that users should be able to run heavy content on low-powered devices. The syntactic
features include the new <video>, <audio> and <canvas> elements, but also integration of
vector graphics content (what we knew before as being the <object> tags). This means
that multimedia and graphic content on the web will be handled and executed easier and
faster, without the need of plugins or APIs.
There are a bunchload of new syntaxes added, but below I will name and describe the
most important. The rest of them can always be found in W3C’s HTML5 section.









<article> – this tag defines an article, a user comment or a post, so an independent
item of content
<aside> – the aside tag marks content aside from the page content, which for example
could be a lateral sidebar
<header>, <footer> – you won’t need to manually name IDs for headers and footers,
as now you have a pre-defined tag for them
<nav> – the navigation can now be placed in the markup in between the nav tags,
which will automatically make your lists act like navigation
<section> – this is another important new syntax, as it can define any kind of sections
in your document. It works pretty much like a div which separates different sections.
<audio>, <video> – these two obviously mark sound or video content, which will now
be easier to run by devices.
<embed> – this new tag defines a container for interactive content (plugin) or
external application
<canvas> – the canvas tag is quite exciting, as it allows drawing graphics via scripting
(mostly JavaScript, but some others can be employed as well)

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
What is important to remember is that the new HTML5 tags do not always work as the ones

before. For example, the header and footer tags will not only mark the start and the end of
a page, but also the start and the end of each section you have. This means that these two
tags are likely to be used more than once in the whole page. In the illustration below can
you see what I mean.
The following tags from HTML 4.01 are now removed from HTML5, therefore browsers
do not offer support for them anymore. This means that it is a good idea to go back to
your HTML pages and check for them, as they might disrupt the design in the latest
browsers.
<acronym>
<applet>
<basefont>
<big>
<center>
<dir>
<font>
<frame>
<frameset>
<noframes>
<strike>
<tt>

Things to know about HTML5
It is crucial to remember that HTML5 is built on the success of its previous version,
HTML 4.01, which is undoubtedly the best version ever. In order to be better at using
HTML5 you do not need to forget everything about the previous version. You are not
learning a totally new language here. Keep your beloved syntaxes and keep the way you
used to format your code, only remember that now you need to build upon the coding
skills you already have.
In case you have absolutely no knowledge of HTML and you want to start now, I
advise you to start with HTML 4.01 and only when you master it move onto HTML5.
Starting with the latest version is like learning to run before learning to walk – which is
impossible as far as I know. HTML 4.01 still contains the basics of HTML5, therefore in
my opinion you should have strong knowledge of former HTML versions in order to be
able to master HTML5.
The upside of learning HTML5 now is that the new markup language works right
away. You can basically do whatever you want with it today – and it is supported in all
major browsers.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
From video to geolocation, local storage and microdata annotations, HTML5 is something
we need to start using. If you are in the design business, sticking with HTML 4.01 is a
mistake, because everybody will move on while you will remain behind.
HTML5 is definitely here to stay. It is created to sustain today’s necessities and
especially because it is in continuous development, it will be able to sustain the changes
that will happen in the industry for quite some time. One of the reasons behind HTML5
taking so much time to develop is because the W3C had to analyze lots of factors and
think of the future. They took their time and finally delivered something that can easily
be labelled as a high-quality product.

Best and Trendy HTML5 Website in 2014


Heart of the Arctic

A 72,000px wide site where users go on an expedition through 4 detailed
environments and gather 56 animated collectables to restore balance to Arctic life.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.


Wanda Print

Nested in the art network of WANDA-PRODUCTIONS, Our talents are creatively
driven to perform fresh and striking digital images. We integrates art buying support,
production coordination, casting, location scouting, booking, to post production delivery.



Soyuz Coffee Roasting

Soyuz Coffee truly believes that coffee is much more than a brewed beverage as we
know it, it’s a way of living! And exactly this coffee experience is something Skybox
created via the re-invented...

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.


Parrot - Flower Power

Discover Parrot Flower Power, the first intelligent wireless sensor fitted with
Bluetooth Smart Technology which, through a dedicated application, helps you look after
your plants.



STAINSBEAUPAYS

STAINSBEAUPAYS™ is an infinite interactive movie made by 15 year old teenagers
from Paris suburb. Jump on the wheel and enjoy the trip !

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.


Melanie F

Melanie.F is a French brand that manufactures slippers for children. She introduces
you her new collection 2013/2014.



Suffolk's bold new tourism site

The website, and its Take me to Suffolk campaign and Facebook app, tear up the rule
book for British tourism websites. Site visitors explore, play and discover the joy of a
break in this...

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.


Love Carmen Rose
Love Carmen Rose is a photography studio in Fort Worth, Texas

 Merry Christmallax
Christmas greeting one pager that takes you from wire-framing stage to polish as you
scroll down the page.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.


Alee Foroughi - Portfolio

My name is Alee Foroughi. I'm CEO & Designer at Swan Design Studio. I love design
and it shows in my works.



Mehdi Benyounes, CEO Rscollab
Site official de Mehdi Benyounes : CEO Rscollab / Lead developer / Web designer

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
10 Top HTML5 Resources
Want to learn HTML? Or hone your skills in the computer language? Then check
out these top resources.
The web is a wonderful thing, brimming with resources and tutorials for people
wanting to learn HTML5. But, sometimes, too much choice can be confusing, so we've
picked 10 top resources that will really help you get to grips with it.

01. HTML5 Rocks

HTML5 Rocks is an awesome resource for for developers looking to put HTML5 to
use today, including information on specific features and when to use them in your apps.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
02. HTML5 & Friends
HTML5 & Friends on the Mozilla Developer Network offers a great selection of
information, demonstrations, tools and resources on the programming language. The web
page is clean and extremely easy to navigate, using symbols, lists and a simple grid to lead
to you the desired information.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
03. HTML5 Cheat Sheet
The guys over at Smashing Magazine released this handy, printable HTML5 cheat
sheet, which lists all currently supported tags, their descriptions, attributes and their
support in HTML 4.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
04. 55 amazing examples of HTML5
We couldn't make a list of awesome HTML5 resources without including this
compliation we put together. If you want to see exactly what this programming language
is capable of, look no further.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
05. Introduction to HTML5 from Mozilla
The Mozilla Developer Network is a fantastic resource for web developers. Organized
by topics, it provides documentation about extensions, themes, applications, frameworks
and technologies - including an excellent in-depth section on HTML5. Not only does it
discuss the fundamentals of HTML5, there's also a section which points you in the
direction of other online resources on the subject.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
06. HTML5 Doctor
For everything HTML, head over to HTML5 Doctor where you will find articles on
everything you might need as well as an awesome 'Ask the Doctor' Q&A section, in
which top advocates of the technology, including Bruce Lawson, Remy Sharp, and Rick
Clark, answer on a regular basis. A brilliant resource.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
07. HTML5 for Web Designers
Web developer Jeremy Keith has taken the 900-page, hard-to-read HTML5 spec and
created a much more user-friendly 85-page version with HTML5 for Web Designers.
Among the pages, Keith cuts to the chase, explaining what accessible, content-focused
standards-based web designers and front-end developers need to know clearly and with
easy to understand, practical examples. You have to pay for it, but the e-version is a steal
at just $9.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
08. Dive into HTML5
Dive into HTML5 by Mark Pilgrim is a fantastic resource to help you really get to
grips with the basics of HTML5. In depth and detailed, this online book will help you get
to grips with the semantics of new elements, playing video without Flash, local storage,
offline apps, manipulating browser history and much more.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
09. HTML5 Please
HTML5 Please is an awesome HTML5 tool, giving users the power to "use the new and
shiny responsibly". This great resource helps you choose and look up features of HTML5 you can
use and provides advice in making decisions about how to implement the computer language into
your projects.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
10. net
If you're looking for HTML5 news, advice and tips, our print and tablet publication
net magazine is a fantastic place to start. Here you'll find articles written by experts in the
field as well as lots of awesome examples of HTML5 in action.

Copyright © 2014 Team Mango Media Private Limited. All rights reserved.

Mais conteúdo relacionado

Mais procurados

Mais procurados (11)

HTML5 Tags and Elements Tutorial
HTML5 Tags and Elements TutorialHTML5 Tags and Elements Tutorial
HTML5 Tags and Elements Tutorial
 
HTML5 New Features and Resources
HTML5 New Features and ResourcesHTML5 New Features and Resources
HTML5 New Features and Resources
 
HTML5--The 30,000' View (A fast-paced overview of HTML5)
HTML5--The 30,000' View (A fast-paced overview of HTML5)HTML5--The 30,000' View (A fast-paced overview of HTML5)
HTML5--The 30,000' View (A fast-paced overview of HTML5)
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 
HTML5
HTML5HTML5
HTML5
 
HTML5 Tutorial
HTML5 TutorialHTML5 Tutorial
HTML5 Tutorial
 
Introdution to HTML 5
Introdution to HTML 5Introdution to HTML 5
Introdution to HTML 5
 
Wa html5-pdf
Wa html5-pdfWa html5-pdf
Wa html5-pdf
 
Html5(2)
Html5(2)Html5(2)
Html5(2)
 
Wa html5-pdf
Wa html5-pdfWa html5-pdf
Wa html5-pdf
 
jackylopez.com - Virtual Assistant and Web Development
jackylopez.com - Virtual Assistant and Web Developmentjackylopez.com - Virtual Assistant and Web Development
jackylopez.com - Virtual Assistant and Web Development
 

Destaque

Doc rev overview_2013
Doc rev overview_2013Doc rev overview_2013
Doc rev overview_2013Robert Grande
 
ELMARINO nutrisi alami
ELMARINO nutrisi alamiELMARINO nutrisi alami
ELMARINO nutrisi alamiadi Pamungkas
 
Presentación Londres
Presentación LondresPresentación Londres
Presentación Londresnataliaraes
 
Linkedin final
Linkedin finalLinkedin final
Linkedin finalwyks0600
 
Italy Presentation
Italy PresentationItaly Presentation
Italy Presentationwyks0600
 
30Harri Jago Jualan 'closing tanpa pusing'
30Harri Jago Jualan 'closing tanpa pusing'30Harri Jago Jualan 'closing tanpa pusing'
30Harri Jago Jualan 'closing tanpa pusing'adi Pamungkas
 

Destaque (7)

Doc rev overview_2013
Doc rev overview_2013Doc rev overview_2013
Doc rev overview_2013
 
ELMARINO nutrisi alami
ELMARINO nutrisi alamiELMARINO nutrisi alami
ELMARINO nutrisi alami
 
Presentación Londres
Presentación LondresPresentación Londres
Presentación Londres
 
Linkedin final
Linkedin finalLinkedin final
Linkedin final
 
Why Every Business Wants Mobile Optimized Websites?
Why Every Business Wants Mobile Optimized Websites?Why Every Business Wants Mobile Optimized Websites?
Why Every Business Wants Mobile Optimized Websites?
 
Italy Presentation
Italy PresentationItaly Presentation
Italy Presentation
 
30Harri Jago Jualan 'closing tanpa pusing'
30Harri Jago Jualan 'closing tanpa pusing'30Harri Jago Jualan 'closing tanpa pusing'
30Harri Jago Jualan 'closing tanpa pusing'
 

Semelhante a HTML5 Introduction – Features and Resources for HTML5

Semelhante a HTML5 Introduction – Features and Resources for HTML5 (20)

HTML5 vs Flash : Term paper at VGSOM, IIT Kharagpur
HTML5 vs Flash : Term paper at VGSOM, IIT KharagpurHTML5 vs Flash : Term paper at VGSOM, IIT Kharagpur
HTML5 vs Flash : Term paper at VGSOM, IIT Kharagpur
 
Everything you need to know about HTML5 in 15 min
Everything you need to know about HTML5 in 15 minEverything you need to know about HTML5 in 15 min
Everything you need to know about HTML5 in 15 min
 
Everything That You Need To Know About HTML5
Everything That You Need To Know About HTML5Everything That You Need To Know About HTML5
Everything That You Need To Know About HTML5
 
Html5
Html5Html5
Html5
 
Html5
Html5Html5
Html5
 
Html5
Html5Html5
Html5
 
Report html5
Report html5Report html5
Report html5
 
UMK Lecture 5 - HTML5 latest v7
UMK Lecture 5 - HTML5 latest v7UMK Lecture 5 - HTML5 latest v7
UMK Lecture 5 - HTML5 latest v7
 
Html5
Html5Html5
Html5
 
Html5
Html5Html5
Html5
 
Html5
Html5Html5
Html5
 
Html5
Html5Html5
Html5
 
Html5
Html5Html5
Html5
 
Html5
Html5Html5
Html5
 
HTML5 and DHTML
HTML5 and DHTMLHTML5 and DHTML
HTML5 and DHTML
 
1._Introduction_to_HTML5 powerpoint presentation
1._Introduction_to_HTML5 powerpoint presentation1._Introduction_to_HTML5 powerpoint presentation
1._Introduction_to_HTML5 powerpoint presentation
 
Html 5 Features And Benefits
Html 5 Features And Benefits  Html 5 Features And Benefits
Html 5 Features And Benefits
 
Introduction to html5
Introduction to html5Introduction to html5
Introduction to html5
 
Introduction to HTML5
Introduction to HTML5Introduction to HTML5
Introduction to HTML5
 
1. introduction to html5
1. introduction to html51. introduction to html5
1. introduction to html5
 

Mais de Team Mango Media Private Limited

Top 20 Social Networking Sites To Drive Huge Traffic to Your Website
Top 20 Social Networking Sites To Drive Huge Traffic to Your WebsiteTop 20 Social Networking Sites To Drive Huge Traffic to Your Website
Top 20 Social Networking Sites To Drive Huge Traffic to Your WebsiteTeam Mango Media Private Limited
 

Mais de Team Mango Media Private Limited (20)

Common Web Design Mistakes that Designers Need to Avoid
Common Web Design Mistakes that Designers Need to AvoidCommon Web Design Mistakes that Designers Need to Avoid
Common Web Design Mistakes that Designers Need to Avoid
 
Top 8 Reasons for the Decline in Website Traffic
Top 8 Reasons for the Decline in Website TrafficTop 8 Reasons for the Decline in Website Traffic
Top 8 Reasons for the Decline in Website Traffic
 
Landing Page vs Website: Which one do you need and Why?
Landing Page vs Website: Which one do you need and Why?Landing Page vs Website: Which one do you need and Why?
Landing Page vs Website: Which one do you need and Why?
 
The Ultimate Revelation Of Ecommerce Websites Development
The Ultimate Revelation Of Ecommerce Websites DevelopmentThe Ultimate Revelation Of Ecommerce Websites Development
The Ultimate Revelation Of Ecommerce Websites Development
 
Creative WordPress Themes of 2015
Creative WordPress Themes of 2015Creative WordPress Themes of 2015
Creative WordPress Themes of 2015
 
Top 20 Social Networking Sites To Drive Huge Traffic to Your Website
Top 20 Social Networking Sites To Drive Huge Traffic to Your WebsiteTop 20 Social Networking Sites To Drive Huge Traffic to Your Website
Top 20 Social Networking Sites To Drive Huge Traffic to Your Website
 
Awards For Creating the Websites
Awards For Creating the Websites Awards For Creating the Websites
Awards For Creating the Websites
 
Twitter Marketing Strategies 2015
Twitter Marketing Strategies 2015Twitter Marketing Strategies 2015
Twitter Marketing Strategies 2015
 
Dazzling Twitter Cover Image Ideas
Dazzling Twitter Cover Image IdeasDazzling Twitter Cover Image Ideas
Dazzling Twitter Cover Image Ideas
 
How To Promote Your Business On Pinterest
How To Promote Your Business On PinterestHow To Promote Your Business On Pinterest
How To Promote Your Business On Pinterest
 
Digital Marketing Strategies In 2015
Digital Marketing Strategies In 2015Digital Marketing Strategies In 2015
Digital Marketing Strategies In 2015
 
Quality Content Boost Site Rankings In Search Engines
Quality Content Boost Site Rankings In Search EnginesQuality Content Boost Site Rankings In Search Engines
Quality Content Boost Site Rankings In Search Engines
 
Why Business Needs Content Marketing
Why Business Needs Content MarketingWhy Business Needs Content Marketing
Why Business Needs Content Marketing
 
Google Mobile Friendly Algorithm Updates & Tips
Google Mobile Friendly Algorithm Updates & TipsGoogle Mobile Friendly Algorithm Updates & Tips
Google Mobile Friendly Algorithm Updates & Tips
 
Best Brand Logos with Behind the Hidden Messages
Best Brand Logos with Behind the Hidden MessagesBest Brand Logos with Behind the Hidden Messages
Best Brand Logos with Behind the Hidden Messages
 
Useful Tools for Design and Development Process
Useful Tools for Design and Development ProcessUseful Tools for Design and Development Process
Useful Tools for Design and Development Process
 
Ways to write Social Media Updates?
Ways to write Social Media Updates?Ways to write Social Media Updates?
Ways to write Social Media Updates?
 
Key Online Marketing Players in Global
Key Online Marketing Players in GlobalKey Online Marketing Players in Global
Key Online Marketing Players in Global
 
Key Ways to Construct Compelling Content for Marketers
Key Ways to Construct Compelling Content for MarketersKey Ways to Construct Compelling Content for Marketers
Key Ways to Construct Compelling Content for Marketers
 
25 Free Image channel Sources for Social Media Campaigns
25 Free Image channel Sources for Social Media Campaigns25 Free Image channel Sources for Social Media Campaigns
25 Free Image channel Sources for Social Media Campaigns
 

Último

VVIP Pune Call Girls Hadapsar (7001035870) Pune Escorts Nearby with Complete ...
VVIP Pune Call Girls Hadapsar (7001035870) Pune Escorts Nearby with Complete ...VVIP Pune Call Girls Hadapsar (7001035870) Pune Escorts Nearby with Complete ...
VVIP Pune Call Girls Hadapsar (7001035870) Pune Escorts Nearby with Complete ...Call Girls in Nagpur High Profile
 
Top Rated Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...
Top Rated  Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...Top Rated  Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...
Top Rated Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...Call Girls in Nagpur High Profile
 
VIP Call Girls Service Mehdipatnam Hyderabad Call +91-8250192130
VIP Call Girls Service Mehdipatnam Hyderabad Call +91-8250192130VIP Call Girls Service Mehdipatnam Hyderabad Call +91-8250192130
VIP Call Girls Service Mehdipatnam Hyderabad Call +91-8250192130Suhani Kapoor
 
Kurla Call Girls Pooja Nehwal📞 9892124323 ✅ Vashi Call Service Available Nea...
Kurla Call Girls Pooja Nehwal📞 9892124323 ✅  Vashi Call Service Available Nea...Kurla Call Girls Pooja Nehwal📞 9892124323 ✅  Vashi Call Service Available Nea...
Kurla Call Girls Pooja Nehwal📞 9892124323 ✅ Vashi Call Service Available Nea...Pooja Nehwal
 
SCRIP Lua HTTP PROGRACMACION PLC WECON CA
SCRIP Lua HTTP PROGRACMACION PLC  WECON CASCRIP Lua HTTP PROGRACMACION PLC  WECON CA
SCRIP Lua HTTP PROGRACMACION PLC WECON CANestorGamez6
 
Fashion trends before and after covid.pptx
Fashion trends before and after covid.pptxFashion trends before and after covid.pptx
Fashion trends before and after covid.pptxVanshNarang19
 
Booking open Available Pune Call Girls Nanded City 6297143586 Call Hot India...
Booking open Available Pune Call Girls Nanded City  6297143586 Call Hot India...Booking open Available Pune Call Girls Nanded City  6297143586 Call Hot India...
Booking open Available Pune Call Girls Nanded City 6297143586 Call Hot India...Call Girls in Nagpur High Profile
 
Nepali Escort Girl Gomti Nagar \ 9548273370 Indian Call Girls Service Lucknow...
Nepali Escort Girl Gomti Nagar \ 9548273370 Indian Call Girls Service Lucknow...Nepali Escort Girl Gomti Nagar \ 9548273370 Indian Call Girls Service Lucknow...
Nepali Escort Girl Gomti Nagar \ 9548273370 Indian Call Girls Service Lucknow...nagunakhan
 
Kala jadu for love marriage | Real amil baba | Famous amil baba | kala jadu n...
Kala jadu for love marriage | Real amil baba | Famous amil baba | kala jadu n...Kala jadu for love marriage | Real amil baba | Famous amil baba | kala jadu n...
Kala jadu for love marriage | Real amil baba | Famous amil baba | kala jadu n...babafaisel
 
Peaches App development presentation deck
Peaches App development presentation deckPeaches App development presentation deck
Peaches App development presentation decktbatkhuu1
 
VIP Kolkata Call Girl Gariahat 👉 8250192130 Available With Room
VIP Kolkata Call Girl Gariahat 👉 8250192130  Available With RoomVIP Kolkata Call Girl Gariahat 👉 8250192130  Available With Room
VIP Kolkata Call Girl Gariahat 👉 8250192130 Available With Roomdivyansh0kumar0
 
Top Rated Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
Top Rated  Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...Top Rated  Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
Top Rated Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...Call Girls in Nagpur High Profile
 
DragonBall PowerPoint Template for demo.pptx
DragonBall PowerPoint Template for demo.pptxDragonBall PowerPoint Template for demo.pptx
DragonBall PowerPoint Template for demo.pptxmirandajeremy200221
 
Punjabi Housewife Call Girls Service Gomti Nagar \ 9548273370 Indian Call Gir...
Punjabi Housewife Call Girls Service Gomti Nagar \ 9548273370 Indian Call Gir...Punjabi Housewife Call Girls Service Gomti Nagar \ 9548273370 Indian Call Gir...
Punjabi Housewife Call Girls Service Gomti Nagar \ 9548273370 Indian Call Gir...nagunakhan
 
VIP Call Girls Service Bhagyanagar Hyderabad Call +91-8250192130
VIP Call Girls Service Bhagyanagar Hyderabad Call +91-8250192130VIP Call Girls Service Bhagyanagar Hyderabad Call +91-8250192130
VIP Call Girls Service Bhagyanagar Hyderabad Call +91-8250192130Suhani Kapoor
 
The_Canvas_of_Creative_Mastery_Newsletter_April_2024_Version.pdf
The_Canvas_of_Creative_Mastery_Newsletter_April_2024_Version.pdfThe_Canvas_of_Creative_Mastery_Newsletter_April_2024_Version.pdf
The_Canvas_of_Creative_Mastery_Newsletter_April_2024_Version.pdfAmirYakdi
 
Dubai Call Girls Pro Domain O525547819 Call Girls Dubai Doux
Dubai Call Girls Pro Domain O525547819 Call Girls Dubai DouxDubai Call Girls Pro Domain O525547819 Call Girls Dubai Doux
Dubai Call Girls Pro Domain O525547819 Call Girls Dubai Douxkojalkojal131
 

Último (20)

VVIP Pune Call Girls Hadapsar (7001035870) Pune Escorts Nearby with Complete ...
VVIP Pune Call Girls Hadapsar (7001035870) Pune Escorts Nearby with Complete ...VVIP Pune Call Girls Hadapsar (7001035870) Pune Escorts Nearby with Complete ...
VVIP Pune Call Girls Hadapsar (7001035870) Pune Escorts Nearby with Complete ...
 
Top Rated Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...
Top Rated  Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...Top Rated  Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...
Top Rated Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...
 
VIP Call Girls Service Mehdipatnam Hyderabad Call +91-8250192130
VIP Call Girls Service Mehdipatnam Hyderabad Call +91-8250192130VIP Call Girls Service Mehdipatnam Hyderabad Call +91-8250192130
VIP Call Girls Service Mehdipatnam Hyderabad Call +91-8250192130
 
Kurla Call Girls Pooja Nehwal📞 9892124323 ✅ Vashi Call Service Available Nea...
Kurla Call Girls Pooja Nehwal📞 9892124323 ✅  Vashi Call Service Available Nea...Kurla Call Girls Pooja Nehwal📞 9892124323 ✅  Vashi Call Service Available Nea...
Kurla Call Girls Pooja Nehwal📞 9892124323 ✅ Vashi Call Service Available Nea...
 
B. Smith. (Architectural Portfolio.).pdf
B. Smith. (Architectural Portfolio.).pdfB. Smith. (Architectural Portfolio.).pdf
B. Smith. (Architectural Portfolio.).pdf
 
SCRIP Lua HTTP PROGRACMACION PLC WECON CA
SCRIP Lua HTTP PROGRACMACION PLC  WECON CASCRIP Lua HTTP PROGRACMACION PLC  WECON CA
SCRIP Lua HTTP PROGRACMACION PLC WECON CA
 
Fashion trends before and after covid.pptx
Fashion trends before and after covid.pptxFashion trends before and after covid.pptx
Fashion trends before and after covid.pptx
 
Booking open Available Pune Call Girls Nanded City 6297143586 Call Hot India...
Booking open Available Pune Call Girls Nanded City  6297143586 Call Hot India...Booking open Available Pune Call Girls Nanded City  6297143586 Call Hot India...
Booking open Available Pune Call Girls Nanded City 6297143586 Call Hot India...
 
Nepali Escort Girl Gomti Nagar \ 9548273370 Indian Call Girls Service Lucknow...
Nepali Escort Girl Gomti Nagar \ 9548273370 Indian Call Girls Service Lucknow...Nepali Escort Girl Gomti Nagar \ 9548273370 Indian Call Girls Service Lucknow...
Nepali Escort Girl Gomti Nagar \ 9548273370 Indian Call Girls Service Lucknow...
 
Kala jadu for love marriage | Real amil baba | Famous amil baba | kala jadu n...
Kala jadu for love marriage | Real amil baba | Famous amil baba | kala jadu n...Kala jadu for love marriage | Real amil baba | Famous amil baba | kala jadu n...
Kala jadu for love marriage | Real amil baba | Famous amil baba | kala jadu n...
 
Peaches App development presentation deck
Peaches App development presentation deckPeaches App development presentation deck
Peaches App development presentation deck
 
VIP Kolkata Call Girl Gariahat 👉 8250192130 Available With Room
VIP Kolkata Call Girl Gariahat 👉 8250192130  Available With RoomVIP Kolkata Call Girl Gariahat 👉 8250192130  Available With Room
VIP Kolkata Call Girl Gariahat 👉 8250192130 Available With Room
 
Top Rated Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
Top Rated  Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...Top Rated  Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
Top Rated Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
 
DragonBall PowerPoint Template for demo.pptx
DragonBall PowerPoint Template for demo.pptxDragonBall PowerPoint Template for demo.pptx
DragonBall PowerPoint Template for demo.pptx
 
young call girls in Vivek Vihar🔝 9953056974 🔝 Delhi escort Service
young call girls in Vivek Vihar🔝 9953056974 🔝 Delhi escort Serviceyoung call girls in Vivek Vihar🔝 9953056974 🔝 Delhi escort Service
young call girls in Vivek Vihar🔝 9953056974 🔝 Delhi escort Service
 
Punjabi Housewife Call Girls Service Gomti Nagar \ 9548273370 Indian Call Gir...
Punjabi Housewife Call Girls Service Gomti Nagar \ 9548273370 Indian Call Gir...Punjabi Housewife Call Girls Service Gomti Nagar \ 9548273370 Indian Call Gir...
Punjabi Housewife Call Girls Service Gomti Nagar \ 9548273370 Indian Call Gir...
 
VIP Call Girls Service Bhagyanagar Hyderabad Call +91-8250192130
VIP Call Girls Service Bhagyanagar Hyderabad Call +91-8250192130VIP Call Girls Service Bhagyanagar Hyderabad Call +91-8250192130
VIP Call Girls Service Bhagyanagar Hyderabad Call +91-8250192130
 
young call girls in Pandav nagar 🔝 9953056974 🔝 Delhi escort Service
young call girls in Pandav nagar 🔝 9953056974 🔝 Delhi escort Serviceyoung call girls in Pandav nagar 🔝 9953056974 🔝 Delhi escort Service
young call girls in Pandav nagar 🔝 9953056974 🔝 Delhi escort Service
 
The_Canvas_of_Creative_Mastery_Newsletter_April_2024_Version.pdf
The_Canvas_of_Creative_Mastery_Newsletter_April_2024_Version.pdfThe_Canvas_of_Creative_Mastery_Newsletter_April_2024_Version.pdf
The_Canvas_of_Creative_Mastery_Newsletter_April_2024_Version.pdf
 
Dubai Call Girls Pro Domain O525547819 Call Girls Dubai Doux
Dubai Call Girls Pro Domain O525547819 Call Girls Dubai DouxDubai Call Girls Pro Domain O525547819 Call Girls Dubai Doux
Dubai Call Girls Pro Domain O525547819 Call Girls Dubai Doux
 

HTML5 Introduction – Features and Resources for HTML5

  • 1. HTML5 Introduction – Features and Resources for HTML5 What is HTML5? HTML5 is the fifth revision and newest version of the HTML standard. It offers new features that provide not only rich media support, but also enhance support for creating web applications that can interact with the user, his/her local data, and servers, more easily and effectively than was possible previously. Because HTML5 is still being developed, changes to the specifications are inevitable. Therefore, not all of its features are supported by all browsers yet. However, Gecko, and by extension, Firefox, has very good initial support for HTML5, and work continues toward supporting more of its features. Gecko began supporting some HTML5 features in version 1.8.1. You can find a list of all of the HTML5 features that Gecko currently supports on the main HTML5 page. HTML5 is the successor of HTML 4.01, released for the first time in 1999. The internet has changed significantly since 1999 and it seemed like the creation of HTML5 was necessary. The new markup language was developed based on pre-set standards:       New features should be based on HTML, CSS, DOM, and JavaScript. The need for external plugins (like Flash) needs to be reduced. Error handling should be easier than in previous versions. Scripting has to be replaced by more markup. HTML5 should be device-independent. The development process should be visible to the public. A Brief History of HTML In addition to this official work on HTML, the browsers have been making their own additions to HTML. Some changes were eventually adopted into W3C HTML Recommendations; others remain proprietary coding aspects that only the individual browsers recognize. The browsers' versions of HTML changed, too, in a game of marketing and programming one-upmanship, hoping to lock Web developers into using one browser or the other exclusively. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 2. Timelines:                       Creation of language in conjunction with Berners-Lee's WWW program - Oct.->Dec. 1990 Specification for HTML released on the Internet - Summer, 1991 Draft defining HTML released (Internet draft later expired) - June, 1993 Initial document for 'HTML 2.0' released - April, 1994 Draft for HTML 2.0 cleaned up and released - July, 1994 HTML 2.0 draft further refined with plans to release as an RFC - February, 1995 HTML 2.0 (RFC 1866) approved as a proposed standard - September, 1995 HTML 3.0 draft released (later expired) - March, 1995 HTML 3.2 draft released - May, 1996 HTML experimental DTD 'Cougar' released - July, 1996 W3C recommendation for HTML 3.2 (Wilbur) - January, 1997 HTML 4.0 draft (evolved from Cougar) released - July, 1997 HTML 4.0 becomes W3C proposed recommendation - November, 1997 HTML 4.0 becomes W3C recommendation - December, 1997 HTML 4.0 revised and certified W3C recommendation - April, 1998 Draft released for 'Reformulating HTML in XML' (codename Voyager) - December, 1998 XHTML 1.0 first working draft released - January, 1999 XHTML 1.0 becomes W3C Proposed Recommendation - August, December 1999 XHTML 1.1 first working draft released - September, 1999 XHTML 1.0 becomes W3C Recommendation - January, 2000 XHTML 1.1 becomes W3C Proposed Recommendation - April, 2001 XHTML 1.1 becomes W3C Recommendation - May, 2001 What HTML is today The standards for HTML are currently being developed by a worldwide industry consortium known as the W3C. This work was carried out previously by the IETF. The W3C places several requirements on HTML: "The document format should be, as far as practical, backwards compatible with existing HTML documents. It should support both paged and scrolling layout models...A simple, scaleable document format that can be used for information exchange on virtually any platform." The W3C goes on to list the proposed range of these platforms, which include:     Graphical User Interfaces, such as Windows, Macs and X11/Unix Text only systems, such as VT-100 terminals Text to Speech devices Rendering to Braille Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 3. The Success of HTML In hindsight, the following quote by Berners-Lee from the original CERN proposal shows how far things have progressed in less than a decade: "In 10 years, there may be many commercial solutions to the problems above, while today we need something to allow us to continue." The WWW and HTML solutions that Berners-Lee created have evolved into that solution. HTML is now becoming the primary document format of choice not only on the Web, but also elsewhere in both personal and commercial uses. Despite its current limitations, HTML has become the most popular and widely used rich text format ever. What’s new? HTML5 was created to make the coding process easier and more logical. You will see a bit later that many syntaxes are now deprecated and soon to be kicked out through the back door. The unique and impressive features HTML5 comes with are in the multimedia department. Many of the features it comes with have been created with the consideration that users should be able to run heavy content on low-powered devices. The syntactic features include the new <video>, <audio> and <canvas> elements, but also integration of vector graphics content (what we knew before as being the <object> tags). This means that multimedia and graphic content on the web will be handled and executed easier and faster, without the need of plugins or APIs. There are a bunchload of new syntaxes added, but below I will name and describe the most important. The rest of them can always be found in W3C’s HTML5 section.         <article> – this tag defines an article, a user comment or a post, so an independent item of content <aside> – the aside tag marks content aside from the page content, which for example could be a lateral sidebar <header>, <footer> – you won’t need to manually name IDs for headers and footers, as now you have a pre-defined tag for them <nav> – the navigation can now be placed in the markup in between the nav tags, which will automatically make your lists act like navigation <section> – this is another important new syntax, as it can define any kind of sections in your document. It works pretty much like a div which separates different sections. <audio>, <video> – these two obviously mark sound or video content, which will now be easier to run by devices. <embed> – this new tag defines a container for interactive content (plugin) or external application <canvas> – the canvas tag is quite exciting, as it allows drawing graphics via scripting (mostly JavaScript, but some others can be employed as well) Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 4. What is important to remember is that the new HTML5 tags do not always work as the ones before. For example, the header and footer tags will not only mark the start and the end of a page, but also the start and the end of each section you have. This means that these two tags are likely to be used more than once in the whole page. In the illustration below can you see what I mean. The following tags from HTML 4.01 are now removed from HTML5, therefore browsers do not offer support for them anymore. This means that it is a good idea to go back to your HTML pages and check for them, as they might disrupt the design in the latest browsers. <acronym> <applet> <basefont> <big> <center> <dir> <font> <frame> <frameset> <noframes> <strike> <tt> Things to know about HTML5 It is crucial to remember that HTML5 is built on the success of its previous version, HTML 4.01, which is undoubtedly the best version ever. In order to be better at using HTML5 you do not need to forget everything about the previous version. You are not learning a totally new language here. Keep your beloved syntaxes and keep the way you used to format your code, only remember that now you need to build upon the coding skills you already have. In case you have absolutely no knowledge of HTML and you want to start now, I advise you to start with HTML 4.01 and only when you master it move onto HTML5. Starting with the latest version is like learning to run before learning to walk – which is impossible as far as I know. HTML 4.01 still contains the basics of HTML5, therefore in my opinion you should have strong knowledge of former HTML versions in order to be able to master HTML5. The upside of learning HTML5 now is that the new markup language works right away. You can basically do whatever you want with it today – and it is supported in all major browsers. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 5. From video to geolocation, local storage and microdata annotations, HTML5 is something we need to start using. If you are in the design business, sticking with HTML 4.01 is a mistake, because everybody will move on while you will remain behind. HTML5 is definitely here to stay. It is created to sustain today’s necessities and especially because it is in continuous development, it will be able to sustain the changes that will happen in the industry for quite some time. One of the reasons behind HTML5 taking so much time to develop is because the W3C had to analyze lots of factors and think of the future. They took their time and finally delivered something that can easily be labelled as a high-quality product. Best and Trendy HTML5 Website in 2014  Heart of the Arctic A 72,000px wide site where users go on an expedition through 4 detailed environments and gather 56 animated collectables to restore balance to Arctic life. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 6.  Wanda Print Nested in the art network of WANDA-PRODUCTIONS, Our talents are creatively driven to perform fresh and striking digital images. We integrates art buying support, production coordination, casting, location scouting, booking, to post production delivery.  Soyuz Coffee Roasting Soyuz Coffee truly believes that coffee is much more than a brewed beverage as we know it, it’s a way of living! And exactly this coffee experience is something Skybox created via the re-invented... Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 7.  Parrot - Flower Power Discover Parrot Flower Power, the first intelligent wireless sensor fitted with Bluetooth Smart Technology which, through a dedicated application, helps you look after your plants.  STAINSBEAUPAYS STAINSBEAUPAYS™ is an infinite interactive movie made by 15 year old teenagers from Paris suburb. Jump on the wheel and enjoy the trip ! Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 8.  Melanie F Melanie.F is a French brand that manufactures slippers for children. She introduces you her new collection 2013/2014.  Suffolk's bold new tourism site The website, and its Take me to Suffolk campaign and Facebook app, tear up the rule book for British tourism websites. Site visitors explore, play and discover the joy of a break in this... Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 9.  Love Carmen Rose Love Carmen Rose is a photography studio in Fort Worth, Texas  Merry Christmallax Christmas greeting one pager that takes you from wire-framing stage to polish as you scroll down the page. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 10.  Alee Foroughi - Portfolio My name is Alee Foroughi. I'm CEO & Designer at Swan Design Studio. I love design and it shows in my works.  Mehdi Benyounes, CEO Rscollab Site official de Mehdi Benyounes : CEO Rscollab / Lead developer / Web designer Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 11. 10 Top HTML5 Resources Want to learn HTML? Or hone your skills in the computer language? Then check out these top resources. The web is a wonderful thing, brimming with resources and tutorials for people wanting to learn HTML5. But, sometimes, too much choice can be confusing, so we've picked 10 top resources that will really help you get to grips with it. 01. HTML5 Rocks HTML5 Rocks is an awesome resource for for developers looking to put HTML5 to use today, including information on specific features and when to use them in your apps. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 12. 02. HTML5 & Friends HTML5 & Friends on the Mozilla Developer Network offers a great selection of information, demonstrations, tools and resources on the programming language. The web page is clean and extremely easy to navigate, using symbols, lists and a simple grid to lead to you the desired information. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 13. 03. HTML5 Cheat Sheet The guys over at Smashing Magazine released this handy, printable HTML5 cheat sheet, which lists all currently supported tags, their descriptions, attributes and their support in HTML 4. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 14. 04. 55 amazing examples of HTML5 We couldn't make a list of awesome HTML5 resources without including this compliation we put together. If you want to see exactly what this programming language is capable of, look no further. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 15. 05. Introduction to HTML5 from Mozilla The Mozilla Developer Network is a fantastic resource for web developers. Organized by topics, it provides documentation about extensions, themes, applications, frameworks and technologies - including an excellent in-depth section on HTML5. Not only does it discuss the fundamentals of HTML5, there's also a section which points you in the direction of other online resources on the subject. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 16. 06. HTML5 Doctor For everything HTML, head over to HTML5 Doctor where you will find articles on everything you might need as well as an awesome 'Ask the Doctor' Q&A section, in which top advocates of the technology, including Bruce Lawson, Remy Sharp, and Rick Clark, answer on a regular basis. A brilliant resource. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 17. 07. HTML5 for Web Designers Web developer Jeremy Keith has taken the 900-page, hard-to-read HTML5 spec and created a much more user-friendly 85-page version with HTML5 for Web Designers. Among the pages, Keith cuts to the chase, explaining what accessible, content-focused standards-based web designers and front-end developers need to know clearly and with easy to understand, practical examples. You have to pay for it, but the e-version is a steal at just $9. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 18. 08. Dive into HTML5 Dive into HTML5 by Mark Pilgrim is a fantastic resource to help you really get to grips with the basics of HTML5. In depth and detailed, this online book will help you get to grips with the semantics of new elements, playing video without Flash, local storage, offline apps, manipulating browser history and much more. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 19. 09. HTML5 Please HTML5 Please is an awesome HTML5 tool, giving users the power to "use the new and shiny responsibly". This great resource helps you choose and look up features of HTML5 you can use and provides advice in making decisions about how to implement the computer language into your projects. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.
  • 20. 10. net If you're looking for HTML5 news, advice and tips, our print and tablet publication net magazine is a fantastic place to start. Here you'll find articles written by experts in the field as well as lots of awesome examples of HTML5 in action. Copyright © 2014 Team Mango Media Private Limited. All rights reserved.