Editores HTML
Você já sabe que HTML é marcação dentro de um arquivo de texto. Esta lição foca na ferramenta com que você escreve esse arquivo: um editor HTML. Escolher uma ferramenta de texto simples mantém as tags limpas e facilita abrir as primeiras páginas no navegador.
O que é um editor HTML?
Um editor HTML é qualquer programa que permite escrever e guardar texto simples como um arquivo .html. O navegador não se importa com a marca. Precisa apenas de marcação correta e de um arquivo que possa abrir. Os editores vão de blocos de notas pequenos a editores de código com destaque e explorador de ficheiros.
Resposta direta: o que os iniciantes devem usar?
Comece com um editor de código gratuito como Visual Studio Code, ou mesmo o Bloco de Notas no Windows / TextEdit em modo texto simples no macOS. Evite Microsoft Word, Google Docs ou processadores de texto semelhantes nas lições de HTML. Esses apps são feitos para documentos imprimíveis e muitas vezes inserem formatação oculta que quebra páginas web.
Editores de texto simples vs editores de código
Um editor de texto simples guarda apenas os caracteres que você digita. Isso basta para HTML. Um editor de código ainda guarda texto simples, mas adiciona recursos úteis:
- realce de sintaxe para ler melhor tags e texto
- números de linha para achar erros
- pastas e vários arquivos numa janela
- extensões opcionais depois (não são necessárias neste curso)
Você não precisa de um IDE pago para aprender HTML.
Página mínima para guardar
html<!DOCTYPE html>
<html>
<head>
<title>Prática do editor</title>
</head>
<body>
<h1>Escrevi isto num editor</h1>
<p>Guardado como arquivo .html e aberto no navegador.</p>
</body>
</html>
Para que serve este arquivo de prática
Copie o exemplo no seu editor, guarde como editor-practice.html e abra no Chrome, Firefox, Edge ou Safari. Se vir o título e o parágrafo, o editor e as definições de gravação estão a funcionar.
Como criar o seu primeiro arquivo HTML
- Abra o editor e crie um arquivo novo
- Cole ou escreva um documento HTML básico
- Guarde o arquivo com um nome que termine em
.html(por exemploindex.html) - Se o editor perguntar a codificação, escolha UTF-8 quando disponível
- Abra o arquivo guardado no navegador (duplo clique ou arraste o arquivo para a janela)
No Bloco de Notas do Windows use Guardar como, defina o tipo para Todos os ficheiros e escreva você mesmo a extensão.htmlpara o arquivo não ficar.txt.
Editores online e as caixas Try-it deste site
Ambientes online permitem editar HTML no navegador sem instalar software. São úteis para experiências rápidas. Neste curso pratique também com um arquivo .html local para aprender o fluxo real de guardar e abrir. Quando uma lição mostrar uma caixa Try-it, pode executá-la ali e recriar a mesma marcação no seu editor.
Opções gratuitas recomendadas
Estas são escolhas comuns e amigáveis para iniciantes (qualquer uma serve):
- Visual Studio Code — editor de código gratuito popular
- Notepad++ (Windows) — leve com realce
- Sublime Text — editor rápido (avaliação gratuita)
- Bloco de Notas / TextEdit em texto simples — suficiente para as primeiras lições
Escolha uma ferramenta e fique com ela um tempo para o fluxo ficar automático.
Erros comuns
- Escrever HTML no Word ou Docs e exportar sem entender a marcação extra que essas ferramentas adicionam
- Guardar por acidente como
.txte perguntar-se por que o navegador mostra tags em bruto - Editar o arquivo e esquecer de guardar antes de atualizar o navegador
- Modo de texto formatado que muda aspas ou insere pontuação tipográfica em atributos
- Esperar que o editor “execute” HTML sozinho — o navegador mostra a página; o editor só guarda o código-fonte
Resumo
- HTML escreve-se como texto simples num editor e guarda-se como
.html - Editores de código ajudam com realce; ferramentas tipo Bloco de Notas também funcionam
- Evite processadores de texto para aprender marcação HTML
- Guarde e depois abra ou atualize o navegador para ver as alterações
- Editores online são práticos; arquivos locais ensinam o fluxo real
- Um editor consistente é melhor do que trocar de ferramenta em cada lição
🧠 Teste Seu Conhecimento
Teste Seu Conhecimento
Desafie-se com este questionário interativo e veja o quão bem você entende o tópico
📝 Instruções
- Leia cada pergunta cuidadosamente
- Selecione a melhor resposta para cada pergunta
- Você pode refazer o quiz quantas vezes quiser
- Seu progresso será mostrado no topo