> For the complete documentation index, see [llms.txt](https://docs.klai.studio/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.klai.studio/engineering-reference-docs/software-testing-overview/ux-ui-checklist/topics/responsiveness.md).

# Responsiveness 🎚

Users access products in all sorts of ways in all sorts of sizes that need to be catered for. Someone should be able to visit a page on a desktop monitor or mobile, and have an experience as similar as it can be.

This checklist ensures you're designing responsively responsibly.

* [ ] Fluid layout

  Your content must be visible and accessible on any device size
* [ ] Breakpoints

  Identify when to change your structure and how it will look
* [ ] Typography

  The size of your text on each device size
* [ ] Change in selection area

  The area for a user to select an element e.g. text field or button
* [ ] Scalability

  Minimizing content and adding to it at the right screen size
* [ ] Vector files for images

  An SVG allows any visual to be at 100% resolution at any size. One file fits all device sizes in being perfect in quality.
