Obrázky na webu - na co si při tom dát pozor

23.02.2023

Jedno z nejčastějších témat, které se týká tvorby webových stránek jsou obrázky a jejich použití na stránkách. Většina z nás si myslí, že stačí pouze umístit obrázek na webovou stránku a tím to končí. Nicméně, pokud chcete, aby vaše stránka byla dobře optimalizována pro vyhledávače a aby byla přístupná pro uživatele se zrakovými postiženími, je důležité používat alt atributy a další prvky.

7 barev
7 barev

alt atribut 

Začneme tím, že si vysvětlíme, co je alt atribut a jak ho používat. Alt atribut je textový popis obrázku, který se zobrazí, když se obrázek nenačte správně. To se může stát například v případě, že uživatel má vypnutý přenos obrázků nebo když soubor obrázku není nalezen. Alt atributy jsou také velmi užitečné pro uživatele se zrakovými postiženími, kteří používají čtečky obrazovky k prohlížení obsahu webové stránky.

Při používání alt atributů byste měli vždy zahrnout popisný text, který vysvětluje, co je na obrázku zobrazeno. Je také dobré uvažovat o použití klíčových slov v popisu obrázku, protože to může pomoci zlepšit optimalizaci pro vyhledávače. Nicméně, je důležité neupouštět od popisnosti jen kvůli snaze optimalizovat pro vyhledávače.

Názvy obrázků 

Dalším důležitým prvkem při používání obrázků na webové stránce jsou názvy obrázků. Pokud je to možné, měli byste pojmenovat každý obrázek tak, aby jeho název popisoval obsah obrázku. To pomůže vyhledávačům lépe pochopit obsah vaší stránky a také pomůže uživatelům se zrakovými postiženími.

Rozměry obrázku 

Dalším prvkem, který byste měli zvážit, jsou rozměry obrázku. Pokud znáte rozměry obrázku dopředu, můžete specifikovat jeho velikost v kódu webové stránky, což může pomoci zrychlit načítání stránky. Také se ujistěte, že se obrázky ve vašem designu správně škálují na různých zařízeních aby byly vhodné pro mobilní zařízení i pro desktopy. Aby se jinak nezobrazovaly na mobilu, jinak na 27" monitoru a jinak na tabletu.

Umístění obrázku na stránce 

Další věcí, kterou byste měli zvážit, je umístění obrázku na stránce. Měli byste zvažovat umístění obrázku tak, aby se co nejvíce přizpůsobovalo designu stránky a zároveň zůstávalo jasné, co je na obrázku zobrazeno. Zvažte také použití popisků nebo textových popisů u obrázků, které poskytnou uživatelům další informace o obsahu obrázku.

Formát souboru 

Poslední věcí, na kterou byste měli při práci s obrázky myslet, je formát souboru. Pokud je to možné, použijte vektorové formáty obrázků, jako je SVG, které jsou přenosnější a mají menší velikost souboru. Pokud je nutné použít bitmapové obrázky, jako jsou JPEG nebo PNG, ujistěte se, že jsou dostatečně komprimované, aby nezpomalily načítání stránky.

V souhrnu je důležité mít na paměti, že obrázky jsou důležitou součástí webové stránky a jejich použití by mělo být promyšleno s ohledem na uživatele i na vyhledávače. Používání alt atributů, správné pojmenování souborů, zvažování rozměrů, umístění obrázků a volba správného formátu souboru jsou klíčové prvky pro správné použití obrázků na webové stránce.