Carregar apresentação
A apresentação está carregando. Por favor, espere
1
Criação de Páginas Web A Internet HTML Básico TIC 9º Ano
Apresentação n.º1 A Internet HTML Básico TIC 9º Ano
2
Internet
3
HTML ? TCP/IP Browser HTTP www
4
Como funciona a Internet?
Os intervenientes Cliente & Servidor
5
O servidor envia a página solicitada.
Como funciona a Internet? Client & Server Servidor do Google INTERNET O servidor envia a página solicitada. Pedido da página O Browser faz o pedido. Cliente
6
Recebe código HTML. Cria a página web.
Client - Browser Browser Página Web CÓDIGOHTML Internet Explorer Netscape Mozilla Firefox Opera Etc... INTERNET Recebe código HTML. Cria a página web. SERVER
7
Server - Servidor Executa permanentemente um programa especial Web server Sempre ligado. Contém o site. Aguarda um pedido de acesso a uma página efectuado por um Web browser
8
Modelo Cliente-Servidor da WWW
Solicita página Cliente Web Servidor Web Página solicitada ou Erro Utilizador Documentos Imagens Vídeos Sons,... Protocolo HTTP
9
URL - Universal Resource Locator
Documento HTML Web browser Web server
10
(Protocolo de transferência de hipertexto)
HTTP Hipertext Transfer Protocol Hiper Text Transfer Protocol (Protocolo de transferência de hipertexto) O protocolo HTTP define o modo como são solicitadas e enviadas páginas web na Internet.
11
URL Universal Resource Locator
protocolo endereço documento
12
Domínios com Organização comercial edu Instituição de ensino gov
mil net org … pt br de ... Organização comercial Instituição de ensino Entidade governamental Instituição militar Hosts não administrativos organização não lucrativa … Portugal Brasil Alemanha ... gerais Indicadores geográficos
13
HTML
14
HyperText Markup Language
Linguagem HTML HyperText Markup Language
15
Linguagem HTML Um programa HTML reside num ficheiro de texto simples
(extensão: html ou htm) HTML
16
Linguagem HTML <HTML> <HEAD> <TITLE> </TITLE> </HEAD> <BODY> <P> </P> Um programa HTML inclui uma série de TAGS (marcas) colocadas no texto que se reflectem na página Web.
17
Exemplo de código HTML <HTML> <HEAD>
<TITLE> A minha primeira página na internet </TITLE> </HEAD> <BODY> <P> Olá, o meu nome é Gollum </P> <HR> <P> <BR> </P> </BODY> </HTML>
18
TAGS <HTML> Declara que o texto seguinte define uma página HTML.
A tag </HTML> termina a página.
19
TAGS <HEAD> Define a área de cabeçalho (header) da página.
A tag </HEAD> termina a zona de cabeçalho. <BODY> Delimita o conteúdo que será visualizado na página. A tag </BODY> termina a zona de conteúdo.
20
TAGS <TITLE> Define o título da página que é visualizado na
barra de título do browser. A tag </TITLE> termina o título.
21
TAGS <P> Início de um parágrafo. </P> termina o parágrafo.
<BR> Mudança de linha <HR> Horizontal line/horizontal rule. <COMMENT> Utilizado para comentar o código.
22
TAGS Formatação de Caracteres <B> <I> <U> </B>
Bold Itálico Sublinhado Hiperligações: <A HREF = “ GOOGLE </A>
23
<IMG SRC=“http://www.empresa.com/directório/elefantes.gif”>
TAGS Imagens em documentos HTML <IMG SRC=“
24
Imagem com origem noutro site
HTML Imagem com origem noutro site
25
TAGS <IMG SRC=“gollum.gif">
<IMG SRC=“gollum.gif" BORDER=4> <IMG SRC=“gollum.gif" BORDER=8> <IMG SRC=“gollum.gif" BORDER=16> O qualificador BORDER coloca uma linha Delimitadora à volta da figura, com uma espessura controlada em pixels.
26
TAGS BORDER=4 BORDER=40
27
Uma página Web pode ter no máximo 6 níveis de headings
TAGS Headings (cabeçalhos) <H1> </H1> <H2> </H2> <H3> </H3> <H4> </H4> <H5> </H5> <H6> </H6> Uma página Web pode ter no máximo 6 níveis de headings Nível alto Nível baixo
28
HTML
29
TAGS Imagem de fundo <BODY BACKGROUND = “gollum.jpg”>
30
TAGS Tabelas <table> … </table>
<table border cellspacing=0 cellpadding=5> <tr> <td colspan=2 align=center>Filmes</td> </tr> <td> Irmandade do anel</td> <td> Duas Torres</td> <td> Olá</td> <td> O meu nome é Gollum</td> </table> <table> … </table>
31
TAGS cellspacing – espaço ente células.
cellpadding – espaço entre o texto e a linha. <table border cellspacing=0 cellpadding=5> </table> <tr> <td colspan=2 align=center>Filmes</td> </tr> <tr> <td> Irmandade do anel</td> <td> Duas Torres</td> </tr> <tr> <td> Olá</td> <td> O meu nome é Gollum</td> </tr>
32
TAGS - TABELAS cellspacing – espaço ente células.
cellpadding – espaço entre o texto e a linha. <table border cellspacing=0 cellpadding=5> </table> <tr> <td colspan=2 align=center>Filmes</td> </tr> <tr> <td> Irmandade do anel</td> <td> Duas Torres</td> </tr> <tr> <td> Olá</td> <td> O meu nome é Gollum</td> </tr>
33
1 linha 3 colunas
34
2 linhas 3 colunas
35
3 linhas e 3 colunas
36
3 linhas e 1 coluna
37
5 linhas e 1 coluna
38
5 linhas e 2 colunas
39
União entre células Rowspan Colspan
40
Exemplo 1 rowspan Esta TAG indica que esta célula irão ser unidas duas células ao longo da coluna.
41
Pretendemos unir estas 3 células.
Exemplo 2 Situação inicial: 3 linhas e 5 colunas Pretendemos unir estas 3 células.
42
Exemplo 2 (continuação)
colspan Esta TAG indica que nesta célula irão ser unidas três células ao longo das colunas.
43
Exemplo 3
44
Exemplo 4
45
Standards A visitar… World Wide Web Consortium
Apresentações semelhantes
