The email designer automatically optimises emails for mobile using a Drag & Drop system. This means that if you use a 14px font size in the designer, the font size on mobile should also be displayed as 14px. However, there may be times when the font size appears smaller or 'zoomed out' on mobile. If you experience this issue, there are a few things you can check. These are explained in this article.
Is the content block correctly set up for mobile view?
Each content block in your email offers options for the mobile view of the block. By clicking on the phone icon in the menu, you can make adjustments to the mobile view. This way, you can optimise your emails for desktop and mobile. If you experience a different display on desktop/mobile versions of emails, it's best to check these settings of the respective content block.
Has the text been copied and pasted?
When text (from an external source) is copied and pasted into a campaign, there is a chance that 'hidden formatting' of the text is also copied. The hidden formatting is a piece of coding behind the text that can cause it to be displayed differently than intended. In MailBlue, you won't see this 'hidden formatting', but receiving email providers may pick it up, resulting in your email being displayed differently. This could lead to the text of the email appearing smaller or in a different font.
To prevent this, we recommend working directly in the email designer or pasting the text in MailBlue without formatting. You can read how to do this here.
Have you used custom code to create your email?
If the font size for a campaign appears small when viewed on mobile, this may be due to the custom code used. We recommend checking the code used to see if there is extra padding. Excessive padding can make the font size appear smaller on a mobile device. Additionally, we recommend using pixels for the font size instead of points or percentages and using a Media Query to adjust the design for different screen resolutions. A Media Query is a piece of code in your website's CSS that requests information (such as the size of the visitor's browser screen) when loading your website.
We recommend testing the campaign as much as possible before actually sending it to your contacts.