[Feature] Enabling Image Zoom in Rich Content: A Flexible Approach
The Challenge
We’ve received feedback that images embedded within content descriptions cannot be zoomed in or out, which can limit usability—especially for learning content where detailed visuals matter.
This is a valid concern. When images contain important information, the ability to zoom can significantly improve the user experience.
Why It’s Not Straightforward
At first glance, adding zoom functionality may seem simple, but there are technical and design considerations:
- The Content Body is a free-style container, unlike our Content Image feature which is a dedicated image component with built-in zoom support.
- This container allows a mix of text, links, images, and formatting, essentially acting as a flexible HTML canvas.
- Injecting zoom behavior into this environment is complex, especially since the zoom tool is not purely HTML-based.
- It becomes even more challenging on mobile applications, where behavior consistency is critical.
From a user experience perspective, forcing all images to be zoomable may also be counter-intuitive. Not every image is meant to be interacted with—some serve as icons or decorative elements. Making everything clickable could lead to unexpected behavior and disrupt the intended design.
Our Approach
Instead of forcing zoom functionality across all images, we’ve introduced a selective and flexible solution.
Images can now be made zoomable by adding a simple attribute in HTML:
<p><img src="your-image.jpg" style="height: 200px" rel="zoomable"></p>
rel="zoomable", the image will be transformed to support zoom via a popup view.
Key Notes
- This feature is currently supported in Challenge Descriptions only.
- It is now live on our sandbox web application.
- Mobile support is not yet confirmed and is still under evaluation.
What’s Next
This is an experimental yet practical step toward improving content usability without compromising flexibility. We’ll continue refining this approach based on feedback and explore broader support in the future.
As always, we’d love to hear how you use this feature and what improvements you’d like to see next!
Please sign in to leave a comment.
Comments
0 comments