Why Mobile Images Should Touch Screen Edges

Design more engaging images

Images on mobile devices are tricky to display because they're limited in screen space. Any large images you have will be confined to thumbnail size. A thumbnail image isn't good because it doesn't give users the best visual experience of what you're selling.

You can always allow users to touch the images to get a full-screen view, but this is an extra interaction that not all users will do. How do you display beautiful images on mobile devices with limited screen space?

The answer is to use screen edge images. Instead of cutting your images off at the left and right margins, allow them to expand the entire width of the screen. Also, extend them past the top bar. If you have buttons there, you can overlay them on the image. The result is a more engaging visual experience.

In the example, you can see the difference it makes when you utilize the screen edges. The hotel looks more captivating with the screen edge image than the thumbnail one. At the same time, it doesn't compromise any of the content and the buttons are still touchable.