ZEN The Road to Enlightenment... or NOT?

minutedesigns · Jan 8th, 2008, 10:51

ZEN The Road to Enlightenment... or NOT?

http://www.csszengarden.com/

At the bottom of their page there is a small list of "Validations"

One of which got me concerned, call me pedantic and a man of Accessibility and Guidelines however on a website that's rather highly commended for the accomplishments of making CSS a very viable and professional way of creating a really good looking website has an annoying edge of promoting itself as a WAI - AAA Website, when it clearly is far from.

"There is clearly a need for CSS to be taken seriously by graphic artists"

Can they not take the rest of the web world serious also?

It actually fails Priority 3 for these issues:

9.4 Create a logical tab order through links, form controls, and objects.

Rule: 9.4.1 - All Anchor, AREA, BUTTON, INPUT, OBJECT, SELECT and TEXTAREA elements are required to use the 'tabindex' attribute.
- Warning - One or more Anchor, AREA, BUTTON, INPUT, OBJECT, SELECT and TEXTAREA elements do not use the 'tabindex' attribute

9.5 Provide keyboard shortcuts to important links (including those in client-side image maps), form controls, and groups of form controls.

Rule: 9.5.1 - All Anchor, AREA, BUTTON, INPUT, LABEL, LEGEND, and TEXTAREA elements are required to use the 'accesskey' attribute.
- Warning - One or more Anchor, AREA, BUTTON, INPUT, LABEL, LEGEND, and TEXTAREA elements do not use the 'accesskey' attribute.

10.5 Until user agents (including assistive technologies) render adjacent links distinctly, include non-link, printable characters (surrounded by spaces) between adjacent links.

Rule: 10.5.1 - All Anchor elements not surrounding images cannot be directly adjacent.
- Failure - Anchor Element found at Line: 87, Column: 4 is directly adjacent to the Anchor element that precedes it.
- Failure - Anchor Element found at Line: 88, Column: 4 is directly adjacent to the Anchor element that precedes it.
- Failure - Anchor Element found at Line: 89, Column: 4 is directly adjacent to the Anchor element that precedes it.
- Failure - Anchor Element found at Line: 90, Column: 4 is directly adjacent to the Anchor element that precedes it.

A website at the forefront of promoting real techniques for web design should surely conform themselves?

Thoughts?

It wouldn't surprise me to find if Dave Shea changes his source, and I have already been in plenty of previous contacts with him.. and as Brilliant at some things he is, completely ignorant to others his seems to be!

So this one is for you Dave Shea! As requested!

MikeHopley · Jan 8th, 2008, 11:13

Just because a site fails an automated accessibility checker does not mean that it fails to comply with WCAG AAA.

I happen to think that claiming conformance for WCAG is pointless, because:

There is no recognised test or awarding body
At least one WCAG guideline harms accessibility

I've never been a fan of validation badges, but I dislike WCAG AAA badges more than the rest. At least valid HTML can be checked.

Of the three "failures" listed, only the last one deserves to be fixed. Ironically, this error is coming from his line of validation links. Ho, ho, ho.

These links should be placed in a <ul> (which solves the problem, and makes the markup more meaningful).

minutedesigns · Jan 8th, 2008, 11:53

Would you not agree though mike, it's rather distasteful on a website like this to display such compliance when it actually doesn't conform? Especially when its classed as a "Reputable" name, where people visit to be, inspired..

I could see you initial and everyone else's argument, "This doesn't mean people will be popping up WAI-AAA signs all over their website" However I'd say it might give them cause to display something that's "Halfway there" perhaps?

Rakuli · Jan 8th, 2008, 13:11

Quote:

Originally Posted by zengarden

The only real requirement we have is that your CSS validates.

The aim of csszengarden is to display graceful use of CSS cascading style sheets for design puposes -- as opposed to a completely accessible sites.

Quote:

Originally Posted by ZenGarden FAQ's

Is the css Zen Garden AAA-compliant?
Quick summary: probably not. The 'aaa' link on the main Zen Garden page used to point to an automated test which checked the Zen Garden's markup for AAA compliance. Since the original checker is no longer available, a new and more comprehensive one has been found, but this comes with a caveat: the markup now fails the test in one area, where a series of links is separated by   character entities. Had these links been contained within a <ul>, it's likely the markup would still pass the test.

But even if the markup passes, AAA compliance is not necessarily achieved. The WCAG 1.0 guidelines contain multiple checkpoints which can not be tested automatically; they require a judgment call made by a human, not software. Many designs use techniques (FIR, fonts sized with the px unit) which are now deemed inaccessible, so the CSS of any particular design is as relevant as the markup when it comes to accessibility. In some cases and with certain designs, the Zen Garden may come close to achieving AAA compliance. But we can't in good conscience say that the Zen Garden is an AAA-compliant site, since we now need such a long disclaimer.

They themselves acknowledge they don't validate fully...

minutedesigns · Jan 8th, 2008, 13:24

Quote:

Originally Posted by Rakuli

The aim of csszengarden is to display graceful use of CSS cascading style sheets for design puposes -- as opposed to a completely accessible sites.

They themselves acknowledge they don't validate fully...

/bangsheadagainstbrickwall

Didn't read that, that further pushes my distaste for this person... Put a link to show WAI-AAA and then say in your FAQ "It probably isn't"

SO WHY POST IT AT ALL, OR AT LEAST POST IT ELSEWHERE FOOLISH PERSON!

This is the sort of mind play trickery to make people believe something is when it isn't, just because its there, in the footer!

<quote>heckpoints which can not be tested automatically; they require a judgment call made by a human, not software</quote>

Online checks do pickup on the "TABINDEX" and the "ACCESSKEYS" actually..

And those anchor elements must have always have been there in the first place if he's only changed the link to where the AAA goes.

It's a seriously lame excuse along with the ones in his email.

To believe this guy has also released a book on web design too... its truly funny!

karinne · Jan 8th, 2008, 13:28

Oh please

minutedesigns · Jan 8th, 2008, 13:30

Oh cmon Karinne you got to agree!

Only someone seriously distasteful would put a AAA link on their website to a page that says "oh I doubt we are but nevermind"

karinne · Jan 8th, 2008, 13:34

You know that Dave Shea is basically in the same league as guys like Dan Cederholm, Jeffrey Zeldman and Jeff Croft right?

To base the integrity of a person like this on his validation quirks is ... well ... stupid.

You know nothing of this man, this really great man so don't be judging him so quickly on something so stupid.

Rakuli · Jan 8th, 2008, 13:41

Quote:

Didn't read that, that further pushes my distaste for this person... Put a link to show WAI-AAA and then say in your FAQ "It probably isn't"

The link on their page actually points directly at their FAQ's...

I'm not entirely sure your attack on CSSzengarden is truly warranted. The site is focussed on design -- not accessibility. The idea of all the designs is to showcase what can be done with valid CSS. There is no requirement for CSS to be accessible.

Accessibility in a site means that it can be accessed by screen readers and text-only browsers.. At the end of the day, the CSS design elements have absolutely no bearing on how a site is presented in these mediums.

CSSzengarden is simply the same page displayed with many different styles. Anyone using a screen reader or text only browser would have no interest in the site as the design elements would not be seen and therefore all links point to pages with the same text repeated.

The sites tag-line is

"A demonstration of what can be accomplished visually through CSS based design"

In terms of accesibillity via voice control, most of these programs work on the actual text in page rather than access keys so I don't discredit this site for it no complying.

minutedesigns · Jan 8th, 2008, 13:41

Can't be so great if he has made so silly mistakes?Zeldman is just as bad, CSS Valid:http://jigsaw.w3.org/css-validator/v...m%2FAbsolutely simple mistakes... yes people make them but for god sake check em and rectify them!I personally do NOT put sites up with a "HTML/CSS/WAI/508" valid mark unless they are!Its as bad as an electrician being Part P but not, or a Plumber saying their Corgi Registered when they arnt.It would be like you Karrine putting a CSS valid logo on your website when its not...

karinne · Jan 8th, 2008, 13:42

I don't put silly css logo on my site

March to your own standard

Another big guy in the Web industry

And what's with the sudden burst of going to the validator for all these sites? (CSS Beauty.. Not so beautiful Code?) You really have nothing better to do?

minutedesigns · Jan 8th, 2008, 13:45

Then why even have a AAA compliance "link" in the footer, no matter where it goes.

http://www.hughfrostgardendesign.co.uk

WAI-AAA yet dosnt look boring like a screenreader site!

My point is "If your serious enough to put a Validation mark on your website, be serious enough for it to follow through"

Its misleading advertising of an "award" so to speak.

"To show your readers that you have taken the care to create.."

karinne · Jan 8th, 2008, 13:47

Ugh! Let it go! Get over it already!

minutedesigns · Jan 8th, 2008, 13:52

"web standards are about a lot more than validation."

Correct, however if its valid show the mark, if its not its not... Whats the point in showing a HTML/CSS/WAI/508 mark if its not.

I agree with the guy, I dont agree with the guys that put them on!

MikeHopley · Jan 8th, 2008, 14:06

Quote:

Originally Posted by minutedesigns

Put a link to show WAI-AAA and then say in your FAQ "It probably isn't"

SO WHY POST IT AT ALL, OR AT LEAST POST IT ELSEWHERE FOOLISH PERSON!

Maybe he can't change it now, because of all the Zen Garden designs that already incorporate it.

Quote:

Online checks do pickup on the "TABINDEX" and the "ACCESSKEYS" actually..

Yes, but incorrectly so.

The automated checks insist that you specify accesskeys and tabindex for everything, which is not a requirement of WCAG.

Quote:

WAI-AAA yet dosnt look boring like a screenreader site!

You've followed the automated guidelines moronically. You even have accesskeys for your validation links.

Why? Because Cynthia said so? Cynthia is a robot. Use your brain!

You should never use accesskeys. I know the lauded WCAG say otherwise, but they're wrong. Access keys harm accessibility by overriding familiar browser shortcuts. The only safe way to use accesskeys is to disable them by default and allow users the option of activating them. While you're at it, you can allow users to choose their accesskeys (here's an example I made; uses javascript).

But have you even read the WCAG? Here's what they say about accesskeys:

Quote:

Provide keyboard shortcuts to important links (including those in client-side image maps), form controls, and groups of form controls.

Important links. Your validation badges are not important links; indeed, I don't think they even deserve to exist, let alone be dignified with an accesskey.

And here's what they say about the tabindex:

Quote:

Create a logical tab order through links, form controls, and objects. For example, in HTML, specify tab order via the "tabindex" attribute or ensure a logical page design.

Did you read that last part? Or ensure a logical page design. There's no need to go putting tabindex on everything if your source order is logical.

Before you go bragging about WCAG AAA, and condemning others for not "passing" it, make sure you've actually read the guidelines.

Quote:

Correct, however if its valid show the mark, if its not its not

You seem to think that accessibility can be validated.

It can't. Accessibility requires thought, not just a syntax checker. Syntax has little to do with accessibility.

minute44 · Jan 8th, 2008, 14:53

This is why we used to call you "Pedantic Boy" at college.

MikeHopley · Jan 8th, 2008, 15:09

Quote:

Originally Posted by minute44

This is why we used to call you "Pedantic Boy" at college.

*sniff* Happy days.

Actually, I never had such an affectionate nickname.