Tabletek terén
A tabletes csoport elég széles kört lefed. Amennyiben felbontás alapján veszünk egy eszközt tabletnek. Bővült a piac mind a kisméretű, mind a nagyobb kijelzős, erősebb tabletek terén is, mint például iPadPro. Ezen kategóriában a leggyakoribb 32.57%-al a 768×1024 px felbontás. Második helyen a 800×1280 px, mely 19,08%-on áll (1280×800 és 800×1280 együtt nézve). Harmadik helyen a 600×960 px áll, 11,59%-al (itt is a 960×600 is beleszámítva).
Laptop és netbook részről
A laptop szegmensben nem történt jelentős változás. Első helyen 26,19%-al 1366×768 px felbontás áll. Második helyen 9,81%-al az 1556×864 px felbontású lesz. További ~5%-on van az 1280×1024 és 1440×900 px felbontás is. A FullHD 1920x1080px felbontás az asztali számítógéphez tartozik, így az ott kerül beszámításra.
Asztali gépek esetén
Az asztali gépek kategóriájában továbbra is vezető a FullHD, 1920×1080 px felbontás, 21,33%-al. Ez egyre több laptopnál is elérhető és növekvő trendet mutat. Második és harmadik helyezett nem kifejezetten erős, így nem is érdemes kiemelni. Nagyon nagy a szórás, annyi féle felbontású és méretű monitor található a piacon. Amikkel érdemes számolni, az inkább a képarányok. A 16:9 standard, a 16:10 és a 21:9-es. A 4K felbontást weboldal esetén nem érdemes számításba venni még.
Mire optimalizáljunk végül?
Mindig érdemes figyelembe venni a célcsoport eszközhasználatát a honlap megtervezésekor. Gondolok itt arra, hogy egyre több fejlesztő laptopon dolgozik, gyakori a Macbook széria. Ráadásul a fejlesztők mind aktív mobil telefon használók. Így mobiltelefonon és laptopokon makulátlannak, könnyen használhatónak kell lennie. Például 4K felbontásra nem kell nagy hangsúlyt fektetni, maximum a wide és super-wide felbontásokat ellenőrizni.
Idén kezdenek térhódításuknak a hajlítható kijelzős mobil készülékek, például Galaxy Fold, Huawei Mate X széria. Az szinte biztos, hogy sok honlap megjelenésével lesz gond ezen eszközökön. Persze azt is vegyük figyelembe, hogy mivel nagyon (de tényleg nagyon) drágák ezen eszközök, így nagyon elenyésző a felhasználóik száma jelenleg. Azonban ettől függetlenül, a jövőben mindenképpen figyelembe kell venni a tervezésnél, fejlesztésnél.
Általános esetben Én három megjelenést tervezek. Ezek a következők:
- Mobil megjelenés, ez szélesség tekintetében 320-tól kezdődik és 767 px-ig tart. Ez lefedi szinte az összes jelenlegi mobiltelefon felbontás szélességét.
- Tablet+Laptop megjelenés, ami 768 és 1599 px között van. Ez a laptopok (ami nem FullHD) terén majdnem az összeset lefedi.
- Asztali gép megjeleés, ami 1600 px szélességtől felfelé van, az elérhető legnagyobb felbontásokig.
A fenti megosztásokkal készítem a munkáim és ezek alapján készítem a tereket is, továbbá a szükséges lekéréseket, hogy minél jobban optimalizált legyen a kód. Továbbá perszóna függő, azonban amikor B2B oldalt tervezek, azzal számolok, hogy a cégvezetők igen jelentős része laptoppal rendelkezik és azt használja elsődlegesen, így az ehhez tartozó felbontásokat priorítással kezelem. Ez azonban csak egy példa volt, ennél jóval komplexebb az egész.
Összefoglalva
Fejlesztőként már az elsődleges irány a mobile-first line. Vagy is először a mobiltelefonos (esetleg tabletes) megjelenítést kell megterveznünk és elkészítenünk, majd innen kiindulva kell a szélesebb felbontásokra is optimalizálni a weboldalunk megjelenését, miközben a reszponzivitás és funkcionalitás megmarad. A fentebb vázolt 3-as elrendezést tudom bárkinek ajánlani, nagyon jól használható és kellően dinamikus.
A statisztikai adatok a statcounter.com oldaláról származnak, melyeket 2020-ban gyűjtöttek, hazai weboldalakon mért adatok feldolgozásával.
