HTML5 Guidelines for Web Developers

220 Chapter 8—Web Storage and Offline Web Applications

8.3 Browser Support

Support for Web Storage is present in all current browsers. Even Inter-

net Explorer offers this function in version 8 and later. If you need to sup-

port older versions of Internet Explorer, you can use an Open Source JavaS-

cript library for sessionStorage; it emulates the session storage using a trick.

For further information and the download, see http://code.google.com/p/

sessionstorage.

Unfortunately, Internet Explorer does not have any support for offline applica-

tions. Even in the upcoming version 9 these functions are not provided. Table

8.4 offers an overview of browser versions implementing Web Storage and offline

apps. To see the connection between browser version and date, look at the Time-

line at the end of the Introduction chapter, or go to the companion website at

http://html5.komplett.cc/code/chap_intro/timeline.html?lang=en.

Table 8.4 Web Storage and offline web applications support in different browsers

Firefox Opera Chrome Safari IE

Web Storage 3.0 10.50 3.0 4.0 8.0

Offline Apps 3.5 10.60 4.0 4.0

8.4 Example: Click to tick!

To finish the chapter, we will use an example to illustrate the two techniques in-

troduced here in combination. Click to tick! is a learning game that finds places

or other geographical features using an unlabeled map. On this map, the player

tries to mark a target as accurately as possible by clicking on the map with the

mouse. The more hits per round, the more points the player will score in the

final scoring.

To allow children to play the game on the iPad during a long car journey, the

required resources, such as images, JavaScript, and HTML files, are saved in the

cache for offline use (see section 8.2, Offline Web Applications). The list with top

scores is saved in localStorage (section 8.1, Storage) to ensure that this informa-

tion is not lost, even when the computer is switched off. Once the computer can

reconnect to the Internet, the new score can be uploaded to the server, a func-

tion discussed in section 8.4.4, Expansion Options. Via an interface, the browser

also checks if there are new game objectives and downloads these to the com-

puter if necessary.