In our newest update, we’ve added advanced features that make it easy to enhance layouts for mobile screens. Users can now customize the inner and lower margins (known as bottom indents), align elements, and hide or add visuals depending on mobile or desktop viewing.
Today, media user traffic on mobile reaches 70-80%, so it’s now hard to ignore the importance of fine-tuning layouts for mobile devices. The ideal process is to typeset the article for mobile from the start, and then cross-check it on desktop. But a few years ago, it was just the opposite. That makes the latest Setka Editor update an important step towards more accurate content management for various screens, as well as optimized interactions with readers.
Mobile devices also dictate the weight of the article. Most users log in via 3G or LTE, so 5-6 megabytes is the limit for even the most beautiful long-reads. To combat this, the srcset attribute is a life safer, allowing us to produce an image that matches screen size and logs mobile user traffic. Now all the images we have up in Setka Editor get varyingly resized – from 300w on mobile devices to fullwidth for desktop views.
Art Director at PIK Media
A customer poll revealed that 50% of our users desired more control over their mobile post design process, while the other half were happy to continue with Setka Editor’s automatic optimized layout adaptation capabilities for mobile viewing. And as mobile traffic continues to grow and surpass desktop usage, we wanted to provide a way to allow for further customization and the best possible user experience.
That’s why users can now view and edit mobile layouts right within the Setka Editor WYSIWYG interface, as opposed to only in Preview.
More often than not, design-oriented clients who spend lots of resources on creating sophisticated content want more flexibility when defining how their content will look across various devices. And with our latest updates, they can now opt to show and hide certain elements on desktop versus mobile, and will soon include specific indents, animations, and custom CSS as well.
Let’s take a closer look.
Customizable mobile settings for:
- Text colors
- Bottom indents
- Inner indents
- Horizontal and vertical alignment
- Hide/show elements
Text alignment and bottom indents
Hide/show images on different devices + text alignment
Text color, hidden paragraphs, different inner indents
By summer’s end, we’ll be rolling out more mobile updates for awesome layouts with optimized animations, backgrounds, and CSS code – all of which can be customized for different screens.
Learn more about how to design a mobile-first reader experience on Áccent’s “5 Mobile-First Design Fundamentals to Engage Any Audience.”