html5 소개 및 배우기- html5 open conference
TRANSCRIPT
요즘 Adobe랑사이가
안 좋다며?
HTML5때문에
그거먹는거야?
나도몰라ㅋㅋㅋ
Web Hypertext Application Technology Working Group
HTML 4.01 Strict<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Strict<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html>
DOCTYPE
div id=“header”div id=“header”div id=“nav”div id=“nav”
div id=“content”div id=“content”
div id=“menu”div id=“menu”
div id=“footer”div id=div id=““footerfooter””
구조적 마크업
<header><header><nav><nav>
<aside><aside>
<article><article>
<footer><footer>
Video
Canvas
WebGL
Web Workers
Plug-in
DBDB
<html><title> <?=$title?> </title><body><font size=2>Hello! World</font><?=mysql_query(“SELECT name…)?></body></html>
CGI
Internet
웹서비스 시대 (1990년대 중반)
Plug-in
DBDBModel
Internet
View
Controller
<! DOCTYPE XHTML…><title>$title</title><body><h1>Hello, Wolrd</h1></body></html>
body { font-size: 9pt;}h1 {color:blue;}
Function popup(url) {window.open(url);
}
Structure
Presentation
Behavior
XHTML
CSS Layout
DOM Script
MS .NET
Spring
Struts
웹 표준 시대 (2000년대 중반)
Plug-in
DBDBModelInternet
View
Controller
{"Name": "Cheeso", "Rank": 7}
Structure
Presentation
Behavior
Ajax OpenAPI
RubyOnRails
jQuery
웹2.0의 시대 (2000년대 후반)
Plug-in
InternetNoSQL
CloudComputing
{"Name": "Cheeso", "Rank": 7}
Structure
Presentation
Behavior
Ajax RESTful
LocalStorage
LocalStorage
Web Storage
Web Socket
SelectorAPI
Canvas
Geolocation
Drag&Drop
diskdisk
Casandra
Hbase
Amazon AWS
MS Azure
HTML5의 시대 (2010년대 초반)
CSS3
HTML5
AppCacheWebGL
HTML5인 것과 아닌 것
HTML5 W/G– HTML5 – Canvas 2D– Microdata– RDFa– AppCache
Web Apps W/G– Server-Sent Events– WebSocket– Web Storage– Web SQL Database– IndexedDB– Geolocation
kr.html5doctor.com
html5gallery.com
html5test.com
Modernizr
html5demos.com
html5rocks.com
hacks.mozilla.or.kr
webstandards.or.kr/html5
Books
Community
√√ √√ √√ √√
√√ √√ √√ √√
√√ √√ √√ √√
√√ √√ √√ √√
√√ √√ √√ √√
Canvas
Video
(Geolocation)
App Cache
Database
Workers √√ √√ √√ √√
iPhone
mobile
mobile
mobile
Speaking from personal experience, I've had a lot more fun writing an HTML5 application based on CSS3, the database API, and jQuery that runs out of the box on all of the hot mobile platforms than I ever would have had writing some silly Objective C app for a locked down App Store (or Java for an open one).
HTML 5 + CSS 3 + HTML 5 + CSS 3 + Apps Cache + Database APIApps Cache + Database API
