1.WEB-Manual Ficha 1

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.
Delegao Regional do Centro

Centro de Emprego e Formao Profissional do Pinhal Interior Norte
Servio de Emprego e Formao Profissional de Arganil
Tecnologias de Informao e Comunicao

UFCD 0792: Criao de pginas para a web em hipertexto

Elaborar pginas para a web, com recurso a hipertexto.
Conceitos gerais de HTML

Ligaes
Formatao de texto com HTML
Imagens
Multimdia na web
Animao na web
Desenho de pginas web
Tabelas
Frames
Mapas
Cursos de Aprendizagem
TIC - UFCD 0792: Criao de pginas para a web em hipertexto
O Formador:
Nuno Santos

Uma pgina Web uma pgina na World Wide Web, com

ligaes de hipertexto que permitem a navegao de uma
pgina, ou seco, para outra. As pginas usam com frequncia
ficheiros grficos associados para fins de ilustrao, e tambm
estes ficheiros podem ser ligaes clicveis.
Uma pgina Web apresentada com o recurso a um navegador,
ou browser, e pode ser construda de forma a recorrer a applets
(subprogramas que correm dentro da pgina), que muitas vezes
fornecem grficos em movimento, interao com o utilizador e
som.
O Formador:
Nuno Santos

Uma dificuldade no desenho e teste de

pginas Web torn-las adequadas a muitos
navegadores e definies, e s diferentes
resolues de ecrs.
O Formador:
Nuno Santos

Para criar um website/pgina so usados

editores de pginas web.
Estes podem ser de dois tipos:
Editores WYSIWYG (j deves ter ouvido falar de um
exemplo Microsoft FrontPage).
Editores HTML (vamos ver de seguida o que o
HTML).
O Formador:
Nuno Santos

Os editores WYSIWYG (What You See Is What You Get) so programas

para a criao e edio de websites que permitem ver na sua janela, o
aspeto com que o site vai ser apresentado aps a sua publicao.
Estes editores permitem ao utilizador, de uma forma acessvel e sem

dominar uma linguagem de programao, desenvolver websites com
aparncia profissional. Todo o cdigo necessrio ao funcionamento do
website automaticamente gerado.
Editores WYSIWYG:
FrontPage;
Dreamweaver;
Easy Website Pro;
BlueVoda;
CoffeeCup;
Etc.
O Formador:
Nuno Santos

Estes editores so, essencialmente, editores de texto, embora alguns

apresentem funcionalidades acrescidas, como a gerao automtica de
cdigo, a insero de cdigos de outras linguagens de programao e
a pr-visualizao da pgina.
A utilizao dos editores de HTML implica um conhecimento prvio da
sintaxe desta linguagem. Com este conhecimento, consegue-se um
maior controlo sobre a criao das pginas web.
Editores HTML:
Notepad++;
Bloco de notas;
Visual Workshop;
Crimson Editor;
Site Builder
tsWebEditor;
LightPad;
Etc.
O Formador:
Nuno Santos

O HTML uma linguagem de programao, utilizada para construir

pginas web.
A sigla HTML significa:
HiperText Markup Language
O HTML foi desenvolvido no incio dos anos 90 e foi sofrendo

sucessivas evolues.
Em 1996 foi estandardizado pela W3C World Wide Web Consortium.
O Formador:
Nuno Santos

O HTML no utilizado isoladamente na programao das pginas

Web. O HTML a base das pginas, e a complement-lo existem
outras linguagens tais como o CSS, o JavaScript, o PHP, entre outras.
O HTML, ao contrrio de outras linguagens de programao, no

compilado nem criado um executvel.
O HTML uma linguagem que interpretada.
O software que interpreta o HTML e mostra o resultado da converso
do cdigo chama-se navegador ou browser.
Exemplos de browsers:
Internet Explorer
Mozilla Firefox
Google Chrome
O Formador:
Nuno Santos

A extenso dos ficheiros de HTML .html ou .htm

Para criar ficheiros em HTML pode utilizar-se, por exemplo, o
Notepad ++ ou o Bloco de Notas, e depois s guardar os
ficheiros com a extenso .html ou .htm
Depois, quando o mesmo aberto por um browser, o browser
vai percorrer todas as linhas de cdigo do ficheiro e vai
transformar as instrues do cdigo em texto (de vrios
tamanhos e cores), imagens, tabelas, hiperligaes, animaes,
etc
Por defeito, na maioria dos sistemas operativos, um ficheiro de
HTML distinguido pela da extenso html ou htm, pelo que,
quando se tenta abrir um ficheiro deste tipo, imediatamente
ativado o browser predefinido, de forma a poder visualiza-lo.
O Formador:
Nuno Santos
10

O Formador:
Nuno Santos
11

Olhando para o esquema da pgina anterior, vejamos, de uma

forma muito resumida, como funciona o acesso as pginas da
Web atravs de um browser.
Do lado do computador que acede ao sistema (que, com o seu

browser, atua como cliente), este comea por (1) enviar um
pedido de um documento HTML a um servidor, atravs do envio
para a rede de um endereo URL (Universal Resource Locator).
O pedido canalizado pela Internet (2) at ao servidor indicado
no endereo.
O servidor, ao receber o pedido (3), procura a pgina indicada
(no caso de esta no ser indicada, e aberta a pgina principal ou
homepage do servidor). Em seguida, a pgina correspondente
resposta (4) enviada para a Internet e, da, (5) conduzida at
ao computador que fez o pedido. Por fim, (6) o browser
apresenta a pgina recebida.
O Formador:
Nuno Santos
12

As instrues bsicas do HTML chamam-se TAGS.

Uma tag uma instruo com uma determinada funo, que vai ser
interpretada pelo browser, e vai ter efeitos sobre a estrutura da
pgina, sobre o texto, sobre uma imagem, uma hiperligao, etc
As tags colocam-se sempre entre os sinais de < (menor) e > (maior).
Dependendo do facto de terem que ser fechadas ou no, as tags

dividem-se em dois grupos:
nicas - quando no existe a tag de fecho.
<TAG>
Duplas quando existe uma tag de fecho, que igual de abertura,

mas tem uma barra / a seguir ao sinal de menor.
<TAG> </TAG>
O Formador:
Nuno Santos
13

Dependendo das opes (argumentos) que as tags podem ter, elas

podem ainda ser classificadas como:
Simples quando so constitudas apenas pelo sinal de <, nome da tag, e
sinal de >
<TAG>
Com argumentos quando a seguir ao nome da tag tm uma ou mais
instrues com indicaes complementares sobre a formatao do texto, do
fundo, dos limites, etc
<TAG argumento1=condio argumento2=condio >
Os argumentos so eles tambm instrues para o browser. Os argumentos
so constitudos pelo nome, seguidos do sinal de igual, e pela condio de
formatao entre aspas. Os vrios argumentos separam-se por um espao.
nome_do_argumento=condio
O Formador:
Nuno Santos
14

Um documento em HTML comea e termina sempre com a tag

<HTML>
.
.
.
</HTML>
Dentro destas tags, temos duas seces bsicas:
HEAD controla as especificaes do cabealho de uma pgina. Uma tag
muito utilizada no HEAD a tag TITLE, que permite escrever o ttulo da
pgina.
BODY controla as especificaes da parte principal de uma pgina.
O Formador:
Nuno Santos
15

<HTML>
<HEAD>
<TITLE>Primeira pgina em HTML</TITLE>
</HEAD>
<BODY>
Esta minha primeira pgina em HTML!
</BODY>
</HTML>
HEAD
BODY
O Formador:
Nuno Santos
16

1.WEB-Manual Ficha 1

Uploaded by

Document Information

Original Description:

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

1.WEB-Manual Ficha 1

Uploaded by

Copyright:

Available Formats

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

Delegao Regional do Centro

Tecnologias de Informao e Comunicao

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

Elaborar pginas para a web, com recurso a hipertexto.

Conceitos gerais de HTML

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

Uma pgina Web uma pgina na World Wide Web, com

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

Uma dificuldade no desenho e teste de

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

Para criar um website/pgina so usados

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

Os editores WYSIWYG (What You See Is What You Get) so programas

Estes editores permitem ao utilizador, de uma forma acessvel e sem

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

Estes editores so, essencialmente, editores de texto, embora alguns

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

O HTML uma linguagem de programao, utilizada para construir

A sigla HTML significa:

HiperText Markup Language

O HTML foi desenvolvido no incio dos anos 90 e foi sofrendo

Em 1996 foi estandardizado pela W3C World Wide Web Consortium.

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

O HTML no utilizado isoladamente na programao das pginas

O HTML, ao contrrio de outras linguagens de programao, no

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

A extenso dos ficheiros de HTML .html ou .htm

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

Olhando para o esquema da pgina anterior, vejamos, de uma

Do lado do computador que acede ao sistema (que, com o seu

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

As instrues bsicas do HTML chamam-se TAGS.

As tags colocam-se sempre entre os sinais de < (menor) e > (maior).

Dependendo do facto de terem que ser fechadas ou no, as tags

Duplas quando existe uma tag de fecho, que igual de abertura,

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

Dependendo das opes (argumentos) que as tags podem ter, elas

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

Um documento em HTML comea e termina sempre com a tag

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL, I.P.

You might also like