The web as it should be
Upcoming SlideShare
Loading in...5
×
 

The web as it should be

on

  • 1,399 views

With the advent of CSS3 and the ever-greater maturity of HTML5, it’s an exciting time for the Web. The possibilities for creating truly engaging – even addictive – Web and business applications ...

With the advent of CSS3 and the ever-greater maturity of HTML5, it’s an exciting time for the Web. The possibilities for creating truly engaging – even addictive – Web and business applications appear limitless. And, with the release of Internet Explorer 9, Microsoft finally came in from the cold after many years in the world wide wilderness.

As Internet Explorer moves towards full support of standards-based HTML5 and CSS3, this is a great opportunity to hear from Martin Beeby about how these key technologies will be used to build and deliver the applications of tomorrow, engage end-users like never before, and generate even greater loyalty to Web-sites.

Statistics

Views

Total Views
1,399
Views on SlideShare
1,387
Embed Views
12

Actions

Likes
1
Downloads
19
Comments
0

3 Embeds 12

http://paper.li 9
http://a0.twimg.com 2
https://twitter.com 1

Accessibility

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    The web as it should be The web as it should be Presentation Transcript

    • the webas it should beMartin Beeby - @thebeebs
    • paving theway to theend userHotbed of innovationWorld of standardsEver-closer user experiences
    • in the beginning…mosaic netscape navigator internet explorer v11993 August 1995
    • 2001 a space odysseyInternet Explorer 6 - Microsoft won the Web (or so they thought)
    • http://www.youtube.com/watch?v=Gp-FQN_v3AM
    • we allmakemistakes
    • the riseof thecompetitionAmazing browserscame on-lineMicrosoft had a longjourney to catch up
    • the journey so farMarch 2011Internet Explorer 9 Great browser Constant development momentum Eight-week beta-launch cycles Faster launch cadence
    • innovate or die
    • standards-basedbrowsingHTML5W3C:Sixteen full-time employeesMost test cases submittedaround 1,700But we still innovate
    • smallest chrome
    • bringing users closer
    • web sites asapplications Fully-fledged Applications HTML5 CSS3 Standards-based Web technologies IE10 is a distinct application delivery platform
    • just some of the newhtml5 features…Animation Frames CSS Positioned Floats (Exclusions) FormData Page VisibilityCSS3 2d Transforms CSS Selectors HTML5 Application Cache Pointer (Mouse, Pen and Touch)CSS 3d Transforms CSS Transitions HTML5 async EventsCSS3 Animations CSS Values and Units HTML5 Canvas Resource TimingCSS3 Backgrounds and Borders Data URI HTML5 Drag and drop Selectors API Level 2CSS Color DOM Element Traversal HTML5 Forms and Validation SVG Filter EffectsCSS FlexBox DOM HTML HTML5 Geolocation SVG InlineCSS Fonts DOM Level 3 Core HTMl5 History API Timing CallbacksCSS Grid Alignment Dom Level 3 Events HTML5 Parser Web MessagingCSS Hyphenation DOM Style HTML5 Sandbox Web SocketsCSS Image Values (gradients) DOM Traversal and Range HTML5 Selectors Web WorkersCSS Media Queries DOMParser and XMLSerializer HTML5 semantic elements XHTML5/XMLCSS multi-column layout ECMAScript 5 HTML5 Video and Audio XMLHttpRequest (Level 2)CSS Namespaces File Reader API ICC Colour ProfilesCSS OM Views File Saving IndexedDB
    • cookbookdemo
    • off-line access
    • benefits applications work correctly at all times User-generated data can be stored off-line Improved overall performance by spreading the load between the cloud and client
    • appcachecreation flow caches resources locally First run fetches Later runs fetch info from network info from cache
    • appcachehow it worksBehind the scenes after Web content displayedManifest file specifies resource URIs to cacheCache only created if all resources are downloadedEasy-update of manifest file to update target cache contentApplications can access cached resources using URLs and URIs
    • appcache vs Guaranteed availability of http cached resources Correct off-line resolution of URLscaching http caching can optimise appcache behaviour
    • indexed db
    • indexed dbvs relational dbConcept Relational DB IndexedDBDatabase Database DatabaseTables Tables contain columns and rows objectStore contains Javascript objects and keysQuery Mechanism, Join, and Filters SQL Cursor APIs, Key Range APIs, and Application CodeTransaction Types and Locks Lock can happen on databases, tables, Lock can happen on database on VERSION_CHANGE or rows on READ_WRITE Transactions transaction, on an objectStores on READ_ONLY and READ_WRITE transactions. There is no object level locking.Transaction Commits Transaction creation is explicit. Default is to Transaction creation is explicit. Default is to commit unless I call rollback unless I call commit. abort or there is an exception that is not caught.Property Lookups SQL Indexes are required to query object properties directlyRecords/Data Normal form and single valued properties De-normal form and can have multi-valued properties
    • indexed dbhow it worksvar oRequestDB = window.indexedDB.open("Library");oRequestDB.onsuccess = function (event) { db1 = oRequestDB.result; if (db1.version == 1) { txn = db1.transaction(["Books"], IDBTransaction.READ_ONLY); var objStoreReq = txn.objectStore( "Books"); var request = objStoreReq.get("Book0"); request.onsuccess = processGet; }};
    • indexed dbbenefitsOptimised way of querying data objectsWebsite access to large amounts of related dataData filtering using KeyRange objects“Master” cloud and local IndexedDB database architectureFaster searchesOff-line data access
    • websocketsand xhr
    • benefits Better off-line application performance Improved user stickiness to the application greater opportunity for your business
    • webapplicationuserexperience
    • thebeautyof html5
    • achieving browserinvisibility
    • real worldwww.beautyoftheweb.co.uk Showcase of sites using HTML5
    • test drivehttp://ie.microsoft.com/testdrive/ download Internet Explorer 10 preview Example applications http://dev.windows.com
    • the webas it should beW3C standards-based: HTML5, CSS3, Web-browsersApplication delivery platformCompelling end-user experiencesDriven by innovation
    • contactmartin beeby@thebeebshttp://www.ubelly.com/html5martin.beeby@microsoft.com