Web Site Development Tools for Small Business

Before I launch into this week’s subject choosing a web site development environment I think it would be helpful to review and clarify the thesis on which this series of articles is based.

My biggest gripe about being a small business online, and hence why the playing field is never level for guys like us, is that the technology to make it all happen is overwhelming. Small business owners just want to sell stuff, but e-commerce can’t happen without significant technology.

That means we either learn to write computer programs or pay someone to sort through the technology for us. Neither of these options is very appealing to those of us on a limited budget who want to get up and running now.

While a custom e-commerce solution will always make you happier, it takes time and resources to create. What should a small business owner do when he or she is in short supply of both?

My answer to that question is that if you know what you are trying to build, you can get inexpensive off-the-shelf solutions to get through this awkward first stage. Then, when your revenue is such that you can afford a better system, you build the custom solution.

Some people call me crazy, but I think the awkward first stage can be funded with a budget of no more than $6,500, including a guerrilla marketing plan. Describing how that is done is the point of this weekly exercise.

So last week, I discussed how to choose a hosting solution and, in the end, spent $1,200 of our budget for a year of web site hosting. That leaves us with $5,300 going into our next task: choosing a web site production environment.

A “web site production environment” is just geek-talk for the tools you use to build and manage your web pages. It has two parts: a web development tool (for making the pages) and an image editor (for managing the graphics).

The last time I actually wrote my own HTML code, Netscape still had a chance, this new thing called “tables” was becoming popular, and “blink” tags were all the rage. Boy, have times changed!

They say HTML isn’t a programming language. But hell, through the eyes of the HTML-challenged like myself, it might as well be. The language has evolved to the point where even experts need reference manuals.

Web Development Tools

So the number-one feature the tools you choose must have is what’s referred to as WYSIWYG, or “what you see is what you get.” All that means is when you design a web page with one of these tools, you can build the page by moving around the graphics and text in a manner similar to laying out a document in Word or a desktop publishing program. You never have to actually see or write the HTML code that makes the page look the way you want. The tool does it for you.

Now to say that you never have to touch the HTML code is misleading. Unless you are doing simplistic page designs, you will have to tweak the code on occasion. That is why you should have a good reference manual on HTML. I use “HTML 4 for Dummies” by Ed Tittel and Natanya Pitts.

Certainly, an equally desirable feature in a web development tool is the ability to produce and manage templates. Here is why this feature is important.

There are certain pieces of information that are the same on every web page of your site. A good example of this is the navigation links a site visitor uses to get around. If you build each page of your site independently and just “cut and paste” the navigation on each of those pages, you’ll have to do that all over again each time you want to make a change. That is fine if your web site is just a few pages. But if the site is any bigger than that, not only is it a pain to make a simple change, it creates a huge opportunity for errors.

What templates allow you to do is define a “master” web page on which all subsequent web pages will be based. You tell the web development tool: “Every page I make from this template will always have these specific elements on it.” Then if you want to make a change, you just do it on the template, and the web development tool, knowing which pages were made from that template, updates all the pages automatically.

This technique for managing web sites works well for sites upwards of a couple hundred pages. The downside, of course, is that you must upload all the pages in bulk each time you make a change to the template on which those pages are based. But it really isn’t that bad, especially if your Internet connection is decent. Once you get beyond a couple hundred pages, you need a more robust solution based on a database (we’ll talk about this in future articles).

An added advantage of this technique is the pages have static, direct URLs no funny characters or code numbers ensuring that search engines can still index them.

So if your web development tool can at least create WYSIWYG pages and manage templates, you have the bases covered. Features beyond that are just gravy. But it is still good to invest in the extras because you’ll find as you get into this stuff that you’ll get more sophisticated about how things are done. Being able to “grow” into those advanced features is nice.

Image Editing Tool

The other half of this equation is the image editing tool. This is what you use to make your graphics look good, yet still load quickly. By its very nature, an image editing tool should let you “edit” an image take apart, add, or change elements of a graphic.

But equally important is that the tool should let you optimize the graphics for the web. What that means is that you can tweak the number and kinds of colors used in the image so you can strike a balance between good image quality and the size of the file, which is the major factor in how fast it will download to a web browser.

“So, Richard,” you’re thinking, “you’ve blabbed on and on. But what the heck do I pick?”

There are really only two contenders in my view:

1. Macromedia Dreamweaver and Fireworks Dreamweaver is the page development tool, and Fireworks is the image editing tool. This is what we use at Booklocker.com. My only complaint is that the FTP function in Dreamweaver what you use to upload and download the files from the web server can be excruciatingly slow if you are moving lots of files at once. To get around this, I spent $30 on CuteFTP, a fabulous little FTP program for the PC. Other than that, the product more than meets our needs.

2. Adobe GoLive and LiveMotion GoLive is the page development tool, and LiveMotion is the image editing tool. I haven’t used the products because they came out after we’d already committed to Dreamweaver and Fireworks, so I can’t comment one way or the other. But a good friend of mine, Glenn Fleishman, just co-wrote a well-received book about GoLive called “Real World Adobe GoLive 4.” You might want to buy the book and read about it first. (I don’t get a commission, BTW.)

Also both Macromedia and Adobe offer free demos of these programs. I recommend downloading them and checking them out before you buy. The links are below.

Regardless of what you choose, it will cost us about $700 to build out this section of the system. So if we take that off our budget, we’re down to $4,600 going to next week when we’ll talk about merchant accounts and credit card authorization solutions.

Keyboard at you then!

Demo Links:

Macromedia Dreamweaver
(click on the “download” link to get the demo)

Macromedia Fireworks
(click on the “download” link to get the demo)

Adobe GoLive
(click on the “downloads” link to get the demo)

Adobe LiveMotion
(click on the “download beta” link to get the demo)


Books Worth Having:

Real World Adobe GoLive

DreamWeaver 2

HTML 4 For Dummies, 2nd Edition

Web Navigation: Designing the User Experience

Related reading