html5: not just for breakfast

NOT JUST FOR BREAKFAST ANYMORE.

Dave Bouwman, Head GeekMike Juniper, Javascript Ninja

I’ve seen the

FUTUREand it’s my

BROWSER

We

Bob Muglia, VP, Microsoft

native webv

s.

Bret Taylor, CTO, FaceBook

WTF?

4things

1) SEMANTIC MARKUP

<div id=“header”>

<div id=“nav”>

<div class=“article”>

<div class=“section”>

<div id=“sidebar”>

<div id=“footer”>

<header>

<nav>

<article>

<section>

<aside>

<footer>

http://www.flickr.com/photos/benhusmann/5126029229

2) CSS3

Where is MAI Kitteh!

DEMO

3) Javascript (duh!)

4) Browser Extensions

GeolocationLocal storageWebGL, Canvas*, WebWorkers, SVG*, Drag & Drop

http://www.flickr.com/photos/hendry/3642114424

Geolocation

key : valueLocal Storage

Canvas & SVG

WebGL

Rainbows and Unicorns

Die. Die. Die.

IE8 Firefox 3.6 Chrome Safari0

5

10

15

20

25

30

Javascript Benchmark Time (s)

teh suk.

Device Differences

!=Touch vs. Point

Client Specific Views

http://www.flickr.com/photos/gray_macbook/5371234004

ViewControllerRequest ViewEngineView View

Normal Request/Response

PhoneView

ControllerRequest CustomViewEngineView

UserAgent?

TabletView

DesktopView

Custom ViewEngine

I think in code…

Esri ChangeMatters

MobileView

ControllerRequest CustomViewEngineView

UserAgent?

iPadView

DesktopView

Views

Sorry! HTML + Javascript Flex

CODE SCREEN CAP

Demo time!

WxMappr.com

MobileView

ControllerRequest CustomViewEngineView

UserAgent?

iPadView

DesktopView

Views

HTML + Javascript

jQueryMobile

HTML + JavascriptOrientation Aware

HTML + Javascript

@media (orientation:landscape)

Demo time!

maps.SafeRoutesInfo.org

Small ScreenView

ControllerRequest CustomViewEngineView

UserAgent +WURFL

Large ScreenView

Views

HTML + Javascript

HTML + Javascript

Browser Capabilities added in CustomViews

Demo time!

Aw man… I hate server side code

Modernizr + Jquery + partials

I’ve seen the

FUTUREand it’s my

BROWSER

Resources & QuestionsWxMappr.com

http://github.com/dtsagileMaps.saferoutesinfo.org