Archiv weblogu
Text za obrázek, obrázek přes text
Jak naložit s textem, který je pomocí CSS přetvořen na obrázek (typické je logo společnosti). Řeším dilema která verze je nejlepší z pohledu přístupnosti, SEO a uživatelského pohodlí. Došel jsem k několika variantám, které už asi kdekdo popsal, ale nemohu se rozhodnout. Každá varianta je zajímavá, ale také nečím nevýhodná.
Neviditelný text s obrázkem na pozadí
První verze počítá s textem obaleným značkou „span“ apod., která jej zneviditelní a pomocí stylů má na pozadí obrázek. Podobné to může být pokud text ve stylech posunu mimo okno prohlížeče.
Klad: Pro SEO ideální, protože informace jsou v textové formě (např.: v nadpisu H1).
Zápor: Základním nedostatkem je když jsou v prohlížeči vypnuté obrázky. Takové řešení totiž nemá alt popisek obrázku a text není vidět kvůli stylům. Řešením by mohl být TITLE popisek textu.
Text za obrázkem
Druhou možností je schovat (opět pomocí stylů) text za obrázek. Musí se ale zajistit, aby v žádném případě text nevyčníval pod obrázkem.
Klad: Při vypnutých obrázcích je vidět text. Pro vyhledávače je informace textová.
Zápor: Text musí být definován tak, aby nevyčníval což bych řešil asi velikostí fontu, která se nedá zvětšít. To je ale při kombinaci vypnutých obrázků a špatného zraku špatné řešení.
Klasický obrázek s ALT a TITLE popiskem
Třetí možnost je mít v HTML klasický obrázek, který bude mít alternativní informaci v popisku.
Klad: Obrázek je obrázkem. Při vypnutých obrázcích v prohlížečích nese svou informaci v textu.
Zápor: Nevím jak je to z pohledu SEO, ale nebude mít asi váhu jako nadpis první úrovně H1.
Obrázek má být obrázkem
V honbě za nejlepším řešením pro vyhledávače jsem se už asi dostal do stavu, kdy věci moc kombinuji. Pomocí kaskádových stylů je možné udělat hodně. Otázka zní jestli je to k užitku. Nakonec jsem došel k názoru, že nemá smysl stavět vyhledávač nad uživatele, ale snažit se vyhovět oběma jednoduchou cestou. Dělání obrázku z textu je nesmysl, protože prostě obrázek není text. Proto se přikláním k verzi kde obrázek je obrázkem. Připravím se tak možná o nějaké plusy z hlediska optimalizace pro vyhledávače, ale na druhé straně nemám ve zdrojáku značky a informace, které tam nepatří.
Přesto mě zajímá jaký na to máte názor. Která verze se Vám zdá nejlepší? Máte-li ještě jiná kvalitní řešení, sem s nimi.