Want to dive even deeper?

Take the course jQuery UI Development by Ben Fhala and become an expert!
jQuery UI Development
by Ben Fhala

Check it out!
You're watching a preview of this video, click the button on the left to puchase the full version from Devoxx'09.

The State of the Web

The State of the Web keynote

Published on
  • 2.827
  • 98
  • 0
  • 6
  • 2
  • State of the Web Ben Galbraith (@bgalbs) and Dion Almaer (@dalmaer)
  • With HTML5, you can make as rich an experience as an app
  • HTML5 is a beautiful thing. You get lost in the experience and forget that you are on the Web.
  • With HTML5, you can make as rich an experience as an app HTML5 is a beautiful thing. You get lost in the experience and forget that you are on the Web. HTML5 makes desktop operating system SDKs obsolete. You no longer need to develop a Windows app. ?
  • HTML5 makes desktop operating system SDKs obsolete. You no longer need to develop a Windows app.
  • Ironically, if Microsoft had focused on how to leverage the [web], rather than how to kill it, they might be in Google s position today. Serves them right. ‒ Jim Clark Founder, Netscape
  • OS X Cocoa Adobe Flex
  • Google Suggest and Google Maps are two examples of a new approach to web applications that we at Adaptive Path have been calling Ajax. The name is shorthand for Asynchronous JavaScript + XML, and it represents a fundamental shift in what s possible on the Web. ‒ Jesse James Garrett Co-founder, Adaptive Path
  • Before Ajax (2000-2005): After Ajax (2006):
  • IE7. IE8.
  • WHATWG
  • 10,000 Mobile Apps
  • 15,000 Mobile Apps
  • 325,000 Mobile Apps
  • Today's announcement is a call to serious writers, thinkers, scientists, business leaders, historians, politicians and publishers... To be considered for Kindle Singles, interested parties should contact [Amazon.com]. ‒ Amazon.com Website Kindle Singles Press Release
  • $3,000,000,000 Mobile App Economy BEN and DION s ESTIMATE BASED ON PUBLICLY RELEASED FIGURES
  • size of app economy what do I think of myself expected $ on my fart app $3,000,000,000 ninja = $1,000,000 h!!! e ric nna b m go I’
  • size of app economy approx. number of apps average earnings per app $3,000,000,000 / 350,000 = $8,571 $30,000 average cost to develop an app return on investment -$21,429 ren’t rs a ey! elope mon Dev ing mak
  • Apps are content. Content production is a hits business. That s just how it works.
  • Popularity Hits Everything else Products The Long Tail
  • Apps are content.
  • 20% of Apple s apps have a daily audience of more than 19 million people who spend over 22 minutes per day using them. Treated as a consumer audience, its size and reach rank somewhere between NBC s Sunday Night Football and ABC s Dancing with the Stars, and only 4 million viewers shy from beating the number one prime-time show on television, FOX s American Idol. ‒ Flurry Blog October 11, 2010
  • OmniFocus for iPad $39 To Do s List for iPad Free ($0.99 optional donation)
  • Starting today, customers... can purchase the Windows 7 Family Pack... online at the Microsoft Store... But act fast̶ Family Pack is only available while supplies last. ‒ Windows Experience Blog October 3, 2010
  • Web App Mobile App
  • We didn t buy Palm [just to] be in the smartphone business. ‒ Marc Hurd Former HP CEO
  • Don t try to take a fortified hill, especially if the army on top is bigger than your own. ‒ Bill Hewlett
  • One thing we'll make sure is that we don't leave a price umbrella for people. ‒ Tim Cook Apple COO
  • craigslist
  • J2ME This is exciting times for developers, and the emergence of a Java gaming industry ‒ JavaOne, 2000 Platform Distribution Merchandising Experience Platform Capabilities
  • The secret of mass marketing of software is having a very large and extremely uniform hardware/software base. ‒ Jef Raskin Author, The Human Interface Instigator of the Apple Macintosh project
  • State of the Web Platform Distribution Merchandising Experience Platform Capabilities
  • Over 1,500,000,000 Browsers
  • (PROPORTIONS BASED ON NET APPLICATIONS DATA AS OF NOVEMBER 2010) Over 1,500,000,000 Browsers
  • (CHART NOT ACTUALLY BASED ON REAL DATA) IE6 (90%) Google Chrome Frame HTML5 Browsers (10%)
  • H.264 Flash and Mobile Video
  • Po w er ed by W eb 2. 0! HTML5
  • What is HTML5? CSS3 WebGL / O3D Geolocation Web Workers Web Storage WebSocket Server-sent Events SVG MathML Fast JavaScript
  • The W3C / WHATWG HTML5 Specification > HTML 4.01
  • The Web needs an app platform standard.
  • State of the Web Platform Distribution Merchandising Experience Platform Capabilities
  • ! !
  • The Web needs app marketplaces. (Come back, Yahoo! All is forgiven...)
  • Chrome Web Store Mozilla Open Web App Store
  • The Web needs a launcher experience.
  • State of the Web Platform Distribution Merchandising Experience Platform Capabilities
  • Tab Awesome Are we Bar Candy fast yet? World’s Pin One Box FASTEST Tabs Browser* 3D World’s Simple Wall of FASTEST UI! Websites Browser* Unibox FASTEST Sites Browser* World’s Pin Firefox 4 Chrome 7.0.517.8dev Safari 4 IE9
  • Canvas CSS3
  • Four GPU-accelerated APIs: Canvas + SVG: 2D graphics CSS3: DOM acceleration WebGL: 3D graphics
  • width
  • The Web needs deeper APIs and richer app frameworks.
  • JavaScript?
  • The Web needs a permissions model.
  • State of the Web Platform Distribution Merchandising Experience Platform Capabilities
  • Palm HTC RIM Nokia Samsung LG Apple Motorola
  • Sproutcore
  • • • • • client-oriented architecture app cache / local storage gradients and text shadows CSS transitions, transforms, and animations
  • @media only screen and (max-width: 480px) { ... } <meta name="viewport" content="user-scalable=no, width=device-width"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <link rel="apple-touch-startup-image" href="appstartup.png">
  • #home { position: absolute; bottom: 0; left: 220px; width: 185px; height: 91px; -webkit-transform: translateY(92px); -webkit-transition-property: -webkit-transform; -webkit-transition-duration: 400ms; } #home.on { -webkit-transform: translateY(0px); } // turn classes on or off to control transforms $("#home").addClass("on"); document.body.addClassName("home-visible"); body.home-visible #home {}
  • /* set background gradient */ background-image: -webkit-gradient (linear, left top, left bottom, from(blue), to(white)); /* nice fonts! */ @font-face { font-family: "Delta"; src: url("Delta.svg"); } /* rounded corners web2.0 style! */ border-radius: 20px; -webkit-box-shadow: 0 0 1em 0.5em grey;
  • var win1 = Titanium.UI.createWindow({ url:'main_windows/base_ui.js', titleImage:'images/appcelerator_small.png' }); var tab1 = Titanium.UI.createTab({ icon:'images/tabs/KS_nav_views.png', title:'Base UI', window:win1 }); tabGroup.addEventListener('open',function() { // set background color back to white after tab group transition Titanium.UI.setBackgroundColor('#fff'); }); // tab group close event tabGroup.addEventListener('close', function(e) { messageLabel.text = 'tab group close event'; messageWin.open(); setTimeout(function() { messageWin.close({opacity:0,duration:500}); tabGroup.open(); },1000); });
  • Thank you. Dion Almaer @dalmaer Ben Galbraith @bgalbs

Comments

Be the first one to add a comment