Melhor maneira de codificar o símbolo de Grau Celsius na página da web?

85

Como devo codificar caracteres especiais em páginas da web? Por exemplo, eu preciso deste símbolo ℃, que usei apenas copiando e colando o caractere como posso vê-lo agora. Isso funcionou para os navegadores de desktop que verifiquei e também no iPad e iPhone, mas nada é exibido em um Blackberry que usei para teste. Existe uma prática recomendada padrão para isso?

http://www.fileformat.info/info/unicode/char/2103/browsertest.htm

Evanss
fonte
Existe um padrão de pensamento sobre o que usar, UTF-8 vs Hex ou outro formato? Obrigado
Evanss
Ah, desculpe, não entendi sua pergunta no início. Eu acredito que o UTF-8 é geralmente o preferido. Quanto ao símbolo em si, geralmente faço apenas o sinal de grau seguido por um C maiúsculo, assim: ° C. Não tenho certeza se isso é melhor ou pior do que sua solução. Eu acho que a maior diferença é o espaçamento das letras entre os dois caracteres.
Nix
Eu acho que é necessário que este símbolo faça do seu jeito. Obrigado
Evanss

Respostas:

178

Tente substituí-lo por °e também definir o conjunto de caracteres para utf-8, como Martin sugere.

°C obterá algo como isto:

Graus Celsius

Nix
fonte
Melhor resposta, na minha opinião
Epirocks
Perfeito!
Zobia Kanwal
38

Se você realmente deseja usar o caractere DEGREE CELSIUS “℃”, então copiar e colar está OK, desde que seu documento seja codificado em UTF-8 e declarado como tal nos cabeçalhos HTTP. Usar a referência de caractere ℃funcionaria igualmente bem e funcionaria independentemente da codificação de caractere, mas a fonte seria muito menos legível.

O problema com o Blackberry é provavelmente um problema de fonte. Não sei sobre fontes no Blackberry, mas o repertório de fontes pode ser limitado. Não há nada que você possa fazer sobre isso em HTML, mas você pode usar CSS, possivelmente com @font face.

Mas raramente há qualquer razão para usar o DEGREE CELSIUS. É um caractere de compatibilidade, incluído no Unicode devido ao seu uso na escrita do Leste Asiático. O Padrão Unicode diz explicitamente no Capítulo 15 (seção 15.2, página 497):

“Em uso normal, é melhor representar graus Celsius“ ° C ”com uma sequência de U + 00B0 sinal de grau + U + 0043 letra latina c maiúscula, em vez de U + 2103 graus Celsius.”

O sinal de grau “°” pode ser inserido de várias maneiras, incluindo a referência de entidade `°, mas normalmente é melhor inseri-lo como um caractere, por meio de copiar e colar ou de outra forma. No Windows, você pode usar Alt 0176.

Advertência: Alguns navegadores podem tratar o sinal de grau como permitindo uma quebra de linha após ele, mesmo quando nenhum espaço intervém, colocando “°” e o seguinte “C” em linhas separadas. Existem diferentes maneiras de evitar isso . Um método simples e eficaz é esta: <nobr>42 °C</nobr>.

Jukka K. Korpela
fonte
1
Uma das melhores respostas que li, com citação direta da fonte principal. Impressionante!!
htm11h
1
Por que tão complicado afinal? O grau Celsius está no lado superior esquerdo do meu teclado, basta pressioná-lo?
Pascal
2
@Pascal, que teclado é esse?
Jukka K. Korpela
Use style = "white-space: nowrap" em vez de <nobr>. developer.mozilla.org/en-US/docs/Web/HTML/Element/nobr
IceWarrior353
10

Usando sup na letra "o" e um "C" maiúsculo

<sup>o</sup>C

Deve funcionar em todos os navegadores e IE6 +

Persijn
fonte
11
A letra «o» não é o símbolo de grau, mas pode se parecer com o símbolo de grau para humanos. Este é um hack e será confuso para os computadores entenderem - como leitores de tela e mecanismos de pesquisa.
Gregers de
4

Adicione uma metatag ao seu cabeçalho

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

Isso expande a quantidade de caracteres que você pode usar.

Martin Risell Lilja
fonte
5
Em HTML5 você pode apenas usar <meta charset="utf-8"/>eu acredito.
Drew Noakes em
No meu caso, essa foi a solução real. VS2015 se comporta de acordo com o que diz a meta tag "Content-Type".
German Latorre
Adicionar isso resolveu um problema para mim em que um °estava sendo renderizado como °em uma imgtag alt onde a imagem de origem estava ausente.
StephenT de
1
  1. O sinal de grau pertence ao número e não ao "C". Você pode considerar o sinal de grau como um símbolo de número, assim como o sinal de menos.
  2. Não deve não haver nenhum espaço entre os dígitos e o sinal de grau.
  3. deve ser um espaço sem quebras entre o sinal grau eo "C".
Johan Hoffsten
fonte
Você poderia dar uma fonte dessas afirmações?
Matthieu
0

Se estiver usando Java-JSP, o que funcionou para mim é colar abaixo na página JSP

<%@ page contentType="text/html; charset=UTF-8" %>
veritas
fonte