Usability for Nerds/Web design/Avoid Frames

From Wikibooks, open books for an open world
Jump to navigation Jump to search

Frames is an HTML technology that divides the screen window into two or more sub-windows which can be changed or scrolled independently. Web designers love frames because they can put a menu in one frame and the selected page in another frame.

Unfortunately, frames have a lot of usability problems:

  • It is not always obvious to the user whether a page is divided into frames or not.
  • Does not work well on small screens.
  • Does not work in all browsers and devices.
  • It is difficult for the user to navigate because the address bar of the browser shows the URL of the frameset, not the selected page.
  • The user cannot set a bookmark to an individual page in a frame system.
  • Others cannot make a link to a particular page in a frame system.
  • If you want to inform a friend about a particular page in a frame system then you cannot just give them the URL. You have to give a detailed explanation of which menu items to click on.
  • The browser doesn't show which frame has the focus. When you issue a print command you may print the wrong frame.
  • The user may want to open a link in a new window. This may not work correctly with frames.
  • Users who, for whatever reason, use the keyboard rather than the mouse don't know which key to use for changing the focus from one frame to another.
  • A user may - deliberately or by accident - open a subpage separately rather than as part of the intended frameset. Thereby they lose the context and the navigation menu.
  • Search engines are generally not able to handle frame systems adequately.
  • Web designers often make errors in frame systems. A very common error is that when you click a link to an external web page it is shown inside the same frame system.

The conclusion is clear: Never use frames!

If you want the same menu on many pages then use server-side includes or server-side programming. If you prefer to use client-side programming then be sure to test it in different browsers and provide an alternative for browsers that don't support your script or applet.

Navigation · Animations