12

Aside from confused scrolling and screen reader problems (and I'm not downplaying these issues, it's just that I've already discussed them at length), are there any concrete accessibility and usability issues associated with iframes?

3
  • 1
    Could you be more specific on how you are using them? Is it for all of the content? Some of the content?
    – Glen Lipka
    Feb 25, 2010 at 16:34
  • It's for a proportion of content hosted independently of the site's hosting (specifically forms).
    – Ali
    Feb 25, 2010 at 17:03
  • 1
    Just done some reading. Everything i though i knew about frame and iframe accessibility seems to be wrong. So looking forward to any answers on this one.
    – Matt Goddard
    Feb 25, 2010 at 17:38

2 Answers 2

6

So the first document that I use for this kind of question is WCAG 2.0 (about frames)

As the document say:

  • Without scripting, they tend to break the "previous page" functionality offered by browsers.
  • It is impossible to refer to the "current state" of a frameset with a URI; once a frameset changes contents, the original URI no longer applies.
  • Opening a frame in a new browser window can disorient or simply annoy users.

But there are several workaround to avoid some of the problems like giving a title to the iframe (like WebAim suggest or IBM)

Using an iframe it's possible but you have to face a different structure of the site (It's no more one entity but a composition of more entities). What are the possible usability issues?

  • Losing of focus
  • Overwhelm memory
  • Fuzzy Navigation

To prevent this issues you can:

  • Use a different technology like Ajax (but there are a lot of problems loading dynamical data through JS for screen reader), or othe similar dynamic tool
  • Use iframe but consider a different structure of the site to avoid usability problems
3

From a purely usability standpoint, having a div with overflow:scroll looks the same as an iframe. With that said, there are alot of places things could go wrong:

  1. Content looks like it was designed by someone else
  2. Content doesn't fit, scrollbars look weird.
  3. Drag and drop is more complicated for development purposes

But as an example: I made a salesforce.com app. The whole system forces you to use an iframe. We worked hard on the details and the design was seamless for the user. Never scrollbars, etc. So it can be done.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.