What's New in Web Development

See session description: What's New in Web Development

not a Drupal-specific session

HTML 5

• new standard is long overdue, so need to standardize what people are already doing in nonstandard ways (Javascript, Flash, etc.)
  
• new structural elements: <section>, <nav>, <article>, <aside>, <footer>, <figure>, <header>, <dialog>
  • these all behave like spans but are used for structuring the content
  • allow nicer CSS with fewer classes
  • can use these tags already in most current browsers, except in IE.  Can define with javascript document.createElement('section');
• new input types for forms, only implemented in Opera so far
  
  • email and url inputs with validation
  • date and time pickers, range slider
  • validation depends on the browser, so that's already problematic
  • required attribute: form will not submit if field is not filled in
  • specs will not be finalized until implemented by two major browsers, to prevent unimplementable specs
• storing data on the client (without sending to server)
  
  • database storage API uses SQLite, separate from cache, cookies, etc.
    
  • local and session storage with key-value pairs (similar to $_SESSION in PHP, but on the client)
  • supported by Mozilla, WebKit (Safari, Chrome, Konqueror), Opera
  • allows the user to customize content of a page regardless of where it is stored, provided they access from the same client
  • security implications are unclear - SQL injection could happen on client side, e.g. from a virus
• <canvas> tag
  • allows an arbitrary 2D drawing with hotspots, etc.
  • already supported by Mozilla, WebKit, Opera
  • can be emulated with VML in IE
  • examples:
    
    • http://code.google.com/p/flot/
    • http://wiki.github.com/sorccu/cufon/about
    • http://ejohn.org/blog/processingjs/
• Canvas Fonts
  • uses <canvas> or VML to render fonts that are not installed on client
  • converts font files to drawings
• Drag and drop now possible without Javascript
• cross-document message exchange
• data grids - like a spreadsheet table - click headers to sort - not yet implemented
• undo manager - allows standard way for users to undo changes they make in Web apps
• Web sockets - standard way to push data to a page already loaded in client
• <video>, <audio> tags for playing media without embedding objects

New browser tools

• Google Gears
  • allows Web applications to work offline such as Gmail, Google Docs
    
  • allows worker pools for compute-intensive applications
  • databases (similar to but not compatible with HTML 5)
  • geolocation capabilities for GPS-enabled devices
• Google Native Client
  • allows any executable (for a given processor and OS) to be run as a plug-in in the browser
  • has major security implications!
• Silverlight
  • Microsoft's Flash clone, based on XAML and WPF
  • implements .NET languages on client

CSS 3

• split up specification into modules so it's not so huge
  
• some parts are already implemented (but not in IE!), so you can use them now -- they degrade gracefully
• border-radius for rounded corners
• user-modify: read-write allows editing on the client
• box-shadow
• background now has opacity
• border-image
• text-overflow: ellipsis
• column-width and column-gap for multi-column layouts
  
• font downloads (beware copyrights)
• WebKit allow tranforms and rotations

Client-side XSLT

• transform XML to multiple formats on the client
• implementation differs by browser
• example: WoW Armory