Pripravujeme obrázky pre web

Je  fajn, ak máme na webe pekné, kvalitné a veľké fotografie, no ich pomalé zobrazovanie, spoľahlivo odradí každého návštevníka. Pre rýchle načítanie webstránky, je potrebné obrázky, pred presunom na hosting upraviť.
Pokiaľ nemáte fotoblog, či fotobanku,  obrázky s vysokým rozlíšením nie sú vhodné pre bežný web. Zaberajú veľa miesta a stránku zbytočne spomaľujú.

Editor obrázkov

Na úpravu fotografií a obrázkov, použijeme šikovný editor, ktorý je zadarmo – IrfanView. Stiahneme a nainštalujeme aj balíček pluginov. Kto chce pridá aj slovenskú lokalizáciu.

Zmena rozmerov obrázka

  1. Fotografiu otvoríme v programe IrfanView.
  2. V hornom menu klik na Obrázok → vybrať Zmeniť veľkosť/Prevzorkovať
    zmenit-velkosť-obrazka
  3. Zobrazí sa okno, kde vidíme aktuálne rozmery obrázka. Veľkosť zmeníme manuálnym zadaním rozmerov, percentom z originálu, alebo vyberieme z predvolených štandardných rozmerov.
    zmenit-velkosť-obrazka-okno
  4. Zaklikneme Zachovať pomer strán, inak sa obrázok zdeformuje. Povolíme  aj Aplikovať zaostrenie po prevzorkovaní.
  5. Klik na OK, obrázok zmení rozmery.

Uloženie obrázka pre web

  1. V hornom menu klik na Súbor, vyberieme položku Uložiť pre Web…(Plugin).
    obrazky-pre-web1
  2. Zobrazí sa okno, kde môžeme vykonať niekoľko zmien, pred uložením fotografie pre web.
    obrazky-pre-web-okno2
  3. Uvidíme 2 náhľady obrázkov, na ľavo je originálny obrázok s veľkosťou, na pravej strane je obrázok, tak ako bude vyzerať po uložení. Pod nimi si vyberieme výstupný formát obrázka.
    JPEG – vhodný na fotografie
    PNG / GIF – vhodnejšie pre ikony, text a printscreen,
    Quality –  výber stupňa kompresie = vyššia kvalita = väčšia veľkosť obrázka. Optimálna kvalita je 70 – 80%.
    Grayscale – obrázok bude čiernobiely
  4. Klik na Save – vyberieme si miesto uloženia a názov obrázka.

Pri fotografiách s vysokým rozlíšením sa pri uložení obrázka pre web, najskôr zobrazí odporučenie pre zmenu rozlíšenia.

Hotovo. Fotografia je pripravená pre web.

Aký rozmer obrázku zvoliť?

Veľká fotografia, napríklad s veľkosťou 3624 x 2448px, sa na webstránke nezobrazí v plnej veľkosti. Z jednouchého dôvodu. Najviac používané monitory počítačov, alebo notebookov, takéto rozlíšenie nemajú.

Rozmery obrázka určujeme podľa toho, ako ho chceme použiť.

  1. Rozlíšenie 1024 x 768px alebo 1200 x 800, sú vhodné napríklad pre fotografie, kde chcete vidieť detail – napríklad tovar v eshope, alebo tento obrázok v článku. Obrázok zobrazíme na webstránke, vo forme náhľadu. Po kliknutí naň sa zobrazí plný rozmer obrázka.
  2. Obrázok, ktorý nepotrebuje väčší rozmer, umiestnime na stránku, bez možnosti zobrazenia zväčšenej verzie. Šírku obrázka môžeme prispôsobiť šírke obsahového bloku.
  3. Mnohé wordpress šablóny obsahujú informácie o presných rozmeroch obrázkov a fotografií, pre zobrazovanie vo web stránke a  slideroch

Existuje viac spôsobov úpravy obrázkov a fotografií pre web. Tento postup odporúčam, preto že je zdarma, vyznačuje sa rýchlosťou a jednoduchosťou nastavení. Používam ho aj ja.

Pridaj komentár

Vaša e-mailová adresa nebude zverejnená. Vyžadované polia sú označené *

*

*