Breakpoints are set up by the developer in the code for a site. These breakpoints provide a better experience for the user by restructuring layouts, changing font sizes, or adjusting elements on a page based off of the width of a browser.
Design Considerations
In an effort to show main content paired with a submenu, the WashU Web Theme has a two column layout on subpages for users browsing on a desktop computer. However, when the user views that same page on a mobile device, the site’s content is restructured to a single column layout because of the smaller screen. By moving to a single column layout on smaller screens, the design can enlarge elements such as fonts and images so the user can experience the site better.
The following breakpoints are used on the web theme:
- 95em (1520px)
- 71em (1135px)
- 61.5em (983px)
- 56.25em (900px)
- 41em (655px)
- 37em (592px)