Co to jest „ALT text" i dlaczego warto go używać

Powszechną praktyką przy wysyłaniu e-maili zawierających obrazki jest wpisanie także nazwy obrazka. Technicznie ten tekst nazywa się „atrybutem alt" obrazka. Określenie to skraca się następnie do „ALT text".

Dlaczego trzeba używać ALT textu?

  • Większość klientów pocztowych domyślnie blokuje wyświetlanie obrazków. Odbiorca e-maila musi je pobrać albo dodać Twój adres lub domenę, z której wysyłasz e-maile, do listy bezpiecznych nadawców. Jeśli to ustawi, każdy kolejny e-mail będzie już miał załadowane i wyświetlone obrazki. Przegląd klientów pocztowych i sposobu, w jaki obsługują obrazki, znajdziesz w tabelach poniżej.
  • Jeśli zdarzy się, że wstawionego obrazka nie uda się załadować i wyświetlić, w jego miejscu zawsze pojawi się ten ALT text.

Gdzie ustawić ALT text w Quandzie

Po wstawieniu obrazka do e-maila w prawym menu znajdziesz opcję wpisania „Nazwy obrazka" i wyboru jej wyglądu.

Ustawienie ALT textu

Wpisz nazwę obrazka i aktywuj ustawienia wyglądu. Ustaw pożądany wygląd. Żeby sprawdzić ustawiony tekst, kliknij w pole „Wstaw adres obrazka z internetu" i za pomocą CTRL+X wytnij obecny adres. Po wycięciu adresu zobaczysz ustawiony tekst.

Ustawienie ALT textu

Adres obrazka wstawisz z powrotem w pole „Wstaw adres obrazka z internetu" za pomocą CTRL+V. Po wstawieniu adresu ponownie zobaczysz pierwotnie wstawiony obrazek. Zawsze możesz też w zwykły sposób załadować obrazek jeszcze raz.

Kiedy potem wyślesz e-mail, wszystkim, którzy mają włączone wyświetlanie obrazków lub których klient pocztowy od razu wyświetla obrazki, e-mail pokaże się w tej postaci:

E-mail z obrazkiem

Odbiorcy, którzy nie mają włączonego wyświetlania obrazków, zobaczą Twój e-mail tak.

E-mail bez obrazka

Uwaga: podgląd e-maila z Thunderbirda.

E-mail bez obrazka Gmail

Uwaga: podgląd e-maila z Gmaila.

Zamiast obrazka odbiorcy widzą ostylowany ALT text, który został ustawiony w Quandzie. E-mail wygląda znacznie lepiej, a nagłówek w miejscu obrazka możesz wykorzystać do przekazania informacji, która znajduje się na obrazku, albo do odpowiedniego zachęcenia odbiorcy, żeby włączył obrazki i pozwolił im się załadować.

Ale to nie byłyby e-maile, gdyby nie było w tym haczyka

W czym tkwi haczyk? Różne programy do wyświetlania e-maili (nazywamy je klientami pocztowymi) różnie obsługują ostylowany ALT text. Podczas gdy niektóre wyświetlają go tak, jak go ustawisz (czyli łącznie z krojem pisma, rozmiarem czy kolorem), inne pokazują go tylko jako zwykły tekst albo wcale.

Na przykład w moim Outlooku 365, zainstalowanym na laptopie, widzę ten e-mail tak.

E-mail bez obrazka Outlook
E-mail bez obrazka szczegół 2

Outlook 365 zainstalowany na moim komputerze wprawdzie wyświetla ALT text, ale tylko jako kolejny niesformatowany tekst na końcu komunikatu o tym, jak wyświetlić blokowane obrazki. Poniżej przygotowaliśmy dla Ciebie porównanie, jak i gdzie ALT text jest wyświetlany.

Naszym zdaniem wypełnianie i stylowanie ALT textu zawsze się opłaca. Większość odbiorców widzi Twój e-mail najpierw na telefonie, a telefony obsługują ostylowane ALT texty.

Niemal wszystkie urządzenia mobilne, które dziś dominują jako urządzenia, na których e-mail jest otwierany po raz pierwszy, obsługują wyświetlanie ostylowanego ALT textu. Dlatego wypełnianie ALT textu i jego stylowanie na pewno się opłaca.

chrome Firefox Explorer

Obsługa wyświetlania ALT textu przez webowych klientów pocztowych

Chodzi o programy, które nie są zainstalowane na Twoim komputerze, ale do których logujesz się przez przeglądarkę internetową.

**Klient pocztowy** (przeglądarka)Wyświetlają obrazki przy otwarciu e-mailaWyświetlają ALT textWyświetlają ostylowany ALT text
**Seznam** (Edge)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Seznam** (Firefox)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Seznam** (Chrome)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**AOL Mail** (Explorer)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-uncheck.svg)
**AOL Mail** (Firefox)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**AOL Mail** (Chrome)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Comcast** (wszystkie przeglądarki)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)
**G-Suite and Gmail** (Explorer)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**G-Suite and Gmail** (Firefox)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**G-Suite and Gmail** (Chrome)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**GMX.de** (Explorer)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**GMX.de** (Firefox)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**GMX.de** (Chrome)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)
**Mail.ru** (wszystkie przeglądarki)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)
**Office 365** (Explorer)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Office 365** (Firefox)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Office 365** (Chrome)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Outlook.com** (Explorer)Czasami![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Outlook.com** (Firefox)Czasami![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Outlook.com** (Chrome)Czasami![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Web.de** (Explorer)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Web.de** (Firefox)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Web.de** (Chrome)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)
**Yahoo! Mail** (Explorer)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Yahoo! Mail** (Firefox)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Yahoo! Mail** (Chrome)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
PC + notebook

Obsługa wyświetlania ALT textu przez klientów pocztowych na PC

**Klient pocztowy**Wyświetlają obrazki przy otwarciu e-mailaWyświetlają ALT textWyświetlają ostylowany ALT text
**Apple Mail**![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Lotus Notes 8.5**![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-uncheck.svg)
**Outlook 2000-2003**![](/assets/img/svg/icon-table-uncheck.svg)Tak\*![](/assets/img/svg/icon-table-uncheck.svg)
**Outlook 2007**![](/assets/img/svg/icon-table-uncheck.svg)Tak\*![](/assets/img/svg/icon-table-uncheck.svg)
**Outlook 2010**![](/assets/img/svg/icon-table-uncheck.svg)Tak\*![](/assets/img/svg/icon-table-uncheck.svg)
**Outlook 2011** (Outlook for Mac)![](/assets/img/svg/icon-table-uncheck.svg)Tak\*![](/assets/img/svg/icon-table-check.svg)
**Outlook 2013**![](/assets/img/svg/icon-table-uncheck.svg)Tak\*![](/assets/img/svg/icon-table-uncheck.svg)
**Outlook 2016**![](/assets/img/svg/icon-table-uncheck.svg)Tak\*![](/assets/img/svg/icon-table-uncheck.svg)
**Thunderbird**![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Windows 10 Mail**![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)

* Outlooki wyświetlają ALT text, ale jako część tekstu, który informuje o konieczności pobrania niewyświetlonych obrazków. Stylowanie nie jest jednak obsługiwane.

E-mail bez obrazka szczegół 2
telefon

Obsługa wyświetlania ALT textu przez klientów pocztowych w telefonach

**Klient pocztowy**Wyświetlają obrazki przy otwarciu e-mailaWyświetlają ALT textWyświetlają ostylowany ALT text
**Android Email** (4.4)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Android Gmail** (4.4)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**AOL Mail** (przeglądarka Android)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**AOL Mail** (przeglądarka iPhone)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**AOL Alto Mail App**![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Blackberry** OS 6![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Blackberry** OS 7![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Blackberry** Z10![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**iOS 6.x** (domyślny klient pocztowy)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**iPhone 5s** (iOS 7)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**iPhone 5s** (iOS 8)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**iPhone 6**![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**iPhone 6s**![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**iPhone 6s +**![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**iPad** (iOS 9)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**iPad Mini** (iOS 9)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Gmail app** (iOS)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Gmail app** (przeglądarka iPhone)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Mailbox** (iOS)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)
**Outlook.com** (przeglądarka Android)Czasami![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Outlook.com** (przeglądarka iPhone)Czasami![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Windows Mobile** 7.5![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)
**Windows Phone** 8![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)
**Yahoo! App** (Android)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)
**Yahoo! App** (iOS)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Yahoo! Mail** (przeglądarka Android)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-check.svg)
**Yahoo! Mail** (przeglądarka iPhone)![](/assets/img/svg/icon-table-check.svg)![](/assets/img/svg/icon-table-uncheck.svg)![](/assets/img/svg/icon-table-uncheck.svg)

Jeśli masz własne doświadczenia ze stylowaniem ALT textów i obsługą ich wyświetlania, podziel się nimi z nami!

Trzymam za Ciebie kciuki!

Jan Spáčil