30

Why do emoji like 💩 appear when I use Safari, but not Chrome on the same MacBook running Lion? Both browsers use WebKit, and I'd imagine font support comes from the OS, not the application.

For reference purposes this is the page rendered in Chrome 17.0.963.56:

Chrome 17.0.963.56

And this is the page rendered in Safari 5.1.3 (7534.53.10):

Safari 5.1.3 (7534.53.10)

Improve this question
8
  • 9
    I'm viewing this in Chrome and I don't see the 💩 in the question or title, but I do see it in the tab title atop the window.
    – Cajunluke
    Commented Feb 22, 2012 at 0:06
  • I rarely ever hover over tabs to see the full page title, but you're right, it does indeed to that. That's very surprising.
    – Jason Salaz
    Commented Feb 22, 2012 at 0:12
  • It might be that Chrome plug-ins into its own character palette, which could be some hybrid version between the native and a proprietary one. And they just need to update it for OS X. But I do know that emoji aren't just a matter of the font-type (you can't port emoji to SL for example by just installing the respective font). So there's more to them than just reading a new font-type. I'd file a bug with Google. Or request full support.
    – user10355
    Commented Feb 22, 2012 at 0:58
  • 14
    Since visitors with Chrome will have a hard time reading the title, I vote to change the title to "How do I produce turds on Google Chrome?"
    – Gerry
    Commented Feb 22, 2012 at 9:47
  • @cksum I reverted the title because it's become a pertinent piece of information in the question.
    – Jason Salaz
    Commented Feb 22, 2012 at 21:11

6 Answers 6

Reset to default
27

The difference is the rendering engines for the browser windows.

We know Safari renders the character set differently than Chrome. But the Window UI elements (the tabs in Chrome) are okay. That's our biggest clue.

The window UI elements are likely (emphasis on likely, I may not be correct here) all being rendered by the OS. So they get the full OS-level emoji-expansion treatment.

But what happens inside a web browser window is all very browser dependent. The rendering engines are a big part of each browser's secret sauce.

Both Safari and Chrome use WebKit, but the similarities between the WebKit instances they use stop somewhere around the name of the engine. They're both forks from the main version and they're both heavily customized to improve the performance in ways that each browser development team thinks is meaningful for their end users.

@JasonSalaz found a great bug in the Chrome bug database that gives us the final clue that it's down to WebKit forks: http://code.google.com/p/chromium/issues/detail?id=90177 -- that bug is talking about the differences between the fork in Chrome and the mainline of WebKit from the open source project. There are rendering differences in the mainline that have yet to make it in to the version Chrome is using. And it looks like they intend to merge the changes in at some point.

Update: Paul Irish has a great blog post on how WebKit differs for all these browsers that currently use it. If you really want to understand just how diverse the WebKit environment is, this is a great read.

Improve this answer
8
  • Argh. Should have grabbed some screen shots. Oh well...
    – Ian C.
    Commented Feb 22, 2012 at 20:51
  • The Chromium bug ticket tracking Emoji support is this one: crbug.com/62435 The one you linked to is a duplicate.
    – Mathias Bynens
    Commented Apr 6, 2012 at 9:43
  • For the record: It's still broken in Chrome 20.0.1132.57.
    – user22594
    Commented Jul 18, 2012 at 14:54
  • Oh great, according to Comment 17 in the bug report this issue has been closed. If anyone wants to complain again, you need to file a new bug report.
    – gentmatt
    Commented Nov 8, 2012 at 18:45
  • 1
    It works now as of Chrome 41! 🚀🚀🚀🚀🚀🚀🚀
    – yincrash
    Commented Feb 25, 2015 at 13:19
12

You can use the Chrome extension Chromoji. It's a workaround that will replace emoji with embedded images in web pages.

Improve this answer
1
  • 2
    Totally works, for Twitter atleast, don't delete the answer.
    – MarcusJ
    Commented Apr 16, 2013 at 0:19
2

The problem is that your browser is using a different character encoding from that of the document you're viewing.

So how does the browser know which character encoding to use?

  1. It can be specified in HTTP using the Content-Type header.
  2. It can be specified for the HTML document using the meta element.
  3. It can be specified for a specific HTML element using the charset attribute.

If none of these are specified, then different browsers use different techniques to guess at the right character encoding. Some use heuristics. Some allow the user to specify a character encoding. Some select the default character encoding of the operating system.

If none of these pan out, you get the gibberish, also known as mojibake.

So to answer your question directly: Safari and Chrome are trying different things to find the right character encoding.

Improve this answer
8
  • 3
    View -> Text Encoding in Safari says 'Default'. View -> Encoding in Chrome says 'UTF-8'. Safari prefs say the default encoding is Western (ISO Latin 1). If I change the encoding in Chrome to Western (ISO-8859-1), Western (Windows-1252) or Western (Macintosh) I still don't see the correct emoji, but I do see gibberish instead of empty space. I don't think it's as simple as character encoding. I suspect there's rendering differences. (continued...)
    – Ian C.
    Commented Feb 22, 2012 at 18:16
  • 1
    (continued from above) That would account for the title bar showing the emoji (text is likely being rendered by OS X's rendering engine as it's a graphical element on a Window) and the body of the page is being rendered by Chrome's own rendering engine.
    – Ian C.
    Commented Feb 22, 2012 at 18:19
  • 1
    @IanC. that's probably answer-worthy if you expand on it just a bit more. Chrome uses WebKit, but otherwise not one of ObjC/Cocoa's classes that natively support emoji. That is after all Chrome's #1 feature, wicked fast which is invariably only achieved with a custom solution. So, Chrome would either have to explicitly write support for emoji, or stop doing the thing that makes people prefer them over Safari and other browsers. (Guess which one's more likely?)
    – Jason Salaz
    Commented Feb 22, 2012 at 18:35
  • 1
    Stumbled on this: code.google.com/p/chromium/issues/detail?id=90177
    – Jason Salaz
    Commented Feb 22, 2012 at 18:43
  • @JasonSalaz nice catch with that bug report. That's the final piece. Writing up the answer!
    – Ian C.
    Commented Feb 22, 2012 at 19:00
0

Go to the Chrome menu bar, click on "More Tools" → "Encoding" and choose a new encoding format. I am using "Unicode UTF-8", it seems to work for me.

Improve this answer
-1

https://code.google.com/p/chromium/issues/detail?id=62435 was marked fixed recently; starting in version 41 emoji should display fine in Chrome.

Improve this answer
2
  • 1
    While useful, this isn't really an answer. It doesn't explain why it was happening. This is better left as a comment IMO.
    – Ian C.
    Commented Dec 28, 2014 at 3:13
  • It happened because support for emojis wasn't implemented. So the question won't make sense once m41 is on stable.
    – thakis
    Commented Dec 28, 2014 at 22:00
-9

The symbol is a character made by Apple. Safari uses its own character set.

Improve this answer
4
  • 5
    Actually "pile of poo" is an international standard character in Unicode - symbol 1F4A9 and not even Apple specific let alone something special to Safari. See the Wikipedia entry on Emoji and this PDF for details.
    – bmike ♦
    Commented Nov 12, 2012 at 5:28
  • 2
    While the character is not unique to Apple, the colors are. I don't know of any other color font in existence so far and I think Apple created its own standard for doing it (a proprietary sbix table). Various apps will not recognize this font, but will display from the normal black/white font Symbola.
    – Tom Gewecke
    Commented Nov 12, 2012 at 13:19
  • 1
    PS Because there is indeed something "Apple unique" about this font, I think this answer is not as far off as the minus rating might suggest.
    – Tom Gewecke
    Commented Nov 12, 2012 at 14:59
  • @TomGewecke well, "Safari uses its own character set" is simply false. So I think the minus ratings are deserved.
    – jbg
    Commented Aug 27, 2018 at 5:50

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .