This question already has answers here:
HTML entities and charset in IE
(7 answers)
Closed 9 years ago.
I use ✓ ! ✗ for show ✓ ! ✗ symbols and it is works for major browser Firefox, chrome and others. But they is not working for internet explore. Can't i use these any more? What are the alternatives for these symbol?
Those references are undefined in any HTML specification, but proposed in the HTML5 Candidate Recommendation. Around 2011, some browsers started supporting them, and IE 10 has joined the gang, but e.g. IE 9 renders them literally, like any pre-2011 browser.
So these references should not be used yet, if ever. They add nothing to the expressive power of the language, but they cause serious incompatibilities, for a long time. As #Quentin recommends, use the characters themselves or (if you do not know how to enter them, or if you are forced to use an encoding other than UTF-8) numeric character references like ✓ and ✗. (There is not reason to use a reference for the “!” character – ! denotes just the common exclamation mark we have in our keyboards. You can find the Unicode numbers (needed for the numeric references) from the same source in which the named references are listed in HTML5 CR.
As a completely different problem with some of these characters, the font being used may well lack them, and this may force browsers to pick them up from other fonts (possibly creating a stylistic mismatch) or, in rather old systems, fail to render them at all. You should thus make sure that some of the fonts in the font-family list you use for the text containing them, in an acceptable shape.
Those entities are not defined in the HTML 4 specification.
Use literal characters (with a suitable encoding such as UTF-8) or numeric character references.
Related
I would like to use the UTF-8 character ✖ on my site but I am not sure if this will be supported cross browser.
I am worried that:
a) Users will not have access to a font containing that character
b) IE will not find the character even if the user has a font that could display it. I am worried about this because of this info:
By the specifications, browsers should display a character if there is any font in the system that contains it. If the fonts specified by the author (in CSS font-family settings or, rarely these days, using font markup in HTML) do not contain the character, browsers are supposed to use fallback fonts. The same applies if no fonts are specified by the author; browsers should use primarily their default fonts, using alternate fonts for any character not covered by the primary font.
In practice, things don’t always work that way. Especially IE is notorious for its failures in this respect. It often fails to display a character, even though it could do that if it used all the fonts in the system. If a browser cannot render a character, it may show a small rectangle, possibly containing a question mark, ?, or some similar indicator. Here’s a quick test (character U+0840, which is probably not supported by any font on your computer): ࡀ.
Source.
c) Other issues that I have though of.
There is a resource called Unify, that will show what devices the character is supported on but it currently (Sept 14, 2015) only suport 107 characters.
So to summarize, the question is: How can I determine if it is safe to use a utf-8 special character on my site? Is it safe to use ✖ specifically on my site?
It's always safe - your user's computers won't suddenly burst into flame.
From a technical perspective, your best bet is to use a web font that has support for every Unicode character you want to use. That is not a catch-all (the user might have web fonts disabled or is using a command line browser, etc...), but it should support the vast majority of computers.
From there I would apply common sense. If the displaying of a character is absolutely crucial and lives depend on it, try to not use Unicode. Otherwise I'd say 'go ahead'.
This is as much a UX question as it is a technical one, so I will mention both.
As a comparison, on my IE11 browser, it looks like this: , but on my Firefox 31.8, it looks like this: . A good user experience is generally associated with consistency, and this approach is not very portable. So from a UX perspective, this is not a great solution.
I would say using a tiny *.gif or *.bmp, or even *.png if you need transparency, is a better solution. Even better yet, go with *.svg so scaling will not be an issue. From a technical aspect, the overhead of something that small is generally insignificant.
The only problem you can face is that exotic symbols are not implemented in many fonts, so the user can see a dummy character (e.g. square) instead of this. I personally like to use svg symbols for this purpose.
An alternative solution would be to use a web font with those icons in it (although probably a subset version of, so that it's less and 1 kb and doesn't weight down your pages).
My question is very similar to this, but didn't find my answer there.
From the link, I could gather that HTML supports the display of ISO 8859/1 8-bit single-byte coded graphic characters, through numerical representations such as:
&32; for Space.
&33; for Exclamation mark.
The above won't be resolved unless the entity names are prefixed with the #:
for Space would be resolved.
! for Exclamation mark would be resolved.
What is the reason for prefixing the entity names with the # symbol for these characters, when the ISO Latin 1 Character Entities do not follow the same standards.
It can be deduced that the HTML parser would be written in such a way to deal with these, but it would be great to know why this standard was introduced in the first place.
The full gory details of how these are processed is detailed in the parsing section of the HTML 5 specification. You notably want to read the links to "consume a character reference".
HTML 3 was never relevant, and even HTML 3.2 was superseded long ago. ISO documents are also irrelevant in this context.
Following the parsing algorithm can be painful (at least, it takes some getting used-to), but it is guaranteed correct.
Trying to get the 1/3 and 1/8 symbols to show on IE 8-9. It shows fine on earlier versions of IE and all other browsers.
Code I'm using:
⅓
¼
IE 9 and older do not recognize the references ⅓ and ⅛ (the latter is obviously what you meant, instead of ¼, which is well supported) but instead render them literally. These references were not defined in HTML 4.01, and they were added to browsers relatively late (around 2011). Use the numeric references instead: ⅓ and ⅛ (or type the characters themselves, using a suitable editor and UTF-8 encoding).
You would still have a font problem, because the font you use for normal text may not contain these characters. In some situations, browsers are unable to use a fallback font unless you give them a helping hand with a font-family declaration. Besides, there is a risk of getting these characters in a style different from other characters, including more common vulgar fractions like ½. Thus, a careful choice of a font list is recommended; see my Guide to using special characters in HTML.
They aren't in the HTML4 spec, which is what IE9 and lower use. Only 1/4, 1/2 and 3/4 are supported.
Here is a list of what works and what doesn't.
http://stanford.library.usyd.edu.au/symbols/entities.html#Math
HTML entities are not working on chrome and IE (on windows).
I have entered the following code in my page and it works fine on mac chrome or firefox or safari, but not on windows.
<span class="font-family:Arial;">〈 〉 〉 〈 </span>
This is primarily a font issue, though there is a nasty silent change in HTML specs involved.
Modern browsers interpret 〈 and 〉 as referring to U+27E8 MATHEMATICAL LEFT ANGLE BRACKET “⟨” and U+27E9 MATHEMATICAL RIGHT ANGLE BRACKET “⟩”, informally known as “bra” and “ket”. This interpretation is being made official in the named character references section of HTML5.
These characters are adequate for use in many mathematical notations, and the ISO 80000-2 standard explicitly specifies that they are used e.g. for certain scalar product notations. But support to them in fonts is rather limited. In old Windows systems, no font contains them. In newer Windows systems, from Windows Vista onwards, Cambria Math should be available. It is possible that you have been testing on an old Windows version, but it is also possible that Chrome is unable to find the right font. To give it a helping hand, use a CSS rule that suggests that font, e.g. with the attribute
style="font-family: Cambria Math"
You might consider adding some other fonts to the list, using fonts that are known to contain the characters. See my Guide to using special characters in HTML.
The nasty change is that in HTML 4.01, in the entities section, 〈 and 〉 are defined as referring to U+2329 LEFT-POINTING ANGLE BRACKET “〈” and U+232A RIGHT-POINTING ANGLE BRACKET “〉”. They are logically less satisfactory (and deprecated by the Unicode Standard), but they have somewhat wider font support.
So in addition to declaring fonts that contain the characters you use, you need to decide which pair of these characters you use or whether you use something else; it's a complicated question. If you use them, it is best to use them as such (in a UTF-8 encoded HTML document) or using numeric character references such as ⟨. The reason is that 〈 and 〉 should not be expected to work consistently; they probably work the HTML5 way in all modern browsers, but there is hardly any reason to take the risk, when you can unambiguously indicate the characters you want.
That particular character is simply a unicode codepoint which is an arbitrary number. There are a lot of unicode codepoints that do not have an 'official' symbol. Even if they do have a symbol, it is not necessarily the case that your font has a symbol for that codepoint. If you choose a different font, you may end up with a different symbol.
I looked at the CSS for the page and it shows this character displaying in Arial (plus a bunch of other fonts that do not matter). Windows comes with Arial so it should always pick up that font first. It looks like Arial does not have a symbol for that unicode codepoint. Anytime you do not have a glyph for a codepoint, it puts in some form of a box indicating there is no glyph
It depends on the entity, and the fonts on the system your reader is using. The issue is that these characters are not in the MathJax web fonts, so MathJax has to fall back on system fonts to find them. Some browsers are better at that than others. Your configuration controls what fonts MathJax lists for the browser to look in, so you may want to modify that to include fonts where you know your entities can be found (and you may want to think about the fact that you may have people reading your site on Windows, Mac, and Linux, and also mobile devices, so such decisions are not always easy).
Notice that when you install STIX fonts, it works for you. This is because STIXGeneral is in the default list of fonts that MathJax uses for unknown characters. You want to add others to that list (it is stored in the undefinedFamily property of the HTML-CSS and SVG sections of your configuration). Note however, that IE will stop checking fonts once it encounters a font that is installed on the system, even if it doesn't include the needed character and later fonts in the list do, so you have to be careful about the order that you use.
Is there a way to put a ▐ (ascii value of 222) in html character codes? (e.g. Þ)?
Is this possible? If not, is there some way to make sure it is reliably rendered by a browser?
Using the official W3 Character Reference sheet, we can find what you're looking for. You have several options:
█
█
█
█
▮
▮
▮
▮
❘
❘
❘
❘
You can then take this a step further by looking into various Unicode regions. This region has a few similar lines:
▌
▌
▍
▍
▎
▎
▏
▏
▐
▐
Note that you'll have to perform browser tests yourself, as not all browsers will be able to render these symbols. Ensuring that your page is in an appropriate UTF format (i.e. UTF-8) will help greatly.
I don't know from where you got "ascii value of 222". ASCII only goes to 127.
The character appears (to me) to be a U+2590 RIGHT HALF BLOCK. In HTML you can use ▐.
is there some way to make sure it is reliably rendered by a browser?
Yes: encode your document as UTF-8 (really – it’s the default on the web and the best choice nowadays) and include the character directly in the document.
Every modern text editor / IDE supports saving documents as UTF-8. To serve it to the browser, specify the encoding in the <head> section:
<meta charset="utf-8">
(This is HTML5; older versions are slightly different) and specify it in the HTTP header when serving the document from a server. Most servers are already configured to do this correctly.
HTML escape sequences, while still useful in certain scenarios, are by no means the easiest way of using arbitrary characters in HTML code.
Also, as others have noted, there’s some confusion here: ASCII only goes up to 127, there’s no ASCII character 222. Furthermore, ASCII is severely outdated and used almost nowhere nowadays. Most of the time, when somebody says “ASCII” they mean something else, and unfortunately they always mean different things. This is another reason to use Unicode and UTF-8 throughout: it avoids confusion.
I believe you have answered your own question. The other HTML entity for that character is Þ
Depending on your doctype, any compliant browser should render the character correctly.