suchmaschinen und navigation mit bildern

[fourty2]

ich steh gerade vor folgendem problem...
eigentlich wollte ich eine navigation aus png's und text machen dessen größe sich je nach inhalt dynamisch anpasst.
dank IE und dessen nicht vorhandenen unterstützng für transparente png's muss ich mir aber was anderes überlegen.
unabhängig von irgendwelchen schlatern für den IE interessiert mich in dem zusammenhang aber prinzipiell das vorgehen von suchmaschinen.

das google zB navigationen aus bildern, oder bilder generell nicht auslesen kann ist ja bekannt. aber den 'alt'-text schon. was also wenn ich eine navigation aus bildern mache und in den alt-text zB 'navigation home' reinschreibe?
hilft mir das? können damit suchmaschinen was anfangen und verfolgen den link auch weiter?

 

[MasterofDistres]

Ich würde einfach folgendes machen:

<div id="navigation"> 
				<ul> 
					<li id="current" class="blog"><a href="http://link.de" title="Blog">Blog</a></li> 
					<li class="about"><a href="/about" title="About">Über</a></li> 
				</ul> 
			</div> <!-- End NAVIGATION -->

sprich zuerst eine normale Liste als Navigation erstellen + normale Textlinks (für jeden eine eigene Klasse) Danach kann man das ganze via CSS so anpassen, dass der Text sozusagen "verschwindet" und die Links jeweils mit einem eigenen Hintergrundbild (die Link-Grafik) versehen:

(musste bei der Anpassung des Containers, der Liste und der Elemente etwas rumtricksen, um mein Design auch umsetzen zu können )

/* Allgemeines Anpassen des Containers */
#navigation {
	background: url(images/navi-bg.png) repeat-x;
	height: 51px;
	margin: 0px 0px 0 115px;
	width: 680px;
	padding: 1px 0px;
	color: #3b2F25;
}

/* Anpassen der Liste (Breite, Höhe etc.) */ 
#navigation ul {
	height: 48px;
	margin: 1px auto;
	padding: 0px 0 0 57px;
	font-size: 24px;
	border: 1px solid white;
	border-top: none;
	border-bottom: none;
}

/* "Ausblenden" des Textes, weitere Anpassungen */
#navigation li,
#navigation a,
#navigation a:link,
#navigation a:visited {
	display: block;
	float: left;
	font-size: 1px;
	text-indent: -9999px;
	height: 49px;
	border: none;
}

hier die Anpassungen für jeden einzelnen Link (eigenes Hintergrundbild normal, hover ...)

/* Blog */
#navigation .blog,
#navigation .blog a { width: 130px }
#navigation .blog a:link,
#navigation .blog a:visited {
	background: url(images/navi-blog.png) no-repeat 0 0px}
#navigation .blog a:hover {
	background: url(images/navi-blog.png) no-repeat 0 -49px}
#navigation #current.blog a:link,
#navigation #current.blog a:visited {
	background: url(images/navi-blog.png) no-repeat 0 -98px}

 

[fourty2]

an die möglichkeit hatte ich auch schon gedacht. einfach textlinks und grafik darüberlegen.

dennoch würde mich interessieren wie suchmaschinen mit grafischer navigation und einem alt-text umgehen.

aber danke für deine inspiration

 

[Slashwalker]

Soweit ich weiß wird der Alt-Text als Link-Text eingestuft.

<a href="blog.html"><img src="bild.jpg" alt="Blog" /></a>

entspricht also

 <a href="blog.html">Blog</a>

Daher sollten die Links ganz normal verfolgt werden.