Um ficheiro HTML é simplesmente um ficheiro de texto guardado com uma extensão .html ou .htm.
Get Started
Neste tutorial aprenderá como é fácil criar um documento HTML ou uma página web. Para começar a codificar HTML só precisa de duas coisas: um editor de texto simples e um navegador web.
Bem, vamos começar a criar a sua primeira página HTML.
Criar o seu primeiro documento HTML
P>Vamos percorrer os seguintes passos. No final deste tutorial, terá feito um ficheiro HTML que exibe a mensagem “Hello world” no seu navegador web.
Passo 1: Criar o ficheiro HTML
Abra o editor de texto simples do seu computador e cria um novo ficheiro.
Tip: Sugerimos que use o Bloco de Notas (no Windows), TextEdit (no Mac) ou algum outro editor de texto simples para o fazer; não use o Word ou WordPad! Quando compreender os princípios básicos, poderá mudar para ferramentas mais avançadas como o Adobe Dreamweaver.
Passo 2: Digite algum código HTML
Comece com uma janela vazia e digite o seguinte código:
Exemplo
Experimente este código ”
<!DOCTYPE html><html lang="en"><head> <title>A simple HTML document</title></head><body> <p>Hello World!<p></body></html>
Passo 3: Guardar o ficheiro
Guardar agora o ficheiro no seu ambiente de trabalho como “minha primeira página”.html “.
Nota: É importante que a extensão .html
seja especificada – alguns editores de texto, tais como o Bloco de Notas, guardá-lo-ão automaticamente como .txt
caso contrário.
Para abrir o ficheiro num browser. Navegue até ao seu ficheiro e depois faça duplo clique sobre ele. Abrirá no seu navegador de Internet padrão. Se não o fizer, abra o seu navegador e arraste o ficheiro para ele.
Explicação do código
P>Pode pensar no que se tratava esse código. Bem, vamos descobrir.
- A primeira linha
<!DOCTYPE html>
é a declaração do tipo de documento. Instrui o web browser que este documento é um documento HTML5. É insensível a maiúsculas e minúsculas. - O elemento
<head>
é um recipiente para as etiquetas que fornece informações sobre o documento, por exemplo,<title>
a etiqueta define o título do documento. - O elemento
<body>
contém o conteúdo real do documento (parágrafos, links, imagens, tabelas, etc.) que é apresentado no navegador web e mostrado ao utilizador.
Você aprenderá sobre os diferentes elementos HTML em detalhe nos próximos capítulos. Por agora, concentre-se apenas na estrutura básica do documento HTML.
Nota: Uma declaração DOCTYPE aparece no topo de uma página web antes de todos os outros elementos; contudo, a declaração doctype em si não é uma tag HTML. Cada documento HTML requer uma declaração de tipo de documento para assegurar que as suas páginas são exibidas correctamente.
Tip: As etiquetas <html>
<head>
, e <body>
compõem o esqueleto básico de cada página web. O conteúdo dentro do <head>
e </head>
são invisíveis aos utilizadores com uma excepção: o texto entre <title>
e </title>
tags que aparecem como título num separador do navegador.
HTML Tags e Elementos
HTML é escrito sob a forma de elementos HTML que consistem em markup tags. Estas etiquetas de marcação são a característica fundamental do HTML. Cada markup tag é composta por uma palavra-chave, rodeada por parênteses angulares, tais como <html>
<head>
<body>
<title>
<p>
, e assim por diante.
as etiquetas HTML vêm normalmente em pares como <html>
e </html>
. A primeira tag de um par é frequentemente chamada tag de abertura (ou tag de início), e a segunda tag é chamada tag de fecho (ou tag de fim).
Uma tag de abertura e uma tag de fecho são idênticas, excepto uma barra (/
) após o ângulo de abertura da tag de fecho, para dizer ao navegador que o comando foi completado.
Entre as tags de início e fim pode colocar o conteúdo apropriado. Por exemplo, um parágrafo, que é representado pelo elemento p
, seria escrito como:
Exemplo
Experimente este código ”
<p>This is a paragraph.</p><!-- Paragraph with nested element --><p> This is <b>another</b> paragraph.</p>
Você aprenderá sobre os vários elementos HTML no próximo capítulo.