Daniel Paterson

Cross-Document Communication

There are many cases where integrating external content into a web page can really make a difference to its richness. It is no secret that the Web isn’t as static as it initially was, and including pieces from other pages, importing raw data, RSS feeds, or so-called widgets has become a norm as found on Netvibes or iGoogle (shown in Figure 11-1), where content and tools from several sources are appropriately brought together in a single page to supply users with a kind of synthesis of their interests.

Bitmap and Vector Graphics and Downloadable Fonts with Canvas and SVG

The one element of Mobile Safari that has drawn the most attention is that it has no support for Adobe Flash. The Web has become a place where multimedia and animation hold an important role, and while being unable to create Flash-based web sites and casual gaming might not be a problem for most people, the main problem is that Flash is used in some manner on most sites nowadays, be it for graphic animation in headers, advertisements, or videos. Not supporting Flash can be a real issue for the iPhone and iPad user experience when viewing classic web sites.

Using Touch and Gesture Events

The iPhone, iPad, and iPod touch, like many portable devices nowadays, uses the finger as the only pointing device. Apple’s devices even support several simultaneous contact points, which, along with a simple, intuitive graphical interface, makes their use fluid, efficient, and overall pleasing for the user. As we have explained in earlier chapters, this entails a close, almost intimate connection between the user and the device. This particular relationship favors realistic designs; for instance, building a poker game application, you can allow your user to virtually “throw” cards on a table with a simple flick of the finger, adding to the real-life impression.

User Experience and Interface Guidelines

The heart of the previous chapter is not the information about screen dimensions, technical possibilities, or even understanding of how iOS behaves on the iPhone, iPod touch, and iPad. Of course, you have to master these aspects to build quality web applications for these devices, but the techniques for doing so are simply tools to succeed in the process. The advice in this book all comes down to the user. The touchinteraction system of Apple’s portable devices establishes a specific relationship between the device and the user that is definitely user-centric. This means that you, the developer, need to seriously consider the design of your applications.

Location-Aware Web Applications

The App Store offers a myriad of applications that bring users services based on where they are at some particular moment, such as Where by uLocate, a multilocation-based services aggregator, or Foursquare, which offers a new way to discover your city.

Introducing Developer and Debugging Tools

It isn’t obvious that developing for the Web would require specific debugging tools or that such tools would even exist. Not so long ago, front-end development was seriously lacking good tools to analyze and debug page components. But the Web has evolved tremendously: front-end debugging tools have flourished, and most major browsers nowadays come with built-in debugging tools or easily added extensions.

An Object-Oriented JavaScript Programming Primer

It is more than likely that, as shown in the previous chapters, you will heavily rely on JavaScript to build your web applications. Over time, client-side scripting has become an ever more crucial tool for developers, with the progress of hardware, the evolution of expectations, and, recently, new APIs that bring the most desirable functionality to web content.

The Anatomy of a Web Application

It has been some time now that mobile phones can browse the Internet. Back when Internet access on mobiles devices started, it was nothing like what we know now. Networks had drastically limited speeds and were extremely expensive, screen sizes were small, and devices usually only did black and white. You could read only a few short lines at a time, with a thumbnail-size image if you were lucky. Back then, a web page couldn’t go beyond a bunch of kilobytes, partly because of device memories, and users had the chore of navigating mostly with the 0-9 phone keys. Obviously, even if this was some kind of technical revolution, browsing the Internet on their phones wasn’t very attractive to end users.

Interesting CSS Features for Your Web Application User Interface

HTML5 takes document semantics even further than previous versions of the language. However, if you’ve been a front-end developer for some time, you must be conscious that an appealing design often implies hard dilemmas and superfluous markup. In this chapter, we’ll go through a number of CSS features that are going to make your web application developing process much faster, richer, and cleaner. Some make longawaited enhancements hassle free and easy to maintain, and others are more complex but are going to open a whole new range of layout and design opportunities for your web application on Mobile Safari.

A Better Handling of Client-Side Data Storage

For years, when data needed to be stored on the client to enhance a page or actually allow it to work properly, developers could rely only on cookies. Although this has worked well for various applications, cookies have limitations that make them somewhat unfit for developing complex functionality. Size limits are not a problem when storing an identifier or some information from a session—such as shopping cart data—but they easily become impossible to handle when dealing with more complex tasks, such as calendar synchronization.