Tecnologias Web

Carcteres Especiais


O html Possui 3 caracteres especiais
reservados a linguagem: ”<” , ”>”, e ”&”.

O Html so permite então que esses elementos
sejam escritos através da seguinte notação.
Mais Blocos de Texto


Tag <pre>: Apresenta o texto da mesma
maneira que foi digitado, mantendo quebras
de linhas e tabulações

Tag <blockquode>: Usada para citações
Longas

Tag <address> : Usado para formatar
endereços de Email e referencias de autores
de documentos
Links

Para criação de links utilizamos a seguinte sintaxe
<a href="http://www.html.com.br/">Aqui entra o nome do
link</a> ou <a href=“claudetesa@gmail.com">Falar
com Claudete Sa</a>

O elemento a significa anchor (âncora)

O elemento href significa hypertext reference (referencia
hipertexto)

href especifica o destino de um link, sendo um email,
endereço de internet, arquivo ou destino na página

A página pode ser especificada através de seu endereço
completo (global) ou no mesmo site (local).
Links


Link global: <a href="http://www.google.com.br/">Aqui entra o
nome do link</a>

Link local:

Na mesma pasta: <a href="pagina2.htm">Aqui um link
para a pagina 2</a>

Em um subdiretório: <a
href="subdiretorio/pagina2.htm">Aqui um link para a
pagina 2</a>

Um nível acima: <a href="../pagina1.htm">Aqui um link
para a pagina 1</a>

Ou o endereço(url) completa do arquivo na web
Links


O link ainda pode possuir o atributo title, que especifica
uma dica para o valor do link <a
href="http://www.google.net/" title="Clique aqui para
visitar a homepage do google">Google</a>
Imagens


Para incluir imagen a páginas utilizamos a tag <img>:
<img src="bandeiradobrasil.jpg" alt="Bandeira do
Brasil" />

Podemos incluir apenas 3 extensões de arquivos em uma
página html :

GIF (Graphics Interchange Format)

JPG / JPEG (Joint Photographic Experts Group)

PNG (Portable Network Graphics)
Imagens


As imagens de uma página podem ter origem de um
diretorio do proprio site, ou contidas em um website:
<img src="images/caixa.png">
<img src="http://www.html.com.br/caixa.png">

Imagens também podem conter o atributo title para definir
uma curta descrição da imagem.

Temos ainda três outros atributos importantes, o width e o
height, usados para definir a largura e a altura da
imagem, respectivamente e o align utilizado para alinhar
a imagem a esquerda(left), a direita(right) ou ao
centro(center).
Tabelas


Tabelas NÃO devem ser usadas para
organizar o layout da página.

Padrões

Usabilidade

Acessibilidade

Separação entre layout e conteúdo

Para isso, usaremos CSS
Tabelas


Estrutura de tags utilizada para representar dados
tabulados

As tags básicas para contrução de tabelas são:

<table>: Começa e termina uma tabela

<tr>: Significa table row (linha da tabela) – Começa
e termina uma linha horizontal da tabel

<td>: Significa table data (dados da tabela) –
Começa e termina cada célula contida nas linhas
da tabela
Tabelas
Tabelas
Atributos de Tabelas


Cellpadding: Espaço entre o conteúdo e a borda da
célula.

Cellspacing: Especifica o espaçamento entre as
células da tabela;

Colspan – Collumn Span, utilizada na tag <td> para
indicar quantas colunas estarão contidas numa
célula.

Rowspan – Row Span, utilizada na tag <td> para
indicar quantas linhas estarão contidas em uma
célula.
Tabelas