Skip to main content

Como usar caracteres especiais em HTML

HTML5 #4 - Exibição de acentos e caracteres (Charset Encoding) (Abril 2025)

HTML5 #4 - Exibição de acentos e caracteres (Charset Encoding) (Abril 2025)
Anonim

As páginas da web que você visita on-line são criadas usando código HTML que informa aos navegadores da web qual é o conteúdo da página e como torná-la visualmente para os espectadores. O código contém blocos de construção instrucionais conhecidos como elementos, que o visualizador de páginas da Web nunca vê. O código também contém caracteres de texto normais, como aqueles em títulos e parágrafos projetados para o espectador ler.

A função dos caracteres especiais em HTML

Quando você usa HTML e digita o texto projetado para ser visualizado, normalmente não precisa de nenhum código especial - basta usar o teclado do computador para adicionar letras ou caracteres apropriados. Um problema surge quando você deseja digitar um caractere no texto legível que o HTML usa como parte do próprio código. Esses caracteres incluem os caracteres <e> usados ​​no código para iniciar e terminar cada tag HTML. Você também pode incluir caracteres no texto que não tenham um análogo direto no teclado, como © e Ñ. Para caracteres que não possuem uma tecla no teclado, você insere um código.

Caracteres especiais são partes específicas do código HTML projetadas para exibir caracteres usados ​​no código HTML ou para incluir caracteres que não são encontrados no teclado no texto visualizado pelo visualizador. O HTML renderiza esses caracteres especiais com codificação numérica ou de caracteres para que eles possam ser incluídos em um documento HTML, lidos pelo navegador e exibidos corretamente para que os visitantes do site vejam.

Caracteres HTML especiais

Três caracteres estão no centro da sintaxe do código HTML. Você nunca deve usá-los nas partes legíveis de sua página da Web sem codificá-los primeiro para exibição adequada. Eles são os símbolos maior que, menor que e comercial. Em outras palavras, você nunca deve usar o símbolo de menor que < em seu código HTML, a menos que seja o início de uma tag HTML. Se você fizer isso, o personagem confunde os navegadores e suas páginas podem não renderizar conforme o esperado. Os três caracteres que você nunca deve adicionar não codificados são:

  • sinal menor que <
  • sinal maior que >
  • e comercial &

Quando você digita esses caracteres diretamente em seu código HTML - a menos que você os esteja usando como elementos no código - digite a codificação para eles, para que eles apareçam corretamente no texto legível:

  • sinal menor que<
  • sinal de maior que>
  • e comercial &

Cada caractere especial começa com um e comercial - até mesmo o caractere especial para E comercial começa com esse caractere. Caracteres especiais terminam com um ponto e vírgula. Entre esses dois caracteres, você adiciona o que for apropriado para o caractere especial que você deseja adicionar.lt (para menos que ) cria o símbolo menor que quando aparece entre o "e" comercial e ponto e vírgula em HTML. Similarmente, gt cria o símbolo maior que e amp produz um e comercial quando eles estão posicionados entre um e comercial e ponto-e-vírgula.

Caracteres especiais que você não pode digitar

Qualquer caractere que possa ser renderizado no conjunto de caracteres padrão Latin-1 pode ser renderizado em HTML. Se não aparecer no teclado, use o símbolo "e" comercial com o código exclusivo que foi atribuído ao caractere seguido pelo ponto e vírgula.

Por exemplo, o "código amigável" para o símbolo de copyright é© e&comércio; é o código do símbolo de marca registrada.

Esse código amigável é fácil de digitar e fácil de lembrar, mas há muitos caracteres que não possuem um código amigável que seja fácil de lembrar.

Cada caractere que pode ser digitado na tela tem um código numérico decimal correspondente. Você pode usar este código numérico para exibir qualquer caractere. Por exemplo, o código numérico decimal para o símbolo de direitos autorais-©-Demonstra como funcionam os códigos numéricos. Eles ainda começam com um e comercial e terminam com um ponto e vírgula, mas em vez de texto amigável, você usa o sinal numérico seguido por um código numérico exclusivo para esse caractere.

Os códigos amigáveis ​​são fáceis de lembrar, mas os códigos numéricos são geralmente mais confiáveis. Sites construídos com bancos de dados e XML podem não ter todos os códigos amigáveis ​​definidos, mas suportam os códigos numéricos.

A melhor maneira de encontrar os códigos numéricos para os caracteres é nos conjuntos de caracteres que você pode encontrar on-line. Quando você encontrar o símbolo que você precisa, basta copiar e colar o código numérico em seu HTML.

Alguns conjuntos de caracteres incluem:

  • Códigos de moeda
  • Códigos Matemáticos
  • Códigos de pontuação
  • Códigos de pronúncia
  • Códigos diacríticos

Caracteres de idioma não inglês

Caracteres especiais não se limitam ao idioma inglês. Caracteres especiais em idiomas diferentes do inglês podem ser expressos em HTML, incluindo:

  • espanhol
  • francês
  • grego
  • romena

Então, o que são códigos hexadecimais?

O código hexadecimal é um formato alternativo para exibir caracteres especiais no código HTML. Você pode usar o método que desejar para sua página da Web. Você os procura em conjuntos de caracteres online e os usa da mesma maneira que usa códigos amigáveis ​​ou códigos numéricos.

Adicione a declaração Unicode ao seu cabeçalho de documento

Adicione a seguinte meta tag em qualquer lugar dentro da da sua página da Web para garantir que seus caracteres especiais sejam exibidos corretamente.

content = "text / html; charset = utf-8" />

Dicas

Não importa qual método você use, tenha algumas práticas recomendadas em mente:

  • Sempre termine sua entidade com um ponto e vírgula. Alguns editores de HTML permitem postar códigos HTML sem o ponto-e-vírgula final, mas suas páginas serão inválidas e muitos navegadores da Web não exibirão as entidades corretamente sem elas.
  • Sempre comece com um e comercial. Muitos editores da Web permitem que você não use o "amplificador". mas quando você exibe um e comercial sozinho em XHTML, isso causa um erro de validação.
  • Teste suas páginas no maior número de navegadores possível. Se o personagem é crucial para entender seu documento e você não pode testá-lo nas combinações de navegador / sistema operacional que seus clientes usam, você deve encontrar outra maneira de representá-lo. No entanto, antes de recorrer a imagens ou qualquer outra coisa, experimente uma das ferramentas de teste de navegador que pode validar seu código em vários navegadores.