WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Fixed width or fluid design

for

From: Karl Groves
Date: Jun 17, 2011 4:33AM

Rick,

Using fixed width has certain usability issues that go beyond accessibility,
but here are the accessibility concerns:

Primarily a fixed-width design is also going to mean fixed-widths for all of
the containers. In other words, in a fixed-width design (most people)
explicitly define widths for the container and also the portions in the
container. So if the containing DIV is set to, say 960px, then they'll
define something like 150-200px for the navigation. This can cause an
accessibility problem if a user has set their browser to use enlarged fonts.
What can happen is that the text will enlarge as much as it can within the
container, but after a certain point bad things happen. Typically text
begins to overlap itself and containers may overlap each other. In the
former case it becomes unreadable and in the latter case things may also
become inoperable.

Whether this is actually an issue is often on a case-by-case basis. There
are lots of ways to do a page layout: tables (hopefully not) or CSS using
absolute positioning or CSS using floats, or other ways, and each of them
will react differently. The best way to know whether it is actually a
problem is to test it. Go to the page with a browser and hit CTRL+ and see
what happens.

WCAG guidelines say you should be able to resize to 200%. I think that's a
bit excessive. You can use the 'No Squint' extension in Firefox to test at
various sizes and see how it looks at each. It will also tell you what %
you're viewing (and you'll see that 200% is huge).

Good luck

Karl