FFHS webmasters' seminar


Session 2: Coding and Accessibility

The promise
maximum accessibility
window widths
screen colours
images; download times
frames
tables
javascript
navigation
troubleshooting

The plan

Malcolm's pet hates; and yours?

Technical aspects of design

which browser
frames
tables
javascript
screen colours
images; download times
navigation

Essential(?) Utilties

statistics
window size control (yours!)
another web browser
broken links - search and destroy
validate your HTML
accessibility - the Big Issue

 

My pet hates
You must use .........
Internet Explorer
Internet Explorer 5.5
SuperDuperPlugin 99.9
800x600; 1024x768
javascript
scroll horizontally

Your pet hates are? ...

print, right missing

white on white

broken links

HTML email

Technical aspects of design

Browser dependence

(Readers') Computer dependence

Has it occurred to you that your pages might not look the same to others as they do to you?

Browser dependence

Who only has Internet Explorer?

Who has uninstalled Internet Explorer?

Who has two browsers?

Who has three browsers?

I have five on this laptop, I have six on my office PC.

Internet Explorer
Netscape Navigator
Opera
Lynx
Amaya
Mosaic

 

Tables

Still disliked by some, tables are generally now considered acceptable.

 

Frames

Much disliked but the problem is as much with the people using them as with frames themselves. They should be avoided unless you both need them and know how to use them.

 

JavaScript

Is NOT Java!

Not all browsers implement the same JavaScript.

Don't ever make navigation dependent on JavaScript.

The bottom line:
Search robots don't execute JavaScript.

 

(Readers') Computer dependence

Screen size

Screen colours

Downloading images

Screen size

This laptop has a 12inch 800x600 screen.

Who has a 17inch screen?

19 inch?

1024x768?

1600x1200?

 

Screen colours

Who has a monochrome monitor?

Who doesn't have (or doesn't use a monitor)?

 

Downloading images

Keep images small.

Use JPG for photographs and GIF for almost everything else.

A picture paints a thousand words
but downloads 20 thousand bytes
and doesn't get indexed by a search robot.

 

Navigation

This must not be dependent on:

Images

JavaScript

Very small areas of the screen.

 

Essential utilities

Server log analysis

Window size control

Another web browser

Broken link checking

HTML validation

Accessibility

Accessibility

Accessibility

 

Statistics - server log analysis

Your ISP may give you access to the real server logs, they may also provide you with a daily analysis of those logs. You can fetch the logs and do your own analysis.

Beware of DNS lookup requirements.

Analog is free and will produce statistics from most forms of server log.

http://www.analog.cx/

Window size

Can you easily flip your browser window to exactly 800x600 or 640x480?

No? What you need is Brian Apps's free sizer utility.

http://www.jugglesaver.co.uk/sizer.html

Browsing independently

The big boys find it hard to resist the temptation to define a few extra goodies of their own. Both Netscape and Internet Explorer are guilty of this. Sometimes they even implement the same extra goodies, but implement it differently!

Get a third opinion! Download the free Opera browser.

Opera is what I'm using today for this presentation. Be warned that the latest version is 5.02, the version I have seen on cover disks is only 5.01. (5.02 is now appearing on cover disks.) Install the full Java enabled version from the CD to save yourself a 9Mb download and then upgrade it to 5.02 with a shorter 2Mb download.

http://www.opera.com/

Link Checking

Do you have any broken links on your site?

No? Well done! ... but it won't last 8-(

Yes? Check out these:

  • Weekly report from the GENUKI search robot.
  • Occasional report from the GENUKI spider.
  • Run your own checks with the free Xenu utility.

http://home.snafu.de/tilman/xenulink.html

Validation

Does your HTML conform to the agreed standards?

No, not the one defined by TinyPrograms of the North West USA!

Browsers will have a go at displaying almost anything but you can't complain about the rendering unless your HTML complies with a standard. If you are using a good editor then it will probably ensure your HTML is valid when it saves the file.

The World Wide Web Consortium (W3C) provides a free validation service on its web site.

http://www.w3.org/ (front page)

http://validator.w3.org/ (online validator)

Accessibility

Failing to make your pages accessible may be a Civil Offence!

Accessibility covers many issues:
motor disorders
sight disorders
...

The bottom line:
If a blind surfer can hear it, then a search robot probably won't find it.

http://www.rnib.org.uk/ (front page)

http://www.rnib.org.uk/digital/ (web design campaign)

http://www.vischeck.com/ (check your pages under colour blind vision)

Accessibility checking

Bobby is the current favourite. It will report on your web pages using a three level accessibility scale. Failing to reach level one may become a Civil Offence!

You can use Bobby online or you can install a downloadable version to check your pages off-line before they are uploaded.

PS: If you install Opera with Java support, you can download Bobby without Java and use the copy you already have.

http://www.cast.org/bobby/

Accessibility - Auntie Betsie

Betsie was developed by Auntie Beeb. It delivers a web page to your normal browser after stripping it of all the fancy HTML stuff.

It also allows the surfer to select from a choice of high contrast colour schemes and font sizes.

Not really )yet?) good for real world delivery but very useful for quickly reducing a web page to its bare essentials.

http://www.bbc.co.uk/education/betsie/

I have a private copy of Betsie running which will allow you to run it on certain UK family history web sites. You can see from the links below how to join the web site address onto Betsie's address.

http://wwwsearch.ox.ac.uk/cgi-bin/betsie/www.genuki.org.uk

http://wwwsearch.ox.ac.uk/cgi-bin/betsie/www.genuki.org.uk/big/

http://wwwsearch.ox.ac.uk/cgi-bin/betsie/www.genuki.org.uk/big/Societies.html

http://wwwsearch.ox.ac.uk/cgi-bin/betsie/www.genuki.org.uk/Societies/

http://wwwsearch.ox.ac.uk/cgi-bin/betsie/www.genuki.org.uk/Societies/England.html

http://wwwsearch.ox.ac.uk/cgi-bin/betsie/www.genuki.org.uk/Societies/Wales.html

http://wwwsearch.ox.ac.uk/cgi-bin/betsie/www.ofhs.org.uk/

Accessibility - yet another web browser?

Lynx is free. Lynx is a plain text browser, it surfs the web entirely free of graphics.

Not especially useful you may think but many serious web users swear by it

On the other hand it does give you a good idea of what your pages are like when reduced to plain text.

http://lynx.browser.org/

© 2001 Federation of Family History Societies
malcolm.austen@oucs.ox.ac.uk