O Bloco de Notas do Windows é um programa básico de processamento de texto que você pode usar para escrever suas páginas da web. As páginas da Web são apenas texto e você pode usar qualquer programa de processamento de texto para escrever HTML.
Salve a página como HTML no Bloco de Notas
Ao criar uma página, salve o arquivo antes de avançar muito. Use todas as letras minúsculas e sem espaços ou caracteres especiais no nome do arquivo.
- No Bloco de notas, clique em Arquivo e em Salvar como.
- Vá para a pasta onde você salvou os arquivos do seu site.
- Altere o menu suspenso Salvar como tipo para Todos os arquivos (*. *).
- Nomeie o arquivo usando uma extensão .htm ou .html.
Comece a escrever a página da web
Inicie seu documento HTML5 do bloco de notas com o DOCTYPE. Esta string informa aos navegadores que tipo de HTML esperar.
A declaração doctype não é uma tag. Ele informa ao computador que um documento HTML5 está chegando. Ele vai no topo de cada página HTML5 e tem o seguinte formato:
<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Transitional // EN" "http://www.w3.org/TR/html4/loose.dtd">
Depois de especificar o doctype , comece seu HTML. Digite a tag inicial e a tag final e deixe algum espaço para o conteúdo do corpo da página da web. Seu documento do Bloco de notas deve ter a seguinte aparência:
<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Transitional // EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> </html>
Crie um cabeçalho para sua página da web
O cabeçalho de um documento HTML é onde as informações básicas sobre sua página da web são armazenadas – coisas como o título da página e possivelmente metatags para otimização de mecanismo de pesquisa.
Para criar uma seção head, adicione as tags head em seu documento de texto HTML do Notepad entre as tags html.
<head> </head>
Tal como acontece com as tags html, deixe algum espaço entre elas para que você tenha espaço para adicionar as informações do cabeçalho.
Adicione um título de página na seção principal
O título da sua página da web é o texto exibido na janela do navegador. É também o que está escrito nos marcadores e favoritos quando alguém salva o seu site. Armazene o texto do título entre as tags de título. Ele não aparecerá na própria página da web, apenas na parte superior do navegador.
Esta página de exemplo é intitulada “Iphone, ipad e outros animais de estimação.”
<title> Iphone, Ipad e outros animais de estimação </title>
Não importa o tamanho do título ou se ele abrange várias linhas em seu HTML, mas títulos mais curtos são mais fáceis de ler e alguns navegadores cortam os longos na janela do navegador.
O corpo principal da sua página da web no bloco de notas
O corpo da sua página da web é armazenado nas tags do corpo. Deve vir depois das tags head, mas antes da tag html final. Esta área é onde você coloca o texto, títulos, subtítulos, imagens e gráficos, links e todos os outros conteúdos. Pode ser o tempo que você quiser.
Deixe um espaço extra entre as tags de corpo inicial e final.
Este mesmo formato pode ser seguido para escrever sua página da web no Bloco de notas.
<body> </body>
Criação de uma pasta de imagens
Antes de adicionar conteúdo ao corpo do seu documento HTML, configure seus diretórios para que você tenha uma pasta para imagens.
- Abra a janela Meus documentos .
- Abra a pasta onde você armazena seus arquivos da web.
- Clique em Arquivo > Novo > Pasta.
- Dê um nome às imagens da pasta .
Armazene todas as imagens do seu site na pasta de imagens para que possa localizá-las posteriormente. Isso torna mais fácil carregá-los quando você precisar.
Usando o bloco de notas para HTML
Nos primórdios da web, ferramentas como o Bloco de notas eram a ferramenta padrão para escrever novas páginas da web.
No entanto, dada a complexidade da maioria das páginas modernas, além da interação de HTML com CSS, quase ninguém usa mais o bloco de notas – eles usam ferramentas gráficas como Adobe Dreamweaver ou contam com plataformas de codificação como Visual Studio Code.
Um ambiente de texto que oferece linting e correção de código é preferível a uma tela em branco e indiferenciada, portanto, embora o Notepad funcione em uma pitada, é muito menos ideal para edição de HTML do que editores de codificação ou aplicativos gráficos de webdesign.
