Although there are many design tools available to help you build your website, a lot of them are quite expensive. The leader in the field, Dreamweaver, is currently priced at a little under 400 pounds, obviously this is beyond the budget of most amateur web designers. Thankfully there are many free software tools available for you to download. Whilst these free tools may not offer some of the time saving facilities as their professional counterparts, they are perfectly usable, and in some instances better suited to an amateurs needs.
The following pages contain lists of free and commercial tools which CWS recommend as a starting point.
One of the basic mistakes made by many web designers is to not design their site for use in different web browsers. Whilst Internet Explorer is the most used web browser, it does suffer from certain incompatibility issues. IE is notorious for not adhering to the published HTML specifications, so CWS recommend that your site be designed to be useable in at least the top four browsers listed below. Those of you developing your sites on an Apple Mac may have difficulty testing your site in Internet Explorer as Microsoft stopped developing a Mac version after IE 5. In this case we’d suggest asking a friend with a windows PC if it’s possible for him to test it for you.
Another common mistake is to only test your site once it’s nearly finished – we’ve made the same mistake ourselves – for this reason we’d advise you to install these browsers before you start development, as rewriting an already completed site is very time consuming.
In addition to the built in features, some browsers allow you to add extra features by the use of plugins. CWS find the following plugins handy for checking accessibility and validation on websites
Firefox plugins
Opera plugins
Once you’ve decided on the general layout of your website using good old fashioned paper and pencil, you’ll need the tools to help make your design a reality. Many designers will tell you that the only way ahead is to use a text editor, whilst others will tell you that a WYSIWYG HTML editor is the only way to go. Here at CWS we use a combination of both, but at the end of the day it’s your decision. Designing completely in a text editor is time consuming and will mean that you will have to learn quite a lot of HTML code. Using a WYSIWYG editor to generate the HTML code for you will save you lots of time, but you may still need to edit some of the generated code to deal with the inevitable errors that creeps in. Even commercial products such as Dreamweaver need slight tweaks to the generated code to make it validate properly.
Microsoft FrontPage is another common commercial WYSIWYG HTML editor. While FrontPage is reasonably easy to use, in our experience the generated code is difficult to make comply with the HTML and accessibility standards. It also generates bloated code which will mean your pages will take longer to download than they ought to. For these simple reasons CWS advise you to steer well clear of FrontPage.
It’s also possible to use Microsoft Word to generate your HTML code, but due to the fact that Word wasn’t designed specifically to do this, the resulting web pages have the potential to look very amateurish. Word also suffers from similar bloating and validation problems to FrontPage. Again our advice is to steer well clear.
Whatever route you take, there are many free tools to help you.
WYSIWYG HTML editors
Text editors
Whatever design you chose for your website, the chances are that you’ll want to include images for one sort or another. Whether it’s just a simple logo, or loads of photographs, you’ll need to edit your images to make them suitable for web usage. Images taken straight from digital camera can be several megabytes in size, as well as large in physical size. While it’s possible to alter the physical size on the fly using HTML, this practice is severely frowned upon. Images that are reduced on the fly can take minutes to download rather than seconds. Users are prone to getting bored and will likely leave your site if pages take too long to download, no matter how interesting the rest of your content is.
A far better method is to reduce the images in size before integrating them into your site. Trust me, your users will thank you if you do, especially if they are still using a dial up service.
Once you have the first few pages of your site ready for testing, it’s time for you to publish your site to the web server. WYSIWYG editors such as NVU and Dreamweaver, and some text editors such as Text Wrangler, have this functionality built in. Some editors however will require an external application to enable you to upload your pages. Even if your editor does have FTP built in, it’s useful to have a stand alone application at hand to help you manage the files on your web server.
The FTP clients listed below are perfect for this situation.
These free tools are a great start to achieving an accessible website. Designed by Fujitsu for their own use and made freely available to the rest of us, these tools provide a means to mechanically test your website for accessibility errors.
While these tools cannot check the site 100%, they do provide a perfect ‘first pass’ check and generate a comprehensive report to aid your testing.
The Web Accessibility Inspector will generate a lengthy report on the accessibility of your website pages, and provide you with a reference to help fix the problems.
The Colour Selector enables you to check your colour before you code them into your site, thereby preventing any contrast issues for those with colour blindness etc.