WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: breadcrumb navigation

for

Number of posts in this thread: 26 (In chronological order)

From: Glenda
Date: Fri, Nov 26 2004 12:53AM
Subject: breadcrumb navigation
No previous message | Next message →

I am finally working on a badly needed facelift for my own site, and I'm
wondering at what point do breadcrumbs actually become useful. At this
point my site is only two or three pages deep, and the breadcrumbs seem
redundant of the navigation bar.

It is the same with my husband's new site -- www.enablingabilities.com --
which is a similar design. It isn't until
http://www.enablingabilities.com/article1.html that you get three pages
deep, which maybe is when breadcrumbs become useful. But if you use
breadcrumbs at all, should they be used on EVERY page??

And, while I'm here, can anyone tell me how to get the vertical line on
http://www.enablingabilities.com/sitemap.html to go all the way down?? I'm
good at evaluating accessibility, not at building them!

Thanks,
Glenda
---
Outgoing mail is certified Virus Free.
Checked by AVG anti-virus system (http://www.grisoft.com).
Version: 6.0.799 / Virus Database: 543 - Release Date: 11/19/04

From: Patrick H. Lauke
Date: Fri, Nov 26 2004 1:17AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

glenda wrote:

> It is the same with my husband's new site -- www.enablingabilities.com --
> which is a similar design. It isn't until
> http://www.enablingabilities.com/article1.html that you get three pages
> deep, which maybe is when breadcrumbs become useful. But if you use
> breadcrumbs at all, should they be used on EVERY page??

My gut feeling would be that if you use them, you should use them on
every page consistently. 2-3 levels down looks like borderline,
though...I'd probably only implement them myself if it were 4 or more
levels.

Patrick H. Lauke
--
_____________________________________________________
re

From: Tim Beadle
Date: Fri, Nov 26 2004 3:09AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

"glenda" wrote on 26/11/2004 07:57:40:
> And, while I'm here, can anyone tell me how to get the vertical line on
> http://www.enablingabilities.com/sitemap.html to go all the way down??
I'm
> good at evaluating accessibility, not at building them!

Use a tiled background image on the body or container div, a la Dan
Cederholm's Faux Columns:
http://www.alistapart.com/articles/fauxcolumns/

HTH,

Tim



Institute of Physics
Registered charity No. 293851
76 Portland Place, London, W1B 1NT, England

IOP Publishing Limited
Registered in England under Registration No 467514.
Registered Office: Dirac House, Temple Back, Bristol BS1 6BE England

This e-mail message has been checked for the presence of computer viruses.

From: Web Aim
Date: Fri, Nov 26 2004 4:24AM
Subject: Re: Breadcrumb Navigation
← Previous message | Next message →

I don't think you have enough related pages to use this type of navigation.
The line down the page problem:

The page doesn't look too bad as it is so just leave it.
Otherwise the easiest solution is to put more content into the centre panel
(div called "maincontent"
You could add more text or a longish graphic, perhaps an appropriate
picture. I think you could even hide these.
The situation is
This section of the page is as long as its longest panel. You use three
panels.
On the page you have a left hand panel (the form) with a border down the
right hand side. Next to this is the centre panel (maincontent) with a
border down the left hand side.
These borders coincide to create a single vertical line down the page.
But the line you see is only as long as the longest border between the two
panels.
On most pages the centre panel is the longest because it contains a lot of
text etc.
Hence the vertical line extends to the bottom.
On the Site Map page the line is only as long as the left panel. This leaves
a gap because the right panel now being the longest determines the length
of the page.
So if you put more content into the centre panel the line will go to the
bottom of the page.
Best just leave it!
Joe Bosher.

From: michael.brockington
Date: Fri, Nov 26 2004 5:07AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

>

From: Tim Beadle
Date: Fri, Nov 26 2004 5:41AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

"michael.brockington" wrote on
26/11/2004 12:06:46:
> No, no, no - you don't need to use images for structure!

I wasn't suggesting that at all! If you actually read the article I linked
to, you'll see that the image is in the CSS, and therefore quite separate
from the structure of the page.

> All you need to do is next your divs in such a way that the div with the
> border contains the largest element, then it will automatically size to
your
> content.

Heh - that's easier said than done. You might have pages of varying
lengths, possibly with content coming from a database or other data
source. You can rarely guarantee that one column will always be longer
than the other.

Tim



Institute of Physics
Registered charity No. 293851
76 Portland Place, London, W1B 1NT, England

IOP Publishing Limited
Registered in England under Registration No 467514.
Registered Office: Dirac House, Temple Back, Bristol BS1 6BE England

This e-mail message has been checked for the presence of computer viruses.

From: michael.brockington
Date: Fri, Nov 26 2004 6:19AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

>

From: Tim Beadle
Date: Fri, Nov 26 2004 6:58AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

"michael.brockington" wrote on
26/11/2004 13:19:01:
> It doesn't look like you read the article yourself - the images are
being
> used to instead of the natural element borders, thus replacing a
structural
> element, ie the border.

Huh? "Natural element borders"? Whether the visual effect is a "real" CSS
border, or an image, is irrelevant! Both are stylistic elements and are
therefore completely seperate from the *structure* of the document!

> In that example this was probably justifiable to
> create the required effect, but here what the author wants is a border -
> replacing a border with an image is wrong. Wrong! Always!

In your opinion. But if we want a web that is structurally and
semantically sound under the hood (markup) but visually attractive on top
(CSS), then we need techniques like this.

Tim



Institute of Physics
Registered charity No. 293851
76 Portland Place, London, W1B 1NT, England

IOP Publishing Limited
Registered in England under Registration No 467514.
Registered Office: Dirac House, Temple Back, Bristol BS1 6BE England

This e-mail message has been checked for the presence of computer viruses.

From: michael.brockington
Date: Fri, Nov 26 2004 7:37AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

>

From: Patrick Lauke
Date: Fri, Nov 26 2004 10:02AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

Aeh...at the risk of splitting hairs:

> From: michael.brockington
> the
> images are being
> used to instead of the natural element borders, thus
> replacing a structural
> element, ie the border.

Is the border a structural element, or is it the *visual*
representation that delimits two separate structural elements
which, in and of themselves, are clearly separated in the markup?
I fail to see how a border on its own can be said to be structural...

> replacing a border with an image is wrong. Wrong! Always!

Don't sit on the fence, like...we haven't had any absolute edicts
in quite a while...

Patrick
________________________________
Patrick H. Lauke
Webmaster / University of Salford
http://www.salford.ac.uk

From: Stephanie Sullivan
Date: Fri, Nov 26 2004 10:39AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

On 11/26/04 11:59 AM, "p.h.lauke" simply typed the following:

> Is the border a structural element, or is it the *visual*
> representation that delimits two separate structural elements
> which, in and of themselves, are clearly separated in the markup?
> I fail to see how a border on its own can be said to be structural...

I'm in agreement with you... A border is no more structural than a
background color is... It's decorative and whether it's created with an
actual border or a faux method, I don't think it's any big deal... As long
as it's implemented in the CSS.

I've had to come up with some VERY creative implementations at times...
Especially in sites with dynamic content where you can't be at all sure of
what kind of content will be in each area.

Stephanie Sullivan
Community MX Partner :: http://www.communitymx.com/author.cfm?cid=1008
Team Macromedia for Dreamweaver :: http://tinyurl.com/6huw3
Co-Author .: "Macromedia Dreamweaver MX 2004 Magic" :. New Riders

From: michael.brockington
Date: Mon, Nov 29 2004 3:48AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

>

From: Tim Beadle
Date: Mon, Nov 29 2004 4:06AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

"michael.brockington" wrote on
29/11/2004 10:47:55:
> If it wasn't structural we wouldn't be doing it.
> Read any treatise on page design (for print) and you can't fail to
notice
> that it is accepted that whitespace, and more obviously black space, is
as
> important to the readability of a page as the layout of the text.
> Are you possibly confusing the code structure with the visual structure
of
> the page? Perhaps I should have talked about layout, but then that is
not the
> correct term. One of the reasons that people often fail to go back to
the
> print design manuals is that Web designers insist on re-using print
terms in
> a different way, as with font != face.

So if it's page structure we're talking about, then it makes *absolutely
no odds* whether that structure is delimited with "real" borders or
background images!

> Ignoring things until they turn into a problem is not very clever -
better to
> get the standards worked out in advance.

I'm not talking about "ignoring things"; I'm talking about doing things in
a pragmatic way that works *now*, with one eye on the future when
technology changes. What's non-standard about a semantic XHTML document
with CSS for styling?

> The reason that they do this is because the few people who use this
feature
> typically mis-use it, in ways like this.

It's the handheld/OS manufacturers that are to blame, IMO.

> > Content will probably need to be refactored for small-screen devices
> > anyway, so I think it's a moot point.
> Not if you stick to the standards, and avoid over-complicating things
with
> inappropriate gimmicks.

What? If you have a long article that works OK in a desktop context, it
will likely need to be chunked up for handhelds; navigation & advertising
will need to be simplified etc etc. Rarely will one document serve all,
unfortunately.

> > Anyway, you can do clever things with resolution dependent layout:
> > http://themaninblue.com/writing/perspective/2004/09/2>; 1/
> >
> I don't really think that this simplifies things in the long run, do
you?

So what? I've got to solve web design problems in the *here and now* as
well as planning for the future! You're probably one of those purists who
won't serve up XHTML unless it's sent as application/xhtml+xml as well!

We're working towards a more standards-compliant future, but you can't get
there in a day.

Tim



Institute of Physics
Registered charity No. 293851
76 Portland Place, London, W1B 1NT, England

IOP Publishing Limited
Registered in England under Registration No 467514.
Registered Office: Dirac House, Temple Back, Bristol BS1 6BE England

This e-mail message has been checked for the presence of computer viruses.

From: michael.brockington
Date: Mon, Nov 29 2004 4:20AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

>

From: Tim Beadle
Date: Mon, Nov 29 2004 4:57AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

"michael.brockington" wrote on
29/11/2004 11:20:05:
> I give up - I've never used XHTML at all, since I live in a more real
world
> than some people appear to.

Then I apologise - it was an unwarranted, unfair comment.

What bothers me, then, is the fact that if you live in a "more real
world", how you can't see the merit in these techniques?

Regards,

Tim



Institute of Physics
Registered charity No. 293851
76 Portland Place, London, W1B 1NT, England

IOP Publishing Limited
Registered in England under Registration No 467514.
Registered Office: Dirac House, Temple Back, Bristol BS1 6BE England

This e-mail message has been checked for the presence of computer viruses.

From: michael.brockington
Date: Mon, Nov 29 2004 6:13AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

>

From: Patrick Lauke
Date: Mon, Nov 29 2004 6:36AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

> From: michael.brockington

> If it wasn't structural we wouldn't be doing it.
> Read any treatise on page design (for print) and you can't
> fail to notice
> that it is accepted that whitespace, and more obviously black
> space, is as
> important to the readability of a page as the layout of the text.

In print, the layout *is* the structure, as it's a purely visual medium.
In HTML we do distinguish between the markup structure and the visual
presentation.

> Are you possibly confusing the code structure with the visual
> structure of
> the page?

I think it's your use of the term "structure" that is confusing, as in
web design terms, structural and semantic are usually used to refer to
the markup, and not the presentation layer (which is merely a visual
representation of the markup structure).

But anyway...

Patrick
________________________________
Patrick H. Lauke
Webmaster / University of Salford
http://www.salford.ac.uk

From: michael.brockington
Date: Mon, Nov 29 2004 7:29AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

>

From: Patrick Lauke
Date: Mon, Nov 29 2004 8:21AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

> From: michael.brockington

> In the context of this discussion HTML is a purley visual medium.
> Electronic text markup (for print-processing) I believe to be
> much older than
> HTML, and it in turn evolved from freehand anotations, so
> even if I only
> minimal intelligence I have to assume that you are being
> deliberatly evasive
> here.

Aeh...please point out where exactly I'm being evasive.

> No, you've got that the wrong way around: the code is merely
> a standardised
> representation of the visual xxx (pick your own word if you must.

Actually, I beg to differ. The code defines the logical relationship
and hierarchies of the content. It does not necessarily have anything
to do with the visual. Sure, the W3C wrongly appropriated terminology
that was deeply rooted in print design (heading, paragraph, etc), when
what they probably should have done is to come up with medium-neutral
element names (title, section, etc), because that's how they're intended.

> I think
> we are all agreed that the physical divisions of HTML code
> should match the
> logical divisions?

Yes.

> That being so, the structure of the HTML should match the
> structure of the
> page, regardless of CSS etc.

And yes again.

Heck, I had to go back to re-read the thread to actually
work out where this whole discussion of principles started, and to summarise:

- Tim suggests using a faux-column background image to achieve the
desired visual styling and appearance.
- Michael suggests that said technique replaces natural element borders,
"structural elements", with images and should not be used, as it does not
scale well on small screen devices (since it uses fixed width background)
- I jump in to point out that borders are not structural elements per se, but
visual manifestations, if you will, of structural elements
- a whole metaphysical discussion about what is structure, content, visual
presentation etc ensues.

To be honest, I agree with the sentiment behind the original suggestion not
to use visual tricks such as faux columns in most cases. As we seem to be
looking at content from a fundamentally different angle, we could probably
carry on with this discussion of semantics. I'm quite happy to agree to disagree
on this though.

Patrick
________________________________
Patrick H. Lauke
Webmaster / University of Salford
http://www.salford.ac.uk

From: Austin, Darrel
Date: Mon, Nov 29 2004 8:24AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

> I am finally working on a badly needed facelift for my own site, and
> I'm wondering at what point do breadcrumbs actually become useful.

From what I've read, general populace rarely uses them when observed in user
testing scenearios. Of course, I don't have any links to said reading, so I
suppose that comment doesn't carry much weight.

I think anyone deeply involved with web development finds them quite useful,
but, even though I also implement them on larger sites, I'm really not sure
if it is a primary navigation tool for most folks.

-Darrel

From: julian.rickards
Date: Mon, Nov 29 2004 8:33AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

I find them useful at times. For example, I may be directed to a specific
tutorial that answers a question I have. If I see breadcrumbs, I may click
the tutorials breadcrumb link to see what other tutorials are available from
the site.

From: Glenda
Date: Mon, Nov 29 2004 9:39AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

Thanks. I think I'll comment them out, for now. Just seems like too much
navigation all in one area.

I am amazed at how my question on the vertical line sparked such a debate.
Frankly I didn't care whether it was structural or presentation. I just
wanted to know how to bring the dang thing all the way down. I now know to
look up "variable length columns". I wasn't that 'intelligent' before.
That is why I asked the question in the first place!

Have a great day.

Cheers,
Glenda

From: michael.brockington
Date: Mon, Nov 29 2004 10:11AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →






RE: [WebAIM] breadcrumb navigation




>

From: Patrick Lauke
Date: Mon, Nov 29 2004 10:32AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

> From: michael.brockington

> The visual (and aural occasionaly) representation is the most important
> thing. Perhaps the CSS mantra of seperating Display from Content has gone
> too far - after all one of the WCAG guidelines is to ensure that the document
> remains usable with all 'features' (scripting, images and even CSS) turned
> off. Remove all of the s and s and a document becomes little more
> than a bunch of bytes.

Whoever said that separation of content and presentation means removing s
and s? What I'm saying is that *content* is the most important thing, and
that content is a more abstract concept than merely visual structure. E.g. when
you talk about the content of a novel or story, you're not talking about the visual
representation (layout or whatever terminology we should settle on) of the book
itself, but you're talking about the medium-agnostic, abstract concept of the
story itself...

> but you seem to be putting the cart before
> the horse, although my point was that many people seem to be doing that these
> days

Almost reads like "you seem to be wrong, but don't worry, many people are".

But anyway, as I said before, I don't think you're getting this, to me, rather
fundamental difference between content and its manifestations (be it printed page,
visual display in a web browser, etc)...

Patrick
________________________________
Patrick H. Lauke
Webmaster / University of Salford
http://www.salford.ac.uk

From: Austin, Darrel
Date: Mon, Nov 29 2004 10:39AM
Subject: Re: breadcrumb navigation
← Previous message | Next message →

> The visual (and aural occasionaly) representation is the most
> important thing.

Well, accessing content is most important. ;o)

> Perhaps the CSS mantra of seperating Display from
> Content has gone too far - after all one of the WCAG guidelines is to
> ensure that the document remains usable with all 'features'
> (scripting, images and even CSS) turned off. Remove all of the s
> and s and a document becomes little more than a bunch of bytes.

No one is suggesting such a thing. HTML should be used to format the logical
structure (semantics) of the content. Not the visual layout of the page. By
default, the browser *will* render the content visually based on the
semantic markup.

A tag is absolutely semantic. A can go either way.

That's not that you can't use HTML as a visual markup tool, but sticking to
the separation of content and presentation as best as you can is only a plus
for accessibility.

-Darrel

From: Tim Beadle
Date: Tue, Nov 30 2004 3:08AM
Subject: Re: breadcrumb navigation
← Previous message | No next message

OK here's (I hope) my last word. Then we can move on.

"michael.brockington" wrote on
29/11/2004 16:51:07:
> Since we have ended up agreeing that the original suggestion of
image-based
> technique was not the best one in this instance, I shall make this my
last
> word on the subject...

No, *you* ended up stating that the image-based teqchique was *evil, evil,
evil* and should *never* be used :)

The only thing we agreed on was that "structure is important". I'm not
sure we agreed what "structure" actually meant, though.

> The visual (and aural occasionaly) representation is the most important
> thing. Perhaps the CSS mantra of seperating Display from Content has
gone
> too far - after all one of the WCAG guidelines is to ensure that the
document
> remains usable with all 'features' (scripting, images and even CSS)
turned
> off. Remove all of the s and s and a document becomes little
more
> than a bunch of bytes.

Patrick already addressed this, but who said anything about removing s
and s? The CSS styling hooks into the logical structure of the
underlying document; whether you style a border with the css border:
directive or use the background: directive to add a vertical rule makes no
difference to the underlying document structure. Believe me, Dan Cederholm
(the author of the Faux Columns article) is a standards-based developer
who's written a book (Web Standards Solutions: The Markup and Style
Handbook) that addresses usability, accessibility and semantic concerns.

Take a look at Dan's SimpleQuiz series, which inspired the book:
http://www.simplebits.com/notebook/simplequiz/

> Perhaps that's not what you meant, but you seem to be putting the cart
before
> the horse, although my point was that many people seem to be doing that
these
> days, so don't take any of this personally. (After all we know very
little
> about each other really...)

This is true: we don't know eachother, but you really don't seem to have
grasped the basic concept that I was proposing, and that of a
standards-based, *attractive* design solution. There are too many
one-pixel dashed-border CSS-based sites. Let's push the boundaries a bit,
while still degrading gracefully to well-structured documents for older,
less capable user agents and assistive tech.

Regards,

Tim



Institute of Physics
Registered charity No. 293851
76 Portland Place, London, W1B 1NT, England

IOP Publishing Limited
Registered in England under Registration No 467514.
Registered Office: Dirac House, Temple Back, Bristol BS1 6BE England

This e-mail message has been checked for the presence of computer viruses.