Building emails

Fonts

Font selection - using a web safe font will ensure your recipients always see the design you want them to see. If you're using a specialized custom font be aware that not everyone will be able to view it.

Use global fonts - Knak allows you to define a font at the brand level which you can then build with by using the 'Inherit font' in the font section menu. That allows you to easily change the font in one place rather than in every email & module.

Images

File size - images can add lots of weight to your email which is a bad thing for email deliverability so keep the image file size as small as possible. Most image editing programs like Photoshop have an option to export a web friendly (smaller file size) version of an image which we recommend using.

Alt text - you should assume that some email recipients will have images blocked by default. Make sure you set relevant alt text to account for that. And ensure your ratio of image to text isn't too high so the email still works if images are blocked.

Animated images - we love animated images and fully support them in the Knak editor. Again keep the file size as small as possible. Keeping the number of frames you're using to a minimum will generally help here.

Image dimensions - we recommend using an image with a width that's twice as wide as the content block you're putting it in. That will ensure crisp 'retina' rendering on all devices. Never use an image that's smaller than the content block you're putting it in as that will result in stretching and blurring. Knak will show you a recommended image width for each image block you're using.

Videos - always host the video somewhere else and display a link to the video in your email. Using a screenshot of the video with a play button overlaid over the top is a good option here. 

Placeholder images - Instead of loading multiple images into your account for placeholders, head over to https://betterplaceholder.com/ and just grab a url for the size you need. Just paste that into the image url section and keep your image library clean.

File size

Keep it small - emails with lots of weight will see deliverability issues. Gmail will clip the end of any email that goes over 102kb and other clients may strip large images or reject the email altogether.
Keeping the number of sections you use to a minimum will help with reducing file size. Only start a new row if you need a different a different column layout.

Padding

Padding types - Knak allows you to set padding on a piece of content (text, image etc) and also on the row or column it's placed in. Using either type is fine, we recommend using the same type throughout your email to make editing simpler.

Padding consistency - Using the same padding on each side of an object will ensure it looks good on mobile as well as desktop. Uneven padding might not work so well when stacked for mobile.

Use special links

It goes without saying that your emails should always include an unsubscribe link which works and is easy to find. Consider adding 'forward to a friend' and 'view as webpage' as well. An email that's forwarded via an email client's forward button will likely not render well. A forward to a friend link will perform better.

Building for mobile

To stack or not to stack - Some multiple column designs might not look great when stacked, to avoid that use Knak's 'do not stack option'

Stacking order - switching the stacking order can improve mobile flow, Knak allows you to switch the stacking order based on your design needs.

Mobile specific designs - Knak allows to you completely hide any piece of content on desktop or mobile. So you can have duplicate content sections to allow separate designs for mobile & desktop.
A word or warning, including lots of duplicated content in your emails will add extra weight so use it wisely and only where you need it.

Modules

Module categories - create your module categories before building modules so you have those setup and can assign to each module while its being built.

Clone for consistency - if you have a specific layout (alignment, padding, spacing etc) a good option is to build one module and then clone that to create additional modules. That way your layout will always be the same.

Custom Themes (Enterprise only)

Build from modules - If you use modules to create your themes you can easily update multiple themes by selecting 'apply to themes' on any module. That will update each theme the module is used in with any changes to the module.

Brands

Define your brand attributes - Use brands to preset things like URL parameters, default from name/email & reply to email and your main colors. That way you don't have to set those each time you create an email.

Did this answer your question?