Jak psát názvy souborů obrázků, které pomáhají SEO a přístupnosti

Na názvech souborů obrázků záleží, ale ne tolik, jak se často tvrdí

Názvy souborů obrázků patří k těm drobným detailům webu, u kterých lidé mívají až přílišnou jistotu. Některé týmy je zcela ignorují a nasazují IMG_7421.jpg. Jiné promění každou produktovou fotografii v miniaturní esej z klíčových slov.

Užitečný střed je jednoduchý: pište názvy souborů, které obrázek jasně popisují, pomáhají lidem spravovat podklady a dávají vyhledávačům trochu dodatečného kontextu. Nečekejte, že názvy souborů zachrání slabý obsah, chybějící alternativní text, pomalé obrázky nebo matoucí stránku.

Google výslovně doporučuje používat pro obrázky krátké, popisné názvy souborů. Je to dobrá rada. Je to také omezená rada. Název souboru je jen jedna kontextová stopa z mnoha: okolní text, název stránky, strukturovaná data, popisky, alternativní text, odkazy, kvalita obrázku a to, zda je obrázek pro stránku skutečně užitečný.

S přístupností je to podobné. Dobrý název souboru není náhradou za alternativní text. Může ale snížit škody, když se něco pokazí, a usnadňuje život editorům, vývojářům i uživatelům, kteří soubor stahují, ukládají nebo sdílejí.

Krátké pravidlo

Použijte název souboru, který odpovídá na tuto otázku:

Kdyby někdo viděl jen název souboru, měl by přibližnou představu, co obrázek obsahuje?

Dobré:

• red-running-shoes-side-view.jpg
• checkout-error-message-mobile.png
• oak-dining-table-120cm-walnut.jpg
• team-planning-workshop-whiteboard.webp

Špatné:

• IMG_7421.jpg
• final-final-v3-new.jpg
• best-cheap-running-shoes-buy-online-discount-sale.jpg
• screenshot.png

Cílem není poezie. Cílem je užitečná konkrétnost.

Co dobrý název souboru obrázku dělá pro SEO

Dobrý název souboru pomáhá vyhledávačům pochopit obrázek, zejména v kontextu vyhledávání obrázků. Může posílit téma stránky a předmět vizuálu.

Ve srovnání se základy je to ale slabý signál:

• Obrázek se nachází na relevantní stránce.
• Okolní text obrázek vysvětluje nebo podporuje.
• Obrázek má v případě potřeby vhodný alternativní text.
• Obrázek lze procházet a indexovat.
• Soubor není zbytečně velký.
• Stránka se spolehlivě načítá.

Pokud opravujete obrázky kvůli organickému vyhledávání, začněte relevancí a užitečností stránky. Pak vyčistěte názvy souborů. Poté se podívejte na kompresi, formáty, rozměry, lazy loading a případně strukturovaná data. Náš průvodce formáty obrázků v roce 2026 je užitečným doplňkem, pokud se úklid názvů změní v širší revizi výkonu obrázků.

Co dobrý název souboru obrázku dělá pro přístupnost

Přísně vzato, názvy souborů nejsou hlavním mechanismem přístupnosti obrázků. Tím je alternativní text.

Pokud obrázek předává informaci, atribut alt by měl poskytnout textovou alternativu. Pokud je obrázek dekorativní, atribut alt by měl být obvykle prázdný: alt="". Pokud je obrázek odkazem nebo tlačítkem, alternativní text by měl popisovat akci nebo cíl, ne pouze pixely.

Podrobně jsme se tomu věnovali v pragmatickém průvodci alternativním textem obrázků v roce 2026 a stojí za to brát alternativní text jako samostatný redakční úkol.

Proč se tedy kvůli přístupnosti vůbec zabývat názvy souborů?

Protože názvy souborů se často objevují na okrajích uživatelského zážitku:

• Některé kombinace asistivních technologií a prohlížečů mohou zobrazit název souboru, když chybí alternativní text.
• Stažené obrázky potřebují srozumitelná jména i mimo webovou stránku.
• Mediální knihovny v CMS se snáze auditují, když jsou názvy popisné.
• Editoři s menší pravděpodobností připojí špatný obrázek, když jsou soubory jasně pojmenované.
• Rozbité obrázky a ladicí pohledy se snáze interpretují.

Název souboru z nepřístupného obrázku přístupný obrázek neudělá. Špatný název souboru ale může selhání ještě více znepřehlednit.

Praktická konvence pojmenování

Použijte tento výchozí vzor:

subject-detail-context.ext

Příklady:

• espresso-machine-steam-wand-closeup.jpg
• pricing-table-enterprise-plan-desktop.png
• garden-chair-green-metal-front-view.webp
• password-reset-email-example.png

U produktů často lépe funguje o něco strukturovanější verze:

brand-product-model-color-view.ext

Příklady:

• acme-trail-jacket-blue-front.jpg
• northline-desk-lamp-brass-side.webp
• terra-ceramic-mug-white-top-view.jpg

U redakčních obrázků:

topic-specific-scene.ext

Příklady:

• remote-team-video-call-laptop.jpg
• city-bike-lane-rain-evening.jpg
• developer-debugging-http-headers-terminal.png

U screenshotů uživatelského rozhraní:

feature-state-device.ext

Příklady:

• checkout-validation-error-mobile.png
• account-settings-two-factor-enabled-desktop.png
• analytics-dashboard-empty-state-tablet.png

Nejde o rigidní taxonomii. Jde o odstranění nejednoznačnosti.

Používejte spojovníky, malá písmena a běžná slova

U veřejných webových podkladů dávejte přednost:

• Malým písmenům
• Spojovníkům mezi slovy
• Žádným mezerám
• Žádným podtržítkům
• Žádné interpunkci kromě spojovníků
• Žádným speciálním znakům, pokud je váš systém nevyžaduje

Dobré:

blue-cotton-shirt-front.jpg

Vyhněte se:

Blue Cotton Shirt (Front).jpg

blue_cotton_shirt_front.jpg

bluecottonshirtfront.jpg

Spojovníky se snáze čtou, snáze kopírují a v URL jsou široce chápány jako oddělovače slov. Malá písmena také pomáhají vyhnout se otravným chybám s rozlišováním velikosti písmen mezi lokálním vývojem, linuxovými servery, CDN a objektovým úložištěm.

Udržujte názvy souborů krátké, ale ne vágní

Název souboru by měl být dostatečně dlouhý na to, aby obrázek popsal, a dostatečně krátký na to, aby zůstal čitelný.

Užitečný rozsah bývá obvykle 3 až 8 slov před příponou.

Příliš vágní:

shoes.jpg

Lepší:

red-running-shoes-side-view.jpg

Příliš mnoho:

best-lightweight-red-running-shoes-for-marathon-training-side-view-discount.jpg

Lepší:

red-marathon-running-shoes-side-view.jpg

Pokud fráze zní jako vyhledávací dotaz napsaný zoufalým marketérem, je pravděpodobně příliš dlouhá.

Nepřeplňujte názvy souborů obrázků klíčovými slovy

Přeplňování názvů souborů klíčovými slovy je obvykle známkou toho, že stránka neplní svou práci.

Špatně:

best-seo-agency-seo-services-seo-consultant-seo-company.jpg

To není užitečné pro uživatele. Není to užitečné pro editory. Není to seriózní praxe přístupnosti. Také to způsobuje, že váš web působí méně kvalitně.

Použijte přirozený název věci zobrazené na obrázku. Pokud se klíčové slovo hodí, protože obrázek přesně popisuje, použijte ho. Pokud ne, vynechte ho.

Například pokud je na obrázku fotografie černé kožené pohovky, black-leather-sofa-three-seat.jpg je v pořádku. best-modern-luxury-living-room-furniture-online.jpg není název souboru; je to volání o pomoc.

Slaďte název souboru se skutečným obrázkem

Zní to samozřejmě, ale knihovny obrázků se časem rozcházejí s realitou. Soubor s názvem homepage-hero-new.jpg může nakonec zobrazovat jiný produkt, jinou osobu nebo zcela jinou kampaň.

Tím vznikají dva problémy.

Zaprvé vyhledávače a uživatelé dostávají nekonzistentní signály. Zadruhé týmy přestávají mediální knihovně důvěřovat.

Pokud se význam obrázku změní, přejmenujte ho před publikováním. Pokud vaše CMS nebo CDN přejmenování komplikuje, zvažte interní používání stabilních ID podkladů a zároveň, kde je to možné, generujte popisné veřejné názvy souborů.

Dobrý interní workflow může vypadat takto:

1. Nahrajte původní podklad.
2. Odstraňte zbytečná metadata, pokud záleží na soukromí.
3. Přejmenujte odvozeninu použitou na webu.
4. Exportujte ve správných rozměrech a formátu.
5. Přidejte alternativní text a popisky v CMS.

Pokud fotografie pocházejí od uživatelů, zaměstnanců nebo terénních týmů, pamatujte, že názvy souborů jsou jen jednou z oblastí ochrany soukromí. Data EXIF mohou obsahovat časová razítka, informace o fotoaparátu a údaje o poloze. Před publikováním citlivých obrázků si přečtěte našeho průvodce jak odstranit metadata EXIF před sdílením fotografií online.

Oddělte názvy souborů od alternativního textu

Častou chybou je používat stejnou frázi pro název souboru i alternativní text.

Někdy je to přijatelné. Často je to lenost.

Název souboru:

red-running-shoes-side-view.jpg

Dobrý alternativní text na produktové stránce:

Red running shoe shown from the side, with a white foam sole and black laces.

Dobrý alternativní text u náhledu ve výběru barvy:

Red

Dobrý alternativní text, pokud je obrázek dekorativní:

alt=""

Název souboru identifikuje podklad. Alternativní text slouží uživateli v kontextu. Jsou to související úlohy, ne totožné úlohy.

Pojmenování obrázků pro různé typy webů

Ecommerce

Uveďte typ produktu, důležitou variantu a pohled.

Příklady:

• linen-shirt-white-front.jpg
• linen-shirt-white-back.jpg
• linen-shirt-white-collar-detail.jpg

Vyhněte se přidávání cen, akcí nebo dočasného jazyka kampaní. Ty se mění příliš často.

Blogy a redakční weby

Popište scénu nebo koncept, ne nadpis článku.

Dobré:

designer-reviewing-mobile-layout.jpg

Méně užitečné:

ultimate-guide-to-mobile-ux.jpg

Obrázek může být znovu použit, oříznut nebo syndikován. Název založený na scéně stárne lépe.

SaaS a dokumentace

Pojmenovávejte screenshoty podle funkce, stavu a platformy.

Příklady:

• billing-settings-payment-method-empty-state.png
• project-dashboard-filter-menu-open.png
• api-token-created-confirmation-modal.png

Díky tomu jsou aktualizace dokumentace mnohem méně bolestivé.

Místní firmy

Používejte službu, objekt nebo lokalitu, pokud jsou skutečně viditelné a relevantní.

Příklady:

• bakery-window-display-sourdough-loaves.jpg
• dental-clinic-reception-area-berlin.jpg
• plumber-repairing-kitchen-sink.jpg

Nepřidávejte názvy měst do každého souboru, pokud to obrázek nepodporuje. Fotografie hasáku není smysluplně wrench-london.jpg.

A co rozměry a verze obrázků?

Vyhněte se uvádění rozměrů v hlavním popisném názvu, pokud to váš systém nepotřebuje.

Lepší rodina podkladů:

• red-running-shoes-side-view.jpg
• red-running-shoes-side-view-800w.jpg
• red-running-shoes-side-view-1600w.jpg

Pokud váš build systém generuje responzivní varianty automaticky, nechte ho připojovat šířky nebo hashe. Neudržujte ručně desítky názvů souborů, pokud vás nebaví budoucí archeologie.

Obsahové hashe jsou pro cacheování v pořádku:

red-running-shoes-side-view.a8f31c.webp

Popisná část tam stále je. Hash slouží stroji.

Rychlý kontrolní seznam před publikováním

Před publikováním obrázku se zeptejte:

• Popisuje název souboru obrázek běžným jazykem?
• Je psaný malými písmeny a oddělený spojovníky?
• Neobsahuje přeplnění klíčovými slovy?
• Vyhýbá se dočasným slovům jako new, final nebo v2?
• Dává alternativní text smysl v kontextu stránky?
• Je formát a velikost souboru vhodná?
• Byla v případě potřeby odstraněna citlivá metadata?

Pokud na ně dokážete odpovědět ano, název souboru je pravděpodobně dost dobrý. Nestravte 20 minut pojmenováním dekorativního oddělovače. Věnujte ale 20 sekund tomu, aby se z DSC0038.jpg nestala trvalá veřejná URL.

<!-- tool-cta:start -->

💡 Vyzkoušejte toto: Normalizujte názvy souborů hromadně na lowercase-kebab-case pomocí Case Converter, aby názvy vašich obrázků zůstaly v celém projektu konzistentní.

<!-- tool-cta:end -->

Tichý přínos: lepší týmy

SEO hodnota názvů souborů obrázků je skromná. Provozní hodnota je větší.

Dobré názvy souborů usnadňují vyhledávání v mediálních knihovnách. Snižují počet duplicitních nahrání. Pomáhají designérům, vývojářům, marketérům a týmům podpory mluvit o stejném podkladu, aniž by otevírali šest náhledů. Zrychlují audity.

To je skutečný důvod, proč standardizovat pojmenování obrázků. Vyhledávačům jasnost prospívá, ale lidem také. A právě u lidí se práce obvykle začne rozpadat jako první.