cover.eps

Building a Web Site For Dummies®, 4th Edition

Table of Contents

Introduction

About This Book

How to Use This Book

Foolish Assumptions

Conventions Used in This Book

How This Book Is Organized

Part I: Building Your First Web Site

Part II: Building Better Web Pages

Part III: Adding Frills and Fancy Stuff

Part IV: Making Money

Part V: The Part of Tens

Icons Used in This Book

Where to Go from Here

Part I: Building Your First Web Site

Chapter 1: Planning for Good Site Design

Drafting a Plan

What do you want to accomplish?

Who do you want to reach?

Keeping your site fresh

User-generated content

Designing the Look of Your Site

Appealing to your audience

Avoiding clutter

Achieving Usability

The Big Rules for Planning Your Site

Online Sources for Web Design

Chapter 2: Creating a Web Page with Basic HTML Tags

Tagging Along with HTML

Getting Wordy

Paragraphs

Headings

Fonts

Lines

Using Color

Creating Links

Picturing It: Using Images

Images

Background images

Putting It All Together

Online Sources for Web Page Building

Chapter 3: Arranging Your Text with Tables and Other Advanced Tags

Creating Tables

Defining rows and columns

Setting table dimensions

Defining cell sizes

Padding and spacing cells

Spanning rows and columns

Playing with alignments

Using Frames and Framesets

Building pages with frames and framesets

Adding borders and margins to frames

Online Sources for Tables and Frames

Chapter 4: Working with WYSIWYG

Creating the Basic Page in CoffeeCup

Setting the page properties

Working with text and links

Adding images

Switching views

Working with Website Projects

Online Sources for WYSIWYG

Chapter 5: Letting the World In: Choosing a Host and Domain Name

Going Live: Choosing a Host

ISPs

Virtual servers

Dedicated servers

Finding your match

Keeping It Cheap: Free Web-Site Providers

Getting Your Own Domain Name

Picking a name

Finding a registrar

Online Sources for Web Hosting and Domain Registration

Part II: Building Better Web Pages

Chapter 6: Using Cascading Style Sheets

Merging CSS and HTML

Selectors, Classes, and IDs

Using classes

Using IDs

Redefining Elements

Contextual Selectors

Going Beyond the Basics

CSS colors

Borders

CSS and WYSIWYG

Layers

Absolute positioning

Relative positioning

Online Sources for CSS

Chapter 7: Adding Images

Getting Graphics — for Free!

Heeding copyrights and credits

Creating your own images

Differentiating among graphics file formats

Putting Your Graphics on a Diet with GIFWorks

Creating a Logo with CoolText.com

Editing Images

Resizing

Cropping

Rotating and flipping

Adjusting color

Using special effects filters

Basic Design with Images

Placing images for maximum effectiveness

Sizing images in HTML

Online Sources for Quality Graphics

Chapter 8: Adding Forms

Getting Input

Typing in text boxes

Using text areas

Choosing radio buttons or check boxes

Setting up SELECT and OPTION

Submitting the form

Processing the Form

Why your ISP often won’t help

Finding a CGI provider

Using remotely hosted CGI scripts

Adding CGI Scripts

Basic techniques

Solving problems

Trying Out Form and Poll Makers

Response-O-Matic

FormSite.com

Online Sources for CGI and Forms

Part III: Adding Frills and Fancy Stuff

Chapter 9: Exploring JavaScript and DHTML

Principles of Programming

Constants and variables

Doing the math

Branches

Loops

Creating JavaScript Functions

Incorporating JavaScripts

Basic techniques

Dealing with problems

The Document Object Model (DOM)

Making Choices with JavaScript Events

Mouseovers and clicks

Keyboard input

Adding Interactive Menus

Making drop-down lists

Making a menu with CoffeeCup

Online Sources for JavaScript and DHTML

Chapter 10: Adding Image-Based Buttons and Image Maps

Creating Buttons

Creating Image Maps

Online Sources for Buttons and Image Maps

Chapter 11: Web Sights and Sounds

Getting Music and Video

Finding music houses

Finding public-domain music and video

Picking a File Format

Compressing Files

Adding Audio and Video Files to Your Site

Adding a Flash music player

Importing YouTube video

Online Sources for Web Audio and Video

Chapter 12: Adding a Blog

Adding Blogger to Your Site

Bloggin’ with WordPress

Adding a post in WordPress

Altering the General Settings

Online Sources for Blogs

Part IV: Making Money

Chapter 13: Attracting an Audience: Publicizing Your Site

Working Keywords into Your Pages

Adding meta tags

Incorporating keywords in the content

Avoiding keyword trickery

Analyzing keywords that other sites are using

Keyword advertising

Submitting to the Search Sites

Doing it yourself

Using submission services

Keeping out of the search sites

Checking Your Search Site Position

Investigating Reciprocal Linking

Finding sites to link to

Joining Web rings

Joining a banner exchange

Online Sources for Getting the Word Out about Your Site

Chapter 14: Designing for Internet Commerce

Learning the Real Secret to Internet Success

Developing the right attitude

Focusing on your business

Getting supplies flowing

Designing for E-Commerce

Adding a Search Function

Using Google Site Search

Getting a free search engine with FreeFind

Dropping in Perl CGI scripts such as Simple Search

Adding a FAQ

Online Sources for Internet Commerce

Chapter 15: Checking Out Online Payment Methods

Checking Out Online Payment Methods

PayPal

Google Checkout

Cash alternatives

Phones, faxes, and snail mail

Getting a Merchant Account

Choosing which acquirers to sign up with

Deciding which cards to take

Signing up

Watching out for fees

Protecting against credit card fraud

Building on a Business Platform

Converting Currencies

Adding the converter to your Web page

Customizing the converter

Online Sources for Merchant Services

Part V: The Part of Tens

Chapter 16: Ten Great Web Sites to Get Advice

Bizy Moms

Cozahost Newsletter

Geek/Talk Forums for Webmasters

grammarNOW!

LivePerson

LawGuru.com

webmaster-talk.com

The Small Business Advisor

Web Developer’s Journal

Website Tips

Chapter 17: Ten Fabulous Tools for E-Commerce

CafePress.com

DMA Privacy Policy Generator

ECommerce Guide

HumanClick

MapQuest

osCommerce

S&H greenpoints

SYSTRAN Translation Software

TRUSTe

WorldPay

Chapter 18: Ten More Great Add-Ins

@watch

Crossword Compiler

Everyone.net

GeoPhrase

VFM Leonardo

localendar

Merriam-Webster Online

SuperStats

Google Friend Connect

theFinancials.com

Glossary

Building a Web Site For Dummies®, 4th Edition

by David A. Crowder

WileyTitlePageLogo.eps

About the Author

David A. Crowder has authored or coauthored nearly 30 books on subjects ranging from computers to historical mysteries, including popular bestsellers such as Sherlock Holmes For Dummies, Building a Web Site For Dummies and CliffsNotes Getting on the Internet. He was selling hypertext systems back in the days when you had to explain to people what the word meant. He’s been involved in the online community since its inception and is the recipient of several awards for his work, including NetGuide Magazine’s Gold Site Award.

He is the son of a teacher and a college president, and his dedication to spreading knowledge, especially about the computer revolution, goes beyond his writing. He also founded three Internet mailing lists (discussion groups), JavaScript Talk, Java Talk, and Delphi Talk, all of which were sold to Ziff-Davis. One of his most treasured memories is the message he received from an old-timer on one of those lists who said that he had never seen such a free and open exchange of information since the days when computers were built by hobbyists in home workshops.

When he isn’t writing, he spends his time with his wife Angela, wandering through villages in the Andes or frolicking in the Caribbean surf.

Dedication

For Angela. Eres mi sol, nena, eres mi luna.

Author’s Acknowledgments

Thanks are due to Steven Hayes, Christopher Morris, Barry Childs-Helton, and James Russell, my fine editors, who were there for me every step of the way. Sometimes the relationship between writers and editors is smooth as silk, and sometimes it’s tempestuous, but it always results in a better book through the give-and-take of the writing/editing process — and I’m grateful for the critiques and contributions of all the members of the Wiley team. All helped to make this the best book we could put together for you. And they’re just the tip of the iceberg: About a zillion people work their tails off anonymously and behind the scenes at Wiley to bring you the finest books they can possibly produce. My hat is off to all of them, from the top editors to the humblest laborer on the loading dock. Last, but by no means least, I’d like to say how much I appreciate all the hard work done by my literary agent, Robert G. Diforio, without whose help I would be lost in the intricacies of the publishing world.

Publisher’s Acknowledgments

We’re proud of this book; please send us your comments through our online registration form located at www.dummies.com/register/.

Some of the people who helped bring this book to market include the following:

Acquisitions, Editorial, and Media Development

Senior Project Editor: Christopher Morris (Previous Edition: Jean Rogers)

Executive Editor: Steven Hayes

Senior Copy Editor: Barry Childs-Helton

Technical Editor: James Russell

Editorial Manager: Kevin Kirschner

Media Development Project Manager: Laura Moss-Hollister

Media Development Assistant Project Manager: Jenny Swisher

Media Development Associate Producers: Angela Denny, Josh Frank, Marilyn Hummel, Shawn Patrick

Editorial Assistant: Amanda Graham

Sr. Editorial Assistant: Cherie Case

Cartoons: Rich Tennant (www.the5thwave.com)

Composition Services

Project Coordinator: Katherine Crocker

Layout and Graphics: Claudia Bell, Ashley Chamberlain, Christin Swinford

Proofreaders: Laura Bowman, Lindsay Littrell

Indexer: Steve Rath

Publishing and Editorial for Technology Dummies

Richard Swadley, Vice President and Executive Group Publisher

Andy Cummings, Vice President and Publisher

Mary Bednarek, Executive Acquisitions Director

Mary C. Corder, Editorial Director

Publishing for Consumer Dummies

Diane Graves Steele, Vice President and Publisher

Composition Services

Debbie Stailey, Director of Composition Services

Introduction

Maybe you already have your own Web site and you’re not quite satisfied with it. Or perhaps you’re still in the planning stages and want to know what you can do to make your site as good as it can be. You’ve been to Web sites that have all the bells and whistles, and you wouldn’t be human if you weren’t just a wee bit envious. Well, now you can have it all too. In Building a Web Site For Dummies, 4th Edition, I show you some of the best stuff around, and I tell you just how to go about putting it on your site.

About This Book

This isn’t just another Web design book. It’s special. Really. I set out to write the one book I’d want by my side if I were looking to set up a really fancy Web site and not break the bank doing it. I tracked down and tested zillions of Web-site enhancements and selected the top of the line to share with you. And I’m honestly proud of the results. I’ve authored or coauthored more than 20 books on computers and the Internet, and this one is my hands-down favorite.

It’s full of things you’re sure to love. It’s packed with fun stuff, but it’s got plenty of serious stuff, too, like how to get past the hype and really make money through your Web site. You’ll wonder how in the world you ever got along without having these features on your Web site.

How to Use This Book

Keep this book next to your computer and never lend it to anybody. It’s far too precious for that. Make your friends buy their own copies. If you need to make space on your bookshelf, throw away anything else you own to make room for it. When you travel, take it with you. Hold it in your arms at night and tell it how much you love it.

Each chapter is a stand-alone entity. (Don’t you just love that word?) You don’t have to read the whole thing, and it’s a rare person who will read the book from cover to cover right off the bat. Go ahead — hit the table of contents or the index and jump to the parts you’re most interested in. But don’t forget to explore the rest of the book after you’re done with the parts that excite you most. You won’t regret spending the time — you’ll find wonders in every chapter.

Foolish Assumptions

I assume that you have a favorite Web-page creation program — whether it’s Dreamweaver, plain old Notepad, or the UNIX-based text editor vi — and you know how to use it. So when I say to copy and paste text or save your file, you know what you need to do. Just in case you don’t have a good Web-authoring program, I include sources for some good HTML editors in this book.

Conventions Used in This Book

It’s all organized; I promise. Even though it’s rather plebeian compared with finding free content for your site, lots of people worked very hard to make sure that this book follows some straightforward rules and typographical conventions.

Code listings, of which there are plenty, look like this:

<HTML>

<HEAD>

<SCRIPT>

...

</SCRIPT>

<TITLE>

...

</TITLE>

</HEAD>

...

HTML elements in this book are in uppercase, and their attributes are in lowercase, as in this example:

<INPUT type=”hidden” name=”answer” value=”yes”>

If the value of an attribute is in normal type, you enter it exactly as shown. If it’s in italics, it’s only a placeholder value, and you need to replace it with a real value. In the following example, you replace myownimage with the name of the image file you intend to use:

<IMG src=”myownimage”>

Whenever you see the URL for one of the top sites I’ve tracked down, it appears in a special typeface within the paragraph, like this: www.dummies.com. Or it may appear on a separate line, like this:

www.dummies.com

How This Book Is Organized

This book is divided into six parts. I organized it that way, with a little help from the folks you see in the Acknowledgments. You did read the Acknowledgments, didn’t you? Don’t tell me that you’re the kind of person who reads the Introduction but doesn’t read the Acknowledgments. Please tell me that you didn’t miss the Dedication, too?

Each part has chapters in it. And each chapter has headings and subheadings. All the sections under these headings and subheadings have text that enlightens the heart and soul. Here, take a look.

Part I: Building Your First Web Site

Part I spills the secrets of how to plan a successful site from the ground up. It tosses in a quick refresher course in basic HTML, then goes into more depth with some of the more advanced approaches such as tables and frames. Toss in a look at WYSIWYG site creation and some advice on getting your material on the Net, and you’re ready to transform a bunch of Web pages into a coherent Web site.

Part II: Building Better Web Pages

Part II introduces you to Cascading Style Sheets, and different ways to add images and forms to your site.

Part III: Adding Frills and Fancy Stuff

Part III gives you a ton of ways to make your site work, look, and sound great. This part demystifies JavaScript and DHTML (Dynamic HTML), then it covers the different ways that you add new features like blogs to your Web site and shows you where to get great multimedia.

Part IV: Making Money

Part IV takes a look at making money from your site. It explodes the myths about Internet income and shows you how to really make a profit, how to get a credit card merchant account, and how to work both ends of the affiliates game.

Part V: The Part of Tens

Part V is The Part of Tens. Well, it just wouldn’t be a For Dummies book without The Part of Tens at the end, right? This part comprises three chapters, so you’ve got 30 extra bits here that tell you all sorts of wonderful things, like where to go for Web-site design advice and ways to add value to your site.

Finally, at the end of the book is a glossary of all the tech terms that might otherwise leave you baffled.

Icons Used in This Book

The icons in the margins of this book point out items of special interest. Keep an eye out for them — they’re important.

tip.eps Psst! Listen, pal, I wouldn’t tell just anybody about this, but here’s a way to make things a bit easier or get a little bit more out of it.

warning_bomb.eps Time to tiptoe on eggshells. Make one false step, and things can get pretty messy.

technicalstuff.eps You don’t really need to know this stuff, but I just like to show off sometimes. Humor me.

remember.eps Well, of course, it’s all memorable material. But these bits are ones you’ll especially want to keep in mind.

Where to Go from Here

Well, keep turning pages, of course. And use the material to make your own Web site the hottest thing there ever was.

One of the hardest parts about getting this book together was categorizing the material in it. Many times, a Web site add-in could’ve been slotted into a different chapter than the one it ended up in because it had multiple features or attributes. So when you’re visiting any of the sites that I mention in this book, be sure to take a good look around. A site that has a great chat room might also have a fine affiliates program. One that offers a good series of Java applets could have some solid tutorials on Web design. A site that has good information on dedicated servers may have the best e-commerce solution for you. I encourage you to browse up a storm.

Additionally, you can go to this book’s companion Web site, at www.dummies.com/go/buildingawebsite4efd, where you can find links to many of the sites discussed in the book.

Part I

Building Your First Web Site

560938-pp0101.eps

In this part . . .

I start off by covering all the things you need to know to put together a Web site. Chapter 1 shows you the differences between a random bunch of Web pages and a coherent Web site, while Chapter 2 is a quick refresher course in basic HTML. Chapter 3 goes into some more advanced areas like tables. Chapter 4 shows you how to use a WYSIWYG editor to visually design your pages. Finally, Chapter 5 gives you everything you need to know about different Web-hosting options.

Chapter 1

Planning for Good Site Design

In This Chapter

Determining your site’s purpose

Analyzing the audience

Appealing to visitors

Keeping your site lean

People argue about what the number-one factor in quality Web site design is, and they probably always will. Some say great graphics are the key. Others say worthwhile information is everything. Still others think that ease of use is the most important factor. I’m not so sure that there’s such a thing as a linear ranking for these kinds of things. After all, a good-looking site that doesn’t work well is useless. A site with a combination of good content and lousy graphics is nothing to crow about either. This book shows you how to do it all and how it all fits together to make a Web site that’s actually worth visiting. If you want to get the basics of Web page structure down pat, check out Chapters 2 and 3 on HTML; for the lowdown on graphic design, make sure you spend some time with Chapter 7.

In this chapter, I walk you through the fundamental things you should consider as you create your Web site. And at the end of the chapter, I give you four basic rules for creating Web sites that work. Take ’em with a grain of salt — remember, you’re the ultimate judge.

Drafting a Plan

Are you publicizing a political candidate? Trumpeting your favorite cause? Looking for a job? Selling shoe polish? Notice the verbs in each example. They’re the key factors in determining your site’s purpose, as opposed to its topic.

What do you want to accomplish?

Just having a topic isn’t enough — you need a purpose, too. The topic is merely what the site is about; the purpose is what the site does. Say, for example, that you want to create a site about penguins. Okay, that’s a nice starting point. You like penguins — they’re cute, unusual, and pretty interesting; many people share your interest in them. But why do you want to create a Web site about them? Do you have something to say? Do you have information to give, an opinion to share, or a particular point of view that you want to put across?

You don’t need to have a PhD in aquatic ornithology to create such a site. Maybe you just like funny-looking birds that swim. But you still need a purpose, or the site just won’t work out in the long run. Perhaps you spent ages plowing through the search engines, and you’ve gathered together the world’s greatest collection of penguin links. But why did you go to all that trouble? What’s your purpose?

If the purpose for creating a penguin site is for your own personal enjoyment, you really don’t need to do much with the site. In fact, you can just create a Web page on your own hard drive or even settle for leaving the links in your Web browser’s bookmarks. If you do want your page on the World Wide Web, however, you need to take into account the needs of your potential visitors, as well as your own needs for creating such a site.

Suppose you’re putting your penguin page on the Web for the purpose of sharing everything you know about these birds with the world. How does that purpose change your approach to site design? You need to include more on the Web site than a bare list of links, for one thing. Everything you do with the site must help people understand its purpose. If you’re setting up your own domain name, for example, you want to pick one that clearly describes your site’s content — such as www.penguinfacts.com. (Grab it quick — it still wasn’t taken at press time.)

The purpose of your site trickles down through each step you take in creating it. You want the title of each page in the site to specify how it supports the site’s purpose. The textual content of each page needs to lead naturally into some specific aspect of the topic that furthers your goal. Each graphical image must be just the right one to drive home or emphasize a critical point.

Who do you want to reach?

Who are the people you expect to visit your site? What geographical or cultural groups do you want the site to appeal to? Without at least a general idea of your potential audience, you can’t have much of an idea about what type of site to create.

If data is available about the audience for similar sites, you want to track it down. But where do you find it? Surprisingly, most of it’s available from the people you’re competing with. (Even if you’re not running a commercial site, similar sites are your competitors.) Anyone who’s been involved in any type of corporate intelligence work would be shocked at the way people on the World Wide Web casually throw around valuable information, instead of keeping it under lock and key.

Many sites offer links to their visitor data. Even a quick perusal of the server logs (which automatically record information about visitors) can provide you with priceless insights into the sort of people who visit sites similar to the one you’re creating. If the sites you want information on don’t list links to their log data, send an e-mail message to the Webmaster asking how to access it. Most Webmasters aren’t the slightest bit security-conscious about their customer data, and you may be surprised at how many of them are more than willing to spill the beans about their visitors.

Keeping your site fresh

If your material never changes, the odds are pretty good that most people won’t come back to it very often, if ever. Unless your sole topic is a rock-solid reference subject, you can’t get away with anything less than constant updating. Sure, the Oxford English Dictionary can come out with a new edition only every few generations. (The first edition came out in 1928 and the second one in 1989, with only two supplements in between.) But such cases are very rare. Even if you deal with a modern high-tech equivalent, such as a site on the Java programming language or the current HTML standard, you need to stay on your toes.

tip.eps If your core material is something that doesn’t change often, you need to add some peripheral material that you can replace more frequently. Consider adding a Tip of the Day, fresh links, a Did You Know? column, or something along those lines so you can avoid offering only stale content to your return visitors.

How often you need to update your site depends partially on your topic and partially on your site policy. With sites that deal with volatile topics such as breaking international news, you need to update on an hourly basis at a minimum. On the other hand, sites that analyze the news can stand a more leisurely pace — daily, weekly, or even monthly — because their scope is considerably wider.

Even if your topic doesn’t absolutely demand a certain update schedule, you should still establish a regular policy for how often you add fresh material to your site. Whatever schedule you establish, make sure you stick with it. Remember the comfort factor and bear in mind that your site’s visitors will be less comfortable if they don’t know what to expect from you. Consistency on your side helps build trust on theirs.

remember.eps A Web site must change at least once a month to keep visitors interested in coming back to it.

User-generated content

When the World Wide Web first got started, it was pretty much a one-way street — Webmasters like you always made the decisions about what would appear and how it could be used. As the Web has evolved, however, it has taken on some important new characteristics.

Today, some of the Web’s most popular sites aren’t so much controlled by their Webmasters as they are by their users. Places like YouTube and MySpace are hotbeds for the users’ self-expression — and, indeed, that is their reason for existence. The new trend that has led to the phrase “Web 2.0” is user-generated content, supplemented by social networking.

Of course, the majority of Web sites are still generated almost totally by either individuals or small teams working together, but the public’s hunger for its own chance to shine is seemingly insatiable — and it’s something you might want to keep in mind as you design your own Web site. Wikipedia and the other wikis are collaborative efforts, and the old personal home page has largely given way to blogs — Web logs, or personalized diaries that can be syndicated and sent to others automatically. (See Chapter 12 for more information on blogs.)

Designing the Look of Your Site

All great art depends on having every necessary component in place and nothing — not one thing — that you don’t need there. Great literature doesn’t add extraneous characters or pad its plot lines. Great paintings don’t have extra brush strokes or colors thrown in for no particular reason. When you’re practicing the art of Web design, strive for that kind of purity.

Appealing to your audience

The audience — which is made up of the visitors you hope to attract to your site — determines the content. To set some basic limits, think of these visitors as being at a beginning, an intermediate, or an advanced level, and gauge your content accordingly. If you’re aiming advanced content at a beginning audience or vice versa, you’re looking at failure from the word go.

Not only does your audience determine your content, but its preferences influence your visual-design requirements as well. If your audience consists of high-school students whose interests revolve mainly around the latest musical sensations, you need a far different look from what you’d shoot for if it consists of retired naval officers who want to know about international events.

For the young music lovers, for example, you need to strike a tone that’s lighthearted and exciting, both in your words and graphics. Brighter colors and a more relaxed and informal tone for the text are the call here. For the old salts, though, you need to take a heavier approach, with darker, duller colors and a middling-formal approach to language.

Whatever the group you’re aiming for, ask yourself the following questions:

How do they communicate with one another? Roller-hockey players don’t communicate quite the same way as cartographers do. What are the level and style of language usage in the group? Do its members have a particular jargon, slang, or regional dialect? If so, can you use it comfortably and correctly?

What kind and color of clothes do they wear? This kind of information tells you volumes about their preferences. People who are willing to wear suits and ties in midsummer don’t think the same way as those who prefer casual clothing. The colors they wear also indicate the color ranges they’re likely to feel comfortable with on your site.

What’s their worldview? For many people, the world consists of their apartment or house; the road between it and their workplace; their cubicle, office, or factory floor; and a couple of restaurants somewhere along that pathway. For others, the world consists only of Wall Street and the Asian financial markets. For some, the world is a series of airports, cell phones, and e-mail messages. Anything that exists outside your audience’s worldview is invisible to them and probably doesn’t belong on your Web site.

Find out all that you can — from what kind of cars your visitors drive to the hours they wake and sleep. Any kind of information you can nail down about your visitors and their lives helps you to understand them — and that understanding can’t help but improve your site’s appeal.

Avoiding clutter

If you’re one of those people who keeps a perfectly clean desk where your speakers line up exactly perpendicular to the edge of your monitor, whose laundry basket is more than occasionally empty, and who always knows where to find everything you own, I probably can’t tell you much about organization. If you’re like the rest of us, however, read on.

Far too many Webmasters seem to think that the best kind of Web page is one that has everything in the world crammed into it. It’s like a novel that introduces 27 characters in the first two pages — the overkill ruins it, and your mind is left swimming.

Perhaps you absolutely must put together a Web page containing a dozen frames, several JavaScript pop-ups, numerous Java applets running in the background, and a bunch of animated GIFs that move around the screen by using Cascading Style Sheets (CSS) positioning. If so, please, please, don’t put in an image map, too.

The line between losing and winning is very fine if you’re considering using Web gadgetry. Without it, most sites seem a bit on the dull side, and Web designers exhibit a really strong keep-up-with-the-Joneses streak that usually results in a frenzy of site changes whenever some new technique becomes popular. Too much of a good thing — or too many good things in one place — can, however, become a real problem.

tip.eps The key is to remember your site’s purpose as you’re designing any page. If anything you’re considering adding to the page doesn’t serve that purpose, don’t add it. If you discover some fun or glitzy gizmo that you simply must put on a page — and I show you plenty in this book to tempt you — first determine if you can make it fit in with what you already have on that page. If you absolutely can’t fit it in, but you still want to add it, maybe you can take something else out to make room for it.

This doesn’t mean you can’t have more than one unusual feature on a page — just make sure that you follow a path of moderation.

Achieving Usability

Usability is an important word for Web designers. It means just what it says — making a site usable. Without usability, nothing else you do matters. What good is it to have wonderful content if nobody can find it? What good is it to have beautiful graphics on a page that is inaccessible except by dumb luck?

Fortunately, designing a usable Web site isn’t difficult, and following a few simple rules can set you on your way. As with any set of rules, you may want to break these from time to time, but you do so at your own peril:

Keep your navigation system consistent on all the pages in your Web site. If you have a link to your home page at the top of half your pages and you put that link at the bottom of the rest, you’ll confuse your visitors.

Put links to your home page and your search function on both the top and bottom of every page. Too many Web designers put them on only the top or the bottom, forcing users to scroll to find them. Don’t make your visitors do extra work.

Never use blue, underlined text for anything but a link. In fact, try to avoid underlining at all. Use bold or italics for emphasis instead; otherwise you’ll fool a lot of people into clicking underlined text to no effect.

Don’t use too many links in a navigation bar. Half a dozen is about the most you should add. Remember that a navigation bar is not a site map, but a guide to the major sections within your site.

Use words! Using graphical icons may make your pages prettier, but you should design your navigation bar (or whatever alternative you use) to instantly communicate what it means to someone who has never been to your site before. In this case, a picture is not worth a thousand words.

If your site is composed of hierarchical pages (and most of them are), consider using breadcrumb navigation. The term comes from the idea of leaving a trail of breadcrumbs as you walk so you can easily retrace your steps. When applied to a Web site, the metaphor refers to a listing at the top of the page showing the current page’s relationship to the hierarchy; most often, these breadcrumbs are links that you can click to go directly back to any place along the trail.

The Big Rules for Planning Your Site

Here are some short rules to condense the information in this chapter down to a few rules that I think are pretty good guidelines, going by my own experience as both designer and visitor. Make these rules a part of your very being. Do them in calligraphy and hang them on your wall. Use a wood-burning kit to engrave them on your desk. Tattoo them backward on your forehead so you see them in the mirror every morning.

Rule #1: The Web is for reaching out to people.

Rule #2: Keep your Web pages lean and clean.

Rule #3: Know who your visitors are and what they want.

Remember that design and content are more a matter of art than science, which means that your own gut feelings count more than anything else. If someone tells you that your design decisions are wrong, and that person is someone whose input you respect, you certainly want to give that opinion some consideration. But if you’re firmly convinced that you’re right, never let anyone else’s concepts override your own. This brings me to The Big Rule:

Rule #4: It’s your Web site. It’s your vision. Do it your way.

Online Sources for Web Design

Table 1-1 lists some places on the World Wide Web where you can find more information on the topics covered in this chapter.

Table 1-1 Online Resources for Web Design

Web Site Name

Web Address

Beginners Web Design Tutorial

www.how-to-build-websites.com

useit.com

www.useit.com

Web Pages That Suck

www.webpagesthatsuck.com

Web Style Guide

www.webstyleguide.com/index.html?/contents.html