This page should only be read if you're serious about getting your site accessible to as many people as possible including valid html for better cross-browser compatibility and also wanting to abide to current laws with regards to disability. If you're not bothered about making a site work correctly then please leave now, you're only wasting your own time.
I think one of the most important things is give yourself plenty of time on the template page design. Here is a check list I go through before I call a page my template:
Do all images have alt tags
Do all tables have summary's (See disabled section)
Have I checked my page against all browsers I have to make sure it works
Does my site work in various screen resolutions
Are the hyperlinks going to the correct places
Have I checked spelling including the images which have to be done manually and also the alt tags
Does it comply with W3C and Bobby
So, with that in mind let's talk about the design..
Things to take into account before you even start:
a. What resolutions will you cater for.
b. What kind of navigation will you use (Hyperlink,flash,java etc).
c. What browsers can I check the site on to make sure it works on them.
d. Will the site be accessible to the disabled.
e. Validating your HTML
f . What age range will be coming to the site, will you need fancy/complex design or a simple one.
g . Total size of the page in kb
h . CSS or not?
i. Javascript's and other extras
So, lets look at these in detail...
a. What resolutions will you cater for?
The 2 most common are 1024x768 and 800x600 with 1024x768 normally the most common on web sites. You also need to bare in mind that some people do still use 640x480, wap phones, web tv etc etc. I suggest that the most basic design should cover at the very least 1024x768 and 800x600. The very best way is to use a fluid design. This means using percentages instead of fixed width. This way no matter what resolution they are in your site will stretch or shrink to suit them.
b. What kind of navigation will you use (Hyperlink,flash,java etc).
There are too many sites out there that use flash/java for buttons but no other way of navigating. I have java and flash off and XP doesn't come with java VM™ as default so more and more people won't be able to view it! Not only that since Service Pack Two in Windows applets have to be accepted before they can be seen. This is very bad news if you're using it for navigation! When I come across a site with only flash/java buttons I just hit the back button and google onto a competitors site. If you must use fancy navigation then make sure standard hyperlinks are in place somewhere on the page also so everyone can use your site.
A standard hyperlink will work on 100% of people's computers!
c. What browsers can I check the site on to make sure it works on them?
First thing to do is visit: http://browsers.evolt.org/ and download different browsers. You can't have more than one IE on your computer but you can have many Netscape's. For example on my machine I have: NS4.7, NS6.2, NS7.1, Opera7, IE6 and Mozilla. I also installed linux on my machine for their different versions of browsers but some might think I'm a little extreme ;-)
d. Will the site be accessible to the disabled?
You should bear this in mind as laws have passed in the UK and Australia with regards to disabled access. The following quote was taken from TheRegister.co.uk:
"A site which is not accessible could be considered to discriminate against disabled people and so could be illegal."
The current laws you should comply to at this time are as follows:
Section 508 (US)
Disability Discrimination Act 1995 (UK)
Special Educational Needs and Disability Act 2001 (UK)
Human Rights Act (UK and elsewhere)
In this age of "no win no fee" litigation test cases are already going to court. 5 million people have trouble viewing web sites in the UK alone.With a potential market of 1.6 million registered blind users as well
as a further 3.4 million with disabilities preventing them from using
the standard keyboard, screen and mouse set-up with ease, you can see the potential market you're missing by ignoring this group!
Check: http://bobby.watchfire.com/bobby/html/en/index.jsp
e. Validating your HTML (W3C Recommendations/Standards)
A lot of people design a site and then wonder why it looks different in other browsers. One of the answers is to check your HTML is valid. See the WaSP site (Web Standards Project) for more details about this. A major part of the code behind a web browser is the ability to recover from errors in markup. Writing valid markup will help ensure that your site will render properly on all browsers. You will need a DTD (Doctype) at the very top of your html. The DTD list can be found here. To check your site (Online or offline) visit the MarkUp Validation Service.
f. What age range will be coming to the site, will you need fancy/complex design or a simple one?
An important question. If your market is the young or net savvy then you can push the boat out to a certain extent. But if your site is aimed at the over 60's then a more easy to navigate site will be needed. By this I mean make sure you don't used a small, fixed font or very small buttons etc.
g. Total size of the page in kb?
You should have noticed that all these pages load instantly or close to it (The server may be a little slow etc). I always used to have a maximum limit on a page of 50kb and that was to include ALL images and text. Because ISDN and broadband are becoming more common I have raised my limit a little. I still don't go too high because people will not wait long for a page to load (Average is 10 seconds). I operate on the thinking that if they are on a slow connection or they are in another Country the pages will load slower for them so I try and include them into the load time which is why I use that size range. People may disagree but that's how I do it.
h. CSS or not?
CSS is a GREAT way of designing a site because if the client says "Can you change the text size" or "Can the color on all the backgrounds change to blue " then a couple of clicks and the whole site is done. HOWEVER! :-) older browsers do not support css well so you need to research what they can and can't view. I always use at least some CSS when designing a web site. It is up to you and you alone to decide when the move should be. Again if you view the source of this page you'll notice there is hardly any html coding to be found. CSS is fantastic at removing bloated code so please think about using more of it if you can.
i. Javascript and other extras
People using java VM™ for their site are in for big shock because XP comes without it (Due to a lawsuit from Sun) and a huge number of people are turning off java and javascript's. If you must use fancy code remember to make sure that people who don't have it can still access your site. The vast majority of sites out there don't which is great for me because people leave those sites straight away and come onto my clients sites :-)
Just remember do you like going onto sites with popup's, midi music you can't turn off, animated graphics, blinking text etc etc. My favorite motto is "Just because you can do it doesn't mean you should",
Also see my what to avoid section.