TIC - Ficha Teórica 4

TECONOLOGIAS DE INFORMAÇÃO E COMUNICAÇÃO
IPOLUB 2022/2023
Ficha teórica 4
Unidade II – Desenvolvimento e manutenção de páginas para a

internet estáticas
Tema: 2.2 – Fundamentos da linguagem HTML
Objectivos
✓ Perceber e implementar código em linguagem HTML
✓ Ser capaz de criar uma página web utilizado um editor HTML
2.1 – Estruturação, criação e manutenção de páginas para a internet

Introdução
As páginas de internet são essencialmente criadas com base na linguagem
HTML (Hyper Text Markup Language – Linguagem de Marcação de Ipertexto).
Conceito: Entende-se por HTML a linguagem de marcação (ou informação)
cujas instruções têm como objectivo, indicar ao navegador de Internet onde
colocar e como mostrar os conteúdos da página ao utilizador.
Uma página de internet em HTML é no fundo uma sequência de instruções e
referências que relacionam e formatam objectos dos mais variados tipos (texto,
imagem, áudio, vídeos, tec).
A linguagem HTML é de uma concepção tão simples que permite a um utilizador
criar uma página de internet num editor tão básico como o Bloco de Notas do
sistema operativo Windows. O conceito que está por trás desta técnica é que,
apenas inserindo todos os elementos desta linguagem, as suas propriedades e
respectivos conteúdos, é possível obter uma página completa, colorida,
formatada, com imagens, vídeos, etc.
2.2.1 – Aspectos essenciais para a construção de uma página HTML

➢ Etiquetas
As etiquetas são elementos chaves da linguagem HTML. Comummente são
chamadas de tags. Indicam ao navegador como deve apresentar e qual o tipo
de objecto contido nessa tag. Pode referenciar um cabeçalho, um título, um
parágrafo, uma imagem, uma ligação, uma tabela, etc. Geralmente possuem
dois formatos, o de início e de fim. Tomando com exemplo a tag de título (TITLE),
vemos que no início o seu formato é <title>; no final o seu formato é </title>.
Professor: Domingos Carlos Dionísio E-mail: domicardio@gmail.com

WhatsApp: 927252519
IPOLUB 2022/2023
Exemplo:
<title> Exemplo de título de página </title>
Praticamente todas as tags têm uma versão de início e uma de fim, mas esta
regra não é universal. Por exemplo, a tag <input> não necessita da versão de
fim. Além disso, existem tags que se encerram a elas próprias por não
necessitarem de conteúdos. Exemplo disso é a tag que tem por objectivo
mudar de linha.
Atributos
Os atributos são propriedades aplicadas na tag para personalizar as opções que
já existem por defeito. Por exemplo, a tag que delimita o conteúdo de um
parágrafo pode conter atributos que alteram o seu alinhamento que por defeito
é à esquerda. Assim, no exemplo seguinte, este passa a ser ao centro.
 Um conteúdo alinhado ao centro 
2.2.2 Estrutura de uma página HTML

A estrutura de uma página html é a seguinte:
<html>
<head>
<title>
</title>
</head>
<body>
</body>
</html>
Estas são as tags mais prováveis de encontrar em uma página html. Funcionam
como um esqueleto onde irão ser integradas outras tags, propriedades e blocos
de códigos mais específicos. O significado de cada uma delas é o seguinte:
<html> - indica o tipo documento em que estamos a trabalhar – documento html
<head> - cabeçalho da página. É geralmente utilizado para definir propriedades
de formatação e outros conteúdos.
<title> - tag que define o conteúdo da barra de título do navegador de internet.

WhatsApp: 927252519
IPOLUB 2022/2023
<body> - tag que define a área onde vai aparecer todo o conteúdo visível da
página de internet.
Exemplo:
<html>
<head>
<title>
Exemplo de 1ª página HTML
</title>
</head>
<body>
 Exemplo de linguagem html 
</body>
</html>
2.2.3 Ficheiros HTML

Os ficheiros das páginas de internet são ficheiros de computador que contêm
toda a infomação que vai dar origem às páginas que vemos normalmente quando
navegamos na internet. Um ficheiro concebido em linguagem HTML por norma
tem extenções .html ou .htm.
Uma página ou site de internet não passa de um conjunto de ficheiros html (ou
te outro tipo) interligados entre si de forma organizada e estruturada. No caso
das páginas estáticas, cada página contem ligações para outras e sempre que
existe uma alteração de conteúdo, é sinal que estamos a passar de um ficheiro
html para outro.
É importante mencionar que ao nome do ficheiro de entrada de qualquer página
de internet, ou seja, ao ficheiro de primeira página a ser lida, deve ser dado o
nome de “index”. Todas as restantes a ele ligadas poderão ter os nomes que o
utilizador considere adequados, mas deve, no entanto, envitar acentuação e
espaços. Portanto, se pretendermos criar um sitio web com mais de uma página
teremos a seguinte hierarquia de páginas web:

WhatsApp: 927252519
IPOLUB 2022/2023
2.2.4 – Caracteres especiais em HTML

A linguagem html tem a capacidade de reproduzir determinados símbolos e
caracteres utilizando combinações predeterminadas que recebem o nome de
caracteres especiais ou entidades. Assim, podemos ter a certeza que qualquer
computador em qualquer parte do mundo interpreta de forma idêntica um
carácter que contenha acentuação, um espaçamento ou um símbolo de uma
determinada meda, etc.
A sintaxe para caracteres especiais é a seguinte:
& código;
Exemplo:
&circ – ao colocar este caracter especial num parágrafo em HTML, o que vai
aparecer no navegador web será “^”;
Existe uma lista de caracter especiais em html que facilmente podem ser
encontrados na internet. Alguns mais utilizados são:

WhatsApp: 927252519
IPOLUB 2022/2023
2.2.5 – Lista de etiquetas em HTML

As etiquetas, como já foi referido anteriormente, são elementos centrais da
linguagem html. São elas que idicam ao navegador de internet como tratar os
diversos conteúdos inseridos numa página de internet, e converte-los do
ficheiro html para o produto final que o utilizador visualiza no seu computador.
Quando navega.
Etiquetas básicas
a. Cabeçalhos
A semelhança dos processadores de texto, em HTML é possível atribuir
diferentes tipos de títulos num conteúdo. Isto é efectuado através da tg <h>.
Existem 6 tipos de cabeçalhos html que vão deste <h1> até <h6>.
Exemplo
Esta tag possui o atributo adicional “align” que permite o alinhamento à esquerda
(left), ao centro (center), à direita (right) e justificado (justify).
Por exemplo, se pretendermos justificar um cabeçalho ao centro, teremos:
<h1 align=”center”> Cabeçalho 1 </h1>
b. Parágrafos
A tag descreve ou delimita um parágrafo. Cada tag deve conter uma
abertura e um fecho. Esta tag contém também, da mesma forma que a
anterior, um atributo “align” que permite o alinhamento de todo o parágrafo.

WhatsApp: 927252519
IPOLUB 2022/2023
Exemplos:
 Parágrafo com alinhamento à esquerda 
 Parágrafo com alinhamento à direita 
 Parágrafo com alinhamento ao centro 
 Parágrafo com alinhamento justificado 
c. Quebra de linha
A tag que provoca a quebra de linha (enter) é a tag . Tem especial
utilidade para mudar ou quebrar a linha dentro de um parágrafo, ou seja,
torna-se desnecessário terminar um parágrafo e reinicia-lo mais tarde. Até
porque o espaçamento entre um parágrafo e o outro é maior em relação a
quebra de linha com esta tag. Porem, é de salientar que esta tag não precisa
de conteúdo, por isso, não precisa de tag de fecho.
Exemplo de uso:
 Parágrafo com alinhamento justificado 
d. Sublinhado
A tag permite sublinhar um conteúdo selecionado.
Exemplo:
 Este texto tem um conteúdo sublinhado 
e. Negrito
A tag permite negritar um conteúdo selecionado, deixndo-o mais
saliente em relação aos demais.
Para além desta tag, pode-se utilizar para o mesmo efeito a tag .
Exemplo:
 Este texto tem um conteúdo negritado 
 Este texto tem um conteúdo negritado 
f. Itálico
A tag permite colocar em itálico um conteúdo selecionado. Pode ser
combinada com outras tags.
Exemplo: Este texto tem um conteúdo em itálico 

WhatsApp: 927252519

TIC - Ficha Teórica 4

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

TIC - Ficha Teórica 4

Enviado por

Direitos autorais:

Formatos disponíveis

TECONOLOGIAS DE INFORMAÇÃO E COMUNICAÇÃO

Unidade II – Desenvolvimento e manutenção de páginas para a

2.1 – Estruturação, criação e manutenção de páginas para a internet

2.2.1 – Aspectos essenciais para a construção de uma página HTML

Professor: Domingos Carlos Dionísio E-mail: domicardio@gmail.com

2.2.2 Estrutura de uma página HTML

Professor: Domingos Carlos Dionísio E-mail: domicardio@gmail.com

2.2.3 Ficheiros HTML

Professor: Domingos Carlos Dionísio E-mail: domicardio@gmail.com

2.2.4 – Caracteres especiais em HTML

Professor: Domingos Carlos Dionísio E-mail: domicardio@gmail.com

2.2.5 – Lista de etiquetas em HTML

Professor: Domingos Carlos Dionísio E-mail: domicardio@gmail.com

Professor: Domingos Carlos Dionísio E-mail: domicardio@gmail.com

Você também pode gostar