Ta sama stopka wygląda świetnie w Gmailu, a w Outlooku się rozjeżdża albo znika logo? To nie przypadek. W tym przewodniku tłumaczymy od podstaw, jak technicznie działają podpisy e-mail: trzy sposoby na logo, dlaczego programy pocztowe „przerabiają” je przy wysyłce i jak zrobić stopkę, która wygląda dobrze wszędzie.
Nie ma jednego uniwersalnego sposobu
Zacznijmy od najważniejszego, bo to oszczędza mnóstwa rozczarowań: nie istnieje jeden sposób na stopkę e-mail, który zadziała identycznie wszędzie.
Powód jest prosty — programów pocztowych i sposobów korzystania z poczty jest mnóstwo, a każdy renderuje wiadomości trochę inaczej i inaczej obsługuje obrazki. Inaczej podejdziemy do:
- programów na komputerze — Thunderbird, Outlook (klasyczny na Windows), Apple Mail,
- poczty w przeglądarce — Gmail, Outlook web,
- webmaili na hostingu — np. Roundcube czy Horde, z których korzysta wiele firm,
- telefonów — aplikacje pocztowe na iOS i Androidzie.
Ta sama stopka, wklejona w różnych miejscach, może wyglądać świetnie w jednym programie, a rozjechać się albo stracić logo w innym. Dlatego do każdego środowiska trzeba podejść trochę inaczej — i właśnie o tym jest ten przewodnik.
Czym właściwie jest stopka e-mail (od kuchni)
Stopka to mały kawałek kodu HTML doklejany do wiadomości. Ale to nie jest zwykła strona internetowa — programy pocztowe (zwłaszcza Outlook) mają bardzo ograniczoną obsługę nowoczesnego kodu. W praktyce dobra stopka:
- jest zbudowana na tabelach (a nie na nowoczesnym układzie jak na stronach www),
- ma style zapisane bezpośrednio przy każdym elemencie (tzw. inline CSS),
- używa tylko systemowych fontów (Arial, Georgia, Verdana), bo własny font marki i tak nie załaduje się jako tekst,
- nie jest jednym wielkim obrazkiem (o tym niżej — to częsty i kosztowny błąd).
Brzmi archaicznie? Bo jest. Silniki pocztowe zatrzymały się w rozwoju lata temu i trzeba się do nich dostosować, a nie odwrotnie.
Sedno sprawy: logo. Są trzy sposoby
Tekst w stopce to najmniejszy problem. Prawdziwa zabawa zaczyna się przy logo — bo obrazek trzeba jakoś „dostarczyć” do wiadomości. Są trzy sposoby, i to jest klucz do całego tematu.
1. Link do obrazka w internecie (hosted URL)
Logo leży na serwerze, a w kodzie jest tylko odnośnik. Działa we wszystkich programach, ale program pocztowy odbiorcy może zapytać o zgodę na wyświetlenie zdalnej treści, a do tego wymaga, żeby serwer z logo działał — jeśli padnie, logo znika.
2. Obrazek dołączony do wiadomości (CID)
Logo jedzie jako załącznik maila, a kod się do niego odwołuje. To klasyczna, sprawdzona metoda. Działa wszędzie, łącznie z Gmailem, i nie pyta o zdalną treść (obrazek nie jest zdalny — jest w mailu). Tworzy go program pocztowy przy wysyłce (o tym za chwilę).
3. Obrazek zakodowany wewnątrz kodu (base64 / data: URI)
Bajty obrazka są wklejone bezpośrednio w kod. To jeden samowystarczalny plik — ale Gmail wycina data: URI w odebranej poczcie, a Outlook również blokuje.
Uwaga na najczęstsze nieporozumienie: „base64″ to dwie różne rzeczy
Wiele osób myli metodę CID z metodą base64, bo obie „pod spodem” używają kodowania base64. Ale to co innego:
- CID — obrazek jest załącznikiem maila; base64 to tylko sposób zapisu tego załącznika. Analogia: zdjęcie włożone do koperty razem z listem.
- data: URI — bajty obrazka są wklejone wprost w kod HTML. Analogia: zdjęcie wklejone w treść listu.
To rozróżnienie jest sednem — CID działa w Gmailu, „obraz w kodzie” (data: URI) nie.
Klucz, którego mało kto rozumie: program przerabia obrazek przy wysyłce
Tu jest najciekawszy mechanizm. Thunderbird, gdy wysyłasz maila, zamienia obrazek data: URI (base64 w kodzie) na załącznik CID. W praktyce: w podpisie masz logo jako base64, klikasz „wyślij”, a Thunderbird sam konwertuje je na dołączony obrazek (CID). Odbiorca dostaje CID — logo widać wszędzie, z Gmailem włącznie, bez monitu.
To wyjaśnia pozorną sprzeczność: „obraz w kodzie” wysłany z desktopu działa świetnie, ale wklejony do pola podpisu w Gmailu — nie (bo tam nikt go nie konwertuje, a Gmail go wycina). Ta sama technika, dwa różne wyniki, zależnie od tego, kto wysyła.
Ważne: konwersję robi program pocztowy przy wysyłce. Nie da się jej „wpisać” gotowej w plik podpisu — bo cid: odnosi się do załącznika, który istnieje dopiero w kompletnym, wysłanym mailu. Jak z kopertą: „patrz zdjęcie w załączeniu” można napisać dopiero, gdy koperta ze zdjęciem istnieje — a przy ustawianiu podpisu koperty jeszcze nie ma.
I jeszcze jedno, uczciwie: nie każdy program konwertuje base64 tak samo. Thunderbird tak (sprawdzone). Outlook na Windows renderuje silnikiem Worda, który słabo obsługuje data: URI — więc tam „obraz w kodzie” często się nie pokaże.
Jak robią to duże firmy
Kiedy dostajesz maila z dużej firmy (np. na Microsoft Exchange/Outlook), jej stopka niemal zawsze używa CID — logo i grafiki są dołączone jako załączniki inline. To najbardziej niezawodna metoda: działa wszędzie, nie pyta o zdalną treść, nie zależy od żadnego serwera.
Ale jest haczyk: te firmy mają administratora, który ustawia stopki globalnie (albo wstawiając logo ręcznie w edytorze podpisu Outlooka — Outlook wtedy sam robi z niego CID). Mała firma nie ma takiego działu IT. Dlatego mniejsze firmy potrzebują rozwiązania „gotowego do wklejenia” — a nie składania stopki z pojedynczych elementów.
I dobra wiadomość: składanie z kawałków nie jest potrzebne. Wystarczy skopiować całą, gotową stopkę i wkleić ją w ustawieniach poczty. Cały układ — także logo w tabeli po prawej czy lewej stronie — jedzie jako jeden blok, a program pocztowy zachowuje jego wygląd.
Ściąga: która metoda gdzie działa
| Metoda | Thunderbird | Gmail | Outlook | Apple Mail |
|---|---|---|---|---|
| Link (hosted URL) | tak* | tak | tak* | tak* |
| Załącznik (CID) | tak | tak | tak | tak |
| Obraz w kodzie (base64) | tak** | nie | nie | tak** |
*Możliwy jednorazowy komunikat o wyświetleniu zdalnej treści.
**Działa, bo program desktop konwertuje base64 na CID przy wysyłce (najlepiej sprawdzone w Thunderbirdzie; w Outlooku bywa zawodne).
„Czy wyświetlić obrazy?” — skąd ten komunikat
Jeśli używasz metody z linkiem (hosted URL), program pocztowy odbiorcy może zapytać: „W celu ochrony prywatności zdalna zawartość została zablokowana”. To nie jest błąd — to standardowa ochrona prywatności. Zewnętrzny obrazek może być tzw. pikselem śledzącym (informuje nadawcę, że otworzyłeś maila), więc programy domyślnie blokują takie treści do czasu zgody.
W praktyce Gmail zwykle pokazuje obrazy od razu (przepuszcza je przez swój serwer), a Thunderbird, Outlook czy Apple Mail mogą zapytać raz — wystarczy kliknąć „zezwalaj z tej domeny” i kolejne maile są już bez pytania. Całkowity brak monitu daje tylko metoda z załącznikiem (CID).
Gdzie najlepiej trzymać logo
Jeśli używasz metody z linkiem, logo musi mieć stały, publiczny adres. Najlepiej trzymać je na własnej domenie firmy (np. https://twojafirma.pl/stopka-email/logo.png), a nie na przypadkowym, tymczasowym hostingu. Dzięki temu adres w stopce pokazuje Twoją domenę, masz pełną kontrolę, a logo działa tak długo, jak Twoja domena.
Dobre proporcje pliku: logo w mailu jest małe, więc plik nie musi być duży — wystarczy ok. 2× rozmiaru wyświetlania (dla ostrości na ekranach retina), zoptymalizowany do kilkunastu KB, PNG z przezroczystym tłem.
Inne pułapki, o których warto wiedzieć
- Outlook na Windowsie renderuje maile silnikiem Worda (a nie przeglądarki). Efekt: brak własnych fontów, sztywne szerokości, ograniczone marginesy, brak nowoczesnych efektów.
- Nie rób całej stopki jako jednego obrazka. Kusi, bo wygląda 1:1 jak projekt — ale gdy klient poczty zablokuje obrazy, cała stopka znika, linki przestają działać, a mail częściej ląduje w spamie. Tekst ma zostać tekstem, obrazem jest tylko logo.
- Nie przesadzaj z wagą. Widujemy stopki z banerami po 200–300 KB dołączanymi do każdego maila — to niepotrzebnie obciąża skrzynki i dostarczalność. Lekka stopka to zdrowszy wybór.
- Telefon. Sporą część maili czyta się na telefonie — stopka musi być wąska (ok. 360 px), żeby się nie rozjeżdżała.
- Dane firmowe. Klauzula RODO, NIP, KRS/UID — dla firm to często wymóg; dobrze mieć je w stopce jako edytowalny tekst.
Wniosek: jedna stopka to za mało — potrzebne jest narzędzie
Skoro każdy program wymaga innego podejścia, logo można osadzić na trzy różne sposoby (a wynik zależy od tego, kto wysyła), a mała firma nie ma administratora, który ustawi to ręcznie — to „ręczne” robienie stopki dla każdego pracownika i każdego programu jest drogą przez mękę i źródłem błędów. Najlepszym rozwiązaniem jest narzędzie, które generuje gotową stopkę w formacie dopasowanym do konkretnego programu pocztowego — a użytkownik ma tylko wpisać dane i wkleić.
Robimy to za Ciebie
W MSTUDIO tworzymy narzędzia online do generowania stopek e-mail. Jak to działa:
- projektujemy stopkę pod Twój brandbook (logo, kolory, układ, dane firmy),
- dostajesz własny link do generatora pod Twoją firmę — pracownik wpisuje tylko swoje dane (imię, stanowisko, telefon) i pobiera gotową stopkę,
- eksport dopasowany do programu — z instrukcją krok po kroku dla Gmaila, Outlooka, Thunderbirda, Apple Mail czy webmaila,
- logo trzymamy na Twojej domenie, a stopka jest lekka i spójna dla całego zespołu.
Jedna stopka, która wygląda tak samo dobrze u wszystkich i w każdym programie — bez kombinowania po Twojej stronie.
Chcesz taki generator dla swojej firmy? Napisz do nas.