Guide to Creating Accessible PDF Exports in Emma:
If you're using Emma (by Marigold) to create and distribute email campaigns, you might wonder how to ensure your content remains accessible when exported as a PDF.
The good news is that Emma is a powerful tool, but the key to accessible PDF exports lies not in a hidden "accessibility button," but in how you build your email from the ground up within the Drag & Drop Editor. Let's dive into the essential steps to make your Emma PDF exports shine with accessibility.
The Foundation: Accessibility Starts in the Emma Editor
Think of your email's HTML structure as the blueprint for your PDF. Emma's "Export to PDF" feature essentially takes a snapshot of this underlying HTML. If the HTML is well-structured and semantically correct, your PDF will follow suit. If it's not, your PDF will inherit those limitations.
Here's how to build accessibility directly into your Emma email campaigns:
1. Harness the Power of Heading Tags with Title Blocks
- Why it matters: Headings (H1, H2, H3, etc.) are crucial for navigation and structure. Screen readers use them to allow users to jump between sections, much like scanning a table of contents. Without proper headings, your content becomes a flat wall of text.
- How to do it in Emma:
- Instead of just using a regular text block and making the text bold and large, use the dedicated "Title" content block.
- Once you've dragged a Title block into your email, click on it and look for the HTML Heading Tag option in the block settings (usually on the left-hand panel).
- Select the appropriate tag: H1 for your main campaign title, H2 for major sections, and H3 for sub-sections. Use them in a logical, hierarchical order.
2. Provide Context with Alt Text for Images
- Why it matters: Images can convey a wealth of information, but they are invisible to screen readers. Alt text (alternative text) describes the image's content and purpose, allowing visually impaired users to understand the visual message.
- How to do it in Emma:
- Whenever you add an image block to your email, click on the image.
- You'll see a field labeled "Alt text" in the settings panel.
- Fill this in with a concise yet descriptive explanation of the image. For example, instead of "logo," use "Company Name official logo." If an image is purely decorative and provides no meaningful content, you can sometimes leave alt text blank or set it as "" (empty quotes) to tell screen readers to ignore it, but descriptive alt text is generally best practice.
3. Structure Body Text with Paragraph Blocks
- Why it matters: Just like headings, paragraph tags (<p>) help define blocks of text, making them easier for screen readers to process and for users to understand the reading order.
- How to do it in Emma:
- Always use the "Paragraph" block for your main body copy. This ensures the underlying code is semantically correct, which translates directly to a more accessible PDF.
4. Create Order with List Blocks
- Why it matters: Lists are a common way to present information, but if they're just styled with hyphens or asterisks in a regular text block, a screen reader won't recognize them as a structured list. This can make the content confusing.
- How to do it in Emma:
- For bulleted or numbered information, use the dedicated "List" block. This block automatically generates the correct HTML (<ul> for unordered lists, <ol> for ordered lists), which the PDF will then interpret correctly.
5. Ensure Readability with High Contrast
- Why it matters: Sufficient color contrast between text and its background is vital for users with low vision, color blindness, or even those viewing your content in bright sunlight. The Web Content Accessibility Guidelines (WCAG) recommend a minimum contrast ratio of 4.5:1 for normal text.
- How to do it in Emma:
- Emma does not automatically adjust or flag low-contrast designs. It's up to you to manually check your color choices.
- Use an online color contrast checker (there are many free tools available) to test your text and background color combinations before finalizing your email design.
The Export Process: Getting Your Accessible PDF
Once your email is meticulously crafted with accessibility in mind, here's how to get your PDF:
- Recommended: If your Emma account tier includes a dedicated "Export" function, use this. It's typically designed to better preserve the underlying HTML structure and tags in the PDF.
- Alternative: You can usually select "Print" from your browser's options and then choose "Save as PDF" or "Print to PDF" from your printer dialogue box.
Verifying Accessibility: Is Your PDF Truly Accessible?
After exporting, it's crucial to verify the accessibility of your PDF. A common pitfall, especially when using a browser's "Print to PDF" function, is that the PDF might become "flattened" – essentially turning into one large image.
Open your exported PDF and try to highlight individual words or sentences. If you can't select text, your PDF is likely a flattened image and is not accessible to screen readers.
For a comprehensive check and to fix issues, use professional tools:
- Adobe Acrobat Pro: Open the PDF, go to "Tools" > "Accessibility," and run an "Accessibility Check." Acrobat can often "Autotag Document" if it detects a lack of structure.
- Online Accessibility Checkers: There are free online tools that can analyze your PDF for basic accessibility compliance.
Need an accessibility audit? Let's talk!
We’re working to co-create a digital world where people with disabilities can thrive. Reach out to us for a quick scan or an audit of your website.
