New Sitepoint Email Newsletter Deisgns ROCK!

I love the new mobile friendly email newsletter templates that Sitepoint has created. The design must be responsive since the same emails display well on both a computer screen and a mobile device, but I’m wondering how. Though you can manipulate css with @media I don’t see how you’re changing html attributes. Are you using javascript for this? This would be a fantastic subject for a article! Is it possible to get some enlightenment on your techniques?


SitePoint uses CampaignMonitor to send out emails (so far as I know) and that company has some good info on sending mobile-friendly emails, such as here:

and here:

Hey Ralph

Thanks for the links. I went ahead and created an account and explored around a bit. I’m actually a Mailchimp user, but I’d move to CampaignMonitor if there was good enough reason.

I think it’s fairly safe to say that Sitepoint has created there own custom template. It looks like they are using @media to implement css instructions to set article thumb images to display none. This way each thumb doesn’t show on smaller screens and the cells collapse. I don’t see any ID’s or classes so I’m unclear how article thumbs are being hooked. Since the newsletter logo and footer icons do show they must have some way they are identifying the article thumbs.

The layout is so simple and so effective I just love it --But the number of tables used is enough to make my headspin:)

thanks for the info!