Přeskočit na obsah
@365tipu
  • Domů
    • Práce na dálku
    • Twitter for dummies
    • Jak na Mastodon
    • Facebook a marketing
    • Návod pro Instagram
    • Jak na LinkedIn
    • Bezpečný Internet
    • Bezpečnost pro novináře
    • Soukromí na Facebooku
    • Pomocník webdesignera
    • Jak na WordPress
    • Nepostradatelné software
      • Jak na Windows 11
      • Jak na Windows 10
      • Jak na iPhone/iPad
      • Jak na Mac OS
      • Jak na Apple TV/TV+
      • Jak na Apple Watch
      • Jak na Apple AirTag
      • Microsoft Office
      • Linux
    • Jazykový koutek
    • GTD
    • Filmy a TV seriály
    • Recenze
    • Chytrá domácnost
      • Chytrá domácnost
      • Jak na Google Home
      • Amazon Echo a Alexa
      • Apple HomePod
      • Jak na Raspberry Pi
      • Jak na QNAP NAS
      • Netatmo
    • Jak na Home Assistant
  • Všechny štítky
  • Odběr e-mailem
  • RSS/XML
  • Kontakt
    • Kontakt
    • Twitter
    • Facebook
    • BlueSky
    • Mastodon
      • Threads
    • Zásady Cookies (EU)
TIP#1359: Proč jsou důležité ALT texty (popisky) obrázků na webu?
21. 5. 2019 podle 365tipů
Internet, Obsah, Software, WordPress

TIP#1359: Proč jsou důležité ALT texty (popisky) obrázků na webu?

Pokud chcete odpověď „pro lidi“, tak je to prosté. Protože se objeví všude tam, kde obrázek není možné zobrazit nebo ho není možné vidět. Těm co jsou nevidomí či slabozrací tak výrazně pomáhají v možnosti pracovat s webovými stránkami. Právě tohle je vlastně ten nejzásadnější důvod.

Pokud provozujete obsahový web, noviny, časopis, magazín, tak popisky (ALT) u obrázků jsou prostě zásadní a měli byste jim věnovat čas a úsilí. Pokud se podíváte na @365tipů, tak uvidíte, že tady kovářova kobyla chodí bosa a měl bych přemýšlet nad napravením. O což jsem se už párkrát pokoušel, ale zdejší tipy do systému míří ve velmi krátkém dostupném čase, takže tohle je prostě důsledek.

Jak důležité to je se můžete podívat třeba i ve WCAG 2.0 a to hned na prvním bodě pravidel: All non-text content that is presented to the user has a text alternative that serves the equivalent purpose.

Pokud chcete odpověď „pro stroje“, tak protože je to hlavní text, který se vztahuje k danému obrázků ve vyhledávačích. Z tohoto v zásadě čistě technického pohledu jsou ALT prvky u obrázků důvodem pro klasickou práci s ohledem na SEO – tedy nejenom že mají popisovat obrázek pro lidi, měly by ještě navíc obsahovat potřebná klíčová slova a fráze.

Z výše uvedeného tedy plyne, že u ALT popisků obrázků bude vždy kombinovat snahu vysvětlit co je na obrázku (či čeho se týká) pro lidi s potřebou pro správnou indexaci a zahrnutí do vyhledávače.

2019-05-12 10_32_40-Upravit příspěvek ‹ @365tipu - Tipy a triky — WordPress.com.png
WordPress umožňuje ke každému obrázku vyplnit vše potřebné. U obrázku v záhlaví se k tomu ale dá dostat až přes několik kliknutí. Obecně by se vyplatilo, kdyby cestu k vyplnění ALT zásadně zjednodušil. Tento text pod obrázkem (Caption) ale nemá s obrázkem vlastně nic společného.  Pozor na to, že pokud nejprve napíšete Caption a pak budete chtít doplnit ALT, tak se vám Caption smaže (ano, chyba).

Také platí, že nemá smysl v ALT uvádět slova jako „Obrázek“ či „Fotografie“ – čtečky pro nevidomé či slabozraké to doplní, vyhledávače moc dobře vědí, že je to obrázek. Jedním z dobrých doporučení je ALT brát jako větu – a také ji tedy ukončit tečkou – ocení to právě uživatelé čteček. Ta věta by opravdu měla popisovat co je v obrázku – nic víc, žádné informace o autorovi, zdroji, atd.

TIP: Jak na web vkládat obrázky. Co všechno byste měli vědět. Nejen o velikosti a rozměrech

POZNÁMKA: Jste zmateni? IMG má ALT a TITLE a vy nevíte co s tím? Jednoduché, správně je ALT, na TITLE většinou zapomeňte. Dobré vědět je , že ALT je čten čtečkami, TITLE je zpravidla pouze zobrazeno poté, co najedete nad obrázek kurzorem (a tím pádem v mobilních zařízení vůbec nefunguje).

Pracujte s ALT každopádně i střízlivě – jsou chvíle, kdy je lepší je vynechat, hlavně proto, že při rolování stránkou by nevidomí/slabozrací byli zaplavování stále se opakujícím textem – jako dobrý příklad je pohled na newsfeed na Facebooku či Twitter kde u každého příspěvku je profilový obrázek – ten by ALT mít neměl. Stejně tak je dobré ALT vynechat v seznamech odkazů na další články na obsahových webech – zpravidla by se tam jenom opakoval titulek.

Ale pozor, „vynechat“ ALT neznamená, že ho vůbec neuvedete. Správná cesta je, že použijete ALT=““ nebo ALT=“ „. Což, mimochodem, děláte i s ohledem na čtečky pro nevidomé či slabozraké.

ALT ale nikdy nezapomeňte nastavit u všech ovládacích prvků/ikon, které nemají doprovodný text.  Tam musí ALT popisovat k čemu daný prvek slouží či kam vede (pokud je to odkaz).

TIP: Dobře zpracovaný přehled s dalšími užitečnými pravidla najdete v Alt-texts: The Ultimate Guide

Pokud chcete dál studovat něco souvisejícího, najděte si přes Google povídání o LONGDESC.

Další tipy a triky pro webdesign hledejte v ‣ Pomocník Webdesignera

Související příspěvky

TIP#727: Proč je nutné hlídat, jak velké obrázky dáváte na web či do e-mailů?
TIP#1050: Jak z PDF udělat obrázek? A proč neposílat věci zbytečně v PDF
TIP#835: Co se stane, když 365tipu.wordpress.com přesunete na 365tipu.cz

Blog Blogování Foto Fotografie Obrázek Obrázky Přístupnost SEO UX Vyhledávání Webdesign Wordpress

Předchozí článekTIP#1358: Proč aplikace v mobilu či fitness náramek podivně měří vzdálenost co ujduDalší článek Jak stáhnout Windows 10 May 2019 Update (verzi 1903)

Nejnovější příspěvky

  • TIP#3253: Co je to latence a proč to hraje roli (nejen) při hraní her
  • TIP3252: Chladit notebooky podložkou? Co byste měli vědět
  • TIP#3251: Kouzelná meteostanice ATMOS řeší problém, o kterém ani nevíte
  • TIP#3250: Jak zabránit tomu, aby se Mac po restartu znovu otevřel se všemi aplikacemi z poslední relace
  • TIP#3249: Zálohovat počítači či NAS? Rozhodně ano. Ale kam a jak? Včetně velkého přehledu cloudových služeb

Nejčtenější

Přispět na provoz můžete

Přispějte. 500 Kč můžete změnit dle vlastního uvážení. Z částky zaplatíme DPH a pochopitelně daně platbou na účet 331049001/5500, spec. symbol 365. Částku si můžete změnit. Z platby odvádíme DPH a daníme ji.

Zdejší tipy na zajímavé/užitečné věci obsahují affialiate odkazy na Alzu/Aliexpres

... nebo placeným odběrem

Staňte se platícím odběratelem newsletteru. 5 USD/měsíc, 50 USD/rok nebo dle vlastního uvážení od 100 USD/rok. Každou středu a neděli nálož informací.

Kontakt a tak

Kontakt: 365tipu@gmail.com

Veškerý obsah zde uveřejněný je CC-BY-NC-SA