HTML5 Quick Overview and Basic guidelines
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (2.81 MB, 22 trang )
HTML
5
WTF?
html timeline
1980
1989
1996
1997
1999
2000
2008
ENQUIRE
HTML
HTML2.0
HTML3.2
HTML4
HTML4.01
ISO/IEC 15445:2000
HTML5
working draft
xhtml timeline
2000
2008
XHTML1.0
XHTML5
alongside HTML5
XHTML1.1
XHTML2
HTML4.01
FINISHED
in
2O22
WTF?
compatibility
Opera, Chrome, Safari & Firefox
♥
<TODAY>
HTML5
internet explorer
DEAD
END
<javascript> to the rescue!
IE does not ♥ HTML5
nor
do i
says Firefox2
html5 minified
no
body?
<!DOCTYPE html>
<title>HTML 5</title>
<p>Hello world</p>
i ♥ validator
no
head?
looks
the
old
<div id=”header”>
<div id=”footer”>
<div id=”sidebar”>
<div id=”nav”>
<div class=”section”>
<div class=”article”>
new
<header>
<footer>
<aside>
<nav>
<section>
<article>
<tagsoup>
side by side
</close> elements
XHTML
HTML5
always use “quotes”
lowercase <tags>
no empty attributes
YOU
CHOOSE
bye bye
<acronym>
<basefont>
<big>
<center>
<font>
<s>
<strike>
<tt>
<u>
cellpadding
cellspacing
width
height
valign
size
clear
attributes
element
hello
<nav>
web forms
2.0
<header>
<footer>
<aside>
<article>
<section>
<time>
type
required
validation
url
date
time
color picker
min / max
oninvalid
<mark>
<meter>
<video>
<canvas>
autocomplete
contenteditable
<video & audio>
<video>
<video src=”x.mp4” controls autobuffer>
for those who can’t see this movie
</video>
look
no flash
styleable
<examples>
youtube.com/html5
9elements.com/io/projects/
html5/canvas
audio &
canvas
video
drag & drop
web workers
threaded <javascript>
non blocking UI
geolocation
ask the user’s location
see Google Maps
like the
iPhone
web apps
<vs>
desktop apps
offline storage
Gmail
closing
the gap
</thanks>
simon schoeters • @cimm • www.suffix.be
theme based on m. jackson wilikinson’s presentation at />
