Why can't Safari display this emoji when I am logged in?
http://www.halfapp.co uses the 💯 emoji.
In Safari on macOS I see a question mark in a square. See screen.
I also have this issue in emoji used on my Instagram profile.
Also, in the web inspector, I see the emoji.
And if I use Look Up, the emoji is shown.
Logging in as a guest user I see the emoji.
No duplicate fonts, no fonts with errors.
Apple Color Emoji is where it should be.
And the emoji is displaying just fine in this post!
Permissions have been repaired and re-checked, but I can check something specific if that would help.
If I remove "-apple-system" from the CSS font definition the emoji appear (and of course the font changes).
Any ideas?
macOS 10.13, Safari 11.0 (13604.1.38.1.6)
The problem is that auto activation of fonts had been disabled. FontExplorer X Pro was the culprit.
Safari seems to need auto activation to be able to display emoji correctly.
The solution is to manually re-enable auto activation. In Terminal:
atsutil autoactivation -e
Credit: https://discussions.apple.com/message/32553150#message32553150
Without knowing your browser version / MacOS version combo, the culprits are probably font corruption or more likely the character encoding isn't UTF-8.
I'm unable to reproduce your screenshot with Safari 11 and 10.12.6, but I can get that specific emoji to falter by switching to other character encodings.
You can check this in Safari in "View" > "Text Encoding".
If you are the developer behind the website in question, you should add the correct character encoding to the page itself to ensure the emoji renders correctly for others. There are good examples of how to do this at W3schools, but this might work too:
<meta charset="UTF-8">
The charset tag in the page is lowercase ;)
You might also try removing the HTML4 charset tag that is also present:
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
Only one is required and the browser should ignore the one that is not right, but that doesn't always happen.