Sagen wir, ich sollte eine innerhalb meiner Haupt-Website-Header austauschen, um stattdessen SVG zu verwenden. Normalerweise würde ich auf das Alt-Tag <img> angewiesen sein.inline SVG - beste Alternative zu "alt" tag normalerweise verwendet für < img > SEO?
Ist die SVG <title> die beste Ersatzmethode für "alt" mit dieser Art der Umstellung?
Wenn SEO Ihr Hauptanliegen ist, warum beziehen Sie sich nicht auf das SVG von einem src Attribut eines img Elements? Es ist sicherlich weit verbreitet, dass Inline-SVGs, also ist es wahrscheinlich die bessere Wahl in diesem Fall.
Würde das funktionieren?
<svg role="img" id="my-svg-img">
...
</svg>
<img src="#my-svg-img" alt="Hey hey, kids!" >
(Oder wenn Sie festgestellt, dass Ihr <title> Ansatz funktioniert woudl Sie so gut sein, wie als Antwort zu schreiben? Ich tastete irgendwie im Dunkeln mit dem gleichen Problem im Moment)
Das interessiert mich auch sehr. Ab jetzt ist meine beste Vermutung, eine mit dem alt-Tag in Ihrem Seitencode zu verwenden, dann mit Javascript ersetzen Sie die IMG mit dem tatsächlichen Svg-Code inline. Sie können this answer für ein kleines Skript überprüfen, das den img durch Ihren svg Inline Inhalt ersetzt. dann hat Ihre, dieses Thema könnte sein, ein Duplikat -
was wäre die Purpose davon? –
@hRvoed Ihre gezielte Lösung sieht tatsächlich besser aus und wird offiziell empfohlen. Der Zweck meiner vorgeschlagenen Abhilfe ist eine schnelle und schmutzige Möglichkeit, Quellcode von Inline-Svg zu bereinigen und vor allem die '' Alt-Tag-Funktion für SEO-und Screenreader zu behalten. –
Gruber
Nach SVG Open, ein <title> muss von Bildschirmleser von zB Blinde, noch schon gibt es Workarounds auf StackOverflow < diskutiert unterstützt werden?
Ich habe 508 ziemlich viel über die Jahre studiert. Für den kleinen Overhead kostet es Sie, ein alternatives Textattribut für das SVG-Bild zu erstellen, es lohnt sich nicht, es zu überspringen. Beachten Sie, dass alle Bildschirmlesegeräte und ihre Benutzer unterschiedlich sind. SVG hat eine Menge Fähigkeiten zu nutzen, aber wir sind noch nicht da. Ja, Google indiziert den Text in Ihrem Bild. Wenn Sie jedoch daran interessiert sind, dass nicht sehende Nutzer auf Ihre Inhalte auf der ganzen Linie zugreifen können, sollten Sie ein alt-Tag einfügen. Es ist buchstäblich die unterste Stufe der Barrierefreiheit. Es hat keinen Sinn, die tief hängenden Früchte an den Ranken faulen zu lassen.
Absolut am besten, ein SVG in einem <img src="" alt=""> ziehen, um alle Vorteile eines SVG + einfache SEO zu erhalten. Es ist wahrscheinlich, dass Google-Spider wissen, dass der SVG-Titel das Alt-Tag sein sollte, aber es gibt keine Garantie und ich bin mir sicher, dass es viele Crawler gibt, die das nicht tun.
Dies ist nicht immer der Vorteil, da für das Image ein Umlauf zum Server erforderlich ist.Da das Bild ein Logo ist und auf der Website sehr prominent ist, möchten Sie nicht warten, um es zu holen. Es könnte mit dem Rest der Website inline sein, besonders wenn es ein SPA ist, wo es nicht von der Seite die meiste Zeit zerstört wird. –
Um genau das zu erreichen? Da es nur Markup ist, können Suchmaschinen (und ich weiß, dass Google das tut) SVGs lesen. – DanMan
Um die gleichen SEO-Vorteile zu erzielen, die Sie von der Verwendung des![]()
Alt-Tags erhalten würden. Ich weiß, dass die Engines SVGs lesen, also möchte ich nur sicher sein, dass die Verwendung des Titels (oder der Beschreibung) innerhalb des SVG tatsächlich der richtige Weg ist. –
Joe