PunBB without <table>'s (Page 4 of 4)

It's looking good!

Question: Is it easier to make the whole page "html only" and then add the CSS, or making it part by part as you want it with CSS? (I know it's probably different for different coders, but anyway :))

so there were already some people who were working on a no-tables version of punbb. I wish I knew... I've spent about 9 hours converting it to css+xhtml strict

will there be a mod/total conversion when someone has finished it? I got this far: http://www.voordummies.nl/notables/index.php It works fine on IE, Opera and Mozilla on windows, but after I popped in my knoppix cd and launched konquerer (or whatever it's called) it looked like crap again.. right now I'm fed up with these browser-incompatibility issues so I'd rater see a finished mod

I wonder whatever happened to Louis. I haven't heard from him in a long time.

the statistics of my site show that only 2% are viewing my site at a resolution lower than 1024*768 and 3% are using IE < 5.5, so if a forum isn't displayed properly in those cases, so be it.

I had a discussion with someone and he said a forum couldn't be displayed without using tables... I'm always up for a challenge, but after 10 hours work I expected more. after removing the tables and replacing them with divs & spans; it worked perfect on IE but it looked horrific on mozilla & opera. In order to get it to work on opera I replaced the spans with divs which worked but it still looked like crap in mozilla. After adding a zillion clear:both divs I finally got it to work with all three browsers. but now that yet another browser can't display it correctly I'm just sick of the whole only-use-tables-for-tabular-data idea

I would also point out the total resolution is not particularly meaningful. My monitor displays at 1024x768  but I don't maximise the browser because I have other windows open so I only view at a width of about 850px. My guideline when designing is that the site should hold together at 640x480 with a browser maximised and look best at 800x600 with a browser maximised.

As for the tableless design. I agree with Rickard. The index page and viewforum pages are a correct use of tables. They are direct tranlations of tables produced by a data query to the screen. Viewtopic probably is not and things like the footer and header boxes certainly are not. Where things begin to get really freaky is when it comes to forms. You could argue for example that the user options input form is a table whereas the search form is not.

EDIT
Viewtopic could certainly be made tabeless especially if it moved to an over and under layout like vB3 rather than side by side. The downside is that the over and under layout is less user friendly because the narrative is broken into chunks.

EDIT2
A very rough and ready test for proper use of a table. If it requires column headers to be intelligible then its a table, if it doesn't, it's not.

You're welcome :)

Fear not. Paul has been working on some very nice markup/CSS changes that will be incorporated into 1.2 (to be released this summer). We discussed accessibility the other day. I'll take the liberty of quoting Paul from an e-mail discussion we had:

Just to update matters.

It turned out that viewtopic was extremely simple to do as a tableless design and it solves some site integration problems i.e. it is easier to control the width in Internet Explorer. Oh! and it doesn't have column headers. The only tables that remain at present are multi-columned data tables. There are no layout tables left.

Forms have been left as tables and I don't think it worth the effort of trying a tableless design. The principle change will be to use the <label> tag to link the labels to the input fields.

On the accessibility point. The one major problem I identified is the main table on the index page. The problem as I understand it is that Jaws is not particularly fond of sub-headings, in this case the category header, even when marked up correctly and positively chokes on colspan. There is of course a quick fix which is to get rid of colspan and position the category header over the forum name.

What I had in mind for an accessible design for the index page was to make each category a seperate table. The category header then becomes the table caption which can be dressed up with css to look like the top row of the table. The column headers then appear under the category header. The result is several small regular tables rather than one big irregular one.

jwalton: I have rather been assuming that the disabled users you have in mind had impaired vision but of course that might not be the case. Are there any tips you can give me generally. Even if it requires a special release to be truly accessible I would still aim at the orginal being as accessible as possible.

Yes - specifically, I am concerned with low-vision and blind users... but something that is interperable and accessible should help out anybody requiring assistive technology or other needs in that area.

As for tips, well I don't claim to be an expert on the subject. But I have had to design and develop for visually impaired users. The obvious stuff, I'm sure you know about - standards-based markup and all that. I found Bobby to be very helpful (If you don't know, its an accessibility validator), and of course the Web Accessibility Initiative. Of course since we are even having this conversation, I assume you know about all that stuff

The most helpful things to us were meeting with a blind user, and observing how he used the web, getting our own copy of JAWS (screen reader), and testing our site on a small group of blind and visually impaired users...

Which reminds me: I can do JAWS testing if you don't have a copy...