Вы находитесь на странице: 1из 36

HTML5 & CSS3

The Future of Web Technologies


by Dang Minh Tuan

HTML5 & CSS3


The TODAY of Web Technologies
by Dang Minh Tuan

About me
Fullname: ng Minh Tun
http://www.facebook.com/dangminhtuan
Nickname: ohisee
http://twitter.com/ohisee
Website: hoctudau.com

Topics in H Ni PHP Day


2008: HTML & CSS Best Practices
http://www.hoctudau.com/slides/html-css-best-practices

2009: HTML & CSS Trends


http://www.hoctudau.com/slides/html-css-trends

What?

Why?

Who?
When?

How?

What?

What is HTML5 & CSS3?

HTML5 is (just a version of) HTML


CSS3 is (just a version of) CSS

HTML5 is (just a version of) HTML


CSS3 is (just a version of) CSS

HTML5 is (just a version of) HTML


CSS3 is (just a version of) CSS

HTML5 is (just a version of) HTML


CSS3 is (just a version of) CSS

New Version - remove some, add many


HTML5 references
http://www.w3schools.com/html5/html5_reference.asp
HTML4
<div id="header">
<input type="text">

HTML5
<header>
<input type="email">

CSS3 references
http://www.veign.com/downloads/guides/qrg0008.pdf
CSS2
border

CSS3
border-radius

Who?

Who relates to HTML5 & CSS3?

Who develops them?


Who supports them?
Who uses them?
Who talks about them?

Who develops them?

Who develops them?

Who develops them?


HTML5 Specifications
WHATWG
o http://www.whatwg.org/specs/web-apps/current-work/
W3C
o http://dev.w3.org/html5/spec/Overview.html
IETF (WebSocket specification)
o http://tools.ietf.org/html/draft-hixie-thewebsocketprotocol

CSS 3 Specifications

W3C
o http://www.w3.org/Style/CSS/current-work

Who supports them?


http://www.findmebyip.com/litmus/#target-selector

Who uses them?

Apple

Who talks about them?


My personal bookmarks about HTML5 & CSS3
HTML5 ~ 80 links
sitepoint: 4
smashingmagazine: 4
tutsplus: 3
html5rocks: 2
sixrevisions: 2
VN: 4
other: 65

CSS3 ~ 70 links
smashingmagazine: 4
tutsplus: 3
marcofolio.net: 2
impressivewebs: 2
mikeplate: 2
css-tricks: 2
dev.opera: 2
VN: 1
other: 44

Who talks about them?


My personal bookmarks about HTML5 & CSS3
HTML5 Link Collection

CSS3 Link Collection

http://www.youtube.com/user/hoctudau#p/u/12/hoiI8Dy1Lnw

http://www.youtube.com/user/hoctudau#p/u/11/dLTmQG_kwJ4

Who talks about them?


Ebooks

most of them published in 2010

Who talks about them?


Slides:

http://www.slideshare.net/search/slideshow?q=HTML5
http://www.slideshare.net/search/slideshow?q=CSS3

How?

HOW TO?
How HTML5 & CSS3 can do?
How can you learn HTML5, CSS3?

Live Demo
http://slides.html5rocks.com/
http://www.youtube.com/user/hoctudau#p/u/6/1sD4mf5JDS4

http://www.youtube.com/user/hoctudau#p/u/8/GGX5SfYSNHw

HTML5 for some Devices


Do you have an iPhone?

How to learn HTML5, CSS3?


1. Step 1: Learn some basic HTML, CSS.
2. Step 2: Learn how to use HTML4, CSS2 in your daily
works.
3. Step 3: Learn how to apply HTML, CSS best
practices.
4. Step 4: "Playing make fun" with HTML5, CSS3
5. Step 5: "Practices make perfect" with HTML5, CSS3

Why?

When?

Why & When?


Why We Should Start Using CSS3 and
HTML5 Today?

For Our Clients


Conceding to the idea that the project will not be able to
look the same across various browsers,
This means more developed and unfettered imaginative
designs for our clients,
This could lead to increased costs for clients as well, but
with higher levels of innovation and
Clients visions for what they want will be less hindered
by these limitations.

For the Users


Potentially less disruptions of experience from one device
to another and
An overall improved user experience.

For Designers/Developers
Conceding to the idea that the project will not be able
to look the same across various browsers,
A more open playing field for designers and
developers all around; less restricted by this holding
pattern,
More exciting and innovative landscape to attract new
clientele,
Division of project audience into separate
presentational approaches and
Probably less work involved because we dont need
the many hacks and workarounds weve used before.

So What Are We Waiting For?

Fear Factor
Comfortable Factor
Doubt Factor
Faith Factor
Its Too Early Factor
Validation Factor

Who hires HTML5, CSS3 Ninja?

HTML5 vs Flash
o
o

http://flashsucks.org/
http://html5vsflash.tumblr.com/

Note: HTML5 doesn't do anything. It's


a spec; one that isn't finished yet. Sure, many
of its proposed features will allow developers
to produce similar features as Flash, but it's
up to the browser developers to implement
said specification.

Q&A
Start your own HTML5, CSS3 Project!
Now!!!

http://hoctudau.com/slides/reg
Topics in H Ni PHP Day

2008: HTML & CSS Best Practices


o http://www.hoctudau.com/slides/html-css-best-practices
2009: HTML & CSS Trends
o http://www.hoctudau.com/slides/html-css-trends

2010: HTML5 & CSS3 The Future of Web Technologies


o

http://www.hoctudau.com/slides/html5-css3

Вам также может понравиться