verschiedene Browser, verschiedene Schriftartendarstellung

[ben]

Hallo zusammen,

ich habe eine Frage. Es handelt sich dabei um die Einbindung von einer TTF-Datei und der Darstellung in Firefox und Safari.

In der HTML verweise ich auf eine JavaScript-Datei...

<script language="JavaScript" src="%name%.js" type="text/javascript"></script>

welche wiederum auf die TTF-Datei verweist.

document.write('<style>@font-face { font-family: hnul; src: url(%URL%/hnul.ttf);}</style>');

In Safari wird der Text wie in der hnul.ttf dargestellt, korrekt wiedergegeben.
In Firefox ab und zu auch, meistens aber Verdana bzw. der Fallback-Font welcher in der Font-Family definiert ist.

Könnte mir da jemand helfen?
Für mich wäre die "schlimmste" Alternative sonst alle Texte als SVG-Grafik einzubinden.

Vielen Dank.
Besten Gruß
Ben

[MrMurphy]

Hallo,

mit deinen wenigen Informationen kann man nur raten.

Die wenigsten bzw. gar keine Probleme habe ich, wenn ich Schriften per css einbinde.

JavaScript kann von den Anwendern geblockt werden und so zu Problemen führen.

Wenn du zudem mehrere JavaScript-Blöcke einfügst kann es sein, das sie sich untereinander ins Gehege kommen. Dann kommt es auch zu den von dir beschriebenen Phänomenen, das die durch JavaScript ausgelösten Ereignisse manchmal funktionieren und manchmal nicht.

Gruss

MrMurphy

[ben]

Hallo Mr Murphy,

okay. Danke für die schnelle Antwort. Würde ich gerne ausprobieren.

Wie verweißt du in der CSS auf die TTF?
Hast du ein Code-Beispiel?

Besten Gruß
Ben

[Tabellenkalk]

Hallo,

Wie verweißt du in der CSS auf die TTF?
Hast du ein Code-Beispiel?

In der CSS kann sich verweißen, wer zu oft #FFFFFF verwendet.

Ansonsten bin ich mir grad nicht sicher, ob duhttp://de.selfhtml.org/css/eigenschaften/schrift.htm#font_family@title=dies oder http://de.selfhtml.org/css/formate/einbinden.htm#separat@title=das suchst.

Gruß
Kalk

[ben]

Hallo Kalk,

weder noch!

Ich benötige ein Beispiel wie ich in einer CSS auf die TTF verweise.

Im HTML-Header kann ich das ja bsplw. so machen...
<style>@font-face { font-family: %FONTNAME%; src: url(%URL%/%NAME%.ttf);}</style>

Wie verweise ich in der CSS auf die TTF???

Hinweis...
Der Threat begann eigentlich anders. Unter Safari funktioniert die Darstellung auch einwandfrei. Unter Firefox nicht.

Gruß
Ben

[Der Martin]

Hallo,

Ich benötige ein Beispiel wie ich in einer CSS auf die TTF verweise.

oder in Deutsch: ... wie ich in einem Stylesheet auf eine Truetype-Schrift verweise.

Im HTML-Header kann ich das ja bsplw. so machen...
<style>@font-face { font-family: %FONTNAME%; src: url(%URL%/%NAME%.ttf);}</style>

Das *IST* CSS, was da innerhalb des style-Elements steht. Insofern verstehe ich deine Frage nicht wirklich.

Der Threat ...

Nein, eine Bedrohung ist das eigentlich nicht.

Ciao,
 Martin

[ben]

Hallo,

Ich benötige ein Beispiel wie ich in einer CSS auf die TTF verweise.

oder in Deutsch: ... wie ich in einem Stylesheet auf eine Truetype-Schrift verweise.

Im HTML-Header kann ich das ja bsplw. so machen...
<style>@font-face { font-family: %FONTNAME%; src: url(%URL%/%NAME%.ttf);}</style>

Das *IST* CSS, was da innerhalb des style-Elements steht. Insofern verstehe ich deine Frage nicht wirklich.

Der Threat ...

Nein, eine Bedrohung ist das eigentlich nicht.

Ciao,
Martin

Entschuldige Bitte den falschen Buchstaben.
Ich finde es schade, dass in diesem Forum ehr auf falsche Buchstaben als auf Tipps hingewiesen wird.

Meine eigentliche Frage wurde auch nicht beantwortet.

Wenn ich jemandem helfen könnte, würde ich es auch machen, auch wenn er sich nicht korrekt ausdrückt.

Für mich im Klartext... aktuell weiß keiner der Thread-Beteiligten einen Weg nur mit Hilfe von HTML, CSS und JavaScript mein Problem der verschiedenen Darstellungen zwischen Firefox und Safari zu lösen.

Wenn jemand dennoch einen Code-Beispiel für mich haben würde, den ich in die CSS oder JS-Datei mit einbringen könnte (HTML unvorteilhaft da nicht zentral), wäre ich sehr dankbar!

Besten Gruß
Ben

[Der Martin]

Hi,

Wenn ich jemandem helfen könnte, würde ich es auch machen, auch wenn er sich nicht korrekt ausdrückt.

ja, ich auch.

Für mich im Klartext... aktuell weiß keiner der Thread-Beteiligten einen Weg nur mit Hilfe von HTML, CSS und JavaScript mein Problem der verschiedenen Darstellungen zwischen Firefox und Safari zu lösen.

So ist es wohl. Denn in dem Teil, den du uns bisher zeigst, ist die Ursache nicht zu finden. Und du verrätst uns auch nicht, was du selbst bisher unternommen hast, um dem Problem auf die Spur zu kommen: Was sagt beispielsweise Firebug? Kommt die CSS-Regel überhaupt zum Tragen? Wenn ja, warum nicht? Wird die TTF-Ressource geladen? Falls nicht, weshalb? Welchen Status liefert der Server dazu? Fragen über Fragen ...

Wenn jemand dennoch einen Code-Beispiel für mich haben würde, den ich in die CSS oder JS-Datei mit einbringen könnte (HTML unvorteilhaft da nicht zentral), wäre ich sehr dankbar!

Was denn nun? Du willst CSS. Im dealfall also in einer eigenständigen CSS-Ressource. Eventuell auch in einem style-Abschnitt im HTML-Dokument. Aber bestimmt nicht im Javascript. Das wäre quasi von hinten durch die Brust ins Knie.

Ciao,
 Martin

PS: Bitte zitiere nicht einfach das komplette Vorposting. Das wird als unhöflich oder unanständig empfunden.

[ben]

Hallo allerseits,

das "Phänomen" (zumindest für mich) habe ich auf meiner eigenen Webseite nachgestellt.
Hier der Link.

Wie gesagt, unterschiedliche Darstellung bei Firefox und Safari. Andere Browser habe ich noch nicht getestet.

Wäre klasse wenn ihr mir helfen könnt.

Vielen Dank im Voraus.

Besten Gruß
Ben

[Tabellenkalk]

Hallo,

Wie gesagt, unterschiedliche Darstellung bei Firefox und Safari. Andere Browser habe ich noch nicht getestet.

Ich habe mir mal die hnul.ttf runtergeladen und installiert. In Word kann man sie verwenden.
Dann hab ich mir FontForge installiert, die ttf-Datei geladen und wollte sie ohne Änderung wieder speichern. Da meldet das FontForge, dass die Datei Fehler enthält und bringt auch eine lange Liste von "Wrong Direction"- und "Missing Points at Extrema"-Fehlern.
Leider kann ich nicht beurteilen, ob da nun ein kausaler Zusammenhang besteht.

Gruß
Kalk

[Alex]

Hallo,

Da meldet das FontForge, dass die Datei Fehler enthält und bringt auch eine lange Liste von "Wrong Direction"- und "Missing Points at Extrema"-Fehlern.
Leider kann ich nicht beurteilen, ob da nun ein kausaler Zusammenhang besteht.

Diese beiden Fehler kommen massenhaft auch in weit verbreiteten Fonts vor. Ohne das jetzt ausgiebig getestet zu haben, kann ich mir kaum vorstellen, dass die Browser damit ein Problem haben.

Viele Grüße,
Alex

[ben]

Guten Morgen zusammen,

@Martin Retteberg: bzgl. JS-Befehle in HTML direkt einbinden… habe ich meines Erachtens schonmal gemacht, werde ich die Tage aber nochmal ausprobieren und von berichten. Danke.

Bzgl. des Beitrags von Alex...

Diese beiden Fehler kommen massenhaft auch in weit verbreiteten Fonts vor. Ohne das jetzt ausgiebig getestet zu haben, kann ich mir kaum vorstellen, dass die Browser damit ein Problem haben.

Würde ich genau so sehen. Hintergrund ist, dass ich jetzt eine Webseite habe, in der die Schriftart korrekt (auch mit JS-Befehlen) sowohl in Firefox als auch in Safari wiedergegeben wird!!!  Hier der Link.

Also es geht auch so. Nur jetzt frage ich mich... wo der kleine und feine Unterschied ist???
Ich sehe nämlich keinen.

Besten Gruß
Ben

[ben]

Hallo zusammen,

also… ich habe den Tipp von Matthias Apsel (Einbindung in CSS mit @font-face) und von Martin Rettberg (direkte Einbindung in HTML). Beides führte auf der Webseite nicht zum erfolg.

Weiter habe ich auf folgender Webseite die Schriftart geprüft...
http://www.fonts.com/font/linotype/neue-helvetica/25-ultra-light/web-font
… und wird alles i.O. dargestellt.

Hier zwei Beispiele die ich noch ca. 2 Tage online belasse...
Positivbeispiel
Negativbeispiel

Vorschläge/Tipps/etc. herzlich willkommen.

Vielen Dank.

Ben

[ben]

Hallo zusammen,

gelöst!!!

Es hat nichts damit zutun, dass die Schriftart via JavaScript eingebunden wird.

Es hat auch nichts mit der Schriftart Datei an und für sich zutun.

Es hat was mit der Referenzierung auf die Schriftartdatei zutun.

Besten Gruß
Ben

[Gunther]

Hallo!

gelöst!!!

Schön, das freut mich für dich.
Wenn jetzt später aber mal jemand diesen Thread über die (Google) Suche findet, ist er nach dem Lesen genauso schlau wie vorher.

Es hat nichts damit zutun, dass die Schriftart via JavaScript eingebunden wird.

Im Firefox ggf. doch: "Firefox implements the same origin policy, so any font library served on a different domain from the page will not be downloaded." - siehe: http://caniuse.com/#feat=fontface (unter 'Known issues')

Es hat auch nichts mit der Schriftart Datei an und für sich zutun.

Auch das stimmt so nicht: Aktuell binden nicht alle Browser (ohne weiteres) eine TTF Schriftdatei ein - siehe ebenfalls: http://caniuse.com/#feat=fontface (unter 'Sub-features' -> 'TTF/OTF - TrueType and OpenType font support')

Es hat was mit der Referenzierung auf die Schriftartdatei zutun.

... oder der fehlenden Formatangabe!?

Sei doch bitte so nett, und poste dein jetzt "funktionierendes" Beispiel - danke!

Gruß Gunther

[Martin Rettberg]

das "Phänomen" (zumindest für mich) habe ich auf meiner eigenen Webseite nachgestellt.
Hier der Link.

Du solltest mal alles innerhalb von document.write aus deinen JavaScript-Dateien direkt ins HTML schreiben, das löst viele andere Probleme mit deiner Internetpräsenz.

Wie gesagt, unterschiedliche Darstellung bei Firefox und Safari. Andere Browser habe ich noch nicht getestet.

Browser greifen für die Darstellung von Schriftarten auf die jeweilige API des Betriebssystems zu, einige Browserhersteller scheinen da aber noch ihr eigenes Süppchen zu kochen..

[Matthias Apsel]

Om nah hoo pez nyeetz, ben!

Ich benötige ein Beispiel wie ich in einer CSS auf die TTF verweise.
oder in Deutsch: ... wie ich in einem Stylesheet auf eine Truetype-Schrift verweise.

webfonts

google

Matthias

[ben]

Hallo zusammen,

ich habs gelöst!!! :-D

Es hat nichts mit der Schriftartdatei, dem JavaScript oder ähnlichem zutun.
Es ging vielmehr um die src-Angabe. Diese wird von den Browsern wohl anders interpretiert.

Einen schönen Tag.

ben