SEO obrázky
Pomocí tohoto řešení dosáhneme toho efektu, že se obrázek zobrazí klasicky a kvůli SEO pod něj vložíme jeho ekvivalent v textové podobě. Toto řešení zajistí, že je text viditelný i tehdy, když máme vypnuté obrázky, nelze ho ale použít u průhledných obrázků, jak ukazuje druhý obrázek v příkladu.
Zde si můžete prohlédnout výsledek.
Toto řešení publikoval Dave Shea. Bližší popis najdete v článku Revised Image Replacement.
CSS
.obrazek
{
float: left;
margin: 10px;
}
h3
{
margin: 0;
padding: 0;
}
.obrazek .logo
{
width: 240px;
height: 30px;
position: relative;
border: solid #ddd 1px;
}
.obrazek .logo span
{
background: url(60-1.gif) no-repeat;
position: absolute;
width: 100%;
height: 100%;
}
.pruhledny .logo span
{
background: url(60-2.gif) no-repeat;
}
XHTML
<html>
<body>
<div class=“obrazek“>
SEO obrázek
<h3 class=“logo“>
<span></span>Knihovna CSS
</h3>
</div>
<div class=“obrazek pruhledny“>
Průhledný SEO obrázek
<h3 class=“logo“>
<span></span>Knihovna CSS
</h3>
</div>
</body>
</html>
Mohlo by vás také zajímat
-
Nové AI modely od Open AI a Google
22. května 2024 -
-
Jak lze snadno upravovat soubory v PDF?
14. září 2023 -
ZONER Webmail jako první v Česku přináší BIMI s VMC
11. července 2024
Nejnovější
-
Jak rozšířit úložiště Macu za pětinovou cenu?
16. prosince 2024 -
Nové trendy v doménách pro osobní projekty – DIY, LIVING a LIFESTYLE
9. prosince 2024 -
Jak chránit webové stránky před Web/AI Scrapingem
27. listopadu 2024 -
Jaký monitor je nejlepší k novému Macu Mini?
25. listopadu 2024
Individual Bike | Web gallery | Beautiful websites | Webium.eu
Lis 18, 2009 v 22:21[…] Bicykle na mieru”. Dobré riešenie na umiestnenie textu pod obrázok môžeme nájsť na interval.cz. Na druhej strane sú zbytočné alternatívne texty pri obrázkoch, ktoré nemajú žiadnu […]