Howl the First: Getting Your Point Across Without Gouging Your Users' Eyes Out

Ever since Five Rings floated the whole idea of official tribe sites, a lot of Garou have been scrambling around like shoppers at an after-Christmas sale, trying to get something put together. (If there's one thing you can never fault the Garou for, it's their energy.) Some of them have come to us for help, and we are always more than willing to help those who ask. Some of them have shown us what they've got so far. Some of it has been extraordinary. Some of it has been... well, extraordinary, but in a Not-Good Way.

This has served as the inspiration for this Howl. Mind you, we have nothing against bad web sites; they can provide hours and hours of wholesome laughter. But we'd really like the tribe sites to succeed, if for no other reason than they might get more of the unwashed masses to buy the game, so that Five Rings keeps printing these spiffy cards. And besides, this way, if you do a bad site and we make fun of it, there'll be no excuses...

And please remember: By saying these things, we are not holding this site up as the ultimate web site. Heck, we remain unconvinced that it's even good. But it ain't all that bad either, and folks seem to show up on a fairly regular basis. So we can't be completely off our rockers.

Yes, yes, now that you mention it, we are completely off our rockers. But that doesn't mean that we aren't right, okay?

This Howl won't tell you how to build a web site; there are plenty of places for that. It won't even tell you how to build a good web site; there are plenty of places for that too. But there are a few mistakes that Garou seem to love making when putting sites together. If you ponder these words carefully, you will not fall into that trap... or if you do, it'll be your own damn fault.

Say Something!

This is the simplest piece of advice, but it's the most important one. The Web is such a wonderfully visual place, and Rage is a wonderfully visual game; there's all sorts of art and nifty symbols and such. So when you start working on your page, you start thinking of all the visual things you can do--"I can make my text this color, and I can put these graphics over here, and I'll need buttons here for this section, and, and, and..." It's awfully easy to spend hours and hours of time getting your site to look just right... and then realize that you can't think of a damn thing to actually say. Or you can think of something, but it's not what you had in mind when you laid out all those nifty graphics, so you go back and redo everything, and then once you finish that, you realize that there's something else you wanted to say, and by that time you've spent so much time on the same graphics that you just throw up your hands and go kill something. Am I striking any nerves here?

If you trust me on absolutely nothing else, trust me on this small thing:

CONTENT FIRST.

Don't worry about the graphic mumbo-jumbo at first. Decide what you want to say, and say it--or at least some of it. Then come up with the visual flash that fits what you've written. The odds are that you'll have a lot easier time than you would if you did all your graphics first, then tried to shoehorn your content in to fit it. Besides, if you go content-first, you can be up and running a lot faster. A plain ol' page with good content won't win any awards, but it'll still be useful. A visual tour de force with no content is nothing.

Don't Work Your Home Page To Death

If you just want your site to be a piece of performance art, that people look at once and say "Oh, that's nice" and never come back to, things are pretty darn easy. But if you want to draw repeat traffic, there are two kinds of users you've really gotta worry about. Ignore either at your peril.

The first is the Surfer. The Surfer has never seen your site before; he just dropped in for the first time. He wants to make a very fast decision: Is your site worth his time? And, if you're lucky, he'll give you about ten or fifteen seconds to make up his mind for him, before he clicks a button and moves on to the other twenty zillion sites out there.

Now, naturally, you want to grab the Surfer's attention. So there's an awful temptation to load up everything on your home page--all your best stuff, all your fancy graphics, everything. But that won't necessarily win you the Surfer, and it will shoot you neatly through the head when it comes to that other kind of user... the Frequent Flyer. She's already seen your site umpteen times. She's seen everything on it. She's here to see what's new, or maybe to look up something--a card, a deck design, whatever. She wants to get in, see what she wants to see, and get out. And if you make it a hassle to do that, she'll get out and stay out.

Now you see the problem. If you load up your home page with everything but the kitchen sink, the Surfer may be impressed. But the novelty of all those snazzy graphics wore off on the Frequent Flyer umpteen visits ago. To her, it's just a page that takes a long time to load. And she doesn't like that. At all.

So if you want to keep both the Surfer and the Frequent Flyer happy, you've gotta design your pages--especially your main page--verrrry carefully. If your main page is too plain, then the Surfer may say "Booooring..." and click away. So, by all means, use graphics. Use tables. Use a snazzy-looking color scheme. That'll catch the Surfer's interest. But if those snazzy graphics mean that your page takes a minute to load, the Frequent Flyer will go ballistic... and even the Surfer will probably lose interest. (After all, if it takes that long just to load the first page, how long is it gonna take to look at the whole site?) So shoot for this: Come up with the best-looking home page that fifteen seconds can provide. In other words, if your home page takes longer than fifteen seconds to completely load, you're doing it wrong. With the other pages in your site, you can be a little more flexible; but if any page takes longer than thirty seconds to load, there had better be a damn good reason.

One way of weaseling around these restrictions a bit: Layer your site. In other words, use just a few graphics on your main page. On other pages, reuse some of those graphics from the main page, and add more graphics as well. Since the user already saw those graphics from the main page, they'll probably still be stored away in the user's browser somewhere, so they'll load 'for free'. That can let you get away with having a graphically fancy page that still loads sometime before the next ice age.

As a good example of a home page that'll make both the Surfer and the Frequent Flyer happy, have a look at the Wyrm's Eye View page. (Try to contain your righteous wrath at being exposed to Wyrmstuff, just for a few minutes here; you can always go kill something later, okay?) The neon-green text on a black background is not only readable, but sets just the right it's-a-dark-world-and-we-like-it-that-way-thank-you-very-much mood. The graphics use that same color scheme. And even though those graphics take a lot of screen space--and really make a strong impression--they're made with only a few colors, which means they're pretty darn small files, which means they load in a hurry; the whole page only takes about twelve seconds. The Surfer certainly gets his attention drawn; the Frequent Flyer can get to those Decks and Reviews sections in a hurry. (Of course, those Decks and Reviews sections don't have anything at the moment, which brings us back to Content First...)

It May Be a Dark World, But It Ain't Illegible

When Garou start actually laying out their sites, this is the single biggest mistake that Garou make. They pour their souls out into their pages... and those souls stay safely hidden in a mush of nearly-black text on a black background with black links and black buttons that light up in black when you push them. (Sorry, Douglas Adams.)

Yes, we know what you're trying to get across. It's a dark, dreary world we live in, woe, the Apocalypse is upon us, woe, the Wyrm slowly crushes the Earth in its coils, woe, feel our angst as we nobly dedicate ourselves to our hopeless cause, did we mention woe. That's all well and good. Run with that. But if the only way you can come up with to get that across to the reader is to use a color scheme that makes the reader break out a magnifying glass and a reading light, then that tells us about you, not about the world. And it doesn't tell us flattering things.

The color scheme you choose may push the reader in the direction of the mood you're after. But it's what you say that gets them there and holds them there. If you write well, you don't need black-on-black to hold the reader's mood. And if you don't write well, then the color scheme isn't gonna change that.

That's not to say that black backgrounds are bad. But use white text, or yellow, or something else that stands out against it. Light tan on black can look pretty snazzy. Dark brown on black is Bad. Get the picture?

And by the way: When you're choosing the colors for your page, make sure that the brightness on your monitor is set to something close to the middle. If you've turned it all the way up so you can play Quake 47 without going blind, don't blind your users by choosing colors that "look perfectly readable to you", okay?

And one more detail before we leave the whole color thing behind: If you set your own background color (and you almost certainly will), just choosing a text color that works with it isn't enough; you've gotta choose decent link colors too, both for the visited and unvisited links. If you don't, then they'll get displayed in the default colors, which will probably be about as unreadable as those two links above. (And by the way: If you've actually visited that "unvisited" link, you're probably a Glass Walker, and my opinion of you just went up by several points.)

Finally, there's the issue of background images. Bringing up the topic of background images in a group of web designers is like bringing up the Impergium at a grand moot. (And they're both fun to watch.) Personally, I think that they're, at best, a nuisance. If you want to have a graphic alongside the text, that's fine. But when I'm reading the text, I want to read the text, not the graphic underneath it. But, if I were going to use one, I'd use one like the one behind this paragraph. (If you don't see a graphic behind this paragraph, then your browser doesn't support background graphics in tables; be thankful, and take my word for it.) It says "Nuwisha", but it doesn't claw its way in front of the text to do it.

Unfortunately, there are some folks who forget about the "background" in "background image", and produce pages that look just lovely... until the background image finishes loading, and makes the text completely unreadable. Like this, for example. This is sick and wrong. (And if you think I'm exaggerating, take a look here. Tragic, really.)

By the way: Let's say you were trying to do a page just like that one--a page full of tables--and you wanted to use a "noisy" background graphic like that. Here's a trick: Go ahead and use the loud background graphic for your page. Then put your content in tables, and set a background color and an empty background graphic for the table, like I've done here. The loud image will appear outside the tables, and the tables themselves will be actually readable. But don't make the rookie mistake of putting the entire contents of a big page in a single table; many browsers don't display any of the contents of a table until the whole thing loads. So Surfers will go to your page, see a blank screen for a few seconds, conclude that Something Must Be Broken, and click away, never to return.

And just so I don't come across as picking on Lord Erikan--who has some great stuff, and who could probably kick my ass--notice that the later pages on his site, like the ones for the new Rage, have background graphics that work very well indeed.

Fonts are another touchy subject. A well-chosen font can set the tone for a site. A poorly-chosen font can also set the tone for a site, but in a Not-Good Way. Remember this: The user chose the default font in their browser for a reason; they probably like it. If you choose another font for them, it's up to you to make sure that it's readable, as well as snazzy. For example, if you have the Stucco font that seems to be popular with Rage sites everywhere, you've noticed that most of the headers for this site are in Stucco. It looks nice, and conveys the message that "This is a Rage site." But you've also noticed that this paragraph is in Stucco; and if you're anything like me, you're about to claw my eyes out if I don't stop it right about now. Isn't this better? (If it's not, you haven't installed Stucco, or you really need to choose a better default font.) A font like Stucco is very attractive to look at, and very fatiguing to read for more than a few seconds. That means that it should be used in places where it conveys a big visual impression (like headers), but not in places where the user will be doing sustained reading (like this overly-long paragraph). Get the idea?

Don't Be a Browser Bigot

I've always felt that ripping people to shreds was a bad thing. Some of our Garou visitors will likely disagree. But if one feels inclined to rip someone to shreds, there are all sorts of important reasons--good causes--to rip them to shreds for. A user's choice of web browser is not one of them.

HTML--the language of the Web--was originally designed with the idea that the Web page would just contain the structure of the document--'here's some text that should be in a paragraph', 'here's a bulleted list', etc. It would be entirely up to the browser--and up to the user--to decide how that structure should be displayed on the screen. Well, then someone decided that it would be a good idea to show images too, and then they wanted to be able to decide exactly where those pictures went on the screen, and the whole structure-only idea pretty much went down the tubes from there. In theory, HTML now lets you choose pretty much exactly where everything goes. In practice, every browser does things just a little bit differently, and every browser has extra little tags that let you have just a bit more control... but that the other browsers don't support. And meanwhile, there are still people out there who want all the pages they browse to look pretty much the same, so they use browsers that don't support the graphic stuff, or they just turn it all off.

If you're going to do any kind of remotely-fancy Web design, you owe it to yourself to download, at the very least, a copy of Internet Explorer and a copy of Netscape. View your site with both of them, and make sure it looks right. Then try turning off as many fancy features as the browser will let you--turn off graphics, turn off sounds, turn off animations, etc.--and make sure that the page still looks right, or at least readable. And if you possibly can, find a Mac (or a PC if you're a Mac-type by nature), and look at your site with IE and Netscape again; the Mac browsers are really very different beasties from their PC counterparts. If it doesn't look right (or at least reasonably close), on every platform, change it so it does. If you don't know how, ask someone. Don't throw away a big part of your audience right off the bat.

Keep the Lawyers at Bay

You've already got plenty to worry about in this life: the Wyrm, the Apocalypse, mange, the usual stuff. The last thing you need is to have a bunch of Ahroun attorneys from Five Rings or White Wolf show up at your door with silver restraining orders. That's just never good.

"But my site's too small to worry about," you say. "They'd never bother with me." And you're probably right. But a lot of Werewolf stuff is trademarked, and trademarks are a funny thing; if you don't use 'em, you lose 'em. If you know that somebody else is using your trademark in the wrong way without your permission, and you don't do anything about that, you can lose the trademark, and that's just never good either. And sometimes that makes companies do things that don't seem to make sense, like suing people who run fan sites. And you don't want to be on the receiving end of that.

So cover yourself. On the main page of your site--and maybe in other places, if you think people will be linking to them--you should have the sort of legalese that you see at the bottom of this page. At least for now, that'll cover you with Five Rings. But if you're going to copy things out of White Wolf's books--like the pretty pictures there--that may not be enough. White Wolf has their own program for web pages using their stuff; you can get the details at their web site.

And don't forget the button. Along with that legalese, you should include one of the two buttons you see here, and link it to Five Rings' web site. The one on the top is the one that Five Rings supplies. The one on the bottom is the one I use; it's exactly the same animation, but it displays much better on browsers that don't support animations, or that have 'em turned off. (Five Rings' version just has the werewolf head sitting next to a big ol' black space on those browsers; mine has the "RAGE" word there too, so people know what the heck you're talking about.)

Balance In All Things

Finally, remember that if you want your site to thrive--if you want it to satisfy both the Surfer and the Frequent Flyer--then it's not enough just to balance the design of your site to satisfy them both; you also have to balance the content.

If you're doing a Rage site, you'll want a lot of "gravy" in the site's content--the praises of your tribe's wisdom (and the moans about the lack of wisdom in the other tribes), vivid descriptions of your great leaders and past triumphs, retelling of the events of Las Vegas from your tribe's uniquely unbiased perspective, that sort of thing. After all, what's the point of doing a tribe site if you're not going to glorify your tribe? And Surfers love this sort of stuff; it really draws 'em in.

There's just one problem with "gravy" content; it's got no replay value. I may read your magnum opus on the virtues of (insert tribe here), and love it. I may tell my friends about it; I may link to it. All of that is good. But once I've read it a couple of times, I'm not going to get anything much out of reading it again. If your site's content is all gravy, then its Frequent Flyer potential is pretty much zero, unless you're willing to commit yourself to adding new material on a very regular basis.

So if you want to encourage repeat business while still allowing yourself at least the slim possibility of having a life, you're going to want to have some "meat" as well--usefull stuff that might not have that same initial "Wow, that's neat" factor, but that's useful even if you've already read it. For example, the card search engine on this site is, if I say so myself, pretty fine meat indeed; even if you've already read all the cards, it's still useful. In fact, this whole site is pretty darn meaty; it's the gravy that's sorely lacking. (Working on it, working on it...)

What sort of meat can you offer? Well, that's up to you. Good deck designs are always a fine choice. Strategy tips on particular cards--their strengths, weaknesses, potential combos, etc.--are good, and haven't been done yet; to keep with the tribe theme, try giving these sorts of tips for your tribe's cards. Set up a page that lets people offer and make trades. Take the time to do a really good links page. Be creative.

If you get the balance right--both in your site's design, and in its content--then it won't take that much effort to keep your site thriving. Your gravy (and the people you've talked/convinced/blackmailed into linking their sites to yours) will bring people in and hold their attention. Then the meat will keep them coming back... which means that, when you add new content, they'll be around to notice it. And they'll be so impressed that they'll link their sites to yours, and tell everyone they know about it. Before long, everybody will be at your site. And while they're all distracted, you and your tribe can sneak in, take all their good caerns, and establish your rightful place as leaders of the Garou.

See how easy this is?

Howls

Nuwisha Home Page