W artykule:
Gdy myślimy o tym, jak możemy zmienić się na lepsze w tym roku, dlaczego nie włożyć trochę tej energii w ulepszanie naszych stron internetowych? Nie wiem jak ty, ale myślę, że mały lifting nie zaszkodzi … zwłaszcza jeśli masz ochotę trochę potrząsnąć.
Jeśli chodzi o modernizację witryny, nie ma potrzeby pełnego przerobienia – chyba że Twoje analizy mówią ci, że coś jest nie tak. W przeciwnym razie wystarczy mały nip i tuck, aby nadać witrynie WordPress świeższy wygląd.
Moja sugestia? Zacznij od typografii.
Krok 1: Oceń aktualną typografię witryny WordPress
Przed podjęciem jakiejkolwiek metamorfozy najlepiej najpierw ocenić, z czym pracujesz. To da ci wyobrażenie o tym, gdzie mogą leżeć wszelkie słabości i ile elastyczności będziesz mieć w wprowadzaniu zmian.
Aby ocenić typografię strony, zadaj sobie następujące pytania:
1. Skąd pochodzą Twoje obecne czcionki?
Czy wiesz, jak doszło do bieżącego wyboru czcionek w Twojej witrynie? Jeśli Twoja witryna używa domyślnych czcionek z motywu WordPress lub zostały wybrane według kaprysu, zwykle jest to dobry znak, że należy je zmienić. Podczas gdy prawdopodobnie wyglądają good enough, nie zostały ręcznie dobrane, aby pasowały do unikalnego stylu twojej marki. Spójność projektu jest kluczowa-od obrazów, których używasz, aż po typografię.
2. Czy Twój Krój Jest Kompletny?
Załóżmy, że wybrałeś wysokiej jakości czcionkę, która dobrze współgra z projektem Twojej witryny. Co się stanie, gdy okaże się, że nie ma pełnego zestawu znaków? Innymi słowy, czy będziesz w porządku, rezygnując ze swojej witryny na rzecz tekstu z pełnym ograniczeniem lub zmuszając pisarzy do unikania pewnych znaków, które nie są zawarte w zestawie?
Jeśli nie masz pewności, czy masz kompletny krój pisma zawierający wszystkie litery, cyfry i symbole, wróć do źródła czcionki. Powinno być pole podglądu, w którym można wprowadzić niestandardowy tekst. Wstaw następujące linie tekstu, aby upewnić się, że wszystkie istotne znaki są obecne:
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
àèéïöùüçûæÆœŒ
.,;:?!/[]{}()*-– —…“”‘’_
0123456789
≤≥÷+=≈≠±-·√°@€£$%&*|«»<>/~”‘§¶©®™
3. Sprawdziłeś, czy nie ma problemów z czytelnością?
Jeśli pracujesz na komputerze Mac, sugeruję pobranie książki czcionek. Gdy masz czcionkę, która wzbudziła Twoje zainteresowanie, zainstaluj ją w książce czcionek, aby przetestować problemy z czytelnością. Możesz użyć tego do:
- Sprawdź, czy nie ma kompletnego zestawu(jak w przypadku testu # 2 powyżej).
- Przejrzyj czcionkę cyfrowo, aby dowiedzieć się, jak będzie ona wyświetlana w Twojej witrynie.
- Wydrukuj pełny zestaw znaków w różnych rozmiarach i stylach, aby określić, które z nich są najbardziej przyjazne dla czytelnika.
Jest to również świetne narzędzie do przechowywania czcionek i organizowania ich na kolejny raz, gdy chcesz nadać typografii metamorfozę.
4. Czy przeglądałeś swoją typografię dla urządzeń mobilnych?
Darmowe narzędzia online, takie jak Responsinator, ułatwiają sprawdzanie strony pod kątem kompatybilności responsywnej. Te same Warcaby responsywne mogą być również używane do przeglądania typografii witryny pod kątem przyjazności dla urządzeń mobilnych.
Standardowe zalecenie dotyczące rozmiaru czcionki międzyplatformowej wynosi 16 punktów lub więcej. Może się tak nie zdarzyć, jeśli wybierzesz czcionkę silnie stylizowaną lub mocno kernerowaną, więc przed zatwierdzeniem upewnij się, że to zostało sprawdzone na jednym z tych narzędzi.
Możesz również skorzystać z tego przewodnika po popularnych rozmiarach czcionek, aby dać ci pojęcie, od czego zacząć.
5. Czy Twój Kolor Czcionki Jest Przyjazny Dla Czytelnika?
Tworzenie typografii witryny nie polega tylko na znalezieniu odpowiedniej czcionki lub rozmiaru. Nie, chodzi również o znalezienie odpowiedniego koloru. Jeśli jeszcze nie eksperymentowałeś z tą paletą materiałów, poświęć chwilę, aby to zrobić teraz. Zobaczysz, że niezależnie od tego, które kolory marki wybierzesz, podstawowy i dodatkowy kolor czcionki jest zawsze czarny lub odcień szarości.
6. Czy testowałeś swoją typografię pod kątem dostępności?
Twórcy stron internetowych wiedzą wszystko o tym, jak udostępniać strony internetowe. Jeśli jednak naprawdę chcesz nadać swojej typografii uniwersalną przyjazność w tej kolejnej iteracji, zwróć większą uwagę na czynniki, które mogą mieć wpływ na osoby niedowidzące lub niewidome.
Zacznij od uruchomienia witryny za pośrednictwem Color Oracle. To narzędzie symuluje, jak twoja strona wygląda dla osób niewidomych.
Następnie zapoznaj się z zaleceniami Amerykańskiej Fundacji dla niewidomych. Te „wskazówki dotyczące zwiększenia czytelności druku” zawierają sugestie dotyczące rozmiaru wydruku, wyboru typografii, użycia kolorów, kontrastu i odstępów.
Nigdy nie wiesz, kto może wejść na Twoją stronę, więc ważne jest, aby wziąć pod uwagę te czynniki teraz, gdy poświęcasz czas na lifting swojej typografii.
Krok 2: Postępuj Zgodnie Z Najlepszymi Praktykami Typografii
Wybór czcionki jest osobistą decyzją, podobnie jak Wszystko inne w projektowaniu stron internetowych. Chociaż nie mogę powiedzieć, jakich czcionek użyć, nadal uważam, że ważne jest, aby opracować najlepsze praktyki, których należy przestrzegać podczas prowadzenia badań, testowania i wdrażania nowych.
Oto podstawowe zasady, których należy przestrzegać:
- Dopasuj swoją markę: Wybierz czcionkę zgodną z zasadami projektowania, które już ustaliłeś dla swojej marki.
- Keep it simple: Użyj nie więcej niż dwóch lub trzech krojów pisma w całej swojej witrynie. Biorąc to pod uwagę, można użyć czcionki, która jest trochę nietypowa, po prostu upewnij się, że jest łatwa do odczytania.
- Zachowaj spójność: Użyj spójnego stylizacji czcionek w całej witrynie. Innymi słowy, wszystkie nagłówki powinny używać tej samej czcionki, rozmiaru, koloru i stylu. To samo dotyczy całego tekstu, tekstu nawigacyjnego, tekstu z hiperłączami i wszelkich innych typów tekstu używanych w witrynie.
- Tworzenie kontrastu: O ile liczy się spójność między typami czcionek, powinna istnieć umowa między nagłówkami a podstawowym tekstem. Możesz to zrobić, łącząc czcionkę bezszeryfową z czcionką bezszeryfową lub czcionkę kursywną z czcionką odręczną. Tylko upewnij się, że kontrast jest uderzający, choć nie do tego stopnia, że jest odpychający.
- Sprawdź kolor: Jak wspomniano wcześniej, czerń lub odcienie ciemnoszarego działają najlepiej dla czytelności. Należy również wziąć pod uwagę kolor tła, dlatego ważne jest, aby odpowiednio sparować kolory (np. jasny tekst na ciemnym tle i ciemny tekst na jasnym tle).
- UŻYWAJ WSZYSTKICH CZAPEK OSZCZĘDNIE: Wszystkie znaki tekstowe mogą być bardzo trudne do odczytania. Albo To, albo może wywoływać złe wibracje. Więc jeśli czujesz, że musisz go używać, Zrób to oszczędnie.
- Ustal hierarchię: Tylko dlatego, że ogólną zasadą jest używanie czcionki o rozmiarze co najmniej 16 punktów, nie oznacza to, że wszystkie kroje czcionek witryny muszą trzymać się tego minimalnego limitu. Nagłówki, podtytuły i tekst treści powinny być tak dobrane, aby ustanowić jasną hierarchię pod względem tego, co najważniejsze.
- Nie zapomnij o rozstawie: Po zaimplementowaniu nowej typografii w witrynie będziesz chciał zoptymalizować jej odstępy. Jeśli występują problemy z liniami zbyt blisko siebie, napraw prowadzenie. Jeśli występują problemy z czytelnością w wierszu tekstu, musisz dostosować kerning, a może nawet śledzenie. Idealnie, każda linia tekstu powinna rozciągać się nie więcej niż 15 słów.
- Test A/B przed podjęciem zobowiązania: Chociaż możesz być zachwycony wyborem nowej czcionki, inne osoby mogą nie czuć tego samego. Zrób sobie przysługę i upewnij się, że A / B przetestuje nowy wybór czcionki przed pełnym zaangażowaniem się w nią. Twoja strona internetowa (i firma) podziękuje Ci za to później.
Wrapping Up
Jeśli chcesz pomóc w znalezieniu nowej, uderzającej czcionki (lub dwóch) na swojej stronie, sprawdź te zasoby, aby skuteczniej znaleźć i używać czcionek (znajduje się na dole postu). W mgnieniu oka wprowadzą cię do gry z nową, krzykliwą typografią.
Tagi:
