Latest Post

How to Play the Game of Poker Best Practices for Making Accessible Toggles


Toggle is a digital magazine for technology executives and the people who make technology work. It covers topics that are unique to these leaders and their ever-evolving roles in today’s organizations. From the latest cybersecurity updates to the best ways to dig out of technical debt, Toggle shows the behind-the-scenes action that goes on every day.

A toggle is a control that lets users update their preferences, settings and other types of information. It is the preferred method to use when you want to provide users with a choice between two opposing states (like Airplane Mode ON and OFF). It also takes less screen estate in comparison to a radio button.

Generally speaking, toggles should be short and direct. Their labels should be clear and describe what the toggle is doing right now. Also, they should be easy to understand by users with cognitive impairments. If your toggle uses colors, they should be high contrast, and ideally not depend solely on color to convey state. This is in line with the WCAG guidelines and should be considered when designing a toggle.

Using static files to manage toggle configuration becomes cumbersome once you reach a certain size. For this reason, it is common for teams to move their toggle configuration into some type of centralized storage, often an existing application DB. In addition to making it easier to manage, this also makes the toggles more visible to stakeholders and testers. It can be hard to see if a toggle has been configured as ON or OFF when it’s hidden in an opaque file. In order to address this, many teams create some form of admin UI which allows these stakeholders to view and modify the toggle configuration.