Help needed with how to proceed

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View

I got a bit of a problem I like some help on.

I'm designing an online training module for people that work in food
processing plants. This is my target audience. These workers have little
or no computer knowledge at all! And they also have outdated, old
browsers, slow modems, old computers, etc. So I need to keep this as
simple as possible and as browser compatible as possible.

The client wants a navigation bar at the bottom of each page with a NEXT
and BACK button and he wants it fixed. So if the content ran long, you
could scroll without the navigation bar moving. He wants the navigation
to stay put as the content scrolls.

My first thought was using the dreaded frameset. The navigation would be
in it's own frame at the bottom and the content would be above it in
it's own frame. That way the content could scroll and the navigation
would stay.

I soon realized that this wouldn't work. All of these modules in this
training are more than one page long, so how could I set the NEXT button
to link to many different, consecutive pages when I can only assign one
link to that NEXT button?

So then I thought I could get rid of the frames idea and use DIVS with
absolute positioning. After looking into this, you'd need a very recent
browser for absolute positioning to display correctly. Getting these
users to learn how to update their browsers would be a huge task.

My question is, this seems like it should work somehow in older
browsers. But I can't figure it out.

I do know of a way but it involves a frameset, plus two more html pages
(content and navigation) for each page of each module. So for each page
of a module I'd need 3 html pages. I really don't want to go there. Sure
the user wouldnt know the difference but I'd like to find a better

Doing it in flash? We're trying to stay away from that right now.

Here is a graphic of what the pages will look like.

This is just a graphic, rough draft, it doesn't link anywhere.

In theory, when you click on the green next button on page one, you are
taken to page two. From page two when you click on the NEXT button you'd
go to page three, and so on. But if the navigation is only one html page
nested in a frame, I can't assign multiple links like that to the NEXT

I just hope I'm missing something so glaringly easy.

Thanks for any advice.

Re: Help needed with how to proceed

Steve K wrote:
Quoted text here. Click to load it

It's fairly easy server side to display short pages of information with
a script. You can either set the script to display blocks
of line numbers or you can embed template markers in the information
or you can store the information in small pieces in a data base.

Your graphic looks as if you may be considering writing your own
scroll bars.  Try to avoid that -- it causes all sorts of accessibility
and usability problems.  If you have a server side program display
the info in short blocks you won't need scroll bars anyway.

For the kinds of buttons you're using I like "previous - next"
instead of "back - next".  It is at least possible that someone
might confuse the button's use with the actual back button on
their browser.
mbstevens /

Re: Help needed with how to proceed

Steve K wrote :
Quoted text here. Click to load it

How can you be *so sure* that they have *no computer knowledge at all*,
that they have outdated browsers, slow modems, old computers? I'm just
asking you what makes you *so sure* about all this? It seems to me that
you maybe generalizing too much or too far.

Even if their computer ease is not so good, even many of them get help
from friends, children, etc.. I'd say you'd be surprised at how many
chat on the internet, get their emails, play with friends, etc.

Quoted text here. Click to load it

You only need to design webpage which will degrade as best as possible
in non-capable browsers: that is a) access to content and b) navigation
functionality. And here, that would mean that the navigation bar's
position would be secondary.

Quoted text here. Click to load it

This is the first thing that should be relativized. The client is most
likely not a web designer himself. The position (fixed and at bottom) of
the navigation bar shouldn't be a decisive issue or a crucial issue in a
simple 2 part webpage.

Ask your client why all module pages would need to have the Next and
Back buttons fixed at the bottom? You should be the one with more
knowledge and understanding of user interface and usability of web page
design, not him.

Realistically speaking, you have presented an overall picture which
can't possibly be satisfying or satisfied all the time, everywhere for
everyone. So someone (client, users, webpage design, browsers used,
etc...) or something will have to be adjusted, or upgraded or modified.
If you investigate more, you may later realize that the client's wish
was only a request, that the users' systems are not that outdated, that
the users are closer to the avg. users in terms of computer/software
usage, that many of them use IE6, Firefox 1.x, etc.., that maybe you may
have underestimated the users computer/software capabilities, etc.

I would offer your client to implement Previous, Next, Start and Home
links (or arrow buttons with title attributes for the links) at the top
of each page *and* at the bottom of the page: that way
- frameset and frame design would not be needed
- page design would remain simple, easy to manage, to update
- page would interoperable in many web-aware applications (like text
browsers, even speech browsers, mobile phones, PDAs, etc.)
- page would work in non-capable frame browsers, in non-CSS browsers, in
browsers with javascript support disabled or inexistent, etc.
- page could be maintained/updated by your client since the page
structure would be simple
- if needed, a table of contents link for all the pages of the module
would be added to the bottom of each page


Quoted text here. Click to load it

Well, you can't have everything. A webpage design of this sort (with
content frame or pane being scrollable), meeting all listed
requirements, with all the given context of users would be impossible to
do in text browsers.

Quoted text here. Click to load it

I'd go for a frameset and then implement Previous, Next, Start and Home
links... or something like (with maybe a link to a list of modules) that
which would meet the website requirements.

If the users were all using a web browser with Site navigation toolbar
functionality (like Seamonkey 1.x, Mozilla Suite, Firefox 1.x with the
link bar extension, Icab 2+, Opera 7+, etc.), then you would be able to
avoid frameset design.

Quoted text here. Click to load it

Again, this assumption on updating their browser may be a false
exaggeration; this seems to me to be exaggerated. How huge and difficult
can such task be? It seems to me that you may be generalizing here.

Quoted text here. Click to load it

I understand the problem you refer to.

Quoted text here. Click to load it

I don't see any other alternative, except maybe talk to your client to
see if the content could not be restructured in smaller pages (that
would easily involve lots of work though) so that content + navigation
could fit easily on a maximized browser window on a 15 inch monitor
screen. Then, you would be able to do like a slide presentation and to
do this without frameset.

Quoted text here. Click to load it

On each page, the bottom navigation frame links would be have to be
coded individually and accordingly to point to the correct previous or
next webpage.

OTOH, if the browsers used to view these modules are HTML 2 compliant
and support <link> and link relationship, then you would be able to code
the Site Navigation toolbar (or equivalent) with
<link href="[path]/filename.html" rel="next" title="Page 5">

remove blah to email me

Site Timeline