Newsletter Redesign

I noticed that McClatchy’s email newsletter HTML template was full of bloat and errors, likely due to it being cobbled together by various developers at different skill levels over time and complicated by the fact that McClatchy switched ESPs twice during a period of about 3 years. I proposed a redesign and rebuild of the base template in order to resolve these problems as well as bring the newsletters completely in line with the Email Design System I developed. One of the goals with both the email design system and our website design system was to create brand consistency across all products.

The new newsletter template is modular, responsive and better matches our website designs, plus the overall code weight was reduced significantly. This template is used for hundreds of newsletter sends every single day throughout the company.

The old design used different fonts than our website and lacked a modular structure. It would frequently be clipped in Gmail for our markets who chose to put more content in their newsletters. The header logo did not match the website logo. Media queries did not work due to errors in the template.

old newsletter template

The new design uses the same fonts as the website and is built using our email design system which is modular and easier to update. It no longer clips in Gmail (unless someone goes rogue and puts a TON of stories in it). The header logo is the same as the one on the website. Media queries work.

redesigned newsletter template