In Alto, to save you time and to help ensure your communication to your customers is on brand, you can now select a template to use when sending an ad hoc email. This article will help you understand and use Titles as a Content element.
When creating an email or a web page, you typically need to add titles to establish a hierarchy in your content. With the editor, you can create Title blocks so that the output HTML will render those titles with heading tags (H1, H2, H3).
Using heading tags in HTML is important for accessibility, as users that need a screen reader can navigate emails and web pages according to their headings, listen to a list of all headings, and skip to a desired heading to begin reading from that point.
- To add a Title, click the Title block available in the Content tab of the editor
- Drag it on to the message editing area (the stage) on the left to create a title block
The block has a “light” version of the text toolbar, similar to the one available for the Button block.
Looking at the Content Properties for this block:
- Use the Title property to select the proper heading style (H1/H2/H3)
- The properties highlighted in red are the ones that are missing from the usual text toolbar and are applied to the whole block
- The properties highlighted in green are applied to the whole block, unless the same setting has been changed for the whole block or for a part using the controls on the text toolbar. In that case, the colour selected with the toolbar won’t be overridden
Using Title for desktop vs mobile
By using two separate Title blocks and applying the Hide on desktop/mobile setting, you can have titles with the same title tag (e.g. H1) but with different font styling. This is handy if you need to differentiate title size and style on mobile and desktop, while keeping the same heading tag.