Web Design 101 for Writers

      A web site. It seems like every writer—both published and unpublished—has one. And now you want one too. So where do you begin?

Get a Domain Name
      This is your www.authorsname.com. You want to reserve it as soon as you can before someone else does. In fact, Google the name you plan to use and see if someone is already using it. If it's taken, you may have to come up with a variation of your name or consider using authorsname.net instead.
      While you're at it, you should probably also search Amazon.com to see if there is already an author published under your name. This was the case for me—there's an author who writes Young Adult books and has the same name as me (my married name, that is). I didn't want readers to confuse us, so I chose to go with my maiden name. Then I discovered someone already owned the domain name I wanted (www.loridillon.com is a realtor's site), so I put a hyphen between my first and last name and ended up with www.lori-dillon.com.
      When you've settled on a domain name, Godaddy.com is a popular place to purchase it. Don't worry, if you're not ready to put up a web site yet, you can still buy your domain name now and "park" it (which means you own the domain name and no one else can use it) until you're ready.

Purchase a Hosting Plan
      Reserving a domain name alone is not enough. Once you design your site, you need a place to put it. This is where a hosting plan comes in. If you Google "web site hosting" you'll see that there are thousands of businesses on the internet who sell web space. Personally, I like to go with a service that includes both the domain name registration and the hosting plan. It saves the hassle of having to transfer your domain name from one service to another.
      Also, don't get overwhelmed and feel like you need to purchase a lot of space. Unless you're building a site like Amazon.com with thousands of pages and shopping carts, you don't need it. A basic author's web site should need no more than 5 Mb of space, and that's being generous. Most of the sites I've designed come in around the 500 Kb range, images and all.

Here are a few popular hosting services:

Geocities Pro Plan

TotalChoice Hosting Starter Plan

Name2host Type A Plan

GoDaddy Economy Plan

Doteasy $0 Hosting

iPowerWeb Business Pro Plan

(Disclaimer: I have not used all of the above services and do not personally endorse any of them. Be sure to shop around. It's also a good idea to ask other authors who they use and if they're happy with their service.)

Now What?
       Okay, so now you've reserved your domain name and purchased a hosting plan for your author web site. Now what do you do?
       You mean I have to design it? Ack!!! How am I supposed to do that?
       Don't panic. It's not that hard. If you keep it simple and follow a few basic guidelines, you should be able to put up a web site in no time.
       Now let's get to work, starting from the bottom up.

Browse Other Sites
       The first thing you want to do is visit many, many other author sites and see how they have designed theirs. Look at the design elements and color schemes they use. Mystery and romantic suspense writers tend to go for dark, rich colors while chick lit and romantic comedy authors will lean toward bright and trendy. See what appeals to you and what doesn't. I'm not saying to steal their design, but it's a great way to start getting ideas.

Programs
       The two most popular programs for designing web pages are Microsoft Frontpage and Macromedia Dreamweaver. There are many other programs out there and most have a downloadable 30-day demo version. I recommend you try several out to see what suits your needs and fits your pocketbook. Personally, I'm a die-hard Dreamweaver fan.
       Another thing to check is many hosting services also include simple web design tools as part of their package. Most likely, this will be an HTML editor. If you go this route, you'll want to pick up a book such as HTML for Dummies to help you learn basic HTML code (this is the programming jargon that builds your page behind the scenes). It's not hard, but it does take a while to get the hang of it.
       I will tell you that even if you purchase a software program like Dreamweaver or Frontpage, knowing HTML code definitely comes in handy for those times when something goes whacky on your web page. Understanding basic HTML will often help you to find, decipher and fix broken code when all else fails.

Page Size
       Actually, this should be screen size, but since we're writers, I thought I'd go with the familiar.
       The majority of internet surfers use a screen size of 800 x 600 pixels. Although it's true that more and more people are using a 1024 x 768 resolution, you need to design your site for the smaller screens. In other words, don't have an image larger than 800 pixels wide because it won't fit on the majority of your viewer's monitors. Above all, you want to avoid designing a site where people have to scroll side to side. This is a pet peeve with many viewers.
       And while most people are accustomed to scrolling up and down to view web pages, try to keep it manageable. You don't want your page to go on and on forever. It's better to break it into several pages than to have one long one.

Backgrounds
       Think contrast for the most impact and the best readability—dark type on a light background or light type on a dark background. Anything in the mid-range tends to wash out on the screen.
       What about using a pretty pattern for the background? Yes, you can. Web designers do this by using a small graphic that tiles across the page, (hopefully) creating a seamless look. Again, there are some good ones and some bad ones. Above all, make sure the image you choose is not so busy that you can't read the type that goes over it.

Colors
       Books are printed with black type on white paper for a reason. For large blocks of text, this is the best color combination for reading. The same is true for web pages. But if you think a black and white web page looks boring, remember what I just said about contrast—dark type on a light background or light type on a dark background will usually work just as well.
       Keep in mind that it's usually best to choose one main color and one or two accent colors. If you try to use the entire rainbow, the page tends to look too busy and the impact of any one color gets weakened.
       This is where browsing other author sites comes in handy. Look at the color combinations they use. And don't just pick colors because you like them. You want to make sure the colors you use also convey the mood of your writing style.

Fonts
       There are hundreds of fonts out there. Some of them are very classy and beautiful, while some are down right weird. Want to use them on your website? Think again.
       Sure, you can use Papyrus, Zapf Chancery or Uptight Neon if you want to. But if the person viewing your site doesn't have those fonts on their computer, guess what they see? Probably Times, Arial, or even Courier—whatever their computer uses as their default font—and now that beautiful web page you spent hours designing looks like crap.
       It's best to stick with standard web fonts for your body text. If you want a serif font, go with Times or Georgia. If you want a sans serif font, use Arial or Helvetica.
       You can still use those fancy fonts, just save them for your banners, titles and buttons. That way, you'll turn them into a graphic and they should look the same on every computer.

Graphics
       For the web, there are two types of graphics: GIFs and JPEGs.
       GIFs are for simple graphics that have only a few colors (logos, text, buttons, etc.) and JPEGs are used for photos or images with lots of gradient color. To create these files, you'll need an image editing software program like Photoshop, Fireworks or Photo-Paint.
       GIFs and JPEGs should be 72 DPI. That's all the computer screen can reproduce and any higher resolution is not really improving the image quality. The only thing that larger file is doing is making the page take longer to download for your viewers. Also try to keep your GIFs and JPEGs small in file size—most should be no larger than 20 Kb.
       Always keep in mind that big images or lots of small images mean longer download time. Twenty 30 Kb images on one page are just as bad as one 600 Kb image. Each graphic you put on your page adds to the total download time and the longer it takes to bring up your page, the more apt your viewer is to get bored and move on to someone else's. It doesn't matter how beautiful your website is, if each page takes longer than 20 seconds to load on the screen, they aren't going to stick around long enough to see it. Remember, not everyone out there has a high-speed internet connection. Over one third of internet surfers (including yours truly) are still using old-fashioned dial-up.

Navigation
       These are the hyper-link text or buttons viewers click on to surf through the pages of your site.
       The most common navigation menus are the ones with text or graphic links running vertically down the left hand side of the page. Some designs look better with the links running horizontally across the top of the page, usually just under a main title banner. Just make sure you don't have them going so far across your page that your viewers have to scroll side to side to see them all.
       Finally, consider putting simple text links at the bottom of your pages (see how I did mine below). It's always a good idea to include a second set of navigation links to complement your main navigation text or graphics. That way, if you do have long pages, your visitors won't have to scroll back up to the top of the page to select another page.
       Whatever type of navigation you decide to use, make them obvious so they stand out on the page. Also, keep them consistent and in the same location from page to page so your viewers know where to find them.

Use a Template
       So does all this design talk have your head spinning? Then consider using a template. Basically, these are blank web sites already created with coordinated colors, buttons, icons, and banners. All you have to do is type in your text, insert your own photo or two and you're good to go.
       There are some free template services out there, but buyer beware. Sometimes you get what you pay for.
       You also need to make sure the images they provide can be edited, otherwise the template is useless to you. If the images (navigation buttons, title banners, etc.) only come in GIF or JPEG format, you won't be able to make changes to them. The most common editable images will come in PSD format and you'll need image editing software to change a "Buy It Now" button into an "About the Author" button.
       Also, check with your hosting service. Many of them offer templates as part of the package to their customers.
       To be honest, I haven't used a template myself. I'll admit I have downloaded a few of the free ones to see how they're put together and quite frankly think most to be more trouble to edit than they're worth. I've found it's usually easier to build a site from scratch. But again, this can be a fantastic place to get design ideas.

Preview Your Site
       Before you go telling all your friends, family and coworkers about your new website, take a look at it on the real live internet. Preview it in several different browsers, not just the one you normally use. At minimum, test it in Explorer, Netscape, and Firefox (from Mozilla), the three most popular browsers. All of these are free, so you can download them for testing purposes. I've seen a page look fine in Internet Explorer but in Netscape the text flows all over the page where it shouldn't be. Oops! Don't want that to happen.

To Get You Started
       Here are a few places that offer free web page templates and graphics. I'm not personally recommending these specific sites, I'm just showing you a sampling of what's out there for you to use. You can find many more sites just like them by Googling words like "web page templates" and "web graphics."

Absolute Web Graphics Archive

Free Webmaster Tools

Templates Box

The Template Store

Free Web Templates

       Finally, don't let the thought of designing your own web site intimidate you. After all, it ain't rocket science. As long as you don't try to put everything on one page or use a wild flowered background with hot pink text, you'll do just fine.

back to top

Lori Dillon is the self-taught webmistress for Virginia Romance Writers. She has also designed web sites for several authors, plus her own site here at www.loridillon.net.

© 2006 Lori Dillon