Unicode symbols and OS/browser font support
Asked Answered
I

2

10

There are so many wonderful unicode symbols. This is amazing.

But they are all useless if I can't know if my user's font support them.

How can I find that out?

Can I track whether a user's font support a unicode symbol?

Any ways to have some kind of fallback? (If this unicode symbol isn't supported then show this other unicode symbol.)

Are there any OS/browser support references out there? (I've already extensively searched for such reference without any luck so far.)

What's your strategy to decide whether to use a unicode symbol?

I would love to use more of these lovely unicode symbols.

===Edit===

For example: I want to use the unicode "U+2605 ★ BLACK STAR" in my project's readme.md on GitHub. How can I know whether this unicode symbol will correctly be displayed?

Interception answered 26/6, 2018 at 12:18 Comment(5)
Please give any situations where you want to use it. Ask real questions that you want answer for. We cannot decide what you really want.Bosnia
@Bosnia I want to use the unicode "U+2605 ★ BLACK STAR" in my project's description at github.com/reframejs/reframe. How can I know how many users support this unicode symbol?Interception
Detecting individual Unicode character support with JavaScriptPacheco
@Pacheco Thanks for your link. The answer "render the character and the missing glyph box offscreen and compare their widths" is super interesting. If only someone would run this test to on all OS/browser and provide a compatibility table, that would be so awesome..Interception
Related: How to check if the font has a symbol: Correctly behaving browsers pick up glyphs from the secondary font if the primary font lacks a glyph for a character (8 years ago so nowadays any glyph shoud be rendered from Unicode BMP)…Mashe
P
6

If only someone would run this test to on all OS/browser and provide a compatibility table, that would be so awesome..

Modern browsers can display pretty much any character as long as the user has a font installed that includes it. So your question comes down to:

Which fonts are bundled with every major OS, and which characters do those fonts support?

Well, I have created a tool that presents exactly that information.

This may have been overkill, since it is pretty easy to just @font-face include FontAwesome, IonIcons, or a similar font or symbol set that you know includes your desired characters. You could even download and include individual SVGs if you're only talking about a couple of symbols.

But if you want to save yourself an external dependency and network request while also benefiting from the easy CSS styling of plain text, this is your solution!

If it turns out you want to use a character that is not widely supported, I include the name of which free Google Noto font you can <link> or @font-face embed. There's also a browser to look through whole Unicode blocks at a time.

Anyway, take a look at Unicompat.com and see if it is what you're looking for. It's very much in beta, so apologies if anything is creaky.

Proprietary answered 18/6, 2020 at 9:44 Comment(3)
Wow, I love it. Thank you for this wonderful tool. You should put it on GitHub to ensure it lives forever!Interception
Now on Github for anyone interested. The entire database is not posted as it is >250MB, but the scripts I used to create it are included. github.com/gelbartj/unicompat-publicProprietary
unicompat.com seems to be down, I created a GitHub issue: github.com/gelbartj/unicompat-public/issues/42Interception
P
0

https://www.fileformat.info/info/unicode/font/index.htm

To determine whether a user's font supports a specific unicode symbol, you can check if it is part of the font's character set.

For fallback, you can use a different unicode symbol that is likely to be supported by most fonts, or specify a fallback font that has wider support for unicode symbols.

There is no one-size-fits-all reference for unicode support across all operating systems and browsers, as it depends on the specific font being used. However, you can check if a unicode symbol is part of the Unicode Standard, which provides a comprehensive list of defined characters and their encoding.

Personally i like this website for check http://www.alanwood.net/unicode/cjk_compatibility.html

Paratuberculosis answered 3/2, 2023 at 12:40 Comment(1)
Let's imagine I want to know whether most browsers/OS will be able to render unicode emoji emojipedia.org/emoji/%F0%9F%8E%97 - how do I use your resources to check that?Interception

© 2022 - 2024 — McMap. All rights reserved.