0

On a product web-page on a mobile device (in this context this is limited to mobile phones and phablets. Tablets and desktop machines are exempt) the main product image is still quite small. Implementing a "zoom" feature. Which is considered better practice -

  • open a modal window showing a scroll-able full-sized image,

or

  • open a a new tab (i.e. use target="blank")?
2

I would consider a a modal window the better practice. It keeps the user on the same page, it just gives them a quick glance.

If a new tab sporadically opens up, they might get confused and try to hit back (Which won't work in a new tab) then get frustrated. I also never liked moving my mouse all the way to the top of the page just for this small interaction (Maybe I'm just lazy then haha).

2

2nd the call for a modal window, not only because it'll be less confusing for the user, but because on mobile it will also be faster & use less system memory.

Most mobile browsers deliberately animate new windows in such a way to tell the user "you're no longer browsing that site - you're going somewhere else now, whether you like it or not!" They may get lost, or just be annoyed. It distracts from their desired goal, which is to view the image, and leaves them stuck looking at a blank screen while the new page loads.

If a user wants to view multiple product images, they then have to bounce back & forth and keep track of which window in the stack was their starting point. If they close it, they're screwed, so they don't. They could wind up with several browser windows open at once, each of which is slow to open, slow to load, and further obscures where they came from.

It's much easier on mobile phones to switch between tabs/windows than to close them, so lots of people probably don't even realize they've left them all open. As with a desktop browser, having a dozen separate windows open sucks up system resources, which are far more restricted on mobile devices. With each new window that opens you increase the risk of a crash.

A modal view within the same page prevents pretty much all of these problems. It'll appear snappier & more responsive just by removing the time it takes to animate to a new tab.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.