Web Page Design Software

Software Categories

To be an effective web page designer, you'll need to learn how to use at least two types of software - a graphic design program and a page creation program. To be really effective, you'll often need to learn to use other types of programs as well - Flash (for animation, video and audio), vector illustration, video editing, sound editing and even page layout software.

Here's a breakdown of the software categories along with representative examples:

Design Suites

Graphic Design Software

Web Page Creation Software

Animation Software

Video Editing and Compositing Software

Audio editing software

Page Layout Software

3D Software

Other Software

What I Use

Okay, I won't keep you in suspense any longer. The two programs I use constantly are Photoshop and Dreamweaver. Next in line is Fireworks and Illustrator. For animation I use Swish Max first, and then Flash when necessary. Clients regularly deliver content in Microsoft Word, Powerpoint and Publisher, so having these programs can be helpful (Word is pretty much a necessity).

PDF files are ubiquitous on websites, and I use Adobe Acrobat Professional to create pdf.

Occassionally a client will provide a file that contains a copy of their brochure that they would like to use to create a website. For this purpose, having Microsoft Publisher handy or Adobe InDesign (which can also open older Quark files) is handy.

Sometimes a client wants to put video on a site, so for editing and compositing I use Sony Vegas. Vegas can also double as a multitrack sound editor. On various occassions, in order to open files sent to me by customers, I'll use Corel Draw or Corel Wordperfect, though I don't work in this software very often.

Very occassionally I'll dabble with 3D software to create an image that I require - for this I use Caligari Truespace or an old piece of software called Simply 3D which is no longer sold.

I'm sure this sounds overwhelming and expensive, but the vast majority of work can be done with two programs - Photoshop and Dreamweaver (or Fireworks and Dreamweaver, if you prefer).

I've purchased and updated two important suites of applications - Adobe Creative Suite Professional and Macromedia Studio. Adobe Creative Suite has Photoshop, Illustrator, InDesign, GoLive, Acrobat, Bridge and VersionCue. Macromedia Studio contains Dreamweaver, Fireworks, Flash, and Contribute. With these packages, you can do almost anything. Adobe, now that they've purchased Macromedia, has some new bundles that include almost everything from both packages, including Premiere video editing software and After Effects. These don't come cheaply but they are incredibly powerful.

Web Page Creation

If you’re serious about creating excellent web pages on a consistent basis, you’ll need to pick a competent web page creation software package and become proficient using it.

The type of software you choose will depend upon how you will be working with web pages.

If you need to create a relatively simple site of a few pages, and then maintain them occasionally, software that simplifies the process and minimizes your learning curve may be the best way to go. This may be either a software package you install on your computer system or a site that allows you to create your pages online (link to Network Solutions).

If you are going to develop web pages professionally, I would recommend that you purchase and learn Dreamweaver. I made the decision early on to bite the bullet and go with Dreamweaver, although it wasn’t the least expensive or easiest to use software. There were several reasons why;

  1. Dreamweaver is used by the majority of people who design sites professionally. If you are looking for employment in a company, or working with other designers on the team, knowing Dreamweaver will likely be an asset. No competent web design software is easy to learn, so why not gain learn a package that will make you more employable?
  2. Dreamweaver has a slew of add-ons created specifically for it that you give you a lot of power and versatility. Macromedia (Adobe) has a web site called Dreamweaver exchange where you can download these add-ons.
  3. Dreamweaver has tools that allow you to add functionality to pages (for example creating Cold Fusion, .asp or .php)
  4. There are tons of support sites for Dreamweaver.
  5. Dreamweaver (and it’s creators Macromedia) has just been purchased by Adobe. As you may know, Adobe makes one of the other professional grade Web design software packages – go live.  There is a lot of speculation about what Adobe will do with Dreamweaver and go live, and which will end up winning. At this point, from what I’ve read,is the smart money is on Dreamweaver.
  6. Dreamweaver latest version has excellent features for developing sites based on CSS.

All in all, you investment of time and money spent will pay back over time.

Macromedia link

Macromedia (Adobe) Flash

How should Macromedia flash be used in creating a web site?  If you ask 10 different site designers and I’m sure you’ll get 10 different answers. Lucky you, you’re reading this site, and therefore you get my opinion.

First of all, what about those fancy splash screens creative flash that you see on many sites?  These are the initial pages you see when you go to a web site, that often take a long time to load and then play a wild dance of text pictures and music. I personally dislike this use of flash intensely.  I and many other people find them simply annoying and they don’t add any real value in my opinion.

I believe the flash has its place on a web site.  I generally do not think is good for a small to medium business without an IT department or programmers on staff to create a site completely in flash.  Why?  Because creating a site in flash requires a high level of skill, and any future modifications may be difficult and expensive to accomplish.  Something that takes a few minutes on an HTML web site can take much longer to accomplish on a flash web site. If you lose touch with the original programmer who created the flash web site, you may have to look for another person with an equally high level of skill who can make any changes you require.  This is not always easy or inexpensive.

On the other hand, if you do have the resources and necessary expertise, creating a good all flash site can produce unique and highly effective results as I’m sure you’ve seen on many corporate sites.

I would recommend creating HTML web sites and using flash to add interest and spice things up. Additionally, flash could be used for navigation elements. For example, create a flash header graphic that functions as a slideshow, and also displays multiple animated text messages.  This allows you to show many things in a small space and get more of a message across then you could with a static element. Such a graphic can add beauty and sophistication to your site.

As mentioned above, another option would be using flash for navigation elements. This entails more complexity, and will certainly be more complicated to modify in the future than HTML navigation. However if the client requires it, this would certainly be a better option than creating the entire site in flash.

A people may disagree with me on this point, and I’m sure I’m showcasing my stupidity, or remarkable lack of patience, but I basically dislike the flash application, find it counterintuitive, and don’t like using it.  I find that accomplishing even the simplest of tasks is often difficult.  However, there’s no denying that flash is an extremely powerful application and the only useful tool of its kind for complex animations. If you need the power of flash, I would strongly recommend taking time to learn the application thoroughly before attempting a large project (unlike me).

One thing that flash has going for it is a video.  The latest version of flash (flash eight professional) as much improved and simplify tools for creating flash video. As a matter of fact, it comes with a batch processor say don't even have to open up flash to convert video from other formats into the flash format.  You can then place that video using Dreamweaver into a web page complete with embedded player controls fantastic.  If you are looking to implement video on a web site this is certainly worth taking a look at.

When I need to create flash animations, I use a tool called swish. This allows me to create relatively quick and simple animations in an intuitive fashion.  I really like this tool and it’s not very expensive. It comes loaded with hundreds of effects, each of which would take me years to program in flash. It also allows you to do some programming, so can be very useful even in creating navigation.

Graphic design software

When he comes to creating graphics there are so many different options.  However, you can apply at the same argument here as I did above speaking about Web design software (Dreamweaver).

If you're going to take the time to learn a complex graphics creation package why not spend that time learning the industry standard? For this reason, I recommend learning Photoshop, regardless of what other graphic programs you choose to use.  There are several reasons;
1.  Photoshop is simply the most powerful program available.  Its wide array of powerful tools helps you create the best possible design.
2.  Photoshop is the most widely used graphic program by professionals in many different design disciplines.  It's used by photographers, print designers, web designers, artists, illustrators, scientists, and many many others that I'm not even aware of.
3.  If you're looking for employment in the design field, knowing Photoshop will make you more employable.

On the other side, Photoshop is not yet optimized for creating Web graphics.  A lot of the Web creation features in Photoshop reside in the companion application called ImageReady.  I do not like ImageReady very much.  Is a strange incomplete clone of Photoshop, and the Web features are not implemented in the same intuitive way as in fireworks. When you want to use the Web features of ImageReady, Photoshop passes the file to the ImageReady program.  When you are done using ImageReady, the file is passed back to Photoshop.  I couple of times in the past ImageReady has corrupted my file so I could not reuse it in Photoshop.  I really wish that Adobe would integrate all wet features into Photoshop so I could work with one interface.  Now that they held fireworks you would be even better is if they move some of fireworks implementations into Photoshop.

That being said, there are a lot of other graphic design software that a good designer should know about and have available.  The other program that is invaluable for web designers to have and use his fireworks.  Fireworks, created by Macromedia which is now part of Adobe, is an excellent all-around program for creating Web graphics.  It was designed for creating Web graphics from the start, so the Web creation features feel more integrated than similar features in Photoshop.  Additionally, fireworks is very well integrated with Dreamweaver.  This means you can create drop-down menus and other beat behaviors in fireworks that Dreamweaver understands natively.  It just makes your life that much easier.  (Photoshop has a similar relationship with Adobe go life which is part of the Adobe creative suite in other words, the two programs work together to make your life easier).

Other programs that are valuable to have for a person doing design on a regular basis;


Adobe Illustrator
illustrator is a vector drawing program.  It has a remarkable set of tools for drawing.  It also has built-in slicing and a save for Web function.  Since illustrators native file format is PDF, it allows you to open PDF files and edit them as vectors (this is not the same as editing the original files that were used to create the PDF in the first place but it is better than nothing).  Illustrator also allows you to open a other vector file formats such as WMF and EPS and edit them in a vector format.  For this reason alone, conversion of graphics, illustrator is a valuable program to have.  Many times a client will send you a graphic in a file format that you will need to open and work with in order to create the graphics for the web site.  Having illustrator and other programs parentheses such as Carl draw) can often make this possible.

CorelDRAW

This is an excellent and powerful program.  It is a vector editing program but has a lot of excellent tools for working with bitmaps.  It's also less expensive than Adobe products. It also has Web features.  I have been but don't use it very often.  However when I need to open a CorelDRAW format it is indispensable is indispensable.  You could easily use this program instead of illustrator is simply a matter of preference.  On the other hand, illustrator is often used by many professional illustrators.

Adobe Acrobat
Being able to create PDF documents is pretty important when working on web sites.  Many many documents distributed web sites are now in the PDF format.  PDF allows you to view the document in its original format without having the program that created it. At some time or another, a client will ask you to convert a document they provide you with each PDF format.  If you can afford it Adobe Acrobat is certainly the best program to use, however there are many other less expensive programs that can be used to create PDF documents.  Also, more programs are coming with a built-in ability to create PDF documents, including the new version of Microsoft Office which will be released later this year. If you own a Mac running OS X, you’re lucky, since the creation of PDF is built into the operating system (when you go to print a document, PDF creation is one of the options in the print dialog box).

Note: I receive some compensation if you purchase products mentioned on this page.