Tableless design options and CSS

The user-created nature of Notanant means that we've used a table-based layout for web-display and then provide simple one click links to accessibility versions for text-to-speech and mobile webpages. However, some designers prefer to use a table-less design, so we now have that option too.

For many early designed websites the basis of the way a page was laid out relied on tables to divide the page into sections. This, though creates problems for those using text-to-speech browsers or text-only web-browsers. So designers started to comply with the idea that websites should be CSS based only, with no tables for layout. Unfortunately with user-generated webpages there can be problems that CSS-based sites 'break' because the content is too big or varies (eg an image, or exists in one place and not in another - such as a icon for some pages but not others) causing floated elements to cascade out of position or overlap each other breaking the design and layout. It's not a problem if you're careful with the content and aware of the issue, but many Notanant users aren't designers. So for this reason, we used a main table layout for the page and give accessibility options to the content in other formats via a simple link (it also means the reader can choose things like where the navigation should be - at the top of the page, or the bottom - within the linearised content).

Some designers and web-design buyers still specify table-free layouts. So for these more sophisticated users who will be more in control of aspects of content and publishing standards, we do have a pure CSS-based layout that can be selected from our advanced layout menu.