Alt texty obrázků na firemním webu: co psát a proč na nich záleží

Firemní web bez obrázků dnes téměř neexistuje. Fotografie produktů, tým v akci, logo partnerů nebo ilustrace u služeb dělají stránku srozumitelnější a důvěryhodnější. Vyhledávače a čtečky obrazovky ale nevidí soubor JPG nebo PNG tak, jak ho vidíte vy v prohlížeči. Potřebují textový popis — tzv. alt text (alternativní text). Správně napsaný alt text pomáhá Google pochopit obsah stránky, může přivést návštěvníky z Vyhledávání obrázků a zároveň zpřístupní web lidem se zrakovým postižením. Na první pohled jde o drobnost v administraci webu. Ve skutečnosti jde o součást SEO, přístupnosti i celkového dojmu z vaší značky.

Co je alt text a proč ovlivňuje viditelnost webu

Alt text je krátký popis obrázku, který se vkládá do HTML kódu atributem alt. Když se obrázek nenačte kvůli pomalému připojení, zobrazí se místo něj právě tento text. Stejný popis čtečky obrazovky nahlas lidem, kteří web nevidí, ale poslouchají ho. Pro Google jde o důležitý signál: vyhledávač z alt textu zjišťuje, co je na fotografii a jak souvisí s obsahem stránky.

Podle doporučení Google pro obrázky ve vyhledávání by alt text měl popisovat obsah snímku věcně a stručně. Nepomáhá opakovat stejná klíčová slova desetkrát na jedné stránce ani psát obecné fráze typu „obrázek“ nebo „foto“. Google hodnotí web jako celek — kvalitní alt texty doplňují nadpisy, meta popisy a texty na stránce. U lokální firmy může popis fotografie interiéru provozovny nebo detailu práce posílit relevanci pro dotazy spojené s vaším oborem a městem.

Přístupnost je druhý silný důvod. Webové stránky by měly splňovat zásady přístupnosti; mezinárodní standard popisuje například dokument WCAG 2.2. Chybějící nebo nevhodný alt text patří mezi nejčastější chyby, které na firemních webech nachází audit přístupnosti. Firma, která o alt textech ví a dbá na ně, tím ukazuje, že myslí i na zákazníky, kteří web vnímají jinak než většina — a to působí profesionálně.

Jak alt text napsat tak, aby dával smysl lidem i Googlu

Dobrý alt text odpovídá na otázku: „Co je na tomto obrázku důležité pro návštěvníka této stránky?“ Ne popisuje každý pixel, ale vystihuje podstatu. U produktu uveďte typ, barvu nebo variantu, pokud to zákazník potřebuje rozlišit. U fotografie týmu stačí stručně identifikovat situaci — například „Instalatér Jan Novák při montáži bojleru v koupelně“. U screenu softwaru popište, co na snímku vidíme: „Přehled objednávek v administraci e-shopu“.

Délka alt textu nemá pevné pravidlo, ale praktická hranice je zhruba 125 znaků. Delší popis může být užitečný u složitých schémat nebo infografik, ale u běžných fotografií na firemním webu postačí jedna věta. Klíčová slova zapracujte přirozeně — tak, jak byste obrázek popisovali kolegovi po telefonu. Pokud stránka cílí na dotaz „oprava kotlů Ostrava“ a fotografie ukazuje technika u kotle, smysl dává alt text „Servisní technik kontroluje plynový kotel u zákazníka v Ostravě“, ne „Ostrava Ostrava kotel oprava kotlů nejlepší servis“.

Názvy souborů také hrají roli vedle alt textu. Soubor pojmenovaný montaz-kuchynske-linky-brno.jpg je pro vyhledávače srozumitelnější než IMG_2847.jpg. Alt text ale nenahrazuje název souboru ani titulek stránky — doplňuje je. Každý významný obrázek na stránce by měl mít vlastní alt text. Stejný popis na deseti fotografiích v galerii Google nepotěší ani návštěvníka, který poslouchá čtečku obrazovky.

• Popisujte obsah, ne emoce ani marketingové slogany — místo „Nejlepší tým v republice“ raději „Čtyřčlenný tým zahradníků při výsadbě keřů“.
• Nepište „obrázek“ nebo „fotografie“ — čtečka už typ média oznámí sama.
• U obrázku, který je odkazem, alt text popisuje cíl — například „Přejít na stránku s ceníkem služeb“.
• U log partnerů uveďte název firmy: „Logo společnosti DHL“.

Kdy alt text nechat prázdný a kdy naopak doplnit

Ne každý obrázek na webu potřebuje popis. Dekorativní prvky — abstraktní pozadí, oddělovací ikonka, opakující se vzor — obsah stránky neinformují. U nich je správné nechat atribut alt prázdný (alt=""), aby čtečka obrazovky snímek přeskočila. Pravidla pro dekorativní obrázky vysvětluje podrobně návod W3C k přístupným obrázkům.

Naopak u informačních snímků je prázdný alt text chyba. Typické případy, kdy alt text musí být: produktové fotografie v e-shopu, ukázky realizací u řemeslníků, mapa s vyznačením pobočky, graf s cenami nebo schéma postupu objednávky. Pokud by bez obrázku stránka ztratila význam, alt text je povinný.

Logo firmy v hlavičce webu bývá na pomezí. Běžná praxe: alt text „Název vaší firmy“ nebo „Domů — Název firmy“, protože logo vede na úvodní stránku. Ilustrace u citátu zákazníka popisuje spíše kontext — „Spokojená zákaznice při předání klíčů od nové kuchyně“ — ne text citátu, ten už je v odstavci pod obrázku.

Kde alt texty zkontrolovat a jak je opravit

Chybějící alt texty často vznikají nahráním fotek bez kontroly v redakčním systému. Ve WordPressu nebo jiném CMS najdete pole „Alternativní text“ v knihovně médií nebo při vkládání obrázku do článku. Projít byste měli zejména úvodní stránku, stránky služeb, galerii referencí a blog — tam bývá nejvíc snímků.

Ruční kontrola stačí u menšího webu: otevřete každou důležitou stránku, klikněte na obrázek pravým tlačítkem a zvolte „Prozkoumat“ (v Chrome), nebo v administraci filtrujte média bez vyplněného alt textu. V prohlížeči můžete také dočasně vypnout zobrazování obrázků — pokud se místo fotky neobjeví smysluplný text, alt text chybí nebo je špatně.

Nástroje pro hlubší analýzu nabízí Google Search Console — uvidíte, zda se vaše obrázky zobrazují ve vyhledávání, a odhalíte technické problémy stránky. Specializované extension pro přístupnost (například WAVE nebo axe) v prohlížeči zdarma upozorní na prázdné alt atributy u informačních obrázků. Po opravě alt textů sledujte v analytice, zda roste provoz z obrázkového vyhledávání; u většiny firemních webů jde o doplněk k textovým výsledkům, ne hlavní kanál, ale zbytečně ho nechte ležet ladem.

Při tvorbě nového webu nebo redesignu zadejte alt texty hned při nahrávání fotografií — zpětné doplňování u desítek snímků zabere výrazně víc času. Seznam snímků s navrhovanými popisy můžete připravit v tabulce ještě před spuštěním webu; copywriter nebo fotograf často popis ví lépe než programátor.

Praktické shrnutí

Alt texty jsou malý detail s měřitelným dopadem. Každý informační obrázek na firemním webu by měl mít stručný, výstižný popis v češtině, který doplňuje obsah stránky a nezní jako seznam klíčových slov. Dekorativní prvky nechte s prázdným alt atributem. Názvy souborů pojmenovávejte srozumitelně a alt texty kontrolujte při každé větší aktualizaci webu.

Pokud si nejste jistí, zda vaše fotografie na webu Google i zákazníkům pomáhají, nebo potřebujete web, kde bude SEO včetně alt textů vyřešené od začátku, obraťte se na nás. Firma WebRift je tvůrcem webových stránek pro malé a střední firmy — navrhujeme a stavíme weby s důrazem na rychlost, přehlednost a základní optimalizaci pro vyhledávače. Podívejte se na naše realizace a služby a napište nám přes kontaktní formulář. Rádi vám pomůžeme s vytvořením webové stránky, u které budou i detaily jako alt texty fungovat ve váš prospěch.