The Web Designer's Toolbox
Colour Programs
One of the thorniest issues you'll run into as a web designer is
colour. Because web colours are all expressed in the somewhat
mysterious HTML colour (#000000 to #FFFFFF), it can be hard to
get the exact colours you want in your design. Don't be fooled
into thinking there aren't many to choose from: those colours
are in hexadecimal, meaning that each one of those six numbers
can have a value anywhere from 0-F (that is, 0-9, A-F). 16
possible values to the power of 6 makes over 16 million possible
colours - that's 24-bit colour, not bad at all.
So, really, instead of trying out millions of colours by hand to
see which you like best, it's much better to download an HTML
colour picker tool - an essential part of every web designers
toolbox. It might sound like they'd be very simple, but there
are all sorts of features they can have: suggesting
'complementary colours' to the one you've chosen, for example.
Some let you take a picture of your screen and click on parts of
it to see which HTML colour is being used - useful when you see
a colour somewhere that you think would work great on your
website.
My personal favourite colour program is Color Schemer, available
at www.colorschemer.com - it has all the features you could
really want in an HTML colour picker. If you're after something
free, though, you might like to try the more compact Pixie, from
www.nattyware.com/pixie.html, which sits in the corner of your
screen and tells you the colour code of any colour you hover
over.
HTML Checkers
There's not much competition when it comes to HTML checking:
what you really need is the W3C's HTML Tidy, or one of the many
programs based on it (see http://tidy.sourceforge.net/). Tidy
can clean up truly disastrous HTML, including the kind of thing
produced by many of the more popular editor programs like
Dreamweaver, and applications like Microsoft Word. Even if you
think your code is great, the chances are that Tidy will be able
to make it smaller and better.
Mozilla Firefox Extensions
When you use Firefox as your web browser, you gain access to
lots of extensions that you can install quickly and easily.
Since so many people using the browser are web designers, there
are more extensions available for web development tasks than
there are for anything else. This makes Firefox an ideal browser
to use when you're writing a website.
Which extensions are most useful? Here's a quick list:
Web Developer's Toolbar
(http://chrispederick.com/work/firefox/webdeveloper/). This is
the most useful Firefox extension out there for web designers.
Its best feature is that it lets you experiment with CSS styles
'live', so the style of your page changes as you do it - a great
way to write CSS.
LinkChecker
(http://www.kevinfreitas.net/extensions/linkchecker/). You
absolutely must check your website for broken links, but it's
usually quite a chore. Because LinkChecker integrates with the
browser, it can check your links for you on-the-fly. It
highlights working links in green and broken ones in red.
Simple, but very effective.
HTML Validator (http://users.skynet.be/mgueury/mozilla/). Lets
you check whether your pages are valid HTML without having to
type all their URLs into an online validity checker. Takes a lot
of the pain out of code validation, which makes you more likely
to actually bother to do it!
SearchStatus (http://quirk.co.za/searchstatus/). When you're
trying to monitor your site's position in search engines, this
extension is indispensible. It shows you the Google PageRank and
Alexa ranking for your site, giving you an idea of both the link
popularity and traffic the site gets. It also lets you check who
links to your site, and whether the search engines have added it
to their index yet.
About the author:
Information supplied and written by Lee Asher of Eclipse Domain
Services
Domain Names, Hosting, Traffic and Email Solutions.