• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
More On Html 5
 

More On Html 5

on

  • 2,041 views

A brief outline on some of the new elements available in HTML 5 and how to start using them now.

A brief outline on some of the new elements available in HTML 5 and how to start using them now.

Statistics

Views

Total Views
2,041
Views on SlideShare
2,039
Embed Views
2

Actions

Likes
3
Downloads
41
Comments
0

1 Embed 2

http://yogeshg1987.blogspot.com 2

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    More On Html 5 More On Html 5 Document Transcript

    • More on HTML5 Darren Wood @darren | http://dontcom.com
    • What is HTML 5? ‐
next
major
revision
of
HTML ‐
from
1997
to
2006
work
on
HTML
within
the
W3C
was
focused
exclusively
on
XHTML ‐
in
2004
with
the
Web
Hypertext
ApplicaJon
Technology
Working
Group
(WHATWG)
formed
as
a
break‐away
from
the
W3C
‐
developed
 the
crux
of
HTML ‐
main
dude
is
IAN
HICKSON ‐
first
draU
appeared
22
Jan
2008
W3C ‐
two
variants
of
same
language;
classic
HTML
(HTML5)
or
XHTML
variant
(XHTML5).

first
Jme
HTML
and
XHTML
have
been
developed
 in
parallel ‐
HTML
is
a
game
changer
esp
in
the
web
app
and
RIA
areas...
    • HTML5 Design Principles
    • Support existing content Ensure interoperability Handle errors Evolution not revolution - Support existing content - Ensure interoperability - Precisely define UA behavior - Handle errors - Evolution not revolution
    • The problem with the current setup... current setup is XHTML/XML
    • "The attempt to get the world to switch to XML, including quotes around attribute values and slashes in empty tags and namespaces all at once didn't work" - TBL
    • “Authors will write invalid content regardless of what we spec. So the spec states what authors must not do, and then tells implementers what they must do when an author does it anyway” - Ian Hickson
    • More than 90% of Alexa Top 500 sites are not valid
    • The solution...
    • Don't get hung up on the syntax
    • <A
HREF=contact.html
class=”yes”> <input
TYPE=”button”
value=FOO>
    • HTML <!DOCTYPE
html> XHTML <html
xmlns="http://www.w3.org/1999/xhtml"> - html 5 simple doctype - xhtml 5 strict xml rules, must be application/xml or application/xhtml+xml, no doctype required
    • <!DOCTYPE
html> <html
lang="en"> <head> 

<meta
charset=utf‐8> 

<title>HTML5
Demo</title> </head> <body> <header> 

<h1>Logo
etc</h1> </header> <nav><p>Menu</p></nav> <section> 

<h1>Section</h1> 

<article> 



<p>article
1</p> 

</article> </section> <aside> 

<h2>Some
extra
content</h2> </aside> <footer> 

<p>Copyright
&copy;
2009.</p> </footer> </body> </html>
    • In the real world...
    • Semantic class names
    • HTML5 shiv
    • <style> 

figure
{
 



border:
1px
inset
#AAA; 



padding:
4px; 

} </style> <script> 

document.createElement("figure"); </script>
    • tinyurl.com/html5-scaffold
    • Audio & Video
    • <video
width="640"
height="360"
src="http:// www.youtube.com/demo/google_main.mp"
autobuffer
 controls
poster="whale.png"> <p>Try
this
page
in
Safari
4!
Or
you
can
<a
 href="http://www.youtube.com/demo/ google_main.mp4">download
the
video</a>
 instead.</p> </video>
    • Codec Shit-fight.
    • OGG Theora & H.264 the plan was to support OGG Theora & H.264
    • OGG Theora & H.264 the plan was to support OGG Theora & H.264
    • The deal with OGG open source and free licensing Big Boys (Apple, Google) are generally scared of OS stuff no widespread hardware support (means mobile is out) lack of quality compared to H.264 ??
    • The deal with H.264 patent owned by MPEG (Motion Picture Experts Group) OS companies (Mozilla) reckon it's too pricey paying the licence doesn't guarantee complete immunity from patent infringement in the future... a whole bunch of other major licensing issues. LEGAL JARGAN
    • Just use Flash <cry>
    • Just use Flash <cry>
    • Link lovage... http://www.w3.org/TR/html5 http://whatwg.org/html5 http://html5doctor.com/ http://molly.com/html5/html5-0709.html http://html5gallery.com/ http://tinyurl.com/html5-video-debate
    • http://assets.dontcom.com/html5.pdf download
    • Lets talk! questions yo