Web guidelines for content editors: Responsive Content

The goal of responsive web design is create pages that flexibly adapt to varied screen sizes (e.g., televisions, desktop displays, tablets and phones). It is handy to think of your content as a fluid that needs to be poured into varying sizes of containers. As screens get narrower the content can adapt and rearrange itself.

Same content shown to reflow in progressively smaller displays of different devices.

Any part of your content that does not flow well into narrower displays (e.g., phones) can cause an issue. The following kinds of content can cause issues:

  • Tables with a fixed width or that contain too many columns such that the table data does not display well when squished into a narrow view.
  • Using tables for the layout of a page is almost never responsive or accessible.
  • Images that contain relevant text as part of the image should have that text as part of the alternative text of the image.