Non-Responsive Email Templates

Viewport META for a Static (Non-Responsive) Design

warning  All samples and many more templates are included in MailList Controller.

Template Tutorial   Download Free Version



The Viewport META Tag

MailList Controller includes templates using either a responsive or static (non-responsive) design. Responsive templates are great, but not the solution for every situation, e.g. if you need a static (fixed) width or if you want to use older templates, then you should adjust the viewport META tag.


Viewport for Responsive Templates:


<meta content="width=device-width, initial-scale=1.0" name="viewport">


It means the mobile device should use the maximum device width without zooming (initial-scale=1.0).


Viewport for Static (Non-Responsive) Templates:


<meta content="width=600" name="viewport">



Static (Non-Responsive) Templates on Mobiles

Using a static (non-responsive) template does not mean the message cannot be viewed on mobile devices. The mobile device will zoom to render the message within the client-width, so it's recommended to stay below 600px to make sure it's still readable in portrait (zoom around 50%) and landscape mode (zoom around 75%).




<meta content="width=480" name="viewport">
<meta content="width=600" name="viewport">
<meta content="width=770" name="viewport">


Initial Zoom/Scale:

You can use "initial-scale=1.0" to render the message in the original size (1:1, not zoomed) by default. This means the mail client will not zoom and the user has to scroll/pan to view your complete message. Use it for wide templates, which would become unreadable (text too small) if zoomed.


<meta content="width=1024, initial-scale=1.0; " name="viewport">



  • Don't use "maximum-scale=1.0" to setup a max. scale of 1.0!
  • Don't use "user-scalable=no" to disable zooming!


Template Tutorial