Escrevendo Seu Código:
Posso digitar o código em qualquer editor de textos como o bloco de notas do Windows. Precisa ser salvo como nomedosite.html. Estas últimas 4 letras (html) são de suma importância.
Por que é importante salvar como .html e não como .txt?
1. O navegador precisa saber que é uma página da web. Quando você salva como .html, o navegador entende que aquele arquivo é uma página da web com código HTML.Ele então interpreta as tags (<h1>, <p>, <img>, etc.) e exibe o conteúdo formatado corretamente. Se você salvar como .txt, o navegador vai mostrar o código como texto comum, e não como uma página web.
2. O ícone muda e você pode abrir direto no navegador Um arquivo .html vira um ícone clicável que abre direto no navegador. Já um .txt abre no Bloco de Notas (ou outro editor), sem mostrar a página pronta.
3. Permite usar recursos da web Arquivos .html podem: Exibir imagens com <img>. Usar estilos com CSS, Executar scripts JavaScript, Ser hospedados na internet. Arquivos .txt não permitem nada disso. Eles são apenas texto sem formatação ou estrutura.
Resumo: Salvar como .txt: Texto comum, Mostra o código "cru", Ignora as tags, Sem recursos de HTML.
Resumo: Salvar como .html: Página web funcional, Roda no navegador, Interpreta as tags, Permite estilização e scripts
Veja abaixo um exemplo de página simples
Um elemento HTML é separado de outro texto em um documento por "tags". Sempre há uma palavra
(nome do elemento) entre os sinais matemáticos < >. Exemplo < nome do elemento >
Alias toda tag inicia com <nome do elemento> e termina com </nome do elemento>.
A tag <html lang="pt-BR"> é de abertura da página e esta tag termina com </html>
A tag <head> é o cabeçalho da página e a tag termina com </head>.
A tag <meta> é uma tag meta usada para definir a codificação de caracteres da sua página HTML. UTF-8 é uma codificação de caracteres que suporta praticamente todos os símbolos e letras do mundo (acentos, emojis, letras de idiomas diferentes etc).
A tag <title> é o título da aba da página.
A tag <body> é o corpo propriamente dito da página. Seu conteúdo começa aqui.
A tag <h1> é o título do corpo da página.
A tag <header> é o cabeçalho do corpo da página.
A tag <p> é um parágrafo do corpo da página, que pode ter inúmeros.
Em HTML, parágrafos são usados para agrupar conteúdos relacionados de qualquer tipo, como imagens e campos de um formulário e não como no texto comum
Resultado Final ao abrir a página:
Salve o arquivo com extensão .html
No menu do Bloco de Notas, clique em: Arquivo -> Salvar como..., No nome do arquivo, digite por exemplo:
meusite.html, em “Tipo”, escolha Todos os arquivos (*.*)
Em “Codificação”, escolha UTF-8. Salve em uma pasta fácil de achar (como a área de trabalho).
Principais tags