Typekit-Schriftart im SVG-Symbol

Ich versuche, dass mein Logo auf meiner Website richtig angezeigt wird. Ich habe in Illustrator ein SVG-Symbol mit einer Schriftart von Adobe Typekit erstellt, es ist Proxima Nova. Das SVG-Symbol mit Text darin wird in Chrome korrekt angezeigt, nicht in Firefox oder anderen mobilen Browsern.

Hatte jemand schon mal ähnliche Probleme?

Antworten (2)

Es empfiehlt sich, beim Exportieren in SVG alle Schriftarten in Konturen zu konvertieren, andernfalls muss die Schriftart auf dem Betriebssystem des Benutzers installiert werden. Da Proxima Nova in keiner Betriebssystem-Schriftbibliothek enthalten ist, verwendet der Browser eine andere Standard-Schriftfamilie. Nur wenige Browser unterstützen SVG-Schriftarten (siehe hier ), deshalb wird eine andere Schriftart angezeigt, selbst wenn Sie Proxima Nova auf Ihrem Betriebssystem installiert haben.

Um die Schriftart zu konvertieren, wählen Sie convert to outlineim Speicherdialog (siehe Bild; sry für deutsch).

Auf diese Weise sollte Ihr Logo in jedem Browser korrekt angezeigt werden.

Geben Sie hier die Bildbeschreibung ein

Ihr 'caniuse'-Link bezieht sich auf SVG-Schriftarten, nicht auf Text in SVG.
@Code 3 das hat funktioniert, danke für deine Antwort!

Indem der Text in eine Gliederung umgewandelt wird, ist er kein Text mehr, und Suchmaschinen können seinen Inhalt nicht indizieren (bis sie Gliederungen interpretieren können, was wahrscheinlich noch kommen wird). Obwohl SVG Webfonts über CSS unterstützt, ist dies derzeit keine Option mit Typekit, das von einem eingebetteten JavaScript-Fragment in einer Webseite abhängt. Das sieht vorerst wie eine programmatische Herausforderung aus; Es scheint ein jQuery-Plug-in zu geben, das Ihnen das meiste, wenn nicht alles bringt: https://github.com/willemvb/svg-typekit

Guter Punkt über SEO. Wenn Platz vorhanden ist, gibt es irgendwelche Nachteile, wenn ein zweiter Satz von UN-konvertiertem Text in genau derselben Farbe wie der Hintergrund separat vorhanden ist (daher wäre er maschinenlesbar, aber nicht von Menschen)?
Typekit-Schriftart im SVG-Symbol
AntwortenHierDatenschutz-Bestimmungen1y, 0v