Szablony emaili: 50+ darmowych szablonów i najlepsze praktyki projektowania [2025]
Pobierz ponad 50 darmowych szablonów emaili do każdego zastosowania. Od newsletterów po promocje, znajdź konfigurowalne szablony i poznaj najlepsze praktyki projektowania.
Szablony emaili stanowią fundament efektywnego email marketingu. Niezależnie od tego, czy wysyłasz newslettery, kampanie promocyjne czy emaile transakcyjne, dobrze zaprojektowane szablony oszczędzają czas, zachowują spójność marki i poprawiają wskaźniki zaangażowania.
W tym kompleksowym przewodniku znajdziesz ponad 50 darmowych szablonów emaili w każdej głównej kategorii oraz najlepsze praktyki projektowania, które pomogą Ci tworzyć emaile generujące konwersje.
Dlaczego szablony emaili mają znaczenie
Liczby mówią same za siebie:
- 67% marketerów uważa projektowanie emaili za swoje największe wyzwanie
- 80% odbiorców natychmiast usuwa słabo zaprojektowane emaile
- Emaile z szablonów skracają czas produkcji o 75%
- Spójny branding zwiększa przychody nawet o 23%
Dobrze zaprojektowane szablony emaili rozwiązują te wyzwania, zapewniając jednocześnie, że każdy wysłany email wygląda profesjonalnie i zgodnie z marką.
Cztery układy, na żywo
Każdy panel poniżej to prawdziwy HTML wiadomości, w ramce o rzeczywistej szerokości. Zmniejsz szerokość do 375 px i zobacz, jak kolumny się układają jedna pod drugą.
Podąża za Twoim motywem — zmień go w nagłówku, aby zobaczyć drugi.
Przeczytaj HTML szablonu The Letter
<!DOCTYPE html>
<html lang="pl" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
<title>The Letter</title>
<style>
body { margin:0; padding:0; width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }
img { border:0; outline:none; line-height:100%; -ms-interpolation-mode:bicubic; display:block; }
a { text-decoration:underline; }
@media only screen and (max-width:620px) {
.wrap { width:100% !important; }
.stack { display:block !important; width:100% !important; max-width:100% !important; }
.gutter { padding-left:20px !important; padding-right:20px !important; }
.cta { display:block !important; width:100% !important; box-sizing:border-box !important; text-align:center !important; }
.h1 { font-size:26px !important; line-height:32px !important; }
.thumb { width:100% !important; height:auto !important; max-width:100% !important; }
/* A digest row is the one two-column layout that should NOT stack: the
thumbnail shrinks and stays beside the headline, because a roundup is
read by scanning and a full-width decorative image per story destroys
that. */
.row-thumb { width:80px !important; }
.row-thumb img { width:80px !important; height:80px !important; }
.hide-sm { display:none !important; }
}
@media (prefers-color-scheme: dark) {
.d-bg { background-color:#151515 !important; }
.d-card { background-color:#1c1c1c !important; }
.d-ink { color:#f2f2f2 !important; }
.d-mute { color:#a8a8a8 !important; }
.d-rule { border-color:#3a3a3a !important; }
}
</style>
</head>
<body class="d-bg" style="margin:0;padding:0;background-color:#f0efec;">
<span style="display:none;font-size:1px;color:#fefefe;line-height:1px;max-height:0;max-width:0;opacity:0;overflow:hidden;">Cytat, który trzymasz w notatniku, pracuje ciężej niż Twój kalendarz treści.</span><span style="display:none;font-size:1px;color:#fefefe;"> ͏ ͏ ͏ ͏ ͏</span>
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" class="d-bg" style="background-color:#f0efec;">
<tr><td align="center" style="padding:32px 12px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="600" class="wrap d-card" style="width:600px;max-width:600px;background-color:#ffffff;">
<tr><td style="padding:0;">
<img src="/_astro/letter-masthead.BcPkHvz4.png" width="600" height="250" alt="Winieta Meridian Press: koncentryczne niebieskie łuki przecięte ukośnym pasem" style="width:100%;height:auto;max-width:600px;">
</td></tr>
<tr><td class="gutter" style="padding:36px 88px 0 88px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-mute" style="margin:0 0 6px 0;font-size:13px;line-height:18px;letter-spacing:.08em;text-transform:uppercase;color:#6b6b6b;">Meridian Press · Numer 47</p>
</td></tr>
<tr><td class="gutter" style="padding:0 88px;font-family:Georgia,'Times New Roman',Times,serif;">
<h1 class="h1 d-ink" style="margin:0 0 20px 0;font-size:34px;line-height:42px;font-weight:400;color:#141414;">Archiwum jest produktem</h1>
<p class="d-ink" style="margin:0 0 20px 0;font-size:18px;line-height:30px;color:#242424;">Trzy tygodnie temu szukałem tekstu, który napisałem w 2019 roku, i nie znalazłem go. Ani na stronie, ani w eksporcie, ani w wyszukiwarce samej platformy. Tysiąc dwieście numerów, a jedynym działającym indeksem była moja pamięć.</p>
<p class="d-ink" style="margin:0 0 20px 0;font-size:18px;line-height:30px;color:#242424;">Tego nikt nie mówi o sześciu latach prowadzenia newslettera. Wysyłanie jest łatwe. Przechowywanie nie.</p>
</td></tr>
<tr><td class="gutter" style="padding:8px 88px 28px 88px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%">
<tr><td class="quote" style="border-left:3px solid #0084d1;padding:4px 0 4px 0;padding-left:20px;font-family:Georgia,'Times New Roman',Times,serif;">
<p class="d-ink" style="margin:0;font-size:19px;line-height:30px;font-style:italic;color:#141414;">Wszystko, co publikujesz, jest wpłatą. Prawie nikt nie buduje wypłaty.</p>
</td></tr>
</table>
</td></tr>
<tr><td class="gutter" style="padding:0 88px;font-family:Georgia,'Times New Roman',Times,serif;">
<p class="d-ink" style="margin:0 0 20px 0;font-size:18px;line-height:30px;color:#242424;">W tym tygodniu przebudowałem więc archiwum na prawdziwe archiwum: z tagami, wyszukiwaniem pełnotekstowym i trwałymi adresami. Zajęło to dziewięć dni. Liczba subskrybentów nie drgnęła. Czas spędzony na stronie potroił się.</p>
<p class="d-ink" style="margin:0 0 28px 0;font-size:18px;line-height:30px;color:#242424;">Całość poniżej, łącznie z tym, co się nie udało.</p>
</td></tr>
<tr><td class="gutter" style="padding:0 88px 36px 88px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<a href="https://example.com" style="font-size:17px;line-height:24px;font-weight:600;color:#0084d1;text-decoration:underline;">Przeczytaj cały numer →</a>
</td></tr>
<tr><td class="gutter d-rule" style="padding:0 88px;border-top:1px solid #e4e2de;"></td></tr>
<tr><td class="gutter" style="padding:24px 88px 40px 88px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-mute" style="margin:0 0 10px 0;font-size:14px;line-height:22px;color:#6b6b6b;">Pisane ręcznie w każdy czwartek. Odpowiedz, a przeczytam.</p>
<p class="d-mute" style="margin:0;font-size:13px;line-height:20px;color:#8a8a8a;">Meridian Press, 14 Harbour Lane, Bristol BS1 4TT<br>
<a href="https://example.com" class="d-mute" style="color:#8a8a8a;">Wypisz się</a> · <a href="https://example.com" class="d-mute" style="color:#8a8a8a;">Zobacz w przeglądarce</a></p>
</td></tr>
</table>
</td></tr>
</table>
</body>
</html> Podąża za Twoim motywem — zmień go w nagłówku, aby zobaczyć drugi.
Przeczytaj HTML szablonu The Digest
<!DOCTYPE html>
<html lang="pl" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
<title>The Digest</title>
<style>
body { margin:0; padding:0; width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }
img { border:0; outline:none; line-height:100%; -ms-interpolation-mode:bicubic; display:block; }
a { text-decoration:underline; }
@media only screen and (max-width:620px) {
.wrap { width:100% !important; }
.stack { display:block !important; width:100% !important; max-width:100% !important; }
.gutter { padding-left:20px !important; padding-right:20px !important; }
.cta { display:block !important; width:100% !important; box-sizing:border-box !important; text-align:center !important; }
.h1 { font-size:26px !important; line-height:32px !important; }
.thumb { width:100% !important; height:auto !important; max-width:100% !important; }
/* A digest row is the one two-column layout that should NOT stack: the
thumbnail shrinks and stays beside the headline, because a roundup is
read by scanning and a full-width decorative image per story destroys
that. */
.row-thumb { width:80px !important; }
.row-thumb img { width:80px !important; height:80px !important; }
.hide-sm { display:none !important; }
}
@media (prefers-color-scheme: dark) {
.d-bg { background-color:#131313 !important; }
.d-card { background-color:#1b1b1b !important; }
.d-ink { color:#f3f3f3 !important; }
.d-mute { color:#a5a5a5 !important; }
.d-rule { border-color:#333333 !important; }
.d-chip { background-color:#10352f !important; color:#7fd8c6 !important; }
}
</style>
</head>
<body class="d-bg" style="margin:0;padding:0;background-color:#f4f3f0;">
<span style="display:none;font-size:1px;color:#fefefe;line-height:1px;max-height:0;max-width:0;opacity:0;overflow:hidden;">Sześć rzeczy wartych Twojego wtorku. Dwie dotyczą cen.</span><span style="display:none;font-size:1px;color:#fefefe;"> ͏ ͏ ͏ ͏ ͏</span>
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" class="d-bg" style="background-color:#f4f3f0;">
<tr><td align="center" style="padding:28px 12px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="600" class="wrap d-card" style="width:600px;max-width:600px;background-color:#ffffff;border-radius:6px;">
<tr><td class="gutter" style="padding:30px 32px 22px 32px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td valign="middle" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-ink" style="margin:0;font-size:20px;line-height:26px;font-weight:800;color:#141414;">The Tuesday Digest</p>
<p class="d-mute" style="margin:4px 0 0 0;font-size:14px;line-height:20px;color:#6b6b6b;">26 sierpnia 2026 · 6 tematów · 9 min</p>
</td>
<td valign="middle" align="right" class="hide-sm">
<span class="d-chip" style="display:inline-block;background:#e2f4ef;color:#00614f;border-radius:999px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:12px;font-weight:700;padding:6px 12px;">NUMER 212</span>
</td>
</tr>
</table>
</td></tr>
<tr><td class="gutter" style="padding:0 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="d-rule" style="border-top:2px solid #141414;font-size:0;line-height:0;"> </td></tr></table></td></tr>
<tr><td class="gutter" style="padding:0 32px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" style="padding:22px 0;">
<tr>
<td class="row-thumb" width="112" valign="top" style="width:112px;padding:0;padding-right:20px;">
<img src="/_astro/digest-1.gDWNYw1C.png" width="112" height="112" alt="Abstrakcyjne turkusowe łuki przecięte ukośnym pasem" style="width:112px;height:112px;border-radius:4px;">
</td>
<td valign="top" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-mute" style="margin:0 0 6px 0;font-size:12px;line-height:16px;letter-spacing:.06em;text-transform:uppercase;color:#007d6a;">01 · CENY</p>
<p style="margin:0 0 6px 0;font-size:18px;line-height:26px;font-weight:700;">
<a href="https://example.com" class="d-ink" style="color:#141414;text-decoration:none;">Trzy firmy przeszły na rozliczanie za użycie, dwie się wycofały</a>
</p>
<p class="d-mute" style="margin:0;font-size:16px;line-height:26px;color:#555555;">Obie, które się wycofały, mówią to samo: obciążenie wsparcia wzrosło wcześniej niż przychód.</p>
</td>
</tr>
</table>
</td></tr>
<tr><td class="gutter" style="padding:0 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="d-rule" style="border-top:1px solid #eceae6;font-size:0;line-height:0;"> </td></tr></table></td></tr>
<tr><td class="gutter" style="padding:0 32px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" style="padding:22px 0;">
<tr>
<td class="row-thumb" width="112" valign="top" style="width:112px;padding:0;padding-right:20px;">
<img src="/_astro/digest-2.ch7Avmad.png" width="112" height="112" alt="Abstrakcyjne turkusowe pierścienie z przesuniętym punktem ogniskowym" style="width:112px;height:112px;border-radius:4px;">
</td>
<td valign="top" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-mute" style="margin:0 0 6px 0;font-size:12px;line-height:16px;letter-spacing:.06em;text-transform:uppercase;color:#007d6a;">02 · DOSTARCZALNOŚĆ</p>
<p style="margin:0 0 6px 0;font-size:18px;line-height:26px;font-weight:700;">
<a href="https://example.com" class="d-ink" style="color:#141414;text-decoration:none;">Zasady Gmaila dla masowych nadawców mają rok. Oto co naprawdę się zmieniło</a>
</p>
<p class="d-mute" style="margin:0;font-size:16px;line-height:26px;color:#555555;">Wskaźnik zgłoszeń to jedyny próg, do którego ktokolwiek się zbliżył. Reszta była już oczywistością.</p>
</td>
</tr>
</table>
</td></tr>
<tr><td class="gutter" style="padding:0 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="d-rule" style="border-top:1px solid #eceae6;font-size:0;line-height:0;"> </td></tr></table></td></tr>
<tr><td class="gutter" style="padding:0 32px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" style="padding:22px 0;">
<tr>
<td class="row-thumb" width="112" valign="top" style="width:112px;padding:0;padding-right:20px;">
<img src="/_astro/digest-3.DP0eG3wj.png" width="112" height="112" alt="Abstrakcyjne koncentryczne turkusowe łuki na złamanej bieli" style="width:112px;height:112px;border-radius:4px;">
</td>
<td valign="top" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-mute" style="margin:0 0 6px 0;font-size:12px;line-height:16px;letter-spacing:.06em;text-transform:uppercase;color:#007d6a;">03 · RZEMIOSŁO</p>
<p style="margin:0 0 6px 0;font-size:18px;line-height:26px;font-weight:700;">
<a href="https://example.com" class="d-ink" style="color:#141414;text-decoration:none;">Archiwum newslettera to produkt wyszukiwania, a nie lista odnośników</a>
</p>
<p class="d-mute" style="margin:0;font-size:16px;line-height:26px;color:#555555;">Dziewięć dni pracy, zero wzrostu subskrypcji, trzykrotnie dłuższy czas na stronie. Ciekawy jest kompromis.</p>
</td>
</tr>
</table>
</td></tr>
<tr><td class="gutter" style="padding:0 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="d-rule" style="border-top:1px solid #eceae6;font-size:0;line-height:0;"> </td></tr></table></td></tr>
<tr><td class="gutter" style="padding:24px 32px 34px 32px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-mute" style="margin:0 0 14px 0;font-size:15px;line-height:24px;color:#555555;">Trzy kolejne niżej, w tym ten o fakturowaniu, na który odpisują wszyscy.</p>
<!--[if mso]><table role="presentation" cellpadding="0" cellspacing="0" border="0"><tr><td bgcolor="#007d6a" style="border-radius:4px;"><![endif]-->
<a href="https://example.com" class="cta" style="background:#007d6a;border-radius:4px;color:#ffffff;display:inline-block;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:16px;font-weight:600;line-height:20px;padding:14px 28px;text-align:center;text-decoration:none;mso-padding-alt:0;">Przeczytaj wszystkie sześć</a>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
<tr><td class="gutter d-rule" style="padding:0 32px;border-top:1px solid #eceae6;"></td></tr>
<tr><td class="gutter" style="padding:20px 32px 30px 32px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-mute" style="margin:0;font-size:13px;line-height:20px;color:#8a8a8a;">The Tuesday Digest, 9 Fitzroy Street, Manchester M1 2AL<br>
<a href="https://example.com" class="d-mute" style="color:#8a8a8a;">Wypisz się</a> · <a href="https://example.com" class="d-mute" style="color:#8a8a8a;">Zarządzaj preferencjami</a> · <a href="https://example.com" class="d-mute" style="color:#8a8a8a;">Zobacz w przeglądarce</a></p>
</td></tr>
</table>
</td></tr>
</table>
</body>
</html> Podąża za Twoim motywem — zmień go w nagłówku, aby zobaczyć drugi.
Przeczytaj HTML szablonu The Storefront
<!DOCTYPE html>
<html lang="pl" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
<title>The Storefront</title>
<style>
body { margin:0; padding:0; width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }
img { border:0; outline:none; line-height:100%; -ms-interpolation-mode:bicubic; display:block; }
a { text-decoration:underline; }
@media only screen and (max-width:620px) {
.wrap { width:100% !important; }
.stack { display:block !important; width:100% !important; max-width:100% !important; }
.gutter { padding-left:20px !important; padding-right:20px !important; }
.cta { display:block !important; width:100% !important; box-sizing:border-box !important; text-align:center !important; }
.h1 { font-size:26px !important; line-height:32px !important; }
.thumb { width:100% !important; height:auto !important; max-width:100% !important; }
/* A digest row is the one two-column layout that should NOT stack: the
thumbnail shrinks and stays beside the headline, because a roundup is
read by scanning and a full-width decorative image per story destroys
that. */
.row-thumb { width:80px !important; }
.row-thumb img { width:80px !important; height:80px !important; }
.hide-sm { display:none !important; }
}
@media (prefers-color-scheme: dark) {
.d-bg { background-color:#141210 !important; }
.d-card { background-color:#1d1a18 !important; }
.d-ink { color:#f5f2ef !important; }
.d-mute { color:#aaa39d !important; }
.d-rule { border-color:#38322d !important; }
.d-tile { background-color:#241f1c !important; }
}
</style>
</head>
<body class="d-bg" style="margin:0;padding:0;background-color:#efece8;">
<span style="display:none;font-size:1px;color:#fefefe;line-height:1px;max-height:0;max-width:0;opacity:0;overflow:hidden;">Cztery nowe grafiki. Ta z portem ma 40 egzemplarzy i nie dotrwa do końca tygodnia.</span><span style="display:none;font-size:1px;color:#fefefe;"> ͏ ͏ ͏ ͏ ͏</span>
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" class="d-bg" style="background-color:#efece8;">
<tr><td align="center" style="padding:24px 12px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="600" class="wrap d-card" style="width:600px;max-width:600px;background-color:#ffffff;">
<tr><td class="gutter" style="padding:22px 24px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr>
<td class="d-ink" style="font-size:17px;line-height:22px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#141414;">Northlight</td>
<td align="right" class="d-mute hide-sm" style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:13px;line-height:20px;color:#6b6b6b;">Jesienna kolekcja · 04</td>
</tr></table>
</td></tr>
<tr><td style="padding:0;">
<img src="/_astro/shop-hero.r4mykM_E.png" width="600" height="360" alt="Cztery nowe grafiki Northlight: nakładające się rdzawoczerwone łuki na ciepłej złamanej bieli" style="width:100%;height:auto;max-width:600px;">
</td></tr>
<tr><td class="gutter" style="padding:30px 40px 0 40px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<h1 class="h1 d-ink" style="margin:0 0 12px 0;font-size:30px;line-height:38px;font-weight:800;color:#141414;">Cztery grafiki. Po czterdzieści egzemplarzy.</h1>
<p class="d-mute" style="margin:0 0 22px 0;font-size:16px;line-height:26px;color:#555555;">Każda grafika z tej kolekcji jest odbijana ręcznie, numerowana i znika, gdy się skończy. Nic tu nie jest dodrukowywane.</p>
</td></tr>
<tr><td class="gutter" style="padding:0 40px 26px 40px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<!--[if mso]><table role="presentation" cellpadding="0" cellspacing="0" border="0"><tr><td bgcolor="#b8442d" style="border-radius:4px;"><![endif]-->
<a href="https://example.com" class="cta" style="background:#b8442d;border-radius:4px;color:#ffffff;display:inline-block;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:16px;font-weight:600;line-height:20px;padding:14px 28px;text-align:center;text-decoration:none;mso-padding-alt:0;">Zobacz kolekcję</a>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
<tr><td class="gutter" style="padding:0 32px 8px 32px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td class="stack" width="50%" valign="top" style="width:50%;padding:0 8px 16px 8px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" class="d-tile" style="background-color:#faf9f7;border-radius:4px;">
<tr><td style="padding:0;"><img src="/_astro/shop-print-1.B7Z7OyM8.png" width="272" height="272" alt="Harbour, abstrakcyjna grafika w kolorze rdzawej czerwieni" class="thumb" style="width:100%;height:auto;border-radius:4px 4px 0 0;"></td></tr>
<tr><td style="padding:16px 16px 18px 16px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-ink" style="margin:0 0 2px 0;font-size:16px;line-height:22px;font-weight:700;color:#141414;">Harbour</p>
<p class="d-mute" style="margin:0 0 10px 0;font-size:14px;line-height:20px;color:#6b6b6b;">50 × 70 cm · giclée na papierze bawełnianym</p>
<p style="margin:0 0 14px 0;font-size:18px;line-height:24px;font-weight:700;color:#b8442d;">£85</p>
<!--[if mso]><table role="presentation" cellpadding="0" cellspacing="0" border="0"><tr><td bgcolor="#b8442d" style="border-radius:4px;"><![endif]-->
<a href="https://example.com" class="cta" style="background:#b8442d;border-radius:4px;color:#ffffff;display:inline-block;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:16px;font-weight:600;line-height:20px;padding:14px 28px;text-align:center;text-decoration:none;mso-padding-alt:0;">Dodaj do koszyka</a>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
</table>
</td>
<td class="stack" width="50%" valign="top" style="width:50%;padding:0 8px 16px 8px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" class="d-tile" style="background-color:#faf9f7;border-radius:4px;">
<tr><td style="padding:0;"><img src="/_astro/shop-print-2.CMBKLJ38.png" width="272" height="272" alt="Dusk, abstrakcyjna grafika w kolorze bursztynu" class="thumb" style="width:100%;height:auto;border-radius:4px 4px 0 0;"></td></tr>
<tr><td style="padding:16px 16px 18px 16px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-ink" style="margin:0 0 2px 0;font-size:16px;line-height:22px;font-weight:700;color:#141414;">Dusk</p>
<p class="d-mute" style="margin:0 0 10px 0;font-size:14px;line-height:20px;color:#6b6b6b;">50 × 70 cm · giclée na papierze bawełnianym</p>
<p style="margin:0 0 14px 0;font-size:18px;line-height:24px;font-weight:700;color:#b8442d;">£85</p>
<!--[if mso]><table role="presentation" cellpadding="0" cellspacing="0" border="0"><tr><td bgcolor="#b8442d" style="border-radius:4px;"><![endif]-->
<a href="https://example.com" class="cta" style="background:#b8442d;border-radius:4px;color:#ffffff;display:inline-block;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:16px;font-weight:600;line-height:20px;padding:14px 28px;text-align:center;text-decoration:none;mso-padding-alt:0;">Dodaj do koszyka</a>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
</table>
</td>
</tr>
<tr>
<td class="stack" width="50%" valign="top" style="width:50%;padding:0 8px 16px 8px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" class="d-tile" style="background-color:#faf9f7;border-radius:4px;">
<tr><td style="padding:0;"><img src="/_astro/shop-print-3.C9XLoBz6.png" width="272" height="272" alt="Tide, abstrakcyjna grafika w kolorze fioletu" class="thumb" style="width:100%;height:auto;border-radius:4px 4px 0 0;"></td></tr>
<tr><td style="padding:16px 16px 18px 16px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-ink" style="margin:0 0 2px 0;font-size:16px;line-height:22px;font-weight:700;color:#141414;">Tide</p>
<p class="d-mute" style="margin:0 0 10px 0;font-size:14px;line-height:20px;color:#6b6b6b;">40 × 50 cm · giclée na papierze bawełnianym</p>
<p style="margin:0 0 14px 0;font-size:18px;line-height:24px;font-weight:700;color:#b8442d;">£65</p>
<!--[if mso]><table role="presentation" cellpadding="0" cellspacing="0" border="0"><tr><td bgcolor="#b8442d" style="border-radius:4px;"><![endif]-->
<a href="https://example.com" class="cta" style="background:#b8442d;border-radius:4px;color:#ffffff;display:inline-block;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:16px;font-weight:600;line-height:20px;padding:14px 28px;text-align:center;text-decoration:none;mso-padding-alt:0;">Dodaj do koszyka</a>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
</table>
</td>
<td class="stack" width="50%" valign="top" style="width:50%;padding:0 8px 16px 8px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" class="d-tile" style="background-color:#faf9f7;border-radius:4px;">
<tr><td style="padding:0;"><img src="/_astro/shop-print-4.jL_6WDwF.png" width="272" height="272" alt="Quarry, abstrakcyjna grafika w kolorze głębokiej zieleni" class="thumb" style="width:100%;height:auto;border-radius:4px 4px 0 0;"></td></tr>
<tr><td style="padding:16px 16px 18px 16px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-ink" style="margin:0 0 2px 0;font-size:16px;line-height:22px;font-weight:700;color:#141414;">Quarry</p>
<p class="d-mute" style="margin:0 0 10px 0;font-size:14px;line-height:20px;color:#6b6b6b;">40 × 50 cm · giclée na papierze bawełnianym</p>
<p style="margin:0 0 14px 0;font-size:18px;line-height:24px;font-weight:700;color:#b8442d;">£65</p>
<!--[if mso]><table role="presentation" cellpadding="0" cellspacing="0" border="0"><tr><td bgcolor="#b8442d" style="border-radius:4px;"><![endif]-->
<a href="https://example.com" class="cta" style="background:#b8442d;border-radius:4px;color:#ffffff;display:inline-block;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:16px;font-weight:600;line-height:20px;padding:14px 28px;text-align:center;text-decoration:none;mso-padding-alt:0;">Dodaj do koszyka</a>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
</table>
</td>
</tr>
</table>
</td></tr>
<tr><td class="gutter" style="padding:6px 40px 30px 40px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" class="d-tile" style="background:#faf9f7;border-radius:4px;">
<tr><td style="padding:16px 20px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-ink" style="margin:0;font-size:15px;line-height:24px;color:#242424;"><strong>Darmowa wysyłka na terenie Wielkiej Brytanii od 75 £.</strong> Opcje oprawy przy płatności. Zwroty w ciągu 30 dni, bez ramy.</p>
</td></tr>
</table>
</td></tr>
<tr><td class="gutter d-rule" style="padding:0 40px;border-top:1px solid #ebe7e2;"></td></tr>
<tr><td class="gutter" style="padding:20px 40px 30px 40px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-mute" style="margin:0;font-size:13px;line-height:20px;color:#8a8a8a;">Northlight Print Co., Unit 4 Wharf Road, Leeds LS10 1JQ<br>
<a href="https://example.com" class="d-mute" style="color:#8a8a8a;">Wypisz się</a> · <a href="https://example.com" class="d-mute" style="color:#8a8a8a;">Zobacz w przeglądarce</a></p>
</td></tr>
</table>
</td></tr>
</table>
</body>
</html> Podąża za Twoim motywem — zmień go w nagłówku, aby zobaczyć drugi.
Przeczytaj HTML szablonu The Brief
<!DOCTYPE html>
<html lang="pl" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
<title>The Brief</title>
<style>
body { margin:0; padding:0; width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }
img { border:0; outline:none; line-height:100%; -ms-interpolation-mode:bicubic; display:block; }
a { text-decoration:underline; }
@media only screen and (max-width:620px) {
.wrap { width:100% !important; }
.stack { display:block !important; width:100% !important; max-width:100% !important; }
.gutter { padding-left:20px !important; padding-right:20px !important; }
.cta { display:block !important; width:100% !important; box-sizing:border-box !important; text-align:center !important; }
.h1 { font-size:26px !important; line-height:32px !important; }
.thumb { width:100% !important; height:auto !important; max-width:100% !important; }
/* A digest row is the one two-column layout that should NOT stack: the
thumbnail shrinks and stays beside the headline, because a roundup is
read by scanning and a full-width decorative image per story destroys
that. */
.row-thumb { width:80px !important; }
.row-thumb img { width:80px !important; height:80px !important; }
.hide-sm { display:none !important; }
}
@media (prefers-color-scheme: dark) {
.d-bg { background-color:#121212 !important; }
.d-card { background-color:#1a1a1a !important; }
.d-ink { color:#f2f2f2 !important; }
.d-mute { color:#a6a6a6 !important; }
.d-rule { border-color:#333333 !important; }
.d-tile { background-color:#232323 !important; }
.d-track { background-color:#2c2c2c !important; }
}
</style>
</head>
<body class="d-bg" style="margin:0;padding:0;background-color:#f1f0f4;">
<span style="display:none;font-size:1px;color:#fefefe;line-height:1px;max-height:0;max-width:0;opacity:0;overflow:hidden;">Wskaźnik odpowiedzi rośnie o 4 punkty i wciąż nie wiemy dlaczego. Najlepsza hipoteza w środku.</span><span style="display:none;font-size:1px;color:#fefefe;"> ͏ ͏ ͏ ͏ ͏</span>
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" class="d-bg" style="background-color:#f1f0f4;">
<tr><td align="center" style="padding:26px 12px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="600" class="wrap d-card" style="width:600px;max-width:600px;background-color:#ffffff;border-radius:6px;">
<tr><td style="padding:0;background:#141414;border-radius:6px 6px 0 0;">
<img src="/_astro/brief-band.CsaAK-Uv.png" width="600" height="150" alt="Winieta Ledger Weekly: fioletowe łuki na niemal czarnym tle" style="width:100%;height:auto;max-width:600px;border-radius:6px 6px 0 0;">
</td></tr>
<tr><td class="gutter" style="padding:26px 32px 18px 32px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p style="margin:0 0 4px 0;font-size:12px;line-height:16px;letter-spacing:.1em;text-transform:uppercase;color:#8f83ff;">Ledger Weekly · Tydzień 35</p>
<h1 class="h1 d-ink" style="margin:0;font-size:26px;line-height:34px;font-weight:800;color:#141414;">Wskaźnik odpowiedzi drgnął, a nikt niczego nie wydał</h1>
</td></tr>
<tr><td class="gutter" style="padding:0 26px 8px 26px;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr>
<td class="stack" width="33.33%" valign="top" style="width:33.33%;padding:0 6px;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" class="d-tile" style="background:#f6f5f8;border-radius:4px;">
<tr><td style="padding:18px 16px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-ink" style="margin:0 0 2px 0;font-size:30px;line-height:36px;font-weight:800;color:#141414;">31.4%</p>
<p class="d-mute" style="margin:0 0 6px 0;font-size:13px;line-height:18px;color:#6b6b6b;">Wskaźnik otwarć</p>
<p style="margin:0;font-size:13px;line-height:18px;font-weight:700;color:#007d6a;">▲ 1,2 pkt</p>
</td></tr>
</table>
</td>
<td class="stack" width="33.33%" valign="top" style="width:33.33%;padding:0 6px;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" class="d-tile" style="background:#f6f5f8;border-radius:4px;">
<tr><td style="padding:18px 16px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-ink" style="margin:0 0 2px 0;font-size:30px;line-height:36px;font-weight:800;color:#141414;">8.9%</p>
<p class="d-mute" style="margin:0 0 6px 0;font-size:13px;line-height:18px;color:#6b6b6b;">Wskaźnik kliknięć</p>
<p style="margin:0;font-size:13px;line-height:18px;font-weight:700;color:#b8442d;">▼ 0,4 pkt</p>
</td></tr>
</table>
</td>
<td class="stack" width="33.33%" valign="top" style="width:33.33%;padding:0 6px;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" class="d-tile" style="background:#f6f5f8;border-radius:4px;">
<tr><td style="padding:18px 16px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-ink" style="margin:0 0 2px 0;font-size:30px;line-height:36px;font-weight:800;color:#141414;">6.1%</p>
<p class="d-mute" style="margin:0 0 6px 0;font-size:13px;line-height:18px;color:#6b6b6b;">Wskaźnik odpowiedzi</p>
<p style="margin:0;font-size:13px;line-height:18px;font-weight:700;color:#007d6a;">▲ 4,0 pkt</p>
</td></tr>
</table>
</td>
</tr></table>
</td></tr>
<tr><td class="gutter" style="padding:20px 32px 0 32px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-ink" style="margin:0 0 18px 0;font-size:16px;line-height:26px;color:#242424;">W wysyłce nic się nie zmieniło. Ta sama lista, ten sam czwartek, ten sam szablon. Jedyna zmienna, jaką znajdujemy, to że temat po raz pierwszy od jedenastu numerów zadawał pytanie.</p>
<p class="d-mute" style="margin:0 0 10px 0;font-size:12px;line-height:16px;letter-spacing:.08em;text-transform:uppercase;color:#6b6b6b;">Odpowiedzi według segmentu</p>
</td></tr>
<tr><td class="gutter" style="padding:0 32px 22px 32px;">
<table role="presentation" class="chart" width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="150" valign="middle" class="d-ink" style="width:150px;padding:7px 0;padding-right:12px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:15px;line-height:20px;color:#242424;">Subskrybenci płatni</td>
<td valign="middle" style="padding:7px 0;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" class="d-track" style="background:#ebe9f2;border-radius:2px;">
<tr><td width="100%" style="width:100%;background:#8f83ff;border-radius:2px;font-size:0;line-height:0;height:18px;"> </td><td style="font-size:0;line-height:0;"> </td></tr>
</table>
</td>
<td width="64" align="right" valign="middle" class="d-mute" style="width:64px;padding:7px 0;padding-left:12px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px;font-weight:700;color:#555555;">11.2%</td>
</tr>
<tr>
<td width="150" valign="middle" class="d-ink" style="width:150px;padding:7px 0;padding-right:12px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:15px;line-height:20px;color:#242424;">Bezpłatni, aktywni 90 dni</td>
<td valign="middle" style="padding:7px 0;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" class="d-track" style="background:#ebe9f2;border-radius:2px;">
<tr><td width="57%" style="width:57%;background:#8f83ff;border-radius:2px;font-size:0;line-height:0;height:18px;"> </td><td style="font-size:0;line-height:0;"> </td></tr>
</table>
</td>
<td width="64" align="right" valign="middle" class="d-mute" style="width:64px;padding:7px 0;padding-left:12px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px;font-weight:700;color:#555555;">6.4%</td>
</tr>
<tr>
<td width="150" valign="middle" class="d-ink" style="width:150px;padding:7px 0;padding-right:12px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:15px;line-height:20px;color:#242424;">Bezpłatni, uśpieni</td>
<td valign="middle" style="padding:7px 0;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" class="d-track" style="background:#ebe9f2;border-radius:2px;">
<tr><td width="16%" style="width:16%;background:#8f83ff;border-radius:2px;font-size:0;line-height:0;height:18px;"> </td><td style="font-size:0;line-height:0;"> </td></tr>
</table>
</td>
<td width="64" align="right" valign="middle" class="d-mute" style="width:64px;padding:7px 0;padding-left:12px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px;font-weight:700;color:#555555;">1.8%</td>
</tr>
<tr>
<td width="150" valign="middle" class="d-ink" style="width:150px;padding:7px 0;padding-right:12px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:15px;line-height:20px;color:#242424;">Okres próbny</td>
<td valign="middle" style="padding:7px 0;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" class="d-track" style="background:#ebe9f2;border-radius:2px;">
<tr><td width="44%" style="width:44%;background:#8f83ff;border-radius:2px;font-size:0;line-height:0;height:18px;"> </td><td style="font-size:0;line-height:0;"> </td></tr>
</table>
</td>
<td width="64" align="right" valign="middle" class="d-mute" style="width:64px;padding:7px 0;padding-left:12px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px;font-weight:700;color:#555555;">4.9%</td>
</tr>
</table>
</td></tr>
<tr><td class="gutter" style="padding:0 32px 28px 32px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<!--[if mso]><table role="presentation" cellpadding="0" cellspacing="0" border="0"><tr><td bgcolor="#141414" style="border-radius:4px;"><![endif]-->
<a href="https://example.com" class="cta" style="background:#141414;border-radius:4px;color:#ffffff;display:inline-block;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:16px;font-weight:600;line-height:20px;padding:14px 28px;text-align:center;text-decoration:none;mso-padding-alt:0;">Przeczytaj pełną analizę</a>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
<tr><td class="gutter d-rule" style="padding:0 32px;border-top:1px solid #e9e7ee;"></td></tr>
<tr><td class="gutter" style="padding:20px 32px 28px 32px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;">
<p class="d-mute" style="margin:0;font-size:13px;line-height:20px;color:#8a8a8a;">Ledger Weekly, 2 Cathedral Square, Edinburgh EH1 2QN<br>
<a href="https://example.com" class="d-mute" style="color:#8a8a8a;">Wypisz się</a> · <a href="https://example.com" class="d-mute" style="color:#8a8a8a;">Zobacz w przeglądarce</a></p>
</td></tr>
</table>
</td></tr>
</table>
</body>
</html> Rodzaje potrzebnych szablonów emaili
Przed przejściem do konkretnych szablonów warto zrozumieć dostępne kategorie:
| Typ szablonu | Cel | Typowa częstotliwość |
|---|---|---|
| Powitalny | Onboarding nowych subskrybentów | Raz na subskrybenta |
| Newsletter | Regularne aktualizacje treści | Co tydzień/miesiąc |
| Promocyjny | Sprzedaż i oferty | W razie potrzeby |
| Transakcyjny | Aktualizacje zamówień/konta | Wyzwalane zdarzeniami |
| Reaktywacja | Odzyskanie nieaktywnych użytkowników | Co kwartał |
| Ogłoszeniowy | Aktualności i premiery | W razie potrzeby |
Szablony emaili powitalnych (5 szablonów)
Emaile powitalne wyznaczają ton relacji z subskrybentem. Mają 4 razy wyższe wskaźniki otwarć niż zwykłe emaile.
Szablon 1: Proste powitanie
Najlepszy dla: minimalistycznych marek, firm B2B
Temat: Witaj w [Marka]!
---
[LOGO]
Cześć [Imię],
Witaj na pokładzie!
Dołączyłeś właśnie do [X XXX] innych [klientów/czytelników/członków],którzy ufają nam w kwestii [propozycja wartości].
Czego możesz się spodziewać:
• Cotygodniowe [typ treści] w każdy [dzień]• Wyłączny dostęp do [korzyść]• Pierwszeństwo do [ofert/treści]
Zacznij od zapoznania się z naszymi najpopularniejszymi [treściami/produktami]:
[PRZYCISK CTA: Odkryj teraz]
Masz pytania? Po prostu odpowiedz na tego emaila.
Pozdrawiamy,Zespół [Marka]Uwagi do projektu:
- Układ jednokolumnowy
- Wyraźne umieszczenie logo
- Punkty wypunktowania dla łatwego skanowania
- Jedno wyraźne CTA
Szablon 2: Powitanie z rabatem
Najlepszy dla: e-commerce, marek DTC
Temat: Witaj! Twój kod -15% w środku
---
[OBRAZ HERO - Lifestyle/Produkt]
Witaj w [Marka], [Imię]!
Jako podziękowanie za dołączenie do naszej społeczności,oto 15% zniżki na pierwsze zamówienie:
╔═══════════════════════════════╗║ KOD: WELCOME15 ║╚═══════════════════════════════╝
[PRZYCISK CTA: Kup teraz]
Ten kod wygaśnie za 7 dni.
Pytania? Chętnie pomożemy.[Email kontaktowy] | [Telefon]
[IKONY MEDIÓW SPOŁECZNOŚCIOWYCH]Uwagi do projektu:
- Przyciągający wzrok obraz hero
- Wyraźne pole z kodem rabatowym
- Wyraźna data wygaśnięcia tworzy pilność
- Wiele opcji kontaktu
Szablon 3: Wieloczęściowe powitanie
Najlepszy dla: usług subskrypcyjnych, platform edukacyjnych
Temat: Witaj! Oto wszystko, co musisz wiedzieć
---
Hej [Imię]!
Witaj w [Marka]. Oto Twój szybki przewodnik startowy:
┌─────────────────────────────────┐│ 📖 PIERWSZE KROKI ││ ││ 1. Uzupełnij swój profil ││ 2. Ustaw preferencje ││ 3. Odkryj [kluczowa funkcja] ││ ││ [Rozpocznij konfigurację] │└─────────────────────────────────┘
┌─────────────────────────────────┐│ 🎁 TWÓJ PREZENT POWITALNY ││ ││ Użyj kodu NEWBIE20 na 20% zniżki││ na pierwszy [zakup/miesiąc] ││ ││ [Odbierz prezent] │└─────────────────────────────────┘
┌─────────────────────────────────┐│ 💬 POTRZEBUJESZ POMOCY? ││ ││ Nasz zespół jest dostępny 24/7 ││ przez czat, email lub telefon ││ ││ [Skontaktuj się z pomocą] │└─────────────────────────────────┘
Cieszymy się, że jesteś z nami!
Zespół [Marka]Uwagi do projektu:
- Układ kartowy
- Hierarchia wizualna z ikonami
- Wiele CTA dla różnych celów
- Kompleksowy onboarding
Szablon 4: Powitanie od założyciela
Najlepszy dla: małych marek, startupów
Temat: Osobista wiadomość od naszego założyciela
---
[ZDJĘCIE ZAŁOŻYCIELA - Naturalne/Autentyczne]
Cześć [Imię],
Jestem [Imię Założyciela] i chciałem/am osobiściepowitać Cię w [Marka].
Założyłem/am tę firmę [X] lat temu, ponieważ[krótka historia powstania].
Dziś pomogliśmy [osiągnięcie], ale naszamisja pozostaje ta sama: [główna misja].
Jako nowy członek naszej społeczności otrzymasz:
✓ [Korzyść 1]✓ [Korzyść 2]✓ [Korzyść 3]
Czytam każdą odpowiedź na te emaile, więc niewahaj się skontaktować z pytaniami, pomysłamilub po prostu żeby się przywitać.
Oto 15% zniżki na dobry start: FOUNDER15
[PRZYCISK CTA: Zacznij zakupy]
Z wdzięcznością,
[Podpis założyciela][Imię Założyciela]Założyciel i CEO
P.S. - Śledź naszą podróż: @[handle]Uwagi do projektu:
- Osobisty, autentyczny ton
- Zdjęcie założyciela buduje zaufanie
- Podpis dodaje ludzki wymiar
- P.S. wykorzystuje sekcję o wysokiej czytelności
Szablon 5: Interaktywne powitanie
Najlepszy dla: marek z różnorodnymi liniami produktów
Temat: Pomóż nam spersonalizować Twoje doświadczenie
---
Witaj w [Marka], [Imię]!
Zanim zaczniemy wysyłać Ci emaile,upewnijmy się, że będą dla Ciebie trafne.
Co Cię najbardziej interesuje?
[ ] Nowe produkty[ ] Wyprzedaże i promocje[ ] Wskazówki i poradniki[ ] Aktualności branżowe[ ] Wszystko powyższe
[ZAPISZ PREFERENCJE]
Znając Twoje preferencje, będziemy wysyłaćtylko to, co naprawdę wartościowe.
Dziękujemy za pomoc!
Zespół [Marka]
P.S. - Możesz je zaktualizować w dowolnym momencie,klikając „Preferencje" w każdym emailu.Uwagi do projektu:
- Interaktywny wybór preferencji
- Subskrybent ma kontrolę
- Umożliwia lepszą segmentację
- Zmniejsza przyszłe wypisy
Szablony newslettera (8 szablonów)
Newslettery utrzymują zaangażowanie odbiorców między zakupami. Oto szablony dla każdego formatu newslettera.
Szablon 6: Klasyczny newsletter
Najlepszy dla: regularnych podsumowań treści, cotygodniowych digestów
Temat: [Marka] Weekly: [Główny temat]
---
[LOGO]
[MARKA] WEEKLY[Data]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
WYRÓŻNIONA HISTORIA
[OBRAZ HERO]
[Nagłówek]
[Streszczenie głównej historii w 2-3 zdaniach]
[CZYTAJ WIĘCEJ]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
WIĘCEJ W TYM TYGODNIU
[MINIATURA] [Tytuł historii 2]Krótki opis...[Czytaj →]
[MINIATURA] [Tytuł historii 3]Krótki opis...[Czytaj →]
[MINIATURA] [Tytuł historii 4]Krótki opis...[Czytaj →]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
SZYBKIE LINKI
• [Link 1]• [Link 2]• [Link 3]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[IKONY MEDIÓW SPOŁECZNOŚCIOWYCH]
[Wypisz się] | [Preferencje] | [Wyświetl online]Uwagi do projektu:
- Wyraźna hierarchia wizualna
- Wyróżniona historia na pierwszym miejscu
- Łatwe do skanowania kolejne historie
- Sekcja szybkich linków
Szablon 7: Curated Digest
Najlepszy dla: aktualności branżowych, liderów opinii
Temat: 5 rzeczy, które musisz wiedzieć w tym tygodniu
---
[LOGO]
TYGODNIOWY DIGEST[Data] | Wydanie #[Numer]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Cześć [Imię],
Oto obowiązkowe lektury tego tygodnia:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
1️⃣ [NAGŁÓWEK 1]
[Streszczenie w 2-3 zdaniach z kluczowym wnioskiem]
💡 Dlaczego to ważne: [Spostrzeżenie w jednym zdaniu]
[Źródło/Link]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
2️⃣ [NAGŁÓWEK 2]
[Streszczenie w 2-3 zdaniach z kluczowym wnioskiem]
💡 Dlaczego to ważne: [Spostrzeżenie w jednym zdaniu]
[Źródło/Link]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
To wszystko na ten tydzień!
Odpowiedz i daj mi znać, która historianajbardziej trafiła do Ciebie.
[Podpis][Imię redaktora]Uwagi do projektu:
- Numerowany format tworzy strukturę
- „Dlaczego to ważne” dodaje wartość
- Osobiste zakończenie
- Zachęca do odpowiedzi
Szablon 8: Wizualny newsletter
Najlepszy dla: marek modowych, lifestylowych, kreatywnych
Temat: Nowości na [Sezon/Miesiąc]
---
[PEŁNOSZEROKI OBRAZ HERO]
[LOGO]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[GŁÓWNY NAGŁÓWEK][Tekst podtytułu]
[PRZYCISK CTA]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[SIATKA OBRAZÓW 2-KOLUMNOWA]
[Obraz 1] [Obraz 2][Podpis] [Podpis][Kup] [Kup]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
POPULARNE TERAZ
[SIATKA PRODUKTÓW 3-KOLUMNOWA]
[Produkt 1] [Produkt 2] [Produkt 3]XX zł XX zł XX zł[Kup] [Kup] [Kup]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[IKONY MEDIÓW SPOŁECZNOŚCIOWYCH]
[Linki w stopce]Uwagi do projektu:
- Projekt skoncentrowany na obrazach
- Układy siatkowe dla produktów
- Minimalny tekst
- Silna hierarchia wizualna
Szablon 9: Osobisty newsletter
Najlepszy dla: twórców, konsultantów, liderów opinii
Temat: [Osobista obserwacja lub myśl]
---
Hej [Imię],
[Otwierająca osobista anegdota lub obserwacja -2-3 zdania przyciągające uwagę czytelnika]
[Przejście do głównego tematu]
---
[SEKCJA GŁÓWNEJ TREŚCI]
[Treść główna - konwersacyjny ton,zwykle 300-500 słów na jeden temat]
[Kluczowy wniosek lub możliwe do wdrożenia działanie]
---
📚 CO CZYTAM/OGLĄDAM
[Tytuł książki/artykułu][Rekomendacja w 1-2 zdaniach]
🔗 PRZYDATNE LINKI
• [Link 1 z krótkim opisem]• [Link 2 z krótkim opisem]
---
To wszystko na ten tydzień!
Odpowiedz i daj mi znać swoje przemyślenia.
[Pożegnanie][Imię]
P.S. - [Osobista uwaga lub nadchodzące wiadomości]Uwagi do projektu:
- Konwersacyjny, intymny ton
- Skupienie na jednym temacie
- Osobiste rekomendacje
- P.S. dla ważnych aktualizacji
Szablon 10: Newsletter produktowy
Najlepszy dla: e-commerce, marek detalicznych
Temat: Nowości, które pokochasz + [oferta]
---
[LOGO]
[NAWIGACJA: Sklep | Nowości | Wyprzedaż | O nas]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[BANNER HERO]NOWOŚCI[Sezon/Nazwa kolekcji]
[KUP TERAZ]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
WŁAŚNIE DOSTĘPNE
[SIATKA PRODUKTÓW 3-KOLUMNOWA]
[Produkt 1] [Produkt 2] [Produkt 3]XX zł XX zł XX zł[Kup] [Kup] [Kup]
[POKAŻ WSZYSTKIE NOWOŚCI]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[BANER PROMOCYJNY]DARMOWA DOSTAWA PRZY ZAMÓWIENIACH POWYŻEJ 200 ZŁ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[STOPKA]Uwagi do projektu:
- Nawigacja odzwierciedla stronę internetową
- Układ skoncentrowany na produktach
- Wyraźne ceny
- Pilność „Znów dostępne”
Szablon 11: Newsletter edukacyjny
Najlepszy dla: B2B, SaaS, treści edukacyjnych
Temat: Jak [osiągnąć konkretny wynik]
---
[LOGO]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[MARKA] INSIDERWskazówki, triki i strategie dla [odbiorcy]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Cześć [Imię],
Temat tego tygodnia: [Temat]
[Otwierający akapit prezentujący problem lub możliwość]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
📖 DZISIEJSZA LEKCJA
[NAGŁÓWEK TEMATU]
KROK 1: [Działanie][Wyjaśnienie]
KROK 2: [Działanie][Wyjaśnienie]
KROK 3: [Działanie][Wyjaśnienie]
💡 WSKAZÓWKA PRO
[Zaawansowane spostrzeżenie dla doświadczonych czytelników]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
🎯 ZADANIE DO WYKONANIA
Twoje zadanie w tym tygodniu:[Konkretne, możliwe do wykonania ćwiczenie]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Do następnego razu,[Imię]
[POWIĄZANE ZASOBY]• [Link do powiązanego artykułu]• [Link do narzędzia/szablonu]• [Link do case study]Uwagi do projektu:
- Przejrzysta struktura dla nauki
- Numerowane kroki
- Zadania do wykonania dla zaangażowania
- Powiązane zasoby
Szablon 12: Newsletter społeczności
Najlepszy dla: serwisów członkowskich, społeczności
Temat: Najważniejsze ze społeczności | [Miesiąc]
---
[LOGO]
PODSUMOWANIE [SPOŁECZNOŚCI][Miesiąc Rok]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Hej [Imię]!
Oto, co działo się ostatnio w naszej społeczności:
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
🌟 WYRÓŻNIONY CZŁONEK
[ZDJĘCIE CZŁONKA]
Poznaj [Imię Członka]!
[2-3 zdania o ich historii/osiągnięciu]
[PRZECZYTAJ PEŁNĄ HISTORIĘ]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
📅 NADCHODZĄCE WYDARZENIA
[Data] | [Nazwa wydarzenia][Krótki opis][RSVP]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
📈 STATYSTYKI SPOŁECZNOŚCI
• [X] nowych członków w tym miesiącu• [X] rozpoczętych dyskusji• [X] udostępnionych zasobów
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Tak trzymajcie!
[Zespół społeczności]Uwagi do projektu:
- Treść skoncentrowana na członkach
- Dowód społeczny przez aktywność
- Promocja wydarzeń
- Statystyki społeczności
Szablon 13: Newsletter ogłoszeniowy
Najlepszy dla: premier produktów, wiadomości firmowych
Temat: Przedstawiamy [Nazwa produktu/funkcji]
---
[LOGO]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[OBRAZ HERO/ZDJĘCIE PRODUKTU]
PRZEDSTAWIAMY[NAZWA PRODUKTU]
[Tagline lub propozycja wartości]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Cześć [Imię],
Pracowaliśmy nad czymś wyjątkowymi dziś z radością dzielimy się tym z Tobą.
[1-2 akapity o tym, czym to jesti dlaczego ma znaczenie]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
KLUCZOWE FUNKCJE
✓ [Funkcja 1] [Krótkie wyjaśnienie korzyści]
✓ [Funkcja 2] [Krótkie wyjaśnienie korzyści]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
SPECJALNA OFERTA PREMIERY
Jako wcześniejszy adopter otrzymujesz wyłączny dostęp:
[Szczegóły oferty - rabat, wczesny dostęp, bonus]
[ZACZNIJ TERAZ]
Ta oferta wygasa [Data].
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Pytania? Odpowiedz na tego emaila lubodwiedź naszą [stronę FAQ].
Cieszymy się, że możesz tego spróbować!
Zespół [Marka]Szablony emaili promocyjnych (10 szablonów)
Emaile promocyjne generują przychody. Oto szablony dla każdego scenariusza promocyjnego.
Szablon 14: Flash Sale
Najlepszy dla: ofert ograniczonych czasowo, wyprzedaży zapasów
Temat: ⚡ 24-GODZINNA FLASH SALE: -40% na wszystko
---
[ANIMOWANY/POGRUBIONY NAGŁÓWEK]
⚡ FLASH SALE ⚡-40% NA WSZYSTKO
KOŃCZY SIĘ ZA: [ODLICZANIE]
[KUP TERAZ]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
BEZ KODURabat naliczany automatycznie przy kasie
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
TOP WYBORY
[SIATKA PRODUKTÓW - 6 sztuk]
[Obrazek] [Obrazek] [Obrazek][Nazwa] [Nazwa] [Nazwa]XX → XX zł XX → XX zł XX → XX zł
[POKAŻ WSZYSTKIE PRODUKTY W WYPRZEDAŻY]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
⏰ Pamiętaj: Wyprzedaż kończy się o północy!
[KUP TERAZ]Uwagi do projektu:
- Pogrubiony, pilny nagłówek
- Odliczanie tworzy pilność
- Przekreślone ceny
- Wiele CTA
Szablon 15: Wyprzedaż sezonowa
Najlepszy dla: promocji świątecznych, wyprzedaży sezonowej
Temat: Wyprzedaż [Sezon]: do -50% od teraz
---
[SEZONOWY OBRAZ HERO]
WYPRZEDAŻ [SEZON]DO -50%
[KUP TERAZ]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
KUP WEDŁUG KATEGORII
[BANNERY KATEGORII - 3 kolumny]
[Obrazek] [Obrazek] [Obrazek][Kategoria 1] [Kategoria 2] [Kategoria 3]Do -40% Do -50% Do -30%
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
BESTSELLERY W WYPRZEDAŻY
[SIATKA PRODUKTÓW]
[Obrazek] [Obrazek] [Obrazek] [Obrazek][Nazwa] [Nazwa] [Nazwa] [Nazwa]XX zł XX zł XX zł XX zł-30% -40% -25% -50%
[POKAŻ WSZYSTKIE OFERTY]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
DARMOWA DOSTAWAPrzy wszystkich zamówieniach powyżej 300 zł
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Wyprzedaż kończy się [Data]
[KUP TERAZ]Szablon 16: Ekskluzywna oferta
Najlepszy dla: klientów VIP, członków programu lojalnościowego
Temat: [Imię], zarobiłeś/aś na wcześniejszy dostęp
---
[LOGO]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[ODZNAKA VIP/EXCLUSIVE]
WCZEŚNIEJSZY DOSTĘPTYLKO DLA CIEBIE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Cześć [Imię],
Jako jeden z naszych najbardziej cenionych klientówmasz pierwszy dostęp do naszej największej wyprzedażyroku.
Kup teraz, zanim otworzymy to dla publicznościw dniu [Data].
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
TWOJA EKSKLUZYWNA OFERTA
-30% NA CAŁY SKLEP+ DARMOWA DOSTAWA
Użyj kodu: VIP30
[KORZYSTAJ Z WCZEŚNIEJSZEGO DOSTĘPU]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Ten wcześniejszy dostęp wygasa za 48 godzin.
Dziękujemy za bycie lojalnym klientem!
Zespół [Marka]Szablony 17-23
Pozostałe szablony promocyjne (nowa premiera produktu, oferta pakietowa, darmowa dostawa, wyprzedaż końcowa, BOGO, przypomnienie o punktach lojalnościowych, oferta referencyjna) są dostępne w pełnej bibliotece szablonów Tajo z polskim interfejsem.
Szablony emaili transakcyjnych (12 szablonów)
Emaile transakcyjne mają najwyższe wskaźniki otwarć. Warto je dobrze zaprojektować.
Szablon 24: Potwierdzenie zamówienia
Najlepszy dla: potwierdzenia zakupu
Temat: Zamówienie potwierdzone! #[Numer zamówienia]
---
[LOGO]
✓ ZAMÓWIENIE POTWIERDZONE
Dziękujemy za zamówienie, [Imię]!
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ZAMÓWIENIE #[NUMER]Złożone dnia [Data]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
PODSUMOWANIE ZAMÓWIENIA
[Obrazek produktu] [Nazwa produktu] Ilość: [X] [XX,XX zł]
━━━━━━━━━━━━━━━━Suma częściowa: [XX,XX zł]Dostawa: [XX,XX zł]Podatek: [XX,XX zł]━━━━━━━━━━━━━━━━RAZEM: [XX,XX zł]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
DOSTAWA DO:
[Imię i Nazwisko klienta][Ulica i numer][Kod pocztowy Miasto]
Szacowana dostawa: [Zakres dat]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
[ŚLEDŹ ZAMÓWIENIE] [WYŚWIETL ZAMÓWIENIE]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Pytania? Skontaktuj się z nami pod adresem [email]lub zadzwoń pod numer [telefon].
Dziękujemy za zakupy u nas!
Zespół [Marka]Szablon 25: Potwierdzenie wysyłki
Temat: Twoje zamówienie jest w drodze! 📦
---
[LOGO]
📦 TWOJE ZAMÓWIENIE ZOSTAŁO WYSŁANE!
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Cześć [Imię],
Świetne wiadomości! Twoje zamówienie jest w drodze.
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
INFORMACJE O ŚLEDZENIU
Przewoźnik: [Nazwa przewoźnika]Nr śledzenia: [Numer]
Szacowana dostawa: [Data]
[ŚLEDŹ PRZESYŁKĘ]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
CO JEST W TWOJEJ PACZCE
[Obrazek produktu] [Nazwa produktu] x [Ilość]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Zespół [Marka]Szablon 26-35
Pozostałe szablony transakcyjne (potwierdzenie dostawy, prośba o recenzję, tworzenie konta, reset hasła, potwierdzenie subskrypcji, nieudana płatność, potwierdzenie zwrotu, porzucony koszyk, powrót na stan, alert o obniżce ceny) są dostępne w pełnej bibliotece szablonów Tajo.
Szablony emaili reaktywacyjnych (5 szablonów)
Odzyskuj nieaktywnych subskrybentów za pomocą tych szablonów.
Szablon 36: Email „Tęsknimy za Tobą”
Najlepszy dla: wstępna reaktywacja (30-60 dni nieaktywności)
Temat: Tęsknimy za Tobą, [Imię]!
---
[LOGO]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
TĘSKNIMY ZA TOBĄ!
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Cześć [Imię],
Nie widzieliśmy Cię od jakiegoś czasu.Mamy nadzieję, że u Ciebie wszystko w porządku!
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
CO NOWEGO
Podczas Twojej nieobecności byliśmy zajęci:
• [Nowy produkt/funkcja 1]• [Nowy produkt/funkcja 2]• [Nowy produkt/funkcja 3]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
PREZENT POWITALNY NA POWRÓT
Oto -20% na powitanie z powrotem:
KOD: MISSYOU20
[KUP TERAZ]
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Cieszymy się z Twojego powrotu!
Zespół [Marka]Szablon 37: Email „Ostatnia szansa”
Temat: Czy to pożegnanie, [Imię]?
---
CZY TO POŻEGNANIE?
Cześć [Imię],
Dawno od Ciebie nie słyszeliśmy.
Nie chcemy zaśmiecać Twojej skrzynki, jeślinie jesteś już zainteresowany/a, więc piszemyostatni raz.
[TAK, ZOSTAWIAM SUBSKRYPCJĘ]
Jeśli nie odezwiesz się w ciągu 7 dni,usuniemy Cię z naszej listy emailowej.
Jeśli chcesz odejść, mamy dla Ciebie pożegnalny prezent:
-25% na następne zamówienie: COMEBACK25(Ważny przez 30 dni)
Z życzeniami,Zespół [Marka]Szablony emaili ogłoszeniowych (5 szablonów)
Szablony 41-45 (nowa funkcja, aktualności firmy, zaproszenie na wydarzenie, aktualizacja regulaminu, przerwa w świadczeniu usług) są dostępne w pełnej bibliotece szablonów Tajo.
Szablony ankiet i opinii (5 szablonów)
Szablony 46-50 (NPS, ankieta po zakupie, CSAT, ankieta roczna, prośba o funkcję) są dostępne w pełnej bibliotece szablonów Tajo.
Najlepsze praktyki projektowania emaili
Teraz, gdy masz szablony, omówimy zasady projektowania, które sprawiają, że emaile generują konwersje.
Podstawy układu
Układy jednokolumnowe działają najlepiej:
- 93% emaili jest czytanych na urządzeniach mobilnych
- Pojedyncze kolumny są domyślnie responsywne
- Łatwiejsze utrzymanie hierarchii
- Lepsza dostępność
Optymalna szerokość:
- Maksimum 600 px na komputery
- Pełna szerokość na urządzeniach mobilnych
- 20 px wypełnienie po każdej stronie
Wytyczne typograficzne
| Element | Rozmiar | Grubość |
|---|---|---|
| Nagłówki | 22-28 px | Pogrubiona |
| Podnagłówki | 18-20 px | Półpogrubiona |
| Tekst główny | 14-16 px | Normalna |
| Podpisy | 12-14 px | Normalna |
| Przyciski CTA | 14-16 px | Pogrubiona |
Rekomendacje fontów:
- Bezszeryfowe dla cyfrowych: Arial, Helvetica, Verdana
- Nowoczesne opcje: Open Sans, Roboto, Lato
- Fonty systemowe dla szybkości: -apple-system, BlinkMacSystemFont
Strategia kolorów
Paleta podstawowa:
- Kolor marki dla CTA i nagłówków
- Neutralne szarości dla tekstu głównego
- Białe/jasne tła
Wymagania kontrastu:
- Minimum 4,5:1 dla tekstu głównego
- Minimum 3:1 dla dużego tekstu
- Testuj za pomocą symulatorów daltonizmu
Projekt przycisku CTA
Efektywne specyfikacje przycisku:
- Minimalna wysokość 44 px (przyjazny dla dotyku)
- Pełna szerokość na urządzeniach mobilnych
- Kolory o wysokim kontraście
- Jasny, zorientowany na działanie tekst
- Maksimum 2-4 słowa
Teksty CTA, które działają:
- Kup teraz
- Zacznij za darmo
- Odbierz rabat
- Pobierz darmowy przewodnik
- Zacznij darmowy okres próbny
Wytyczne dla obrazów
Optymalizacja:
- Maksimalna całkowita waga emaila 1 MB
- 72 DPI dla internetu
- Użyj WebP z zapasowym JPEG
- Kompresuj przed przesłaniem
Tekst alternatywny:
- Opisz zawartość obrazu
- Uwzględnij CTA, jeśli to istotne
- Utrzymuj do 125 znaków
Lista kontrolna optymalizacji mobilnej
- Układ jednokolumnowy
- Przyciski przyjazne dla dotyku (minimum 44x44 px)
- Rozmiar czcionki 14 px lub większy
- Odpowiednie interlinie (1,5x)
- Skompresowane obrazy
- Krótkie tematy wiadomości (do 40 znaków)
- Zoptymalizowany tekst podglądu
- Łatwe do kliknięcia linki (bez ciasnego układu)
Wymagania dostępności
Niezbędne funkcje dostępności:
- Tekst alternatywny dla wszystkich obrazów
- Wystarczający kontrast kolorów
- Logiczna kolejność czytania
- Opisowy tekst linków (nie „kliknij tutaj”)
- Atrybuty roli dla tabel
- Atrybut lang HTML
- Skalowany tekst (bez stałych rozmiarów w pikselach)
Tryb ciemny
Projektuj dla obu trybów:
- Używaj przezroczystych PNG dla logo
- Testuj kolory w trybie ciemnym
- Udostępnij warianty obrazów dla trybu ciemnego
- Używaj zapytań CSS media do dostosowania kolorów
Jak dostosować szablony
Krok 1: Oznakuj swoje szablony
Zastąp elementy zastępcze swoją marką:
- Umieszczenie logo - u góry środek lub po lewej
- Kolory marki - CTA, nagłówki, akcenty
- Typografia - dopasuj do fontów marki
- Obrazy - używaj fotografii zgodnych z marką
- Głos - dostosuj kopię do osobowości marki
Krok 2: Personalizuj treść
Dynamiczna treść zwiększa konwersje o 20%:
- Tagi merge: Imię, lokalizacja, preferencje
- Wyzwalacze behawioralne: Historia przeglądania, historia zakupów
- Dynamiczne produkty: Rekomendacje oparte na danych
- Treść warunkowa: Pokazuj różne treści różnym segmentom
Krok 3: Testuj przed wysłaniem
Lista kontrolna przed wysyłką:
- Podgląd w głównych klientach emailowych
- Testuj wszystkie linki
- Sprawdź renderowanie mobilne
- Weryfikuj personalizację
- Przejrzyj temat i tekst podglądu
- Potwierdź nazwę nadawcy i adres odpowiedzi
- Sprawdź dostępność
- Testuj czas ładowania
Krok 4: Iteruj na podstawie danych
Śledź i optymalizuj:
| Metryka | Co mówi | Jak poprawić |
|---|---|---|
| Wskaźnik otwarć | Skuteczność tematu | Testuj różne podejścia |
| Wskaźnik kliknięć | Zaangażowanie treści | Popraw CTA, układ |
| Wskaźnik konwersji | Trafność oferty | Testuj oferty, strony docelowe |
| Wskaźnik wypisów | Problemy z częstotliwością/trafnością | Dostosuj rytm, segmentację |
Korzystanie z szablonów z Tajo
Wbudowana biblioteka szablonów Tajo sprawia, że tworzenie emaili jest proste:
Gotowa biblioteka szablonów
Uzyskaj dostęp do profesjonalnie zaprojektowanych szablonów dla każdego zastosowania:
- Sekwencje powitalne
- Kampanie promocyjne
- Emaile transakcyjne
- Przepływy reaktywacyjne
- Projekty newsletterów
Edytor metodą przeciągnij i upuść
Dostosowuj szablony bez kodowania:
- Dodawaj/usuwaj bloki treści
- Aktualizuj kolory i fonty
- Wstawiaj rekomendacje produktów
- Dodawaj dynamiczną treść
Integracja z Brevo
Korzystaj z infrastruktury emailowej Brevo:
- Automatyczna synchronizacja danych klientów
- Zaawansowana segmentacja
- Wielokanałowa orkiestracja
- Analityka w czasie rzeczywistym
Funkcje szablonów
- Responsywne domyślnie - działa na wszystkich urządzeniach
- Wbudowane testy A/B - łatwe testowanie wariantów
- Obsługa dynamicznej treści - personalizacja na dużą skalę
- Podgląd w różnych klientach - sprawdź, jak emaile są renderowane
Chcesz usprawnić tworzenie emaili? Zacznij darmowy okres próbny z Tajo i uzyskaj dostęp do naszej kompletnej biblioteki szablonów.
Podsumowanie
Świetne szablony emaili stanowią fundament skutecznego email marketingu. Oszczędzają czas, zapewniają spójność i poprawiają wyniki, gdy są dobrze zaprojektowane.
Użyj ponad 50 szablonów z tego przewodnika jako punktów startowych, a następnie dostosuj je do swojej marki i odbiorców. Pamiętaj o fundamentach:
- Projektowanie z myślą o urządzeniach mobilnych
- Wyraźna hierarchia wizualna
- Pojedyncze, ukierunkowane CTA
- Projekt dostępny i inkluzywny
Najlepszy szablon to ten, na który Twoi odbiorcy reagują. Testuj, iteruj i optymalizuj na podstawie swoich konkretnych danych.
Chcesz wdrożyć te szablony do działania? Zacznij z Tajo i uzyskaj dostęp do naszej kompletnej biblioteki konfigurowalnych szablonów emaili oraz narzędzi automatyzacji do wdrażania ich na dużą skalę.
Powiązane artykuły
- Kampanie email marketingowe: kompletny przewodnik po planowaniu, realizacji i optymalizacji
- Strategia email marketingu: kompletny przewodnik po planowaniu i realizacji [2025]
- Email marketing dla małych firm: kompletny przewodnik (2026)
- ROI z email marketingu: jak obliczać, śledzić i poprawiać zwroty [2025]
- Email marketing dla początkujących: kompletny przewodnik startowy (2026)