David, todos os cursos que eu fiz sobre Html5 e todos os programadores que eu acompanho em mídias sociais recomendam o uso da tag
meta charset="UTF-8" e falam da sua importância.
Dito isto eu fui pesquisar sobre o assunto e encontrei a possível causa do seu problema, alguns editores de código tem uma ferramenta que codifica o charset="UTF-8" de forma automática quando salvamos o arquivo, o que pode a vir causar alguns problemas caso esta ferramenta não esteja configurada da forma correta.
Busquei entender também o motivo do navegador esta lendo o documento de forma correta quando não se usa a tag meta charset="UTF-8", e o que acontece é que os navegadores que nos utilizamos possuem uma ferramenta que por padrão quando não encontra a tag " meta charset="UTF-8" no documento utilizam a codificação "UTF-8", o que não exclui a utilização da tag meta charset="UTF-8" nos documentos Html.
Estou deixando as fontes das informações abaixo caso queira dar uma olhada.
Charset não funciona.
Problema com acentuação UTF-8 resolvido de uma vez por todas!
Configurações de codificação para texto truncado
Escolha e uso de codificação de caracteres
✔ A Forma Certa de Como Configurar Encoding de Arquivos no VS Code (Código Legado sem Stress)