Bezpieczne fonty do e-maili i stosy, których używać
Bezpieczne fonty do e-maili
Bezpieczne fonty do e-maili: stosy działające w każdej skrzynce | We.Inc
Stosy fontów do e-maili HTML, które sprawdzają się w Gmail, Outlook i Apple Mail, informacja o tym, które skrzynki ładują web fonty, oraz podgląd do testowania każdego stosu na Twoim urządzeniu.
Bezpieczne fonty do e-maili to kroje zainstalowane zarówno w Windows, jak i w macOS, takie jak Arial, Verdana, Tahoma, Trebuchet MS, Georgia, Times New Roman i Courier New. Ponieważ Gmail i Yahoo Mail ignorują własne web fonty, zapisuj każde font-family jako stos kończący się jednym z nich i rodziną ogólną.
Fonty zainstalowane zarówno w Windows 11, jak i w macOS Sequoia
Font
Rodzaj
Dobry do
Arial
Bezszeryfowy
Tekst główny, najbezpieczniejszy wybór domyślny
Verdana
Bezszeryfowy
Mały tekst; szerokie litery pozostają czytelne
Tahoma
Bezszeryfowy
Zwarte etykiety i stopki
Trebuchet MS
Bezszeryfowy
Nagłówki z odrobiną charakteru
Georgia
Szeryfowy
Newslettery redakcyjne i dłuższe teksty
Times New Roman
Szeryfowy
Oficjalne komunikaty
Courier New
Monospace
Kody, numery zamówień, paragony
E-mail nie w każdej skrzynce może pobierać fonty tak jak strona internetowa. To, co zobaczy odbiorca, zależy od jego aplikacji pocztowej i fontów na urządzeniu, więc cała sztuka polega na stosie fontów, który łagodnie się degraduje. Wybierz stos poniżej, aby zobaczyć podgląd z własnym tekstem i skopiować CSS.
Wybierz stos. Podgląd używa tego fontu ze stosu, który ma Twoje urządzenie, dokładnie tak jak aplikacja pocztowa.
Wpisz temat wiadomości lub nagłówek w tekście przykładowym i dostosuj rozmiar.
Skopiuj linię font-family i umieść ją w stylu inline w każdej komórce z tekstem, nie tylko w bloku style.
Wyślij test do skrzynek, z których naprawdę korzysta Twoja lista, bo renderowanie różni się między aplikacjami.
Wpisz font-family inline w każdym td lub p zawierającym tekst, aby każdy blok treści miał własny stos zamiast polegać na bloku style.
Ujmuj w cudzysłów nazwy fontów zawierające spacje, takie jak "Trebuchet MS", i kończ każdy stos rodziną ogólną, na przykład sans-serif lub serif.
Jeśli ładujesz font marki przez @font-face, wybierz bezpieczny font zastępczy o podobnej szerokości, aby podziały wierszy nie przesuwały się zbytnio.
Segoe UI jest dostarczany z Windows, ale nie z macOS, a Helvetica jest dostarczana z macOS, ale nie ma jej na liście Windows 11. Łącz je w stosie z Arialem.
Najczęściej zadawane pytania
Które fonty są bezpieczne w e-mailach HTML?
Fonty obecne w obu głównych systemach desktopowych: Arial, Verdana, Tahoma, Trebuchet MS, Georgia, Times New Roman i Courier New znajdują się zarówno na liście fontów Windows 11 Microsoftu, jak i na liście fontów macOS Sequoia Apple.
Czy Gmail obsługuje własne web fonty?
Nie. caniemail.com podaje, że @font-face nie jest obsługiwany w Gmail, który używa zamiast tego własnych fontów. Czytelnicy w Gmail widzą font zastępczy z Twojego stosu, więc wybierz go starannie.
Które aplikacje pocztowe wyświetlają web fonty?
Według caniemail.com @font-face obsługują Apple Mail na macOS i iOS, Thunderbird i ProtonMail. Gmail, Yahoo Mail i AOL go nie obsługują, a obsługa w Outlook.com jest oznaczona jako częściowa.
Dlaczego Outlook w Windows pokazuje Times New Roman?
Klasyczny Outlook dla Windows akceptuje regułę @font-face, ale ignoruje zdalne fonty, a caniemail.com zauważa, że tekst może wtedy przejść na Times New Roman. Bezpieczny font wcześniej w stosie tego unika.
Jaki rozmiar powinien mieć tekst główny e-maila?
Nie ma oficjalnej reguły. Wielu projektantów używa od 14 do 16 pikseli dla tekstu głównego i większych rozmiarów dla nagłówków; testuj na telefonie, gdzie mały tekst czyta się najtrudniej.
Jak wybierany jest font ze stosu
font-family to lista priorytetów. Aplikacja pocztowa przechodzi ją od lewej do prawej i używa pierwszego fontu, który znajdzie, znak po znaku, więc stos obsłuży każdego odbiorcę, o ile kończy się fontem, który mają wszyscy.
MDN radzi zawsze zamykać listę rodziną ogólną, taką jak sans-serif. Jeśli nic innego nie pasuje, aplikacja i tak wybierze rozsądny krój zamiast własnego domyślnego fontu szeryfowego.
Jak mimo wszystko użyć fontu marki
Możesz zadeklarować web font w bloku style dla aplikacji, które go obsługują, a po nim wymienić bezpieczne fonty. Czytelnicy w Apple Mail zobaczą font marki, a czytelnicy w Gmail font zastępczy.
Ważny tekst, taki jak ceny i przyciski, zostaw jako prawdziwy tekst, a nie obrazy tekstu. Pozostaje czytelny przy wyłączonych obrazach i działa z czytnikami ekranu.
Które skrzynki ładują web fonty
Obsługa @font-face według caniemail.com, ostatnia aktualizacja 19 grudnia 2023. Sprawdź aktualną stronę, zanim na tym polegasz, bo aplikacje pocztowe się zmieniają.
Obsługa @font-face w klientach poczty
Klient poczty
@font-face
Apple Mail (macOS 12.2 i nowszy, iOS 10.3 i nowszy)
Obsługiwany
Thunderbird
Obsługiwany
ProtonMail
Obsługiwany
Outlook dla Windows (2003 do 2019)
Reguła akceptowana, zdalne fonty ignorowane
Outlook.com
Częściowo
Gmail
Nieobsługiwany
Yahoo Mail
Nieobsługiwany
AOL
Nieobsługiwany
Kod fontów do e-maili do skopiowania
Stos fontów inline w komórce tabeli
Stos znajduje się w stylu inline samej komórki, więc nie zależy od bloku style w sekcji head.
Font marki z bezpiecznym fontem zastępczym
Aplikacje obsługujące @font-face pokazują font marki; pozostałe przechodzą na Trebuchet MS, Arial i w końcu dowolny sans-serif.
Podgląd stosów fontów do e-maili
Wybierz stos i wpisz własny tekst. Podgląd używa fontów zainstalowanych na tym urządzeniu, tak samo jak aplikacja pocztowa wybiera font ze stosu.
Stos fontów
Tekst przykładowy
Rozmiar: {n}px
CSS do wstawienia inline
Twoje zamówienie jest już w drodze. Śledź je w każdej chwili na swoim koncie.