Guide
Email signature HTML best practices for Gmail and Outlook
Email clients render HTML far less consistently than browsers. These rules keep a signature looking the same in the inboxes that matter.
Published October 8, 2026 · 5 min read
Lay out with tables, not modern CSS
Build the structure with nested HTML tables. Many email clients, Outlook desktop in particular, ignore or mishandle flexbox, grid and floats, so a layout that looks perfect in a browser can collapse in an inbox.
Put styles inline
Apply fonts, colors and spacing as inline style attributes on each element. Do not rely on a style block in the head or on external stylesheets, because clients often strip them.
Host images and size them correctly
Use absolute HTTPS URLs
Host images on a reliable server. Attachments and embedded base64 images are not displayed consistently, including in Gmail.
Set width, height and alt text
Explicit dimensions stop the layout jumping, and alt text covers clients that block images.
Export at twice the display size
A logo shown at 150 pixels wide looks sharper on high-density screens when the file is 300 pixels wide.
Keep it compact
Google's own guidance for footer images is about 70 to 100 pixels high and no more than 100 pixels high by 1000 wide.
Choose safe fonts and clear colors
Use a web-safe font stack with a sensible fallback, because custom web fonts will not load in most clients. Set link colors explicitly so clients do not apply their own, and check contrast so the text stays readable.
What to leave out
Scripts, forms and video
Email clients block them.
Background images
Outlook desktop often drops them.
Very wide layouts
Keep the width near 600 pixels so it fits narrow panes.
Heavy markup
Gmail signatures are limited to 10,000 characters, so avoid bloated code.
Test before you deploy
Send the signature to real accounts in Gmail, Outlook and Apple Mail, on desktop and on a phone, in light and dark mode. Check images load, links work and the layout holds.
SigDeploy compiles every design to email-safe table HTML with inline styles, and lets you preview the signature as a real employee before you deploy it.
Frequently asked questions
Why do email signatures use tables?
Because email clients support table layout far more reliably than flexbox, grid or floats, especially Outlook desktop.
Can I use base64 images in a signature?
It is best not to. Embedded base64 images are not displayed consistently across clients, so host images at an HTTPS address instead.
How wide should an email signature be?
Keep it near 600 pixels wide or narrower so it fits in narrow reading panes and on phones.
Sources
Keep reading
- How to Set a Company-Wide Email Signature in Google WorkspaceThree ways to give every employee the same Gmail signature: the Admin console footer, the Gmail API, or a signature manager. Steps, limits and trade-offs.
- Signature builderDrag-and-drop design with live directory fields and email-safe HTML.
Stop chasing signatures.
Design it once. Deploy it to every inbox. See exactly who is updated.
$25 a month after the trial for up to 100 employees. Card required. Cancel any time.