mikrocontroller.net

Forum: PC-Programmierung Unicode-Symbole in verschiedenen Browsern / Windows 7 und 10


Announcement: there is an English version of this forum on EmbDev.net. Posts you create there will be displayed on Mikrocontroller.net and EmbDev.net.
Autor: Heini (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Weiß jemand, woher die verschiedenen "Interpretationen" der 
Unicode-Symbole unter verschiedenen Browsern unter verschiedenen 
Windows-Versionen kommen?

Unter Windows 7 mit Chrome sind die Dinger monochrom (Wortspiel nicht 
beabsichtigt). Viele fehlen ganz.
Unter Windows 7 mit Firefox sehen sie sehr sehr stylisch und hübsch aus 
(das ist mein Favorit). Unter Android ebenfalls. Dort auch unter Chrome.

Unter Windows 10, egal ob Chrom oder Firefox sind sie zwar bunt, aber 
sehen echt sch***e aus...

Ich konnte bisher nicht rausfinden, wie die Dinger generiert werden. 
Eine HTML-Testseite mit verschiedenen Fonts brachte keine Erkenntnis 
zutage (sieht immer gleich aus).

Jemand mit Erfahrung hier?

Autor: TestX (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
aus einem font....je nach os/software verschieden

Autor: bastel_ (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Emojis sind ganz normale Unicode Zeichen. Mit jeder neuen Version von 
Unicode kommen neue hinzu. Aaaaber. Nicht einfach immer nur neue 
Codepoints, sondern es werden auch mal ältere Zeichen zu Emojis 
umgewidmet. D.h. Auf einem alten OS mit altem Font ist es ein 
monochromes Textzeichen oder unbekannt. Auf einem neueren OS ist es ein 
Bild Emoji.

Wie geht das? Jedes Zeichen kann einen Modifier mit 15 oder 16 oder so 
Möglichkeiten haben. Das ist einfach ein unsichtbares Zeichen direkt 
nach dem Zeichen. Damit machen die auch die Hautfarben für die Smileys. 
Einer davon ist immer 'normal' für das monochrome Textzeichen. Wird ein 
Zeichen zum Emoji umgewidmet, gilt aber ab der Version, dass die 
Bildvariante angezeigt werden muss, außer der 'normal' Modifier steht 
dahinter.

Das klingt erstmal gut, ist sehr sehr doof, weil:
- alter Font: monochrom Zeichen oder unbekanntes Zeichen
- Software nimmt monochrom Zeichen (z.b. Filled black cross für ein X im 
Fensterdialog)
- neues Betriebsystem mit neuerer Verion des Fonts
- Zeichen ist plötzlich Emoji: jetzt ein rotes X Bild
- Software sieht scheiße aus.
- Bei Ausdrucken müsste man diesen Modifier hinter jedes Symbol-Zeichen 
kleben, um nicht in Zukunft verarscht zu werden.

Autor: Heini (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Das erklärt aber immernoch nicht, welche Fonts jetzt benutzt werden. 
Oder ob überhaupt: Ich kann nämlich per CSS und font-family welche 
durchprobieren und es sieht immer gleich aus.

️ ist natürlich jeweils an das Zeichen angehängt.

Autor: Heini (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Mir geht es primär darum, warum Firefox unter Windows 7 sehr hübsche 
Symbole produziert (die nicht von Windows selbst kommen), aber unter 
Windows 10 diese hässlichen Teile angezeigt werden.

Autor: Rufus Τ. F. (rufus) (Moderator) Benutzerseite
Datum:

Bewertung
3 lesenswert
nicht lesenswert
Weil diese hässlichen Teile der Mainstream sind, den man jetzt hinnehmen 
muss. "Emojis" und so, Du weißt schon. Was man früher mit Worten 
ausdrücken konnte, das geht nur noch mit diesen hässlichen meist gelben 
Dingern. Das ist die Whatappisierung der Welt, damit muss man leben.

Autor: test (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Können Fonts überhaupt bunt?

Ich denke nicht das die Symbole aus den Fonts kommen. Es ist durchaus 
möglich (und üblich) das ein Programm bei bestimmten Symbolen ein 
eigenes Bild anzeigt, anstatt das Symbol aus dem Font.

Damit meine ich... Mal als Extrembeispiel... Es wäre durchaus möglich 
einen Web Browser so zu programmieren das jedes mal wenn im Text ein "A" 
vorkommt, ein Bild eines Autos angezeigt wird, anstelle des "A".

Viele SMS Programme (und AFAIK auch WhatsApp) tun genau dieses, wenn ein 
Smiley im Text vorkommt (Smilies sind ja ganz normale Sbole, genau wie 
"A", "B", "C" usw.), dann zeigen sie ein eigenes Bild, anstelle des 
Smiley Symbol aus dem Zeichensatz.

Autor: Heini (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Das wiederum erklärt nicht, warum die Symbole unter Windows 10 bei 
Firefox und Chrome identisch sind.

Autor: Rufus Τ. F. (rufus) (Moderator) Benutzerseite
Datum:

Bewertung
0 lesenswert
nicht lesenswert
test schrieb:
> Können Fonts überhaupt bunt?

Ja, mittlerweile schon. Es gibt verschiedene Ansätze, Farbinformationen 
in OpenType-Fonts unterzubringen, einer davon ist OpenType-SVG.

Ob genau das nun die Technik ist, die von den üblichen Webbrowsern 
genutzt wird, entzieht sich meiner Kenntnis.

Autor: Jens G. (jensig)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
>Emojis sind ganz normale Unicode Zeichen. Mit jeder neuen Version von
>Unicode kommen neue hinzu. Aaaaber. Nicht einfach immer nur neue
>Codepoints, sondern es werden auch mal ältere Zeichen zu Emojis
>umgewidmet. D.h. Auf einem alten OS mit altem Font ist es ein
>monochromes Textzeichen oder unbekannt. Auf einem neueren OS ist es ein
>Bild Emoji.

Das glaube ich aber nicht wirklich, daß bestehende bzw. bereits 
zugeordnete Unicodezeichencodierungen gelegentlich umgewidmet werden.
Was Du vermutlich meinst, ist wohl eher der Font.

Autor: Yalu X. (yalu) (Moderator)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Welches Symbol konkret dargestellt wird, hängt davon ab, welcher Font in
der betroffenen Anwendung gerade eingestellt ist und ob es in diesem,
einem anderen, mehreren oder überhaupt keinem der installierten Fonts
enthalten ist. Bei mehreren Alternativen entscheidet eine Priorisierung
in der Fontkonfiguration darüber, welchem der Vorzug gegeben wird.
Manchmal habe ich das Gefühl, dass einige Anwendungen (wie bspw.
Web-Browser) zusätzlich ihre eigenen Priorisierungsregeln haben.

Lustig wird es dann, wenn ein Font nur eine Untermenge und ein anderer
Font eine andere Untermenge dieser Symbole implementiert. Dann erhält
man einen wilden Mischmasch aus den Symbolen, was besonders auffällt,
wenn sie in dem einen Font farbig und im anderen monochrom sind.

Es gibt Fonts die ausschließlich Emojis enthalten und recht vollständig
sind, bspw. Noto Color Emoji von Google:

  https://www.google.com/get/noto/help/emoji/

Hier sind die Emojis aus verschiedenen Quellen im Vergleich dargestellt:

  https://unicode.org/emoji/charts/full-emoji-list.html

Die Windows-Emojis mit ihren Trauerrändern sind in der Tat etwas
gewöhnungsbedürftig. Aber Windows-User sind ja schließlich hart im
Nehmen, so dass sie sich kaum daran stören werden ;-)

Autor: Heini (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Gibt's eigentlich die Möglichkeit, festzustellen, ob ein bestimmtes 
Symbol im Browser vorhanden ist? So, dass man ansonsten ein 
Alternativsymbol anzeigen könnte?

Autor: Bernd K. (prof7bit)
Datum:

Bewertung
-1 lesenswert
nicht lesenswert
Sprichst Du jetzt von Unicode oder von diesen komischen Emoji-Symbolen? 
Das sind zwei komplett verschiedene Paar Schuhe. Für Unicode kommts 
einfach darauf an was für einen Font du verwendest. Emoji kann 
wahrscheinlich jede Anwendung die das unterstützen mag rendern wie sie 
lustig ist, ist ja nur ne Spielerei und kein Standard.

Autor: Heini (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert

Autor: Yalu X. (yalu) (Moderator)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Heini schrieb:
> Gibt's eigentlich die Möglichkeit, festzustellen, ob ein bestimmtes
> Symbol im Browser vorhanden ist? So, dass man ansonsten ein
> Alternativsymbol anzeigen könnte?

Erstelle doch einfach eine Mini-HTML-Seite mit dem fraglichen Zeichen
und lade sie in den Browser.

Oder noch einfacher: Gib das Zeichen hier auf dieser Web-Seite in das
Eingabefeld für "Antwort schreiben" ein, ohne "Vorschau" oder "Beitrag
veröffentlichen" anzuklicken. Direkt bei der Eingabe siehst du, ob das
Zeichen wie gewünscht dargestellt wird. Kann der Browser das Zeichen
nicht darstellen, zeigt er stattdessen ein Kästchen mit dem jeweiligen
Hexcode an.

Heini schrieb:
> Ich rede z.B. von
> https://de.wikipedia.org/wiki/Unicodeblock_Verschiedene_Symbole
> https://de.wikipedia.org/wiki/Unicodeblock_Verschiedene_piktografische_Symbole

Damit ist es am allereinfachsten: Einfach die beiden Wikipedia-Artikel
durchscrollen, und schauen, welche Zeichen fehlen.

Autor: Heini (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Ne, das Ganze muss natürlich automatisch ablaufen, z.B. per JavaScript 
oder auf eine andere Art und Weise.

Autor: Hannes J. (pnuebergang)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Bernd K. schrieb:
> Sprichst Du jetzt von Unicode oder von diesen komischen Emoji-Symbolen?
> Das sind zwei komplett verschiedene Paar Schuhe.

Nein, sind sie nicht mehr. Emojis haben Code-Points in Unicode bekommen. 
Verwende ich den Code-Point U+1F3A4 sollte in den meisten Programmen die 
Unicode können und einen Font mit Emojis Glyph haben ein Mikrofon 
erscheinen - wie hier >🎤< in vielen Browsern.

Autor: Heini (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Gutes Beispiel! Und in meinem Fall will ich z.B. lieber das 
Studiomikrofon haben: 🎙
Im Firefox geht das... im Chrome unter Windows 7 sehe ich es nicht. 
Dafür soll eine Fallbackmöglichkeit her (z.B. das Defaultmikro 🎤).

Autor: Cyblord -. (cyblord)
Datum:

Bewertung
-2 lesenswert
nicht lesenswert
Rufus Τ. F. schrieb:
> Weil diese hässlichen Teile der Mainstream sind, den man jetzt hinnehmen
> muss. "Emojis" und so, Du weißt schon. Was man früher mit Worten
> ausdrücken konnte, das geht nur noch mit diesen hässlichen meist gelben
> Dingern. Das ist die Whatappisierung der Welt, damit muss man leben.

So sprach der Greis.

Autor: DPA (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Rufus Τ. F. schrieb:
> "Emojis" und so, Du weißt schon. Was man früher mit Worten
> ausdrücken konnte, das geht nur noch mit diesen hässlichen meist gelben
> Dingern.

☝️💯🧑👄

👍

Autor: bastel_ (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Erkennen ob der Browser das Symbol rendern kann? Glaube ich nicht, dass 
das geht.
Höchstens in einen Canvas malen und dann die Pixel anschauen?

Wegen Farbe: ja, smileys sind gelb, das war schon offline so, aber die 
hier nicht unbedingt: 👨👨🏻👨🏼👨🏽👨🏾👨🏿, je nach Variantenselektor. 
👌👌🏻👌🏼👌🏽👌🏾👌🏿
Lässt sich in je nach Browser unterschiedlich gut eingeben.

Autor: Heini (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Chrome zeigt nur Klötze.

Schade, dass das nicht geht. CSS kann ja sonst jeden Mist...

Autor: Yalu X. (yalu) (Moderator)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Heini schrieb:
> Chrome zeigt nur Klötze.
>
> Schade, dass das nicht geht. CSS kann ja sonst jeden Mist...

Das hat mit CSS nichts zu tun.

Yalu X. schrieb:
> Es gibt Fonts die ausschließlich Emojis enthalten und recht vollständig
> sind, bspw. Noto Color Emoji von Google:
>
>   https://www.google.com/get/noto/help/emoji/

Damit zeigt auch Chromium (und damit vermutlich auch Chrome) bunte
Fratzen an.

Autor: Heini (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
> [...]but doesn’t work on macOS or Windows

:(

Autor: Yalu X. (yalu) (Moderator)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Heini schrieb:
>> [...]but doesn’t work on macOS or Windows
>
> :(

Ups, das habe ich übersehen.

Bei den bunten Fonts scheinen Google, Microsoft und Apple wohl jeder
wieder einmal sein eigenes Süppchen zu kochen:

  https://github.com/googlei18n/noto-emoji/issues/43

Dann bleibe ich wohl doch besser bei den ASCII-Smileys, die sind sowieso
viel cooler :)

Autor: guest (Gast)
Datum:

Bewertung
0 lesenswert
nicht lesenswert
Heini schrieb:
>> [...]but doesn’t work on macOS or Windows
>
> :(

"Windows supports it starting with Windows 10 Anniversary Update."
Quelle: https://github.com/googlei18n/noto-emoji/

Antwort schreiben

Die Angabe einer E-Mail-Adresse ist freiwillig. Wenn Sie automatisch per E-Mail über Antworten auf Ihren Beitrag informiert werden möchten, melden Sie sich bitte an.

Wichtige Regeln - erst lesen, dann posten!

  • Groß- und Kleinschreibung verwenden
  • Längeren Sourcecode nicht im Text einfügen, sondern als Dateianhang

Formatierung (mehr Informationen...)

  • [c]C-Code[/c]
  • [avrasm]AVR-Assembler-Code[/avrasm]
  • [code]Code in anderen Sprachen, ASCII-Zeichnungen[/code]
  • [math]Formel in LaTeX-Syntax[/math]
  • [[Titel]] - Link zu Artikel
  • Verweis auf anderen Beitrag einfügen: Rechtsklick auf Beitragstitel,
    "Adresse kopieren", und in den Text einfügen




Bild automatisch verkleinern, falls nötig
Bitte das JPG-Format nur für Fotos und Scans verwenden!
Zeichnungen und Screenshots im PNG- oder
GIF-Format hochladen. Siehe Bildformate.

Mit dem Abschicken bestätigst du, die Nutzungsbedingungen anzuerkennen.