HTML
Dicas de Uso para a Construção de Páginas Web

O tag ITALIC especifica que o texto deve ser mostrado em itálico.

Por exemplo:

O manual <I>deve ser lido</I> antes de abrir a caixa.

O resultado é similar a:

O manual deve ser lido antes de abrir a caixa.

topo

O tag IMAGE é utilizado para incorporar algum elemento gráfico dentro do documento HTML. Este tag não pode ser utilizado para embutir nenhum outro texto HTML no documento.

O tag IMAGE, um dos poucos tags que são abertos (isto é, não necessita um par para fechar, do tipo </IMG>) possui os seguintes atributos:

ALIGN="left | right | top | texttop | middle | absmiddle | baseline | bottom | absbottom"
ALIGN=left - a imagem se alinha à esquerda e o texto flutua em torno da imagem, pelo seu lado direito.
ALIGN=right - a imagem se alinha à direita, e o texto flutua pelo seu lado esquerdo.
ALIGN=top - alinha-se pelo elemento gráfico mais alto dessa linha.
ALIGN=texttop - alinha-se pelo texto mais alto da linha (quase o mesmo que ALIGN=top).
ALIGN=middle - alinha a linha-base da linha atual com o meio da imagem.
ALIGN=absmiddle - alinha o meio da linha atual com o meio da imagem.
ALIGN=baseline - alinha a parte inferior da imagem com a linha-base da linha atual.
ALIGN=bottom - alinha a parte inferior da imagem com a linha-base da linha atual.
ALIGN=absbottom - alinha a parte inferior da imagem com a parte inferior da linha atual.

ALT="Texto Alternativo"
Permite a inclusão de um texto opcional, como uma alternativa ao elemento gráfico num browser não-gráfico, ou quando o usuário tenha desativado a apresentação dos elementos gráficos, ou ainda para quando o servidor seja muito sobrecarregado, e portanto demora a mostrar as imagens. O Internet Explorer também mostra uma caixa de texto pequena, com o texto alternativo, quando o usuário passa o mouse sobre a imagem

Por exemplo:

<IMG SRC="triangulo.gif" ALT="Atenção:"> Leia as instruções, antes de ligar!.

ISMAP
O atributo ISMAP identifica uma imagem como sendo um mapa de imagem. Mapas de imagem são gráficos nos quais certas regiões são mapeadas para apontar para outros documentos. Clicando em diferentes regiões o usuário pode acessar diversos recursos, desde o mesmo gráfico; é muito utilizado para substituir menus convencionais.

Por exemplo:

<A HREF="http://machine/htbin/imagemap/sample">
<IMG SRC="menu.gif" ISMAP></A>

NOTA : Para que se possa utilizar deste recurso dentro de documentos HTML, o servidor onde o site é hospedado deverá contar com scripts cgi-bin instalados, os quais possam ser acessados pelos documentos HTML através das definições dadas pelos ’hot-spots’ definidso pelo criador da página.

Uma forma mais simplificada de mapa de imagem, conhecida como client-side image maps é também possível. O programa editor de HTML FrontPage da Microsoft possui embutido um sistema desse, desobrigando o usuário a ter acesso à um sistema do outro tipo (também conhecido por server-side image maps), já que em geral as empresas que fornecem hosting gratuito não disponibilizam tais serviços para tais clientes.

SRC="URL da imagem"
O valor do atributo SRC é o URL da imagem a ser mostrada. Sua sintaxe é a mesma que o atributo HREF do tag <A> . SRC é o único atributo obrigatório do tag <IMG>. Elementos Imagem são permitidos dentro de âncoras.

<IMG SRC="warning.gif">Tenha certeza de ler as instruções

O atributo SRC aceita desde URLs total ou parcialmente qualificadas, ou mesmo apenas o nome da imagem (desde que a imagem esteja no mesmo diretório que o documento HTML).

WIDTH=valor / HEIGHT=valor
Os atributos WIDTH e HEIGHT permitem ao browser determinar o layout do texto que vai em torno das imagens, antes da imagem ser baixada, o que reduz significamente o tempo de carga de uma página. O Internet Explorer e o Netscape usam mecanismos de posicionamento de imagem, assim mesmo que o usuário tenha desligado o recurso de "in-line images", o espaço ocupado por essas imagens será preservado, como se lá fossem aparecer tasi imagens (incluindo qualquer texto alternativo existente). Isto garante aos autores de páginas HTML que o layout das páginas ficará como definido, mesmo que o usuário tiver desligado o recurso de mostrar imagens.

BORDER=valor
Este atributo deixa o autor da página controlar a espessura da borda ao derredor da imagem.
Isto é bem útil quando a imagem é utilizada para servir como um hyperlink, no caso em que deve ser ajustado para "0".

VSPACE=valor / HSPACE=valor
Utilizado quando se usa imagens flutuantes (isto é, aquelas que são apresentadas com um atributo ALIGN=left|right) serve para evitar que o texto que flutua em redor da imagem não fique "pressionando" contra ela. VSPACE controla o espaçamento vertical acima e abaixo da imagem, enquanto HSPACE controla o espaçamento horizontal à esquerda e a direita da imagem. O valor a ser colocado representa o número de pixels que terá esses espaçamentos.

LOWSRC
Usando o atributo LOWSRC, é possível usar duas imagens no mesmo espaço físico. A sintaxe é :

<IMG SRC="alta_qual.gif" LOWSRC="baixa_qual.gif">

Browsers que não reconhecem o atributo LOWSRC ignoram calmamente tal atributo e simplesmente mostram a imagem especificada no atributo SRC.
Browsers que suportam esse atributo, entretanto, carregam a imagem de baixa resolução (no exemplo: "baixa_qual.gif") no seu primeiro "passe" do documento. Quando o restante do documento for carregado, e a página formatada, o browser então redesenhará a página, carregando, desta vez, a imagem especificada pelo atributo normal SRC.

Qualquer formato gráfico que o browser suporte pode ser usado, e intercambiado, internamente aos atributos LOWSRC e SRC. O autor pode também especificar valores para width e/ou height no elemento <IMG>, e ambas as versões high-res e low-res da imagem serãowill apropriadamente escaladas para ocupar o espaço definido. Entretanto, se valores para width e height não tiverem sido efetuados, os valores usados para a imagem LOWSRC (isto é: as dimensões daquela imagem) serão utilizadas para re-escalar a imagem SRC.

NAME
Este atributo seta o nome da imagem no documento. Este atributo permite que as imagens sejam acessadasatravés de métodos de scripting (no Netscape 3.0 e acima), pelo referenciamento do controle "Image Object".

Exemplo
O seguinte código HTML produz a mostra indicada mais abaixo:

<IMG ALIGN="left" SRC="mosaic.gif" HSPACE="20" ALT="Mosaic logo"> Mosaic, do <B>N</B>ational <B>C</B>entre for <B>S</B>upercomputing <B>A</B>pplications representa o browser gráfico original no qual o Netscape se baseou.
<BR CLEAR="all">
<HR>
<IMG ALIGN="right" SRC="netscape.gif" HSPACE="20" ALT="Netscape logo"> Netscape, da <B>Netscape Communications</B>, após desenvolvimento inicial baseado no Mosaic, se tornou, mais ou menos o <I>de facto</I> Web browser.
<BR CLEAR="all">
<HR>
<IMG ALIGN="left" SRC="iexplore.gif" HSPACE="20" ALT="Internet Explorer logo">Internet Explorer, da <B>Microsoft </B>, exibe as sérias intenções da Microsoft no mercado de web browser e compete cabeça-a-cabeça com Netscape, oferecendo a mesma funcionalidade ... e às vezes mais.
<BR CLEAR="all">
<HR>

Mosaic, do National Centre for Supercomputing Applications representa o browser gráfico original no qual o Netscape se baseou.

---

Netscape, da Netscape Communications, após desenvolvimento inicial baseado no Mosaic, se tornou, mais ou menos o de facto Web browser.

---

Internet Explorer, da Microsoft, exibe as sérias intenções da Microsoft no mercado de web browser e compete cabeça-a-cabeça com Netscape, oferecendo a mesma funcionalidade ... e às vezes mais.

topo

O tag ORDERED LIST é utilizado para apresentar uma lista de itens, ordenados em seqüência, como uma lista numerada, dando indicação de uma prioridade. A ordem é definida na digitação do programador, ficando a colocação dos números para o browser. Uma lista ordenada pode ser endentada.

Uma lista ordenada deve obrigatoriamente começar pelo tag <OL> e ser seguido pelos tags <LI>, denominados List Item (Item de Lista).

Por exemplo:

<OL>
<LI>Clique no arquivo desejado para download.
<LI>Na caixa de diálogo digite o nome do arquivo.
<LI>Clique 'OK' para dar download no arquivo p/o drive.
</OL>

Aparece como:

1. Clique no arquivo desejado para download.
2. Na caixa de diálogo digite o nome do arquivo..
3. Clique 'OK' para dar download no arquivo p/o drive.

Como mencionado anteriormente, as listas aparecem numeradas, começando por 1, passando por 2, 3, etc.. Entretanto é possível alterar tanto o tipo de numeração, quanto o valor do primeiro elemento da lista.

O atributo TYPE permite alterar o tipo de numeração:

(TYPE=A) - Letras em Maiúsculas; ex.: A, B, C ...
(TYPE=a) - Letras em Minúsculas; ex.: a, b, c ...
(TYPE=I) - Numerais Romanos em Maiúsculas; ex.: I, II, III ...
(TYPE=i) - Numerais Romanos em Minúsculas; ex.: i, ii, iii ...
(TYPE=1) - ou os Números normais; ex.: 1, 2, 3 ...

O atributo START, que deve ser sempre informado em números normais, permite alterar o valor do primeiro elemento da lista:

Por exemplo:

<OL TYPE=a START=3>
<LI>Clique no arquivo desejado para download.
<LI>Na caixa de diálogo digite o nome do arquivo.
<LI>Clique 'OK' para dar download no arquivo p/o drive.
</OL>

Aparece como:

3. Clique no arquivo desejado para download.
4. Na caixa de diálogo digite o nome do arquivo.
5. Clique 'OK' para dar download no arquivo p/o drive.

NOTA : o atributo TYPE e o atributo START usados nos tags <OL> e <LI> são suportados apenas pelos browsers Netscape e Internet Explorer.

topo