Spracovanie obrázkov pre webstránky

Základné spracovanie obrázkov, aby vaša webstránka, alebo eshop mohol dosahovať čo najlepšie výsledky vo vyhľadávaní je potrebné optimalizovať obrázky tak, aby spĺňali pravidlá. Mnoho ľudí robí chybu v tom že odfotí fotografiu a tak ako ju odfotí ju zavesí na web. Výsledok je ten že stránka sa načítava pomaly, alebo pre ľudí čo sú ovplyvnený pomalším internetovým  pripojením sa stránka vôbec nezobrazí a vy prichádzate o potencionálneho zákazníka.

Ďalší obľúbený extrém je stiahnuť obrázok najčastejšie pri eshopoch, kde zanecháte pôvodný názov rovnako pôvodnú veľkosť obrázka a čakáte že Vám produkt google natiahne a budete predávať. Lenže takto to nefunguje. Vždy je potrebné premenovať obrázok tak ako sa volá produkt, alebo služba ktorú ponúkam, oddeľovať ich pomĺčkou a keď je ich viac rozšíriť ich o čisla. A teda v našom prípade:

príklad: spracovanie-obrazkov-pre-webstranky.jpg

Ak je obrázkov viac pozrite si návod na: hromadné premenovanie obrázkov

Ako zistím akú veľkosť má obrázok

1/ Ak mám fotografiu v počítači kliknem na ňu pravým lačítkom na myške, vyberiem vlastnosti, prekliknem sa na podrobnosti a v indentifikácií obrázka nájdem údaj napríklad 800 x 600 a rozpísaná veľkosť na výšku a a šírku ktorá je uvádzaná v pixeloch.

2/ Ak fotografiu pozerám v prehliadači napríklad mozilla kliknem na obrázok, pravým dám zobraziť obrázok, kliknem na zobraziť informácie o obrázku. Prepnem v prepínači všeobecné a vypíše mi rozmer.

Správna veľkosť obrázku pre web

1/ Správna veľkosť obrázku je 800x 600px teda pixelov. Vždy dbám na to aby najvačšia hodnota obrázku bola v tomto rozmere. Ako postupovať manuálne pre dosiahnutie týchto rozmerov kompletný návod njdete tu: Úprava veľkosti obrázkov v programe GIMP.

2/ Ak máte pripravené obrázky môžete si ich upraviť aj naraz. Výhodou tejto úpravy je že nemusíte používať kompresiu obrázkov ktorú si rozoberieme nižšie. Kompletný návod ako postupovať pri hromadnej úprave obrázkov pre webstránky alebo eshopy nájdete tu: Hromadná úprava obrázkov.

3/ Ak chcete precízne a detajlne riešiť úpravy vaších fotografií tak aby boli na tom čo najlepšie je vhodné robiť samostatnú úpravu manuálne. Viete si kompletne zmeniť jednak veľkosť obrázkov ale aj kompresiu tak, aby bola čo najlepšia a súčasne aby to na fotografiách nebolo poznať. V tomto prípade je však nutné poznať aspoň základné znalosti z programu Photoshop. Tejto možnosti a návodom sa budeme venovať v návodoch neskôr.

Formát obrázkov pre web

Vždy je potrebné dodržiavať pravidlo aby obrázkok ste mali .jpg je pre Vás absolútne zbytočné riešiť formát iného formátu ako .png, .gif, .bmp. Sú to všetko formáty ktoré bez správnej komprimácie spomaľujú a zaťažujú systém. A vy predsa chcete ľudom pomôcť a nie škodiť.

Formát .png využívame jedine vtedy ak riešime logo, alebo obrázok v ktorom je text. Takýto obrázok však nesmieme zabudúť skomprimovať.

Ak ste sa oboznámili s programom Gimp ak nie tak šup šup do toho. V ukladaní konkrénej fotografie už v upravenej veľkosti vidíte formát obrázka. Ak je iný ako .jpg použijete uložiť ako a do názvu dopíšete mmiesto inej prípony (zvyčajne .png, .bmp, .gif... ) zapíšete miesto neho: .jpg. Teda výsledný formát v našom prípade bude: spracovanie-obrazkov-pre-webstranky.jpg a dáte uložiť.

Kompresia obrázkov

Kompresia obrázku slúži na to, aby obrázok ktorý sme zmenšili na potrebný rozmer mal aj optimalizovanú veľkosť súboru, ktorý ukladáme na webstránku.

Príklad obrázok ktorý má 60,0Kb po skomprimovaní sa zmmení na veľkosť 45,3Kb.

Ak použijeme zmenšenie obrázku prostredníctvom programu Gimp, alebo iným programom skomprimujeme obrázk cez návod: kompresia obrázkov