Cascading Style Sheets have been around since the end of 1996. Despite the relative longevity of the technology, its use in real-world web design has been limited to managing fonts and color, at least until recently. This limitation was imposed by the lack of consistent browser support. Because not all browsers managed CSS equally (if at all), it has been very difficult for designers to tap into the true power of style sheets. Instead, there’s been a reliance on HTML for presentation.

Now we have far better support for CSS, so to tap into its many valuable features, web designers are moving away from HTML as a means of adding style and laying out pages, and into pure CSS design. Why is this so important? The reasons are many:

Keeping presentation separate from the document means you can style that document for numerous media, including the screen, print, projection, and even handheld devices.

Separating presentation from the document means a lighter document, which, in turn, means the page loads and renders faster, making for happier visitors.

CSS offers ways to control one document or millions of documents. Any time you’d like to make a change, you change that style in one location and automatically update to all the documents with which that CSS is connected. In HTML, this couldn’t be done.

CSS documents are cached. This means they are loaded into your browser’s memory one time. As you move within a site, the browser never has to reinterpret the styles. The results are more fluid movement from page to page and faster-loading pages, which, of course, is always desirable.

By separating presentation from structure and content, accessibility is easily achieved. Documents that don’t have heavy tables and lots of presentational HTML are inherently more accessible than documents that do.

Clearly, CSS offers a lot. In this chapter, you’ll learn how to set up CSS to be most efficient and flexible for your designs.

These days, it’s a rare novelty to see someone using frames to create web pages. The reasons are numerous, including these fun facts:

Frames modify the browser interface, which results in no consistency in how operating systems and individual browsers display the results.

Frames are difficult for both blind and mobility-impaired users. Screen reader software has a hard time managing the altered interface. Mobility-impaired users also encounter difficulty moving from frame to frame.

In older browsers, frame pages were difficult to bookmark. Bookmarking is improved in most modern browsers, but the user still has to know where to dig up this feature within the browser interface.

Frames consume more server and client resources, for two reasons: First, frames-based designs rely on multiple documents just to build one page, so a server has to send each of these documents when each frame page is assembled. Second, browsers and the user’s operating system have to work harder to manage them.

Because multiple documents must be created for each single-frame page result, managing frames is an arduous, unhappy task when you’re trying to manage, update, and modify a frame-based site.

So if frames aren’t all that and a bag of chips, why on Earth would you want to learn them? I have two very specific reasons I want you to know about them:

Frames are a unique part of HTML. I want you to understand what you’re looking at if you see frames and to also have them in your toolbox if you ever need them.

Frames can occasionally be exactly the right choice for a specific approach. Let’s say you want to develop an application in which data loads into another location directly within the same interface. Frames can help you accomplish that kind of functionality; if you need it, you’ll know how.

Finally, although iframes are not the same thing as conventional frames, they are in use. You might well want to tap into their unique functionality at some point.

I never feel very good about leaving readers without all the information necessary to tap into the true power of forms. But doing so is nearly impossible because forms can be used so effectively in so many different ways and with a wide range of technologies, as you’ve seen.

In fact, in the world of professional web development, entire sub-specialties exist in which individual developers spend the majority of their work developing the applications and databases that form-based, dynamic web pages require. You’ll see the results of such complex specialties at many familiar websites. Anything with e-commerce, such as Amazon.com, requires this kind of complex development to properly process orders, credit card information, and shipping directions.

Portal sites are also very good examples of complex use of forms. Yahoo!, Excite, and even America online all use forms extensively to manage membership, personalization features, and so forth.

Still another excellent example of complex forms and data management comes via online banking. I don’t know about you, but I’m sure at a loss these days without instant access to my accounts from anywhere in the world. It really helps a somewhat distracted person such as me stay on top of the practical side of life.

NOTE

Not using online banking yet? Check and see if your bank offers online banking options. My bank, Wells Fargo, which services the western United States, has an excellent website and is even working toward making the site completely standards compliant and accessible.

Okay, have you had enough of forms? Great! It’s time to move on to frames and learn their value in contemporary design. I’ll also point out their many flaws and tell you why most people have eliminated frames from site designs altogether.

Forms are an essential part of how the Web is made interactive and useful. Forms are interactive because a form demands that you, the user, interact with it to perform some task. That task might be any number of important ones:

Entering information into your online banking system so you can manage funds online

Submitting your name and information to become a member of an online dating service

Making a purchase for an airline ticket and travel services

Purchasing other goods and services online

Without forms, we’d have had none of these features available and, in fact, the Web itself would never have moved along to become as efficient as it is in terms of providing interactive services. Today other technologies are being used with regularity to accomplish the same things HTML forms do.

Flash, for example, supports rich forms that are also very fast and update on the same page. This doesn’t mean that HTML forms are falling out of favor: Although Flash forms can be very useful for some users, they cannot be made as searchable and accessible in the way that HTML-based forms can. So even sites using Flash forms often also provide an HTML alternative. Other technologies are beginning to emerge to help make forms more feature rich, but these technologies are preliminary, so HTML forms remain the conventional method to bring interactivity and functionality to websites.

Forms are relatively easy to work withat least, from the HTML side of things. It’s the programming for the form that makes the form behave in certain ways and programming forms on the server side is beyond the scope of this book.

Here you’ll learn how to build HTML forms and make them logical and accessible. I’ll also provide resources along the way so you can become more aware of the options you have when it comes to server-side scripts to validate and process the forms that you build.