disabilities…

@AdamBrillJun 06.2003

I’ve been wondering for quite some time now how important it really is to code to w3c standards. The only reasons I remember hearing are these:

1. The W3C said to.

2. For the disabled.

3. For the users with JavaScript disabled.

I got my hands on a screen reader and did some research. This is what I found:

Contrary to what everyone always told me, Screen Readers can read tables. I read most of my site(which uses tables), and had no trouble at all. I created a site in both tables and divs and couldn’t tell the difference between the two. I’m not quite sure where this false idea came from… ?

JavaScript works in Screen Readers. I tested the following link:

<a href=”javascript:window.open(‘http://www.yahoo.com’);”>Yahoo!</a>

and had no trouble. The text reader opened a new window with Yahoo! in it. The only problem with it is it screwed up the original window. If I used this link:

<a href=”http://www.yahoo.com” onclick=”window.open(‘http://www.yahoo.com‘); return false;”>Yahoo!</a>

It opened a new window with Yahoo! in it and left the original window how it was. The only reason not to do it is because it would be annoying for them… ?

Now, for the JavaScript, I like to code it in such a way that it will “fail-safe”, so that really isn’t a big issue. However I have not heard any valid reason to not use tables, and the one that I did hear(for the disabled) I just disproved. Are there any other reasons not to use tables? Since it works for users with disabilities, I have no reason at all to not use them, besides that it isn’t how the W3C said to. If there are some reasons that I am missing, please let me know. ?

NOTE: For the tests, I used a Screen Reader that I found on the IBM Accessibility Center. It costs $149.00.

to post a comment

Full-stack Developer

61 Comments(s) _↴

@brendandonhueJun 06.2003 — #No one said not to use tables...its don't use tables for layout.

I'm not completely sure why, anyways I find using DIV and SPAN much easier for formatting the section with CSS and making it look how I want.

@nkaisareJun 06.2003 — #Add:

1. Easier to code and maintain

2. Smaller in size

3. Is more search engine friendly.

4. It seems to be where future of the web lies. But then, who's seen the future ?

Cons:

1. It has a learning curve. But if you are a professional webdeveloper, you need to learn!

2. Browser support is not 100%

3. backward compatibility... its less of an issue if your site is accessible. Also less issue because cool javascripts that are invariable added on a website do not work on v4- browsers anyway. Also less of an issue because there arent a lot of v4- browsers left.
-----

OK, my research:

My friend's cell phone (T-mobile/Samsung) displays tables much like a text browser like lynx. So the links are not to the left of the contents. I am not sure how your screen reader displayed it.
----

Comment:

Using tables for layout does not mean that you are not coding to standards. You can use tables and make the site standards compliant. W3 [b]recommends[/b] not using tables purely for layout.

With all the tag soup and display problems, a website built to comply with the standards has the best chance of looking correct in the present and future. Having said this, I would also like to mention that there is an attempt from some quarters towards a paradigm shift from pixel-perfect layout to a flexible layout and to give user more control through the use of user styles.

@AdamBrillauthorJun 06.2003 — #nkaisare, thanks for the input. I guess the two reasons why I would want to use tables are your last two cons. ? Basically, many browsers don't support divs and styles right.

[i]Originally posted by nkaisare [/i]

[B]Comment:

Using tables for layout does not mean that you are not coding to standards. You can use tables and make the site standards compliant. W3 [b]recommends[/b] not using tables purely for layout.[/B][/QUOTE]Really? That's not what most people on here seem to want me to think... Most people say that it is [b]WRONG[/b] to use tables. ? Anyway, thanks for your comments. ?

@CharlesJun 06.2003 — #[i]Originally posted by nkaisare [/i]

[B]Using tables for layout does not mean that you are not coding to standards. [/B][/QUOTE] [i]Form the HTML 4.01 Specification[/i]

[b]Tables should not be used purely as a means to layout document content as this may present problems when rendering to non-visual media. Additionally, when used with graphics, these tables may force users to scroll horizontally to view a table designed on a system with a larger display. To minimize these problems, authors should use style sheets to control layout rather than tables.[/b]

[i]http://www.w3.org/TR/html4/struct/tables.html#h-11.1[/i][/quote][font=georgia]If you are using tables for layout then you are indeed "not coding to standards." And keep in mind that your experience with one screen reader does not apply to all screen readers. There's a good review of how several different ones handle tables in the book [i]Accessible Web Sites[/i] (http://www.glasshaus.com/bookInfo.asp?bookId=44). The review is by Jim Thatcher who invented the screen reader.

There are two ways a non-graphical browser can handle a table. The old way was to simply ignore them. Lynx uses this method. The big problem with tables and these browsers is that with the "old nav bar down the left side of the screen" design the user has to listen to a repetitive list of links at the top of every page in your site. One solution is to put the links down the right side. Another is to use a "skip navigation" link.

But TABLEs are a legitimate HTML element in their own right. There how you organize tabular data and screen readers need to be able to present the data in a way that the user can understand the relationships. And the advanced screen readers do have a way. Essentially they call out the contents of the appropriate header cell or cells with each data cell. And if you haven't indicated what the header cells are then the browser just guesses. If you have used tables for layout then this will really make a mess out of your page. In other words, "this may present problems when rendering to non-visual media."[/font]

@AdamGundryJun 06.2003 — #Regarding your second point, I believe the reason the WCAG forbids popups is that they are confusing for visually impaired users, especially if they are not requested. This is tied in to the guideline not to change the window without informing the user.

Adam

P.S. I think I read somewhere that WCAG 2.0 is now a Proposed Recommendation, so perhaps some of these issues will be cleared up.

@nkaisareJun 06.2003 — #I was wrong. I was viewing standards compliance thru a visual-browser + validator.w3.org prism.

@AdamBrillauthorJun 06.2003 — #It appears to me(although I could be wrong), that divs and styles are primitive. Take this code, for example:

&lt;body style="margin:0px;"&gt;
 &lt;div style="position:absolute; top:0px; left:0px; width:20%; height:20px; background-color:#A3BDE2;"&gt;
 Links...&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 link2&lt;br&gt;
 &lt;/div&gt;
 &lt;div style="position:absolute; top:0px; left:20%; width:60%; height:100%; background-color:blue;"&gt;
 Main content...
 &lt;/div&gt;
 &lt;div style="position:absolute; top:0px; left:80%; width:20%; height:100%; background-color:#A3BDE2;"&gt;
 Other side...
 &lt;/div&gt;
 &lt;/body&gt;

Please don't pick on my code, since this is only an example... ? What I am trying to do is to make all three columns the same height. With tables, that is an easy task. With divs? Very hard, if not impossible. If divs would be better equipped for the job, I might use them, but they make designing MUCH more work than it has to be...

BTW, if anyone has a solution, please let me know... ?

@CharlesJun 07.2003 — #[font=georgia]So, for the sake of your own convenience you will make your page inaccessible to certain blind persons. An interesting choice. But it does make me wonder, what do you think a just God will do to those that scoff at the needs of the blind? I don't know about you, but my eyes are bad enough already.[/font]

@AdamBrillauthorJun 07.2003 — #[i]Originally posted by Charles [/i]

[B][font=georgia]So, for the sake of your own convenience you will make your page inaccessible to certain blind persons. An interesting choice. But it does make me wonder, what do you think a just God will do to those that scoff at the needs of the blind? I don't know about you, but my eyes are bad enough already.[/font] [/B][/QUOTE]Apperantly you didn't read my first post... I tried tables in the text reader and it worked fine. Even if some of the older text readers couldn't read them, doesn't it seem fair to program for the latest versions? I'm not programming for NN4, either... If I was, I would have to use tables, since div's don't work hardly at all. ? I don't even know if tables DON'T work in older screen readers. The only screen reader that I tried could read them, so if that is the only one that can, then everyone will probably buy that one anyway. Otherwise they can only view about 10%(or less) of the pages anyway. If you take a look at Yahoo's code, you will see tables. If you look at Amazon, it uses tables. So does Microsoft, Mozilla, IBM's Accessibility Center, and about every other site on the internet. If they can't view any of those, a screen reader would be virtually useless...

BTW, I really don't think that God would punish me for making code that doesn't work in text readers. :rolleyes: I don't believe in HTMLism, which you must.

@nkaisareJun 07.2003 — #The question I have is: why do you want the divs to stretch? Usually, I have layouts like:

`---------------------------------------</H2> <H2> HEADER ---------------------------------------</H2> Link 1 | Main Contents of the page<br/> Link 2 | Can run long<br/> ... | Very long<br/> Link n | Or may be short<br/> Doesnt matter <H2> What the length is ---------------------------------------</H2> <H2> Footer ---------------------------------------</H2>`

Or may be another column to the right. Layouts like these are easy to create. For layout examples, take a look at

http://www.glish.com/css/

http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html

http://www.bluerobot.com/web/layouts/

What you are asking is possible to do with javascript not really with pure css... because divs take height of its content. If you want background color for left column and want to make it look like stretch, you'll have to use a trick. See an example at

http://www.prism.gatech.edu/~gte207x/pyro.html
reply?

@nkaisareJun 07.2003 — #

<i>
 </i>&lt;h1 id="header"&gt;Header&lt;/h1&gt;
 &lt;div id="middle"&gt;
 &lt;div id="left"&gt;
 &lt;p class="hide"&gt;&lt;a href="#main1"&gt;Skip navigation&lt;/a&gt;&lt;/p&gt;
 &lt;ul&gt;
 &lt;li&gt;Link 1&lt;/li&gt;
 ...
 &lt;li&gt;Link n&lt;/li&gt;
 &lt;/ul&gt;
 &lt;/div&gt;
 
 &lt;div id="main"&gt;
 &lt;a name="main1"&gt;&lt;/a&gt;&lt;!-- Backward compatibility --&gt;
 Lorem Ipsum crap crap blah.
 &lt;/div&gt;
 &lt;/div&gt;
 &lt;div id="footer"&gt;Footer goes here&lt;/div&gt;

div#left {float: left; width: 20%}

div#main {margin-left: 20%}

div#main ul, div#main li {list-style: none; margin: 0; padding: 0}

Taming lists article:

http://www.alistapart.com/stories/taminglists/

Some examples of layout on my personal site (Uses SAME valid strict xhtml file to create 6 different layouts):

http://www.prism.gatech.edu/~gte207x/experiment/page1.html

Folder Tabs (no tables)

http://www.prism.gatech.edu/~gte207x/web4vibha/alternate.html

this one uses only 3 images!!!

One for logo, one for banner and ONLY ONE IMAGE for all the folder tabs.

What more do you need? Take the plunge into the world of CSS.

[Edited later] BTW, all these examples (on GaTech website) are done by me. I never read any HTML or CSS book in my life. All my knowledge is from htmlgoodies.com (a site I WONT recommend, but have to acknowledge as thats where it all started), w3schools.com, w3.org and this very forum. And when me, a PhD student in Chemical Engineering, who has nothing to do with professional web development, can come this far, I see no reason why anyone (who intends to do serious web development) should complain that CSS is a difficult tool.

@AdamBrillauthorJun 07.2003 — #Thanks for the links and info, nkaisare. Hopefully I can get one of those to work for me... ? I still think there should be an easier way of doing it, though. ? Maybe that will be in CSS 3. ?

@nkaisareJun 07.2003 — #[i]Originally posted by AdamBrill [/i]

[B]Thanks for the links and info, nkaisare. Hopefully I can get one of those to work for me... ? I still think there should be an easier way of doing it, though. ? Maybe that will be in CSS 3. ? [/B][/QUOTE]
Well I am on a crusade now ?

lolz

Convert 'em all to CSS.

[TABLES]

[size=1]

<table>

<tr><td colspan="2"><h1>PAGE HEADER</h1></td></tr>

<tr>

<td width="20%">Link 1<br>Link 2<br>...Link n

</td>

<td width="80%"><h2>Section 1</h2>

Blah blah blah

</td>

</tr>

<tr><td colspan="2">Footer goes here</td></tr>

</table>

[/size]

[NON TABLES]

[size=1]

<h1 id="header">PAGE HEADER</h1>

<div id="left">

<ul><li>Link 1</li><li>Link 2</li>...<li>Link n</li></ul>

</div>

<div id="main"><h2>Section 1</h2>

Blah blah blah

</div>

<div id="footer">Footer goes here</div>

[/size]

Which HTML file is crisper? C'mon you tell me. In NON TABLE file, you don't require ul of links (but is recommended as it makes semantic sense).

CSS is very simple:

[size=1]

div#left {float: left; width: 20%}

div#main {margin-left: 20%}

div#footer {clear: left}

div#left ul, div#left li {list-style: none; margin: 0; padding: 0}

[/size]

The above CSS is common for every page.

If you want links to the right instead:

replace [i]float: left[/i] with [i]float: right[/i] and

[i]margin-left: 20%[/i] with [i]margin-right: 20%[/i]

Now you want the links at the top, not left/right:

[size=1][color=blue]

div#left ul, div#left li{list-style: none; margin: 0; padding: 0; display: inline}

div#left li {padding: 5px 15px; border-left: 1px solid black}

[/color][/size]

Its not rocket science. And browser support isn't that bad.

@JonaJun 07.2003 — #[font=arial][color=maroon]This brings up a final question for me... I want my site to fit [i]all[/i] standards, according to the W3C, WCAG, etc., but I also want it to work in all browsers. NN4, I assume, does not support DIV elements and CSS2. So what do I use after all of the above has been explained?

I know how to program, and I know HTML and I know CSS, but this has brought up a large question in my mind which I've never gotten an answer for.. I am lost for once. ?[/color][/font]

Be glad you can teach me (because I normally already know it ?),

[b]Jona[/b]

@CharlesJun 07.2003 — #[i]Originally posted by Jona [/i]

[B]I want my site to fit [i]all[/i] standards, according to the W3C, WCAG, etc., but I also want it to work in all browsers. NN4, I assume, does not support DIV elements and CSS2. So what do I use after all of the above has been explained? [/B][/QUOTE] [font=georgia]If you have followed correctly the HTML 4.01 Specification and the WCAG 1.0 then your page will work on [i]all[/i] browsers. It will not look the same on all browsers, but that's not the point. You didn't expect it to "look right" on a screen reader, did you? Well neither will it look the way you would prefer on Netscape 4. But that's an exceedingly small number of users, users that 1) can upgrade to any number of better graphical browsers and 2) can use your site just fine anyway.

Keep in mind the following WCAG 1.0 Priority 1 checkpoint:[/font][b]6.1 Organize documents so they may be read without style sheets. For example, when an HTML document is rendered without associated style sheets, it must still be possible to read the document. [Priority 1]

When content is organized logically, it will be rendered in a meaningful order when style sheets are turned off or not supported.[/b]

[i]http://www.w3.org/TR/WCAG10/wai-pageauth.html#tech-order-style-sheets[/i][/quote]

@CharlesJun 07.2003 — #[i]Originally posted by AdamBrill [/i]

[B]Apperantly you didn't read my first post.....[/B][/QUOTE][font=georgia]Clearly, you didn't read my post last before that one of yours.

1) Your experience of one screen reader does not tell you how all screen readers behave.

2) The older style of screen readers simply ignored tables, the newer ones get them wrong if you use them for layout.

3) It would appear that you were testing an older style screen reader. [/font] [i]Originally posted by AdamBrill [/i]

[B][D]oesn't it seem fair to program for the latest versions? [/B][/QUOTE][font=georgia]Indeed, that's why I'm suggesting that you need to eschew tables for layout like the W3C says.[/font]

@CharlesJun 07.2003 — #[font=georgia]Here are three sites that will work well on [i]any[/i] browser:

http://www.saintjohns.ang-md.org/

http://www.agbs.co.uk/

http://www.rickbull.co.uk/

Check out each of those in Netscape 4 and Lynx (http://www.delorie.com/web/lynxview.html) and your favorite version 7 browser. You'll need to disable JavaScript to really appreciate the middle one in Netscape 4. And do look closely under the hood of the third one. It's a excellent example of a page properly done.[/font]

@AdamBrillauthorJun 07.2003 — #[i]Originally posted by Charles [/i]

[b]1) Your experience of one screen reader does not tell you how all screen readers behave.[/b][/quote]
No, it doesn't, but I haven't seen any other screen readers. Can you show me one that doesn't work with tables?

[i]Originally posted by Charles [/i]

[B]3) It would appear that you were testing an older style screen reader.[/B][/QUOTE]
Wait a minute... Tables worked FINE on the screen reader that I tried. If that was an older screen reader, than tables and screen readers would have never been an issue. It is quite possible(and expected) that all new screen readers work fine with tables, since almost every site on the internet uses tables for layout. You must admit that most sites use tables, so how useful would a screen reader be without being able to read them?

@CharlesJun 07.2003 — #[font=georgia]Please read that post above. The one where I cite a book that reviews several screen readers (a book that I have returned to my public library) and the one where I explain that there are two kinds of screen readers where TABLEs are concerned. There are readers that simply ignore the element and then there are those that handle them. If you have been using tables for layout then a browser that is ignoring them will seem to be "handling" them but it is not. It is not presenting the relationships between the cells.[/font]

@JonaJun 07.2003 — #[i]Originally posted by Charles [/i]

[B]http://www.saintjohns.ang-md.org/[/B][/QUOTE]

[font=arial][color=maroon]Wait a second... This site uses [i]tables![/i] If I'm not supposed to use tables, why do you say this site is an example of a well designed site?

Is there any way to check user agents and stuff to see if it's a text-based, braille, aural, etc., browser (server-side)? That way I can just redirect them to a well lain-out section with all of the necessary content and no troubles for the disabled, or those using text-based brwosers. (Right?)

I really want to know what to do.. Because this is confusing. I can't use tables, so I have to use DIVs and CSS, but even if it's valid HTML 4.01 Strict and the CSS is valid CSS2, older browsers (even though there are very few users that use them) will not read the page properly. I understand that the page must be compatible and look nice without CSS, but if that's the case, redundancy becomes necessary. If you have p{text-align:justify;} in your CSS, and a CSS-disabled browser comes along, the text will not justify--so I would use <p align="justify"> in all of my paragraph elements? Or would I simply disregard things like this? But if that's the case, my "div tables" won't format correctly, making nasty site design for older browsers.

I realize older browsers are a very small percentage of visitors; however, I'd like it to regardless--since I assume it can be done if the page is "valid." Please explain.

Thank you very much, Charles, by the way. ? You're a great help when it comes to this sort of thing.[/color][/font]

[b]Jona[/b]

@CharlesJun 08.2003 — #[i]Originally posted by Jona [/i]

[B]Wait a second... This site uses [i]tables![/i] [/B][/QUOTE] [font=georgia]Yes, that's why I included it, to show tables being properly used. Each table shows the relationship between or among tabular data. And take a good look at the table at http://www.saintjohns.ang-md.org/calendar/ and you will see how a multidimensional table is marked up. The difference is that those tables are better understood when the headings are read with each data cell.

The reason you are not supposed to use TABLEs for layout is that they are valuable for showing tabular data. If they didn't have this use then all screen readers would just ignore them.[/font]

@JonaJun 08.2003 — #[font=arial][color=maroon]So... What do I do? Let's take a client's site for an example: http://sonoracabinets.com/ Here, the site uses tables. It looks the same in all browsers (and looks ok in Lynx but is sort of redundant with the links/headings), but I haven't tested it in Netscape 4, although I'm sure it will look basically the same. (I'm not bragging about my site-design either, I made this "template" in a few minutes to show the client what I could do, and the client wanted to use it! :p) So my question is, what do I do to redesign the site and make it look the same?

Also, when you say, "tabular data," do you mean that as long as the tables are in order (the text in each cell in the source follows the same as what is displayed on the page) or am I missing something?[/color][/font]

[b]Jona[/b]

@nkaisareJun 08.2003 — #

-------------------
 Name      Age  Sex
 -------------------
 John      19   M
 Jane      23   F
 Jack      17   M
 Jill      12   F
 -------------------

The above is an example of tabular data... and tables [b]should[/b] be used here.

The next example is [b]not[/b] a tabular data. Its just that the navigation links are anchored to the left of the main contents. The use of tables is incorrect in this example; CSS should be used instead.

-------------------------
 Link 1 | Page content
 Link 2 | goes here
 ...    | ...
 Link n | Tables used here
 is improper use
 as this is not a
 tabular data
 -------------------------

@JonaJun 08.2003 — #[font=arial][color=maroon]Ah yes, makes perfectly good sense. Tables should be used for what they are--tables, and not for formatting pages.. I completely understand that now. Thanks, Niket.

But... I supposed you consider my client's site formatted with tables rather than the tables being used for tabular data. Which means I have to redo the entire site using CSS, rather than the tables that are there right now.. Here's the thing, I have no idea how! ? I mean, I've done some working with it, etc., etc., etc., but nothing looks the same... [/color][/font]

There is no height attribute for a table,

[b]Jona[/b]

@JonaJun 08.2003 — #[font=arial][color=maroon]OK, this looks all right--kinda smaller but I think it works. Charles, Niket, tell me what you think about it (it's valid HTML 4.01 Strict, too): http://sonoracabinets.com/index_2.html [/color][/font]

I'm on vacation for three days now, so I may not reply,

[b]Jona[/b]

[i]If the link doesn't work, it's because I left in a freaking hurry and didn't have time to fully upload it.[/i]

@JonaJun 11.2003 — #[font=arial][color=maroon]Hey guys, I'm back. Um.. I don't see any replies.. :rolleyes: OK, the link [i]does[/i] work, and I'd like to know if I re-did the page correctly. According to the WCAG 1.0 standards, etc. I'm going to validate the pages in the Strict DTD in just a second... I'm pretty sure it's valid. ?

[/color][/font][b]Jona[/b]

@DaveSWJun 11.2003 — #Your style sheet should be external for the following reasons

1) Loads faster

2) search engines get to the page content faster and give it more importance

3) saves you rewriting it on every page.

4) the W3C says so!! (don't you just hate that phrase?)

To make it external, cut the style tag contents out and paste it in notepad.

Then Put this in your page code to link to it.

<link href="style.css" type="text/css" rel="stylesheet"

title="stylesheet" id="sqstylesheet">

I noticed you've used absolute positioning. This should really be hidden under the @import rule, otherwise a few older browers with buggy css support will deposit all your page contents in the top left corner, which isn't too useful. It's not absolutely necessary, but if you're going in for accessibility, you might as well do it all!

in xhtml that looks like:

<style type="text/css">

/*<![CDATA[*/

@import url("real.css");

/*]]>*/

</style>

html is like

<style type="text/css">



</style>

If you can't get it to work don't worry - it took me about a week to work out when Niket sent me the code.

hope this helps you

Dave

@JonaJun 11.2003 — #[font=arial][color=maroon]Yes, it does help, Dave. Thanks, I'll take a wack at it--I've done this before. ?[/color][/font]

I assume I've done it correctly, then,

[b]Jona[/b]

@DaveSWJun 11.2003 — #well... there's not really much to take exception to if you see what I mean! LOL

I suggest putting an image in the backgound of your div - maybe just creme background and line drawing of a cabinet? make it look technical!

in css, that is

background-image: url("background.jpg");

background-repeat: no-repeat;

background-position: center;

What is

html>body #left {

width: 120px;

}

about in your style sheet? (haven't seen it before) If you're specifying the width of your div named left you can put that in the main #left section

dave

@JonaJun 11.2003 — #[font=arial][color=maroon]I know how to do that in CSS. I'm not that much of a newbie. :rolleyes: But I was just trying to make sure I was making the page right.

Also, the html>body #left{} part is a fix for IE5.5.[/color][/font]

[b]Jona[/b]

@DaveSWJun 11.2003 — #[i]Originally posted by Jona [/i]

[B][font=arial][color=maroon]Also, the html>body #left{} part is a fix for IE5.5.[/color][/font]

[b]Jona[/b] [/B][/QUOTE]
ta. hadn't seen that one. never had troubles in IE5.5 meself - though it's the default browser on my main machine.

sorry if I was being patronising... but you never know what people know and don't know.

dave

@JonaJun 11.2003 — #[font=arial][color=maroon]'Tis okay, my friend. ?[/color][/font]

[b]Jona[/b]

@Robert_WellockJun 12.2003 — #It is a CSS child selector.

A child selector matches when an element is the child of some element. A child selector is made up of two or more selectors separated by ">".

Example(s): The following rule sets the style of all P elements that are children of BODY:

body > P { line-height: 1.3 }[/quote]

Jona you might want to add generic font family and background-color to some of the CSS statements plus 'visited' is not an HTML element actually the CSS used is a minefield or inaccuracy, I'd suggest cleaning the CSS syntax up.

Yes, I am officially disabled but luckily I don't need to use asistive browsing technologies or screen readers like JAWS for Windows.

The Web Content Accessibility Guidelines (WCAG) rules are not exclusive to (x)html markup alone, they also cover implementation of CSS hence your CSS syntax should also be correct.

@JonaJun 12.2003 — #[font=arial][color=maroon]Yes, I am/have been working on cleaning it up. I should be done today... But probably later on.[/color][/font]

[b]Jona[/b]

@DaveSWJun 12.2003 — #You can use this to help.

http://jigsaw.w3.org/css-validator/

[SIZE=1]not that I've ever found it much help you know...[/SIZE]

@JonaJun 12.2003 — #[font=arial][color=maroon]Actually, I doubt that it will help me much either. I tried the online validator, and I doubt that the downloadable one will be any good.[/color][/font]

[b]Jona[/b]

@DaveSWJun 12.2003 — #I was surprised to see that scrollbar css doesn't validate

@pyroJun 12.2003 — #It (CSS scrollbars) is a non-standard property: http://www.w3.org/Style/Examples/007/scrollbars

@DaveSWJun 12.2003 — #Does that mean i cannot change scrollbar colors and validate? Personally I'd prefer to have the scrollbar match the page...

@AdamGundryJun 12.2003 — #I personally find it annoying if the web page changes the browser chrome - I prefer to do that myself. Of course, in Mozilla coloured scrollbars are not supported.

Adam

@DaveSWJun 12.2003 — #Thing is... the customers seem to like it!!

@Robert_WellockJun 12.2003 — #Neither does M$ IE 6.0 in strict mode.

Although I don't condone use of coloured scrollbars the hack answer is simple use multiple CSS sheets with one separate for M$ scrollbar nonsense CSS and only validate the appropriate file, or CSS declarations.

@CharlesJun 12.2003 — #[font=georgia]Permit me this one piece of speculation, but I cannot see the harm in using invalid CSS. As long as the HTML is valid and follows the Web Content Accessibility Guidelines 1.0 then it doesn't matter what you do with your CSS the page will be accessible.[/font]

@Robert_WellockJun 12.2003 — #Yes, it will be accessible though what if a make a scrollbar that is of too low a contrast that that you cannot see the bar itself separate from the background, then your not helping the cause.

One close example off the top of my head would be: http://www.kingsofchaos.com/ obviously you then you disable CSS via your user-agent or enforce overrides, though why should I have to use overrides to view a scrollbar?

Just in case you aren't using the hideous M$ Explorer the scrollbars are black, as are the scrollbar buttons and arrows.

As it so happens my own disability doesn't require me to take such drastic actions, though even using fully-justified text hinders some people whom share my condition.

@DaveSWJun 12.2003 — #Charles: :eek:

actually I agree, but maybe it's worth it in case someone runs a validator over my code LOL.

Robert: justified text? I take it these people would definitely switch off external style sheets? Otherwise I'm up salt creek...

@Robert_WellockJun 12.2003 — #Honestly I don't know, you could ask Sir Richard Branson he has the same disability, it may affect him you also could have written to any of the following: Albert Einstein, Pablo Picasso, Thomas Alva Edison or Leonard Da Vinci if they were still around they all had the same condition.

Perhaps, they'd probably opt for a screen reader or just change the browser setting with regards to paragraph formatting - I hope you follow the rules of degrades gracefully.

Hence why applying CSS correctly is good methodology.

@khakiJun 12.2003 — #hey Robert...

you continue to allude to... but not detail... the "condition" that classifies you as disabled.

if it's not disrespectful to ask...

do you mind telling us?

if not...

i apologize if it was insensitive of me to bring it up.

? k

@Robert_WellockJun 12.2003 — #You might treat me different though and take sympathy, which would be wrong.

@DaveSWJun 12.2003 — #Rob: I'm sure we all respect you for your skills.

I have a few friends with the same condition. Strange how the greatest people have it...

@khakiJun 12.2003 — #[i]Originally posted by Robert Wellock [/i]

[B]You might treat me different though and take sympathy, which would be wrong. [/B][/QUOTE] yeah...

I'm sure you're right...

vacuous twit that I am.

if you don't want to say... then don't.

but don't use [I]me[/I] as your excuse.

gee-whiz

:rolleyes: k

@HesterJun 13.2003 — #[b]Jona:[/b] NN4, I assume, does not support DIV elements and CSS2[/quote]
It does support DIVs, but is buggy when it comes to things like background colours. Not sure about CSS2 - I think it handles a small amount but I could be wrong.

The problem with NS4 is that is has so many bugs. For example, a form can [b]disappear[/b] if it is inside a div. So either you make a page without styles for NS4, or you use have to use tables for layout. If it wasn't for that browser, I'd use divs all the time. (I do at home - check my site.) But the work site has to look the same in NS4 as we have a large number of visitors using it still.

I use some divs, where they work, but the page is set within a table. I have added table headers (TH) and summaries and the SCOPE attribute to make it accessible though.

@Robert_WellockJun 13.2003 — #I am not bothered about saying I have dyslexia although I am not a good example of an disabled person whom has problems reading, or many of the more [i]common[/i] things are typically associated with the condition.

Actually to some extent that is an inaccuracy; since the term covers a wide range of minor differences, which an individual may, or may not experience.

I wasn't even diagnosed until I was eighteen years of age.

Although I am prone to a lot of grammar and 'online typographical errors', but when your intelligence is rated within the top 1% of the population and you have such a condition it is feasible that your mind is multitasking and going much faster than your fingers, which could lead to discrepancies - assuming you don't touch-type ?.

I would say it is preferable to [i]always[/i] at least consider Web Content Accessibility Guidelines 1.0 Level A whenever beginning a web-design project.

@JonaJun 13.2003 — #[i]Originally posted by Robert Wellock[/i]

[b]... I have dyslexia ...[/b][/quote]

[font=arial][color=maroon]Pardon me if I'm being rude, but I don't really know what the condition [i]is.[/i] (If you don't want to explain or go into further detail, you don't have to, I'm just interested.)

[/color][/font][i]Originally posted by Robert Wellock[/i]

[b]I would say it is preferable to always at least consider Web Content Accessibility Guidelines 1.0 Level A whenever beginning a web-design project.[/b][/quote]

[font=arial][color=maroon]I try my best to fit these standards (http://www.sonoracabinets.com/), although I'm not 100% sure that my sites do completely (how about triple-A?). Sometimes difficult to be sure... (Care to critque? Just don't critique the CSS because I'm working on that, lol. I have a few typos and stuff in there. :p)[/color][/font]

[i]Originally posted by Hester[/i]

[b]So either you make a page without styles for NS4, or you use have to use tables for layout.[/b][/quote]

[font=arial][color=maroon]No, I do not believe this is true. Using tables for layout does not conform to the WCAG 1.0 standards; instead, it is recommended that your pages "fail safe" or degrade "gracefully" to other browsers. As long as the content is accessible (and the HTML is valid), even in a text-browser, it should be fine.[/color][/font]

[b]Jona[/b]

@DaveSWJun 13.2003 — #http://www.dyslexia.com/

Dyslexic people are visual, multi-dimensional thinkers. We are intuitive and highly creative, and excel at hands-on learning.
[/quote]

told you only the greatest people have it... why can't I be a multi dimensional thinker??

@Robert_WellockJun 18.2003 — #That makes it sound like some exclusive club; basically dyslexia is a grouped family of syndromes that some may have problems reading, others like myself may not.

No single definition currently exists to adequately define dyslexia, including our own definition. The truth is, at present nobody really knows exactly what dyslexia is or what causes it. However, we do know much about the dyslexic condition and as a consequence dyslexia tends to be described in terms of its symptoms or alternatively in terms of what it is not. For example 'Dyslexia is not due to low intelligence' or 'Dyslexia is not a disease, it has no cure.[/quote]

Obviously there will be specific traits like poor spelling although I am probably as capable at spelling words correctly as the average man on the street.

For example I would find spoonerism (transposition of usually initial sounds in a pair of words, i.e. Bob Marley becomes Mob Barley) a little taxing if I were do mentally rather than looking at the "text" myself, but upon hearing application spoonerism I have no problem unscrambling the words.

Personally I think once you go past AA you can end-up looking like your on an "accessibility crusade" and remember a 10 year old using a monochrome VDU and text only browser probably should be able to understand and AAA labelled site.

My advice is be creative but keep WAI in mind and try to aim for A if it is at all feasible - it is not too hard.

Jona I will probably look at your site and try and interpret the WAI Content Rating if you are having trouble with the W3C WAI language and terminology.

@JonaJun 18.2003 — #[i]Originally posted by Robert Wellock [/i]

[B]For example I would find spoonerism (transposition of usually initial sounds in a pair of words, i.e. Bob Marley becomes Mob Barley) a little taxing if I were do mentally rather than looking at the "text" myself, but upon hearing application spoonerism I have no problem unscrambling the words.[/b][/quote]

[font=arial][color=maroon]I have a photographic memory, so when I hear a word, I "see" it in my mind (yeah the background is white, the text is black, and the font is Times New Roman!). lol[/color][/font]

[i]Originally posted by Robert Wellock[/i]

[b]Jona I will probably look at your site and try and interpret the WAI Content Rating if you are having trouble with the W3C WAI language and terminology. [/B][/QUOTE]

[font=arial][color=maroon]Thanks. ?[/color][/font]

[b]Jona[/b]

@Robert_WellockJun 19.2003 — #I could provide an analysis of "Sonoracabinets" but I also tend to add comments on usage of semantic HTML elements; I give frank, honest reports so do [i]not[/i] get offended.

Preamble: I'll try ignore the CSS issues.

The HTML is strict and generally the page uses CSS-P, I assume the use of @import is to prevent Netscape for rendering the CSS from the external link.

I would suggest you place , between the keywords within the <meta> element.

I am also glad the contact form uses PHP although the "back button" when you add invalid data uses JavaScript to go back which is a 'downside'.

You may also like to add the title attribute to the main "Welcome graphic" since you use it as a header.

Also the link to "Merillat" may benefit from the having title attribute explaining it is an external link.

Really for the left navigation menu you should be using the <li> element rather than <h1> as semantically they are only links and not really headers in the context you have used.

Now, onto the WAI the "click here" might be a little confusing for some.

You might want to consider changing some of the heading to CSS styled elements.

I have to fly now, but once you get your CSS fixed, sort out the heading structure and follow the advice in the preamble you should be able to attain: A for "Sonoracabinets", you are fairly close to AA because you used the rules of KISS.

@JonaJun 19.2003 — #[font=arial][color=green]Thanks, man. I'll fix all of that up ASAP. ?

Thanks again,[/color][/font]

[b]Jona[/b]

@DaveSWJun 19.2003 — #[i]Originally posted by Robert Wellock [/i]

[B]I would suggest you place , between the keywords within the <meta> element.

[/B][/QUOTE]

Actually there are two views about that. The one Rob said is the accepted way to do it. The other says leave out the commas so that the search engine inserts the breaks wherever it likes.

Personally I wouldn't know which was best. The second argument makes sense, but would search engines think that it matched less words in the search string so rank it lower? I don't know. Anyone??

@brendandonhueJun 19.2003 — #None of the major search engines base their results or rankings on META tags anymore. They are based on the content of your site, and the content of sites that link to yours.

@JonaJun 19.2003 — #[font=arial][color=maroon]Actually, what I'm going to do is just use spaces after the commas.[/color][/font]

[b]Jona[/b]

Also in #Full-stackDeveloper _↴

Web Standards Questionnaire <http://www.davewilding.co.uk/qindex.asp>Ie7?Examples of tests for web integration job

Success!

Help @AdamBrill spread the word by sharing this article on Twitter...

Tweet This

disabilities…

61 Comments(s) _↴

3. backward compatibility... its less of an issue if your site is accessible. Also less issue because cool javascripts that are invariable added on a website do not work on v4- browsers anyway. Also less of an issue because there arent a lot of v4- browsers left.
-----

My friend's cell phone (T-mobile/Samsung) displays tables much like a text browser like lynx. So the links are not to the left of the contents. I am not sure how your screen reader displayed it.
----

Also in #Full-stackDeveloper _↴

Success!

Social

Version

disabilities…

61 Comments(s) ↴

3. backward compatibility... its less of an issue if your site is accessible. Also less issue because cool javascripts that are invariable added on a website do not work on v4- browsers anyway. Also less of an issue because there arent a lot of v4- browsers left. -----

My friend's cell phone (T-mobile/Samsung) displays tables much like a text browser like lynx. So the links are not to the left of the contents. I am not sure how your screen reader displayed it. ----

Also in #Full-stackDeveloper ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

61 Comments(s) _↴

3. backward compatibility... its less of an issue if your site is accessible. Also less issue because cool javascripts that are invariable added on a website do not work on v4- browsers anyway. Also less of an issue because there arent a lot of v4- browsers left.
-----

My friend's cell phone (T-mobile/Samsung) displays tables much like a text browser like lynx. So the links are not to the left of the contents. I am not sure how your screen reader displayed it.
----

Also in #Full-stackDeveloper _↴