I need a list of HTML escaped codes that represents shapes. I want the codes to be compatible with all browsers. For example, I want an escaped code to show a square on the page, in another page I want a triangle. From what I've heard it's possible.
If you're talking about characters that look like basic geometrical shapes, try opening charmap on Windows or a similar if you're on a different OS. As long as your HTML is using a Unicode encoding (like UTF-8), you can simply use those characters directly in your source code. If your code is written in something like ASCII, then you can use the numeric value of the character with a numeric entity, like this: ▲ (will render a ▲). Keep in mind that the character will only render if the font you're using to display it contains the character.
Related
I have a blog where I use custom fonts from Google Fonts in each and every text of the <body> element, but whenever there is an inverted comma or a double inverted comma in my text, it is not shown as it should be - it is replaced by an unknown character.
I had even looked into the font and there is the character support for the inverted commas.
I don't think this has anything to do with your font.
If you look at the source code you will see the characters already are broken there:
This rather is a problem of your encoding. Your site is UTF-8, but the characters seem to be non-UTF-8. You either need to use UTF-8 characters or change the encoding of your site. (1st option is preferable)
If you change the site encoding to Windows-1252 (which is automatically suggested by Chrome based on the content) everything seems fine:
The question is how did you create this text? Maybe in Word and then copy and pasted? Or is your blog backend not UTF-8?
Also note there are two different characters: ’vs ´.
It's a special character. Please check below example
if you want to write "Don't" than you have to use "don’t"
if you want to write in double quote "highly sought users" than you have to use “highly sought users”
I hope this will help you.
Usually the special characters appears when you copy the text from other sources like MS word. This can be solved by manually entering inverted commas while entering or modifying in the database.
I am wondering, if I can use html-entities like
<h5><em>⇆</em> Headline</h5>
without any fallback if I use utf-8? (because on my systems this works totally fine). Are all these chars from http://dev.w3.org/html5/html-author/charref really all embedded into the utf-8-charset by default?
And how would I use it correctly, like this:
<h5><em>⇆</em> Headline</h5>
that
<h5><em>⇆ </em> Headline</h5>
or
<h5><em>⇆</em> Headline</h5>
There are two separate issues here:
get the browser to understand which character you want
render that character visually
For the first point, there are two options:
Embed the character directly as is, for which you will need to serve the HTML in an encoding that can encode that character. Yes, "⇆" is a Unicode character and can be encoded by any Unicode encoding. UTF-8 is the best choice here. The browser then simply needs to understand that the document is encoded in UTF-8 and it will be able to read and understand the character correctly. Set the appropriate HTTP header to denote the encoding.
Embed the character as an HTML entity. HTML entities is a way to embed any arbitrary character using only ASCII characters, e.g. ⇆. To encode this, your encoding of choice only needs to be able to encode &, l, r, a and ;, which are very standard characters in any encoding. This special sequence of characters is understood by the browser to mean the character "⇆". By embedding characters as HTML entities you can largely ignore the intricacies of managing encodings correctly, but it makes your source code rather unreadable. You should not do this in this day and age.
Whether you use named entities (⇆) or refer to the character by its Unicode code (⇆) doesn't really matter, they both result in the same thing.
Having handled this, the character needs to be actually rendered as a glyph on screen. For this, an appropriate font is necessary. You'll have to test whether most of your target audience uses a system which has a font installed by default which contains this character. You can also provide your own font to the browser which contains this character as a web font.
I've coded an HTML email and use "▶" to code a right-pointing triangle in place of an image in a call-to-action. This renders as anticipated except in iOS devices where this html entity is converted to its emoji counterpart. I also tried using the hex version instead of the decimal one with no success.
I've found posts where the solution utilizes php, but as this is an HTML email I can't use PHP.
Any way to prevent iOS from converting the HTML Entity into its emoji counterpart?
Here's the html entity I'm using: http://www.fileformat.info/info/unicode/char/25B6/index.htm
▶︎
U+FE0F and U+FE0E are ‘variation selectors’, signalling that, respectively, an emoji-like (coloured/animated) or text-like rendering is preferred, if available. If neither is used, the renderer can choose at will. Unfortunately iOS in certain scenarios defaults to the emoji variant and has to be manually put right.
(Hex vs decimal character reference is immaterial. You can include the raw characters too, you don't necessarily have to encode them as character or entity references, but as raw characters the existance of the variant selector would be hard to see in an editor.)
I want to take characters in the Microsoft Symbol font (taken from the w:sym tag in a docx file) and render them in html. When I look at how Word writes out the characters when I save the doc as html, I see this:
<span style='mso-char-type:symbol;mso-symbol-font-family:Symbol'>Â</span>
This appears as a script R in both Word and Word's html output.
When I write the same thing in my own html file, I see the A-hat in the regular font, and Chrome's element inspector warns that the mso- properties are unknown.
In Word's html output there is lots of mso-specific stuff but nothing I can see that lets Chrome know how to interpret mso-char-type and mso-symbol-font. I see the same behavior in IE.
Is there an easy way to tell the browser to use the Symbol font? Or do I have to explicitly translate the Symbol font characters to Unicode (using a static translation table?)
Thanks,
Wayne
The Symbol font is a privately-encoded font, i.e. it places various glyphs in positions that should be occupied by other characters according to character code standards. This means that a web page using it will fail badly whenever the Symbol font is not available, or the page style sheet is overriden, or the browser behaves correctly: e.g., the letter “” cannot be rendered using the Symbol font, so the browser will use a fallback font.
The proper way is to use Unicode encoded characters, such as “ℜ”, in a UTF-8 encoded page, with font-family on the applicable element set to contain a list of fonts that contain this character. For general notes on this, see my Guide to using special characters in HTML.
An inappropriate way that has worked on some faulty browsers is to set font to Symbol in a manner generally understood by browsers, e.g. <font face=Symbol>Â</font> or <span style="font-family: Symbol">Â</span>. But as said, if this “works”, consider it a browser bug.
So yes, if you now have data using Symbol font, it should be mapped to Unicode characters.
Note that characters like “ℜ” (Black-letter capital R, not script R) are seldom needed. In particular, the standard (as per ISO 80000-2) notation for the real part of a complex number z is not ℜ(z) but Re z.
Ok, just removing mso-symbol and writing font-family:Symbol seems to have worked. However I suspect this is not really best practice... A table for translating symbols into unicode can be found here: http://www.alanwood.net/demos/symbol.html
Ok, so I want to have the characters from below in my html page. Seems easy, except I can't find the HTML encoding for them.
Note: I would like to do this without having sized elements, plain ol' text would be fine ^_^.
Cheers.
You can see that they have a unicode number of the selected character - at the bottom of the picture ("U+266A: Eighth Note").
Simply use the last portion in a unicode character entity: ♪ - ♪
If your page is already UTF-8, you can simply paste it in.
Try encoding it as █ - that should do the trick!
In a UTF-8 encoded page, just copy and paste them as-is.
Otherwise, use the number that the dialog gives you for each character, e.g. ♪
However, when working with rather exotic characters, be very wary of font support. See e.g. this question for background: Unicode support in Web standard fonts
This page gives some information about support for the characters you want to use. They seem to be relatively well supported, but a test on Linux and Mac machines won't hurt.
Here is one comprehensive entity reference. If you want to convert symbols into their entity counterparts, I suggest using this converter.
My suggestion is to use hexadecimal reference. ( it's easy dont worry :) )
for example, the first character you have highlighted in red got ascii value of 175, which is AF in hex.
So in short you can encode it using %AF, and so on...
is it clear mate? Let me know if you need further explanation or help about this :)
Edit: my post is meant for url encoding.