✔️ Jak przygotować grafiki, które zawsze wyglądają dobrze?

👉 Wgrywaj grafikę w rozmiarze desktopowym

Na tabletach i telefonach kafelki skalują się automatycznie. Grafika nie będzie rozciągana lub zwężana, zachowa swoje oryginalne proporcje. Przy skalowaniu zostanie ucięta prawa część grafiki.

Możesz też dodać dedykowane grafiki dla mniejszych rozdzielczości, jeśli chcesz, by wyglądały lepiej na tablecie i telefonie.

Mamy trzy wielkości kafelków zależne od szerokości ekranu:

• Desktop - powyżej 1280 px,
• Tablet - od 1280 px do 540 px,
• Mobile - poniżej 540 px.

Programy kafelkowe

Dla tego kafelka możesz:

• wgrać grafikę z tekstem lub dodać własny tekst wraz z ikoną (ikona wyświetli się przed nazwą),
• włączyć prezentację postępu, która zasłania prawą część grafiki w obszarze 340×86 px, odsuniętym o 24 px od prawej krawędzi.

📌 Tekst na grafice umieszczaj zawsze po lewej stronie - prawa część może zostać ucięta na mniejszych rozdzielczościach (chyba, że przygotujesz alternatywną grafikę dedykowaną dla tabletów i telefonów).

Desktop: 990×120 px

Tablet: 504×120 px

Mobile: 244×58 px

Alternatywna wersja grafiki na tablet i mobile

Aby grafika wyglądała atrakcyjniej na mniejszych ekranach, możesz wgrać jej dodatkową wersję dedykowaną dla tabletu i telefonu.
Wystarczy przygotować plik w rozdzielczości 504×120 px - na urządzeniach mobilnych automatycznie przeskaluje się on do 244×58 px, zachowując odpowiednie proporcje.

Kafelek widokowy

Kafelek powiązany z listą w platformie jest zawsze prezentowany w formie małego kafelka:

• Desktop: 236×120 px
• Tablet i mobile: 244×120 px

Możesz w nim dodatkowo wyświetlać liczbę elementów na liście (np. zgłoszeń do akceptacji czy wyników zespołu). Liczba ta prezentowana jest w lewym górnym rogu kafelka.
Dodatkowo istnieje możliwość wyboru ikony, która pojawi się z prawej strony.

Dla wersji mobilnej możesz przygotować osobną grafikę w rozdzielczości 244×120 px.

Kafelek linkujący

Kafelek linkujący działa w taki sam sposób jak kafelek widokowy, z tą różnicą, że nie wyświetla liczby elementów z listy.

Kafelek do zrobienia

Kafelek do zrobienia może występować w wersji małej lub dużej. Jego zadaniem jest prezentowanie liczby obowiązkowych elementów do wykonania przez użytkownika.

Tekst na kafelku jest stały i nie podlega edycji, dlatego rekomendujemy wgrywanie grafiki bez tekstu, pełniącej jedynie rolę tła.

Duży kafelek:

• Desktop: 488×120 px
• Tablet: 504×120 px
• Mobile: 244×120 px

Dodatkowo, dla dużego kafelka można wgrać osobną grafikę w rozdzielczości 244×120 px.

Mały kafelek:

• Desktop: 236×120 px
• Tablet/Mobile: 244×120 px

Katalog szkoleń

Katalog szkoleń

Kafelek zachowuje się dokładnie tak samo jak kafelek do zrobienia (opisany wyżej) - zamiast prezentowania liczby elementów pokazujemy ikonę katalogu.

Duży baner

Duży baner w wersji desktop ma rozdzielczość 488×170 px.
Na tablecie skaluje się do 504×120 px, natomiast na telefonie prawa część grafiki zostaje obcięta, a baner wyświetlany jest w rozmiarze 244×145 px.

Mały baner

Mały baner w wersji desktop i tablet ma rozdzielczość 244×120 px.
Na telefonie skaluje się do rozmiaru 244×145 px.

📏Podsumowanie rozmiarów grafik

📱 Alternatywne grafiki mobilne

Dla wybranych kafelków możesz przygotować dedykowane wersje grafik na mobile:

Kafelek programowy → 244×58 px

Kafelek linkowy → 244×120 px

Kafelek widokowy → 244×120 px

Lista do zrobienia (duży i mały kafelek) → 244×120 px

Katalog szkoleń (duży i mały kafelek) → 244×120 px