caraceter especial ao informar o utf-8 | HTML5 e CSS3 parte 1: crie uma página da Web

Solucionado (ver solução)

Solucionado
(ver solução)

4
respostas

por eduardo.nogueira

| 1.3k xp | 3 posts

<!DOCTYPE html>
<html lang='pt-br'>
   <meta charset='UTF-8'>
   <title>Barbearia Alura</title>
   <h1>Sobre a Barbearia Alura</h1>

   <p>Localizada no coração da cidade a <strong>Barbearia Alura</strong> traz para o mercado o que há de melhor para o seu cabelo e barba. Fundada em 2019, a Barbearia Alura já é destaque na cidade e conquista novos clientes a cada dia.</p>

   <p><em>Nossa missão: <strong>"Proporcionar auto-estima e qualidade de vida aos clientes"</strong>.</em></p>

   <p>Oferecemos profissionais experientes e antenados as mudanças no mundo da moda. O atendimento possui padrão de excelência e agilidade, garantindo qualidade e satisfação dos nossos clientes.</p>

</html>

Ao colocar a tag no navegador aparecem caracteres especiais. Sem a tag, o texto fica perfeito. Utilizando o vscode para desenvolvimento e chrome para abertura do html.

4 respostas

por Thiago Augusto da Silva Rasquino

| 516.8k xp | 102 posts

Programador Java Júnior

10/12/2019

Testa assim:

<!DOCTYPE html>
<html lang='pt-br'>
<head>
    <meta charset='UTF-8'>
        <title>Barbearia Alura</title>
</head>
<body>
   <h1>Sobre a Barbearia Alura</h1>

   <p>Localizada no coração da cidade a <strong>Barbearia Alura</strong> traz para o mercado o que há de melhor para o seu cabelo e barba. Fundada em 2019, a Barbearia Alura já é destaque na cidade e conquista novos clientes a cada dia.</p>

   <p><em>Nossa missão: <strong>"Proporcionar auto-estima e qualidade de vida aos clientes"</strong>.</em></p>

   <p>Oferecemos profissionais experientes e antenados as mudanças no mundo da moda. O atendimento possui padrão de excelência e agilidade, garantindo qualidade e satisfação dos nossos clientes.</p>
</body>
</html>

O que eu fiz? Acrescentei as tags Head e Body. O HTML é uma linguagem de marcação de texto, portanto você precisa delimitar cada trecho com a tag certinha pra tudo funcionar não só na nossa máquina, mas na do nosso cliente também.

por eduardo.nogueira

| 1.3k xp | 3 posts

10/12/2019

fiz o teste como falou e continuou igual, coloquei em comentário a tag meta e voltou ao normal....

solução!

por André Eduardo Pérez Álvarez

| 99.6k xp | 18 posts

Analista de Desenvolvimento de Sistemas

10/12/2019

Boa tarde Eduardo. Reproduzi o seu erro e descobri o motivo. Repare que foi definido o conjunto de caracteres UTF-8:

charset='UTF-8'

Se você salvar o arquivo HTML no editor de texto com um conjunto diferente, digamos por exemplo, "Windows 1252", "ISO 8859-1", etc., os caracteres especiais não serão mapeados corretamente.

Para corrigir, você precisa definir no charset o mesmo código de página que foi usado no arquivo. Para fazer um teste no VS Code, basta você executar o comando "Reopen with encoding" (reabrir com codificação).

Ou, pode deixar o charset como está (UTF-8), e converter o arquivo para o UTF-8. Nesse caso, repare que a acentuação ficará distorcida exatamente como você mencionou. Assim precisará copiar e colar o texto novamente e salvar.

Espero ajudar.

por eduardo.nogueira

| 1.3k xp | 3 posts

11/12/2019

Obrigado André, resolvido o problema.