The term "HTML5" might seem to relate most directly to HTML- a site's layout and user interface. But the most dramatic implications of HTML5 relate to web application architecture.

The HTML5 Web App

An HTML5 web app employs some or all of the following emerging technology standards:

• HTML5 tags- new browsers support more advanced layout and user interface controls
• Style Sheets- CSS3 allows powerful control and easier programatic access to layout, element positioning, and design styles
• Ajax- Asynchronous JavaScript enables real-time dynamic access to server resources from a static web page
• Local Storage- A simple key value pair data store in the browser makes it possible to maintain user state on the client instead of the server

Before HTML5

The PHP, ASP, .NET "dynamic web pages" architecture might seem limiting compared to today's highly interactive and responsive web apps. However, there are some major benefits for the programmer:

• Design follows a natural story board. Somewhat static pages take in user input to be processed when the user is ready.
• Story board design approach naturally organizes code. Each "page" (file) becomes analogous to a function.
• User state is managed on the server, which is fundamentally more secure and controllable than the client browser

An HTML5 architecture

I took an HTML5 approach for the Pampered Poultry e-commerce site. The web site runs as a client app, maintaining user state via cookies and/or local storage depending on browser support. All dynamic content (products and news) is loaded via Ajax calls to the Node server. The Node server serves the static files (such as HTML, JavaScript, CSS, and images), implements the Ajax handlers, and interfaces with MySQL for data storage.

Now, let's look at managing state in the browser using cookies and local storage.

For a full introduction and index to this blog: Node.js: One New Approach

Cheers!