it-swarm.com.de

CSS Sprite, welches HTML-Tag verwendet werden soll

Ich überlege, für meine Bilder auf CSS Sprite umzusteigen. Das Hauptproblem ist, dass ich etwas brauche, das mit dem alt-Attribut kompatibel ist. (Seo-Zweck)

Was kann ich benutzen? Der erste Gedanke, an den ich dachte, war die Verwendung eines Standards

<img src="1x1.gif" class="mysprite">

Das Problem ist, dass ich das nicht benutzen kann, weil das von Google aus folgendem Grund verdächtig wäre:

<img src="1x1.gif" class="mysprite" alt="my keyword1">

<img src="1x1.gif" class="mysprite" alt="my keyword2">

<img src="1x1.gif" class="mysprite" alt="my keyword3">

(das gleiche Bild "1x1.gif" mit unterschiedlichem Alternativtext)

Wie können wir das lösen?

2
dynamic

Wenn ein alt-Attribut angemessen ist, ist das Bild Inhalt.

Wenn das Bild Inhalt ist, ist es kein Hintergrund Bild, sollte nicht mit CSS angewendet werden und kann nicht in ein Sprite verwandelt werden.

3
Quentin

CSS-Sprites werden nicht mit IMG-Tags verwendet. Sie werden mit CSS verwendet (wie in CSS Sprites). Sie werden normalerweise mit der CSS-Eigenschaft background-image und der Pseudoklasse :hover verwendet. Wenn eine Aktion ausgeführt wird, normalerweise ein Mouseover-Ereignis, wird das Bild im Hintergrund geändert, indem das Hintergrundbild auf das entsprechende Bild verschoben wird. Ein häufiges Beispiel hierfür ist das Anzeigen verschiedener Schaltflächenzustände (normal, aktiv usw.). Hier sind einige gute Beispiele dafür .

Zu Ihrer Information, das alt-Attribut hat nur einen sehr geringen SEO-Wert und Sie sollten sich keine allzu großen Sorgen machen, insbesondere bei Hintergrundbildern. Wenn es sich so anhört, als ob Sie zu viel optimieren.

5
John Conde

Ich habe viele Artikel über CSS-Sprites gelesen und finde, dass die Unterscheidung zwischen Inhalten und Hintergrundbildern keineswegs so eindeutig ist, wie es die meisten Artikel vermuten lassen.

Ich habe vier Symbole auf einer Seite, die dazu dienen, vier entsprechende Absätze "schlagkräftiger" zu gestalten (http://www.systhermique.com). Ist das Inhalt oder Hintergrund?

Meiner Meinung nach ist es ein bisschen von beidem, aber ich sehe die Nachteile der Verwendung eines CSS-Sprites für diese Bilder nicht, obwohl ich geneigt bin, die oben beschriebene Bildcontainer-Strategie zu verwenden, um die Alt-Tags beizubehalten.

0
user6542