What is a modal in web design? SaneChoice

Some websites make you want to fall asleep, while others feel like somebody just dumped a bucket of ice-cold water over your head.

But why?

Sure, bright colours and interesting welcome videos are a part of it. But “modals” may be the deciding factor. These funny little devices are a bit like Marmite – you either love ‘em or hate ‘em. So what is a modal in web design?

The definition

Modals – also called lightboxes or “modal windows” – are web page elements that display on top of and deactivate all other webpage content. To navigate to the underlying page, users must first interact with the modal, either by following its call-to-action or closing it. Unlike pop-ups, users cannot take any other website actions at all while models are displayed.

While modals might sound super annoying, like pop-ups, they’re a little different. Modals contain information that lets users take the most effective next step in their website journey – well, that’s the theory at least.

However, as you might, modals are polarising. Some designers love them, believing in their ability to quickly focus users and move them towards conversion of one kind or another. Others hate them, viewing them as an unwelcome disruption to a website’s flow (and the same as regular pop-ups in all but name).

So what’s the truth?

Costs and benefits of using modals

The benefits of modals are considerable. One study found that the top 10 percent of modals converted 9.28% percent of website visitors, nearly five times the rate of PPC search ads, and twenty times the rate of banner ads. Modals help to keep things simple, presenting users with everything they need to know in a single tab, and allowing businesses to convert any page into a sales funnel.

Modals also focus website visitors on what matters most. For instance, instead of advertising a discount code on a banner, displaying it in a modal may increase the likelihood that a user will see and use it.

Lastly, modals preserve page space by presenting featured media in a lightbox instead of on the main page.

But it’s not all rainbows and butterflies. Modals are also seriously annoying for many users and, for the lay public, indistinguishable from pop-ups. The vast majority of website visitors want to navigate directly to the page they typed into the URL bar or clicked on in search results. They don’t want to get bombarded by interstitials the moment they arrive on a page. It creates frustration and harms perceptions of site quality.

The trick here is to only use modals in contexts where they add real value to users. These include: