Wikia

Wikia Polska

Komentarze5

Zmiany w układzie: szerokość i typografia

Hej wszyscy, w zeszłorocznym prototypie układu artykuły testowaliśmy kilka różnych rzeczy i otrzymaliśmy sporo sugestii i uwag, które były kluczowe w obraniu dalszego kierunku. Prototyp pozwolił nam dowiedzieć się co działa, a co nie (np. usunięcie prawego panelu było trochę uciążliwe). Ciągle planujemy stopniowo wprowadzać zmiany w układzie, ale będziemy po kolei skupiać uwagę na konkretnych aspektach. Proces będzie podobny do tego, który zastosowaliśmy przy aktualizacji globalnej nawigacji w styczniu, ale zajmie to znacznie więcej czasu żeby wprowadzić wszystkie zmiany.

Pierwsze na liście są punkty zmiany szerokości w responsywnym układzie Wikii i niektóre poprawki dotyczące typografii. Zmiany w typografii pojawią się tylko przy największej szerokości, którą nazwaliśmy Monitor XL, która obecnie dotyczy rozdzielczości szerszych niż 1575 pikseli. Galeria poniżej pokazuje przykłady przed i po zmianach w układzie na dużych monitorach.

Punkty zmiany szerokości

Jest to zmiana z płynnego układu, gdzie zamiast tego wprowadziliśmy stałe punkty, przy których zmienia się szerokość co pozwala na bardziej przewidywalne zachowanie treści. Naszym celem jest zachowanie układu, który dostosowuje się do większych ekranów i będzie to działać na podstawie szerokości okna przeglądarki. Pamiętaj, że paski przewijania znajdują się poza obszarem, którego szerokość jest obliczana.

Lista wszystkich punktów i odpowiadającym im szerokościom ekranu

Punkt Szerokość
treści
Minimalna
szerokość ekranu
Maksymalna
szerokość ekranu
Ruch na
komputerach i tabletach
Tablet w pionie 768px 768 1023 16,17%
Tablet w poziomie 1024px 1024 1063 49,60%
Monitor 1064px 1064 1574
Monitor XL 1238px 1575 34,23%

Typografia

Chcemy skupić się na czytelności i długości wiersza, która podąża za najlepszymi praktykami, a to oznacza dostosowanie się do szerokości wyświetlacza. Obecnie na Wikii zmienia się tylko długość linii, a rozmiar czcionki i wysokość linii pozostają bez zmian. Wraz z tą aktualizacją, rozmiar czcionki i wysokość wiersza na dużych monitorach będzie się zmieniać zgodnie z poniższą tabelą. Kolumna z wymiarami dla monitora i tabletu służy tylko dla porównania, zmiany dotyczą tylko szerokości Monitor XL.

Lista zmian typograficznych dla danych szerokości

Monitor / Tablet
(rozmiar czcionki / wysokość linii)
Monitor XL
(rozmiar czcionki / wysokość linii)
Nagłówek H1 28 / 28 34 / 34
Nagłówek H2 20 / 22 28 / 30
Nagłówek H3 17 / 22 22 / 24
Nagłówek H4, cytat 15 / 22 20 / 28
Treść 14 / 22 16 / 26

Mamy na celu wprowadzenie tych zmian tylko dla nagłówków, cytatów i zwykłego tekstu. Jednym problemem, który się tutaj pojawia, są niektóre szablony, które nie mają odpowiedniej klasy CSS. Przez to zmiany mogą również zostać wprowadzone w nich, co może spowodować niepożądane efekty. Większość problemów powinno dać się się naprawić poprzez dodanie klasy lub zmiany w arkuszy styli strony. Listę proponowanych poprawek i porad znajdziesz na stronie Pomoc:Zmiany w układzie (lub tymczasowo na angielskiej Help:Layout Changes), która będzie rozbudowywana o kolejne rozwiązania wraz z nadchodzącymi zmianami w układzie.

Jak podejrzeć zmiany w szerokości i typografii

Jeśli chcesz zobaczyć jak to wygląda na Twojej wikii, jedyne co musisz zrobić to dodać do adresu parametry ?oasisbreakpoints=1&oasistypography=1 w ten sposób:

http://graotron.wikia.com/wiki/Tywin_Lannister?oasisbreakpoints=1&oasistypography=1

Zmiany w szerokości zostaną wprowadzone wraz z dzisiejszą aktualizacją. Rozumiemy, że zmiany w typografii mogą prowadzić do niepożądanych efektów, więc naszym planem jest wprowadzenie ich dopiero 30 kwietnia. Da to całej społeczności dużo czasu na eksperymenty. Jeśli spotkasz się z czymś zepsutym lub dziwnym, daj znać w komentarzach.

Więcej od Wikii

Losowa wiki