Moderné webové prehliadače a systémy na správu obsahu optimalizujú obrázky na zobrazenie v akomkoľvek prostredí. Najlepšie je však pripraviť obrázky, ktoré sú optimalizované pre každý možný tvarový faktor a miesto, kde sa obrázok môže zobraziť. Zamerajte sa na tri veci: rozlíšenie obrázka, veľkosť a farebný priestor.
Farebný priestor v obrázkoch
Grafickí dizajnéri sa spoliehajú na dva primárne farebné priestory. Farebný priestor je metóda, pri ktorej sa primárne farby kombinujú a vytvárajú komplexné farebné dúhy.
Pri príprave obrázkov pre mobilné zariadenia používajte režim RGB. Displeje na počítačových monitoroch a smartfónoch sa spoliehajú na kombináciu červených, modrých a zelených pixelov. Tento obraz RGB je optimalizovaný tak, aby presne reprodukoval zamýšľané farby na obrazovke.
Na tlač používajú dizajnéri štvorfarebný proces, kde sa každá farba destiluje na kombináciu azúrovej, purpurovej, žltej a čiernej. Z tohto dôvodu sa niekedy štvorfarebné obrázky označujú ako obrázky CMYK.
Rozlíšenie obrázka
Obrázky, najmä na mobilných platformách, by mali mať čo najmenšiu veľkosť, aby vyvážili kvalitu a rýchlosť sťahovania v mobilných sieťach a veľkosť súboru v porovnaní s limitmi mobilných dát.
Väčšina programov, vrátane aplikácií Adobe Creative Cloud, podporuje nástroj Export for Web, ktorý zobrazuje obrázok v rôznych kombináciách rozlíšenia a kompresie. Vyberte obrázok najvyššej kvality pri najnižšej celkovej veľkosti.
Veľkosť obrázka v pixeloch
Každý obrázok by mal mať veľkosť zodpovedajúcu účelu, na ktorý je určený. Tu je niekoľko príkladov veľkostí obrázkov pre obľúbené webové použitie:
- Internetové bannerové reklamy majú často 468 x 60 pixelov.
- Obal na Facebooku by mal mať veľkosť 851 x 315 pixelov.
- Profilové fotky na Twitteri by mali mať rozmer 400 x 400 pixelov.
- Obrázky pre zdieľané odkazy by mali mať veľkosť 1200 x 630 pixelov.
Keď pracujete s fotografiami na konkrétne účely, skontrolujte miesto, kde sa fotografia zobrazí (napríklad stránka sociálnych médií alebo blog), aby ste si overili optimálne rozmery obrázka a potom podľa toho upravte veľkosť, aby ste sa vyhli naťahovaniu alebo orezávaniu obrázka.
Ak sa chcete vyhnúť pixelizácii, zamerajte sa na skutočnú veľkosť displeja. Aj keď je obrázok správne dimenzovaný, ak nemá správnu veľkosť, výsledný produkt môže vyzerať pixelovo, ak je potrebné obrázok zväčšiť, aby vyhovoval dostupnému priestoru.
O vektorových obrázkoch
Vektorové obrázky – obrázky, ktoré vypočítava a kreslí zariadenie – sú zvyčajne efektívnejšie a kvalitnejšie ako rastrové obrázky (obrázky nakreslené po jednom pixeli), pretože sa dajú zväčšiť a zmenšiť bez ovplyvnenia kvality obrázka. Pre jednoduché logá, čiarové grafiky a grafy je ideálna vektorová verzia. Na fotky sa nepoužívajú vektorové formáty.