Desatero pro použití obrázků a fotek na webech MU

12. 5. 2022

1. Nejlepší fotky jsou fotky autentické

Kvalitní autentické fotky z prostředí univerzity budou působit na webu jistě lépe, než fotky z fotobank, u kterých je mnohdy na první pohled poznat, že se jedná o zakoupené či stažené fotografie. Díky vlastním relevantním fotkám si uživatelé navíc budou moct udělat lepší představu o vašem pracovišti, projektu, konferenci, poskytovaných službách apod. Někdy může být fotobanka nejrychlejší volbou a nemusí to být nutně špatně, vždy ale zvažte, zda by nebylo lepší dohledat či nafotit fotky z reálného prostředí.

Nevíte, kde je možné získat fotky na web z prostředí univerzity? Podívejte se na náš článek Kde získat kvalitní fotky pro web.

2. Pozor na práva (licence)

Fotografie jsou stejně jako jiná autorská díla chráněny autorským zákonem. Nepoužívejte tedy na webu fotky, na jejichž použití nemáte oprávnění či souhlas autora. Pokud je daná fotka např. pod licencí Creative Commons, uveďte u ní v popisku autora, typ licence a odkaz na danou licenci.

Problém může být i s některými free fotobankami, kde se může stát, že sem někdo nahraje fotky, jejichž autorem ale není. Tipy na ověřené fotobanky najdete v našem článku Kde získat kvalitní fotky pro web.

3. Použijte fotky v dostatečné kvalitě

Obrázky nahrávejte do Umbraca v co nejlepší kvalitě / rozlišení. Umbraco si obrázek podle použití přizpůsobí, takže se nemusíte bát, že pak bude obrázek příliš veliký a stránka se bude načítat pomalu. Obrázek po vložení na web vždy zkontrolujte a ověřte, že není rozmazaný.

Tip! Použili jste obrázek v rámci komponenty hero box či hero header? Abyste docílili ideálního "zazoomování" obrázku a aby nebyl rozmazaný, nechte si v nastavení prvku automaticky přepočítat výšku obrázku. Pokud časem změníte obsah hero boxu nebo hero headeru a změní se tak jeho výška, nechte výšku obrázku opět znovu přepočítat.

4. Zkontrolujte obrázky na webu na různých zařízeních

Weby v Umbracu jsou responzivní. Když to vztáhneme na fotky, znamená to, že ve většině případů, kdy použijete fotky na webu, se tyto fotky zobrazí jinak na vašem monitoru v kanceláři, jinak na menším notebooku, na tabletu či na mobilu. Nespoléhejte tedy na to, že pokud vypadá obrázek dobře na vašem monitoru, bude to tak i na jiných zařízeních. V náhledu v Umbracu si tedy vždy zkontrolujte zobrazení obrázku i na tabletu a na mobilu.

5. Méně je někdy více (myslete na na návštěvníka webu)

Jsou fotky relevantní a mají na webu svůj smysl či význam pro návštěvníka? Fotografie web sice oživí, pokud ale nejsou relevantní a na web vložíte např. slider nesouvisejícího mixu fotek a obrázků, byť nějak spjatých s tématem webu, uživateli webu toho příliš neřeknou a k lepšímu zážitku z webu také patrně nepřispějí.

Je nutné mít na webu fotogalerii o desítkách podobných fotek z jedné akce či k jednomu tématu? Bude si je opravdu někdo prohlížet? Menší množství kvalitních a reprezentativních fotek bude možná lepší volbou.

6. Nepoužívejte členité fotky na pozadí

Některé prvky jako např. hero box nebo hero header umožňují použít obrázek na pozadí textu. V tomto případě je ale potřeba obrázky pečlivě vybírat a zvolit fotky či grafiku jednoduchou a dostatečně kontrastní k textu, aby byl text dobře čitelný. V tomto případě obzvlášť platí, že je potřeba zkontrolovat, jestli je text na obrázku čitelný i na jiných zařízeních včetně mobilu.

Vhodně a nevhodně použitý obrázek na pozadí textu (komponenta hero box)

7. Zvolte vhodnou komponentu

Fotky můžete prezentovat na webu různým způsobem za různým účelem prostřednictvím různých komponent.

  • Chcete na webu použít fotku jako pozadí banneru? → Zvolte hero box či hero header.
  • Potřebujete na web umístit galerii fotek? → Zvolte fotogalerii.
  • Chcete umístit ilustrační obrázek do článku? → Použijte obrázek či text s obrázkem.
  • Vkládáte na web seznam log pro prezentaci partnerů či sponzorů? → Využijte komponentu loga.

Obrázky jsou (či mohou být) součástí několika dalších komponent, jako např. slideshow, kategorie, grafický modul, vizitka, časová osa nebo citát.

8. Pozor na neprůhledné pozadí u log

Pokud vkládáte na web loga ve formě obrázků, dejte pozor na to, aby měla průhledné pozadí, jinak se vám kolem obrázku zobrazí bílý čtverec.

Tip! Problém s bílým pozadím u log můžete obejít také tím, že celému řádku či sloupci, kde jsou loga vložená, nastavíte bílé pozadí.

9. Fotky ve vizitkách

Nezamlouvá se vám vaše roky stará "ISová" fotka, která se automaticky zobrazuje ve vizitce? Nechte se přefotit, ať máte vaši fotku aktuální, nebo si do vizitky nahrajte jakoukoli vlastní fotku.

10. Přidejte fotkám v galerii popisky

Bude návštěvníkům webu jasné, co je na fotce? Zvažte, jestli by nebylo vhodné opatřit fotky popisky. Popisky můžete zobrazit přímo u náhledových fotek ve fotogalerii, nebo až po zvětšení


Více článků

Přehled všech článků

Používáte starou verzi internetového prohlížeče. Doporučujeme aktualizovat Váš prohlížeč na nejnovější verzi.

Další info