Mostrando postagens com marcador HTML. Mostrar todas as postagens
Mostrando postagens com marcador HTML. Mostrar todas as postagens

sábado, 18 de junho de 2011

Como descobrir o IP no Windowns 7

images
O endereço IP  (Internet  Protocol, ou Protocolo de Internet, em Português), é um número responsável por identificar os computadores em um rede local ou pública. Cada computador deve possuir um endereço IP diferente, o que faz com que esse número seja semelhante a uma identidade. Mas, como fazer para descobrir o número IP do seucomputador? Acompanhe os passos desta dica e descubra.
Passo 1. Abra o Menu Iniciar e clique em “Painel de Controle”.
Passo 2. Cique na opção “Rede e Internet” e, em seguida, em “Central de Rede e Compartilhamento”.
11
Passo 3. Na coluna de menus à esquerda, clique em “Alterar as configurações do adaptador”.
2
Passo 4. Localize a conexão desejada, clique com o botão direito do mouse sobre ela e, em seguida, clique em “Status”.
3
Passo 5. Na janela que se abrir, clique em “Detalhes…” para verificar os Detalhes da Conexão de Rede.
4
Agora é só conferir os itens que desejar. Além do endereço IP, também são exibidas informações relativas ao Gateway Padrão, Servidor DNS e muitos outros itens.

sexta-feira, 17 de junho de 2011

Subscriçao de um Serviço

Subscrição de um serviço 
 
Depois de termos construído um site em HTML, concerteza iremos querer que ele seja publicado mesmo na Web, para que as pessoas possam visitar a nossa página. Existem inúmeros serviços de ‘hosting’, para muitos preços, mas a maioria de nós irá querer subscrever um serviço gratuito, ‘pago’ pela publicidade que quase sempre somos obrigados a consentir que seja colocada na nossa página ou enviada para o nosso endereço de e-mail.
Vamos então analisar como se processa a subscrição de dois dos serviços mais populares, o Terravista (português) e o Xoom (americano).
a) o Terravista

Caso raro, o Terravista não exige publicidade nas páginas de quem decide ter o seu site aqui alojado. No entanto, as páginas terão de ser em português (embora possam ter também uma versão noutra língua). Oferecem 7MB, o que é espaço mais suficiente para um primeiro site.
Iremos começar por nos deslocarmos a www.terravista.pt. A opção óbvia a escolher é ‘crie a sua página’.
 
 
Depois de lidas e aceites as regras, somos deparados com o formulário de inscrição. Antes de o preenchermos, devemos fazer uma pesquisa das moradas disponíveis.
 
 
Seremos levados a seleccionar uma das ‘praias’ do Terravista. Escolhemos uma do nosso agrado e seremos contemplados com uma longa lista de números. Esta irá ser a nossa morada, por isso devemos clicar num numero fácil de decorar. Seremos levados de volta ao formulário, que já terá preenchida a morada escolhida.
 
 
Devemos preenche-lo, e ter especial atenção à ‘Identificação para FTP’ para mais tarde podermos enviar a nossa página, assim como devemos ter muito cuidado para não nos enganarmos ao escrever o nosso endereço de correio. Devemos também escolher um ‘farol’ de acordo com o tema da nossa página. O resto é bastante simples, e quando acabarmos devemos submeter o formulário.Devemos depois confirmar a inscrição, e devemos então anotar a nossa morada. Podemos visitá-la e verificar que temos o nosso espaço já pronto:
 
 
Passado alguns minutos iremos poder verificar a nossa caixa de correio electrónico, onde iremos receber um e-mail com a password necessária para enviar o site que construímos. Veremos como o fazer no tutorial: Publicação na Internet via FTP.

Publicaçao na Internet via FTP

Após termos criado a nossa página nos termos inscrito num serviço de alojamento, o passo final consiste no envio dos ficheiros que constituem o nosso site para o servidor de alojamento. A maneira mais comum de fazer isto é através de FTP, ou File Transfer Protocol.

Existem inúmeros programas de FTP, e vamos aqui ver como utilizar as contas que subscrevemos no Apêndice A utilizando dois programas bem diferentes, o WS_FTP e o SmartFTP. Existem muitos outros, mas não diferem muito de um destes que vamos ver.

a) o Smart FTP


Vamos ver como aceder à conta que criamos no Terravista utilizando este programa. Ao entrar veremos o seguinte ecrã:
 
 
Devemos preencher os campos. Em ‘URL’ iremos escrever ‘ftp.terravista.pt’, e em ‘Login’ o nome que escolhemos ao subscrever os serviços do Terravista. A password é aquele que nos foi enviada por e-mail após a subscrição. O ‘Port’ deverá continuar em ‘21’ e devemos ter a caixa ‘Anonymous’ desligada.Carreguemos então no botão ‘Connect’, o primeiro da barra de ferramentas.

Após alguns momentos, iremos ver o conteúdo do nosso site. Se ainda não tivermos enviado ficheiros, provavelmente irá conter apenas um ficheiro ‘index.html’ com o anuncio de que a página está em construção, fornecido pelo Terravista.
 
 
Devemos abrir então o Explorador do Windows (ou Windows Explorer para quem tiver o sistema operativo em Inglês), e abrir a pasta onde gravámos os ficheiros do nosso site. Seleccionando os ficheiros, devemos arrastá-los para dentro da janela do SmartFTP que exibe o conteúdo do nosso site.
 
 
Podemos ser avisados de que algum ficheiros já existe, e podemos escolher ‘Overwrite’ para o substituir por aquele que enviamos. Após o envio de todos os ficheiros podemos abrir o nosso browser e escrever o endereço do nosso site para verificar a sua presença na Web

b) o WS_FTP


Este é um dos mais antigos e comuns clientes de FTP. Vamos ver como aceder à nossa subscrição no Xoom.

Ao abrir o WS_FTP, é nos apresentada uma caixa de diálogo que nos irá permitir gerir vários perfis de FTP. Iremos carregar em ‘New’ para criar um novo.
 
 
Devemos preencher os dados como vemos na imagem. ‘ftp.xoom.com’ é o ‘Host Name’, o ‘User ID’ é o endereço que escolhemos para a nossa página, e a password é também a escolhida. ‘Anonymous Login’ deverá estar desligado, e podemos, se quisermos, escrever o directório onde gravámos o site em ‘Local PC’. Posto isto, carreguemos em ‘Save’, e depois em ‘OK’.
Após uma curta espera teremos no lado esquerdo da janela o conteúdo do nosso disco, e no lado direito o conteúdo do servidor de FTP.

 
 
Caso seja necessário, devemos navegar no nosso disco até à pasta onde temos o site gravado. Para transferir os ficheiros, nada mais simples: Basta escolher os ficheiros desejados e carregar no botão com a seta no sentido desejado, neste caso, a seta da esquerda para a direita.
Após transferirmos os ficheiros, podemos deslocar-nos à morada do nosso site com um browser e verificar que está online.

 
 
Como foi dito antes, o Xoom insere automaticamente uma frame com publicidade na nossa página. Tirando isso, o resto deverá estar operacional.

Divulgue seu site na Internet

Divulgação de uma página 
 
Após termos uma página na Internet, provavelmente iremos querer que ela tenha visitas. Podemos dar o endereço aos nossos amigos, mas esse talvez não seja o melhor método de atrair visitas (a não ser que tenhamos mesmo muitos amigos). Torna-se assim importante divulgar a nossa página. Podemos pedir uma link a sites semelhantes, mas o melhor método mesmo é a sua inclusão num ‘search engine’. Vamos aqui ver como podemos divulgar a nossa página no AEIOU português e no Altavista, que funciona a nível internacional. Iremos ainda abordar os ‘crawlers’, que são uma espécie de robots que procuram páginas novas na Web, e por isso devemos ter sempre a nossa página preparada para os receber, o que iremos ver como fazer.
 
a) o AEIOU

Em www.aeiou.pt temos um dos mais populares motores de busca portugueses. Para acrescentarmos o nosso site, devemos, uma vez na página principal do AEIOU, clicar no link ‘Adicionar’ no canto superior esquerdo.

Surge então um formulário que deve ser preenchido com atenção. Em ‘Site’ devemos escrever o título do site, e em ‘URL ‘ é que escrevemos o seu endereço. Devemos escolher a categoria onde o nosso site se enquadra melhor, e, muito importante, escolher não mais que meia-dúzia de ‘keywords’. Estas são muito importantes, pois são as palavras que se devem relacionar com o nosso site quando alguém faz uma pesquisa. Devem ser palavras simples mas o menos ambíguas possível. Devemos ainda preencher o nosso nome, endereço de e-mail e atribuir uma password, para que mais tarde possamos mudar o registo da nossa página no AEIOU, se necessário.

Depois de submetidos os dados, a nossa página estará automáticamente presente na base de dados do AEIOU.
 
b) o Altavista: crawlers e ‘meta-tags’

O Altavista da Compaq, acessível em www.av.com, orgulha-se de ser o maior motor de busca do mundo. Podemos adicionar as nossas páginas a este ‘search engine’, mas a grande maioria das páginas presentes nas suas bases de dados são adicionadas através de ‘crawlers’. Estes ‘crawlers’ são uma espécie de pequenos programas robot – ‘bots’ que procuram constantemente na web páginas não presentes nas bases de dados do Altavista.
Porém, não são robots inteligentes, e por isso um bom criador de sites fornece a informação necessária para que os ‘crawlers’ adicionem correctamente as palavras-chave e a descrição do nosso site ao Altavista, ou a qualquer outro motor de busca baseado neste sistema. Caso esta informação não existe, serão adicionadas as primeiras linhas de texto do nosso site, o que não é muito desejável.
Para isso, devemos inserir o seguinte no início da primeira página do nosso site (normalmente ‘index.htm’ ou ‘index.html’):

<HTML>
<HEAD>
<TITLE>Eduardo Sousa</TITLE>

<META NAME="keywords" CONTENT="arte digital poesia musica">
<META NAME="description" CONTENT="Página pessoal de Eduardo Sousa">

</HEAD>


Estes ‘tags’ <META> servem para inserir informação invisível ao visitante, mas muito útil a outros agentes da Internet, como os ‘crawlers’. Um ‘bot’ ao ler esta informação irá indicar ao Altavista o endereço onde encontrou o nosso site, assim como o título (que lê em <TITLE>) e as outras informações que normalmente fornecemos aos ‘search-engines’: as ‘keywords’ e a descrição do site.

Para acrescentarmos a nossa página ao Altavista então, temos apenas que, uma vez tendo inserido os ‘meta-tags’, indicar o endereço da página de modo a ‘obrigar’ o ‘crawler’ a passar por lá. Fazemos isso a partir da link ‘Add a page’, presente no fundo da página principal do Altavista. Depois, basta inserir o endereço e esperar que o ‘crawler’ faça o trabalho por nós

Lista de Tags comuns


'TAGS' BÁSICOS

<html></html>
Inicia/termina um documento em HTML.
<head></head>
Define a àrea de cabeçalho, com elementos não visualisáveis na página.
<body></body>
Define a área visível do documento.
  CABEÇALHO

<title></title>
Coloca o nome da página na barra de título da janela.

ATRIBUTOS DO CORPO

<body bgcolor=?>
Cor de fundo.
<body text=?>
Cor de texto.
<body link=?>
Cor das links.
<body vlink=?>
Cor das links previamente visitadas.
<body alink=?>
Cor da link activa.
  TEXTO

<b></b>
Texto carregado.
<i></i>
Texto em itálico.
<tt></tt>
Texto estilo máquina de escrever, monoespaçamento.
<font size=?></font>
Tamanho das letras.
<font color=?></font>
Cor das letras.
<font face=?></font>
Define a fonte utilizada.


LINKS

<a href="URL"></a>
Cria uma hiperligação.
<a href="mailto:EMAIL"></a>
Cria uma link para o envio de correio.
<a name="NOME"></a>
Cria um 'alvo' dentro de uma página.
<a href="#NAME"></a>
Faz a ligação a um 'alvo' presente dentro da mesma página.
  FORMATAÇÃO

<p></p>
Define a área de um parágrafo.
<p align=?>
Alinhamento de um parágrafo.
<br>
Insere uma quebra de linha.
<div align=?>
'Tag' genérico utilizado para formatar blocos de texto.
  GRAFISMO

<img src="FICHEIRO">
Insere uma imagem.
<img src="FICHEIRO" align=?>
Alinha uma imagem em relação ao resto do texto.
<img src="FICHEIRO" border=?>
Define a borda da imagem.
<hr>
Insere uma linha horizontal.
  TABELAS

<table></table>
Cria uma tabela.
<tr></tr>
Linha de uma tabela
<td></td>
Célula individual numa linha.
  ATRIBUTOS DAS TABELAS

<table border=#>
Borda à volta de cada célula.
<table cellspacing=#>
Espaço entre as células.
<table cellpadding=#>
Margem interior das células.
<table width=# or %>
Largura da tabela - em pixels ou percentagem.
<tr align=?> or <td align=?>
Alinhamento horizontal do conteúdo das células.quot;left", "center" ou "right")
<tr valign=?> or <td valign=?>
Alinhamento vertical do conteúdo das células.("top", "middle" ou "bottom")
<td colspan=#>
Numero de colunas 'percorridas' por uma célula.
<td rowspan=#>
Numero de linhas 'percorridas' por uma célula.
  FRAMES

<frameset></frameset>
Define o conjunto de frames. Surge antes de <body> num documento com frames.
<frameset rows="valor,valor">
Define as linhas num conjunto de frames. Valor pode ser em pixels, percentagem ou * (o resto / proporção).
<frameset cols="valor,valor">
Define as colunas num conjunto de frames. Valor pode ser em pixels, percentagem ou * (o resto / proporção).
<frame>
Define uma unica frame. Surge dentro de <frameset>.
<noframes></noframes>
Área onde é inserido o conteúdo visivel em browsers que não suportam o uso de frames.
  ATRIBUTOS DE UMA FRAME

<frame src="URL">
Especifica o documento HTML a ser exibido na frame.
<frame name="nome">
Dá um nome à frame de modo a poder ser 'linkada' a partir de outras frames.
<frame scrolling=VALOR>
Define se a frame tem barra de scroll. VALOR pode ser "yes", "no" ou "auto".
<frame noresize>
Impede o visitante de redimensionar a frame.

O A-B-C da Internet


Em português dá-se o nome de ''arroba'' a este símbolo. A arroba é utilizada nos endereços de Email (redacao@truquesedicas.pt) e significa ''at'' (em).
Attachment 
Em Português: Anexo. A frase ''esta mensagem de Email tem um attachment'' significa que a mensagem tem um ficheiro em anexo. Um ficheiro anexo a uma mensagem é normalmente representado por um ''clip''.
Backbone 
Se traduzirmos livremente esta palavra para Português ficamos com ''espinha dorsal''. Podemos dizer, por exemplo, que as ligações entre todos os pontos de acesso de um fornecedor de acesso Internet formam um backbone uma vez que esse conjunto de ligações é essencialmente a ''espinha dorsal'' de toda a rede do fornecedor de acesso.
Bit (Binary Digit)
O BiT é a mais pequena unidade utilizada para medir quantidades de informação. Um BiT é um algarismo (0 ou 1) e a um conjunto de oito bits dá-se o nome de byte. Nos textos electrónicos, por exemplo, cada letra é representada por um byte, ou seja, um conjunto de oito bits.
Bookmark 
Em português: Favoritos ou, e se traduzirmos à letra, marcador de livro. A função Bookmark (favoritos) encontra-se normalmente nos browsers (o Internet Explorer ou o Netscape Navigator) para marcar uma página que se pretende visitar mais tarde. A página ''marcada'' é adicionada à lista de favoritos que é acessível no menu correspondente.
Browser 
O Browser é o nome genérico do programa que nos permite navegar na Internet. Os mais populares são o Internet Explorer e o Netscape Navigator (pode instalar as versões mais recentes de ambos a partir do seu IP-ROM).
Bug 
Um bug é um erro num programa (software) ou mesmo num equipamento (hardware) que provoca uma acção inesperada. Um bug pode ser uma falha de segurança num programa, a incapacidade de lidar com datas posteriores a 31 de Dezembro de 1999, entre muitas outras falhas.
Byte 
O Byte é uma unidade que permite medir a quantidade de informação e é, normalmente, o conjunto de oito bits. Uma letra num texto electrónico, por exemplo, ocupa um byte.
CGI (Common Gateway Interface)
CGI é a abreviatura de Common Gateway Interface, uma tecnologia utilizada para fazer a ''ponte'' entre o browser e as aplicações de servidor. Os programas de servidor a que damos o nome de CGIs são utilizados para desempenhar inúmeras tarefas, como por exemplo processar os dados inseridos em formulários, mostrar banners publicitários, permitir o envio de notícias para amigos, etc.
Cache 
A cache é a parte da memória do computador ou do disco rígido que armazena dados frequentemente requisitados, de modo a aumentar a rapidez de acessibilidade. Os browsers mais populares (Internet Explorer e Netscape Navigator) criam um espaço no disco para utilizar como ''cache'' para que as páginas web já visitadas pelo utilizador fiquem guardadas e apareçam mais rapidamente quando as volta a visitar.
Comércio Electrónico 
Este é o nome genérico que se dá à compra e venda de bens e serviços via Internet. A todo o tipo de comércio que ocorra na Internet dá-se este nome.
Cookies 
Se traduzirmos à letra significa ''bolachas''. Os cookies são pequenos ficheiros criados pelo Internet Explorer (ou Netscape Navigator) a pedido do web site que se está a visitar. Um cookie contém normalmente um número de série. Quando se visita de novo o web site que gerou o cookie, o servidor do web site repara que já existe um cookie e assim percebe que o utilizador já visitou o site. O servidor apenas pode lêr o número de série contido no cookie e nada mais. O servidor não pode saber quem o utilizador é nem pode obter qualquer tipo de informações pessoais.
Correio Electrónico (Email)
O Email, também conhecido por correio electrónico, é o envio e recepção de mensagens electrónicas através de um programa apropriado. Para enviar uma mensagem para um amigo que possui um endereço de correio electrónico, basta utilizar um programa de Email (por exemplo o Outlook Express que pertence ao pacote de programas incluidos no Internet Explorer) e digitar o endereço do destinatário, o assunto e o texto da mensagem. Quando se efectua o envio da mensagem, ela demora, normalmente, poucos segundos a chegar à "caixa" de Email do destinatário. Da próxima vez que o destinatário se ligar à Internet e verificar a caixa de Email, recebe a mensagem.
Crash 
Traduzido à letra ''crash'' significa ''choque'' ou ''acidente''. Quando o computador fica paralizado diz-se que ocorreu um ''crash''. Este termo pode também ser aplicado a um programa individualmente, isto é, se um dos programas ficou paralizado mas o resto do PC está funcional, diz-se que o programa ''crashou''. Muitos utilizadores já utilizam o verbo ''crashar'' embora esta palavra não faça oficialmente parte do vocabulário português.
Domínio 
Também chamado sub-domínio, é o nome dado ao computador no qual está alojado o servidor das suas páginas. Este domínio pode ser real, se o computador apenas tiver um nome, ou pode ser virtual, se o computador for conhecido por diversos nomes, i.e., se nele residirem vários domínios. Em linguagem corrente, Domínio é utilizado muitas vezes como o nome que identifica uma entidade (organização, marca, produto) na Internet. O domínio é composto por um nome e por um sufixo (ex. ip.pt).
Download 
Traduzido à letra significa ''carregar para baixo''. Quando se está a transferir um ficheiro de um web site para o computador está a fazer-se um download.
Encriptar 
Procedimento que codifica o conteúdo de uma mensagem ou ficheiro, impedindo deste modo a sua leitura por utilizadores não autorizados. São técnicas muito utilizadas para proteger e assegurar a privacidade e segurança na transferência de dados confidenciais.
Endereço IP
Um endereço IP é uma sequência de algarismos (exemplo: 195.23.110.161) que representa o endereço de um computador que está ligado à Internet. A cada computador ligado à Internet corresponde um endereço IP. Os endereços sob a forma www.nome.pt são utilizados para não ser necessário decorar números. Ao endereço www.nome.com corresponde um endereço IP.
FAQ (Frequently Asked Questions)
Em Português: Perguntas Frequentes. Uma FAQ (Frequently Asked Questions), é um conjunto de respostas às perguntas mais frequentes, colocadas pelos utilizadores de determinado site, produto ou serviço.
FTP (File Transfer Protocol)
FTP significa "File Transfer Protocol". Através deste protocolo é possível efectuar a transferência de ficheiros pela Internet de uma maneira fiável. Actualmente existem programas que utilizam exclusivamente este protocolo, para que se possam efectuar transferências de ficheiros de uma forma prática. A função mais comum do FTP é o "download" de ficheiros, embora muitos programas já executem esta função, se bem que utilizem, normalmente, um protocolo mais lento e menos fiável do que o FTP. Com este tipo de programas também é permitido enviar ficheiros (upload) para áreas de FTP. O upload é mais utilizado para colocar páginas on-line.
Firewall 
Traduzindo à letra Firewall significa ''Parede de Fogo''. Uma firewall é um programa, um equipamento ou uma combinação dos dois que protege uma rede de computadores (de uma empresa por exemplo) para que os utilizadores de internet não possam aceder a zonas confidenciais da rede protegida. Uma firewall consegue também limitar aquilo que os utilizadores da rede protegida conseguem fazer para fora (impedindo o acesso a determinados web sites, ou limitando o uso de programas de video-conferência, etc).
Freeware 
Em português: programa (software) gratuito. Um programa do tipo Freeware pode ser utilizado sem qualquer pagamento e sem nenhuma restrição.
GIF (Graphics Interchange Format)
um tipo de ficheiro com formato de imagem. Muitas das imagens visualizadas nas páginas Web estão em formato GIF. Estes ficheiros têm a extensão .gif
HTML (Hyper Text Markup Language)
À linguagem utilizada para produzir páginas web dá-se o nome de HTML, ou seja, produzir um ficheiro html é sensivelmente a mesma coisa que produzir uma página web.
HTTP (HyperText Transfer Protocol)
O ''protocolo'' utilizado para navegar na web é o http, isto é, ao escrever ''http://www.nome.pt/index.html'' estamos a dizer ao browser para transferir o ficheiro index.html, que está no servidor www.nome.pt, com o protocolo http.
Hacker
Em termos gerais um hacker é alguém que gosta de explorar todos os aspectos dos sistemas informáticos, incluindo sistemas de segurança. Hackar é um verbo normalmente utilizado para descrever a violação de um sistema informático. A palavra ''hacker'' significa, para a maioria dos utilizadores, a pessoa que viola a segurança de sistemas informáticos.
Hiperligação 
Esta é a tradução literal de ''Hiperlink''. As palavras ou imagens de uma página web nas quais é possível clicar chamam-se links, hiperlinks ou hiperligações.
Home Page 
Este termo quer normalmente dizer ''página principal de um web site''. A Home Page de um web site é a sua página principal. A home page de um utilizador pode ser a sua página pessoal, mas pode também ser a página que carrega quando se abre o browser (Internet Explorer ou Netscape Navigator).
IRC (Internet Relay Chat)
O IRC (Internet Relay Chat) é o serviço que permite conversar com outros utilizadores em tempo real, em modo de texto. Ao utilizar um programa para este tipo de serviços (por exemplo o mirc) pode escolher um de muitos servidores de conversa disponíveis, um "nick" (pseudónimo) que pode ser o seu nome verdadeiro ou um nome inventado, e de seguida escolher um dos muitos canais (também chamados de salas) para conversar com os utilizadores que aí estiverem presentes. Tudo aquilo que escrever numa determinada sala pode ser lido pelos utilizadores da sala, e tudo aquilo que os outros utilizadores escreverem pode ser lido por si. É ainda possível conversar em privado com um só utilizador.
ISDN (Integrated Service Digital Network)
Em Portugal as linhas telefónicas do tipo ISDN são conhecidas pelo nome RDIS. Este tipo de linhas telefónicas permitem ligações à Internet a velociades de 64 kbits/segundo. Para ligar o computador a uma linha RDIS utiliza-se uma placa apropriada ou um ''modem RDIS''. As linhas RDIS têm outras utilizações (para além de serem utilizadas para fazer chamadas telefónicas normais) e têm uma assinatura mensal superior à linha telefónica tradicional. Na linha RDIS o preço dos impulsos e a sua duração é igual à linha telefónica tradicional.
ISP (Internet Serviçe Provider)
Em Português: Fornecedor de Acesso Internet. As empresas através das quais os utilizadores se ligam à Internet são Fornecedores de Acesso Internet.
Internet 
A Internet é a rede das redes, que é formada por um vasto conjunto de redes independentes ligadas entr si. A Internet liga computadores de diferentes tipos e dimensões e permite a comunicação entre pessoas de diferentes países, raças e culturas.
Intranet
A uma rede interna (dentro de uma empresa ou residência) que tem um servidor web internet e outras ferramentas de comunicação dá-se o nome de Intranet. Esta rede pode, naturalmente, estar ligada à Internet, mas o facto de possuir um web site interno apenas disponível para os funcionários da empresa é o suficiente para se dizer que é uma Intranet.
JPEG (Joint Photograhic Experts Group)
É um tipo de ficheiro com formato de imagem. Muitas das imagens visualizadas nas páginas Web estão em formato JPEG. Estes ficheiros têm a extensão .jpg
Java 
Linguagem de programação que possibilita criar interactividade em páginas Web. A utilização de pequenos programas em Java também designados por Applets, permite criar diversas funções, tais como, animações, cálculos e outros truques.
kbps 
Abreviatura de ''kilobits per second'' ou seja, kilobits por segundo. Esta é a unidade de medida da velocidade de transmissão da informação. Quando se diz que um modem tem a velocidade de 33.6 kbps significa que ele é capaz de transferir 33.6 kilobits de informação por segundo.
Kilobyte 
É uma unidade que permite medir a quantidade de informação. Um kilobyte equivale a 1024 bytes (e não a mil bytes como a palavra pode kilo pode sugerir).
Largura de Banda (Bandwidth)
Velocidade máxima que uma determinada ligação permite. Por exemplo: ao ligar o computador ao fornecedor de acesso internet com um modem de 33.6 kbps estabelece-se uma ligação cuja largura de banda é 33.6 kbps. Ao transferir um ficheiro a velocidade máxima que é possível atingir é de 33.6 kbits por segundo.
Mailing List 
Em português: Lista para envio de Correio. Uma mailing list é uma lista à qual o utilizador pode adicionar o seu endereço de correio electrónico para receber mensagens do moderador da lista e/ou dos restantes membros. Alguns web sites têm mailing lists para manter os seus membros informados das novidades e nas quais o utilizador se pode inscrever digitando o endereço de Email numa pequena ''caixa'' presente no web site.
Megabyte 
É uma unidade que permite medir a quantidade de informação. Um megabyte equivale a 1024 kilobytes.
Modem 
Esta palavra resulta da junção das palavras modulador e desmodulador. Dá-se o nome de modem ao aparelho que transforma dados analógicos em digitais e vice-versa. O modem é o pequeno aparelho (ou placa) que liga o computador à linha telefónica para estabelecer a ligação com o fornecedor de acesso Internet.
Netiquette 
Em português: Netiqueta (etiqueta na Internet). Ao conjunto de regras de boas maneiras para utilização da Internet dá-se o nome de Netiqueta.
Newsgroups 
Em Português: grupos de notícias ou grupos de discussão. Os Newsgroups permitem, aos utilizadores de todo o mundo, trocar ideias entre si através de mensagens que todos podem ler. Imagine, por exemplo, um placard na cafetaria de uma escola que está visível a todos. Se colocar uma mensagem todos os alunos a podem ler. Qualquer um pode, da mesma forma, colocar uma mensagem em resposta à sua. Agora imagine que existe um placard para cada assunto diferente. Os newsgroups funcionam de uma forma muito semelhante.
POP (Point of Presence)
Em Português: Ponto de Presença. Um POP é, normalmente, um servidor de um fornecedor de acesso internet instalado numa determinada localidade para permitir a ligação por chamada local. Se um fornecedor de acesso Internet tem um POP em Coimbra isso quer dizer que os utilizadores de Coimbra se podem ligar ao fornecedor de acesso por chamada local.
Plug-in 
Utilitário que aumenta a funcionalidade de um determinado programa. Para conseguir navegar em páginas web com funcionalidades especiais é necessário instalar os ''plug-ins'' no browser (Internet Explorer ou Netscape Navigator) correspondentes a essas funcionalidades.
Proxy 
Um servidor proxy está encarregue de ''navegar'' nas páginas em nome do utilizador e guardar essas página no seu disco, ou seja, se o Internet Explorer do utilizador estiver configurado para navegar com o ''proxy'' do fornecedor de acesso, as páginas visitadas pelo utilizador ficam guardadas no proxy. Quando um outro utilizador pretende visitar a página que já foi visitada pelo primeiro utilizador, o acesso à página é mais rápido porque já estava guardada no proxy do fornecedor de acesso.
QuickTime 
O QuickTime é o nome de um pequeno programa (também disponível em formato de plugin) que permite visualizar videos neste formato criado pela Apple. Da mesma forma que para ouvir músicas no formato RealAudio é necessário instalar o Real Player, para ver vídeos no formato QuickTime é necessário instalar o Quicktime ''player''.
RDIS (Rede Digital Integradora de Serviços)
Tipo especial de linhas telefónicas comercializado, em Portugal, pela Portugal Telecom. Este tipo de linhas telefónicas permitem ligações à Internet a velociades de 64 kbits/segundo. Para ligar o computador a uma linha RDIS utiliza-se uma placa apropriada ou um ''modem RDIS''. As linhas RDIS têm outras utilizações (para além de serem utilizadas para fazer chamadas telefónicas normais) e têm uma assinatura mensal superior à linha telefónica tradicional. Na linha RDIS o preço dos impulsos e a sua duração é igual à linha telefónica tradicional.
Router 
Computador ou Software que interliga duas ou mais redes. Os Routers passam todo o seu tempo à procura dos endereços de destino dos pacotes que por ele passam, encaminhando-os para outros endereços de destino, de acordo com o protocolo utilizado. Para que uma rede de computadores, por exemplo de um escritório, se ligue à Internet é necessário instalar um router (o aparelho) ou um programa que desempenhe o papel de router (instalado no servidor da rede).
Servidor (Server / Host)
Computador central, que administra e fornece informação a outros computadores-clientes. Existem servidores Web que disponibilizam páginas online, servidores de mail que distribuem mensagens, etc.
Shareware 
Tipo de programa (software) que é disponibilizado para que o utilizador o possa testar e que necessita de um registo (pagamento) para que se possa utilizar após o período inicial de testes. Existem muitos programs disponíveis na Internet que são deste tipo.
Spam 
Correio electrónico ''lixo''. As mensagens publicitárias que são enviadas para muitos utilizadores ao mesmo tempo e que não foram pedidas por esses utilizadores são consideradas spam. A maioria dos fornecedores de acesso proíbe este tipo de práticas, e os utilizadores que enviarem mensagens publicitárias a muitos utilizadores que não as pediram podem ser banidos do fornecedor de acesso.
Streaming 
Este termo tem origem na palavra ''stream'' que em português significa ''corrente'' (no sentindo de corrente de um rio por exemplo). Na Internet este termo aplica-se sobretudo ao vídeo e audio que o utilizador começa de imediato a ver mesmo quando o ficheiro não chegou todo ao computador. Ou seja, o vídeo/som começa a ''chegar'' ao computador do utilizador e é de imediato colocado no monitor, e à medida que o ficheiro continua a ser transferido o seu conteúdo continua a ser mostrado. O audio e vídeo dos eventos que são transmitidos em directo via Internet utilizam esta tecnologia.
TCP/IP (Transmission Control Protocol/Internet Protocol)
É o protocolo de comunicação básico da Internet, para interligar redes cujos componentes usam sistemas operativos distintos. Podemos dizer que o TCP/IP é o conjunto de regras técnicas que os computadores utilizam para enviar e receber informações na Internet e nas Intranets.
TIFF (Tag Image File Format)
É um tipo de ficheiro com formato de imagem. Este formato é muito pouco utilizado em páginas web mas é bastante popular por entre os designers e por aqueles que necessitam de gravar uma imagem com uma boa ''resolução''. Estes ficheiros têm a extensão .tif
Telnet 
Este é um dos serviços da Internet menos conhecidos e permite efectuar a ligação a um computador em modo de texto e trabalhar nesse mesmo computador como se o utilizador estivesse sentado à sua frente. Ao utilizar um programa apropriado o utilizador efectua uma ligação Telnet ao computador pretendido e digita comandos (normalmente unix) para trabalhar no computador.
URL (Universal Resource Locator)
O endereço de uma página web que se escreve na barra de endereços do browser (Internet Explorer por exemplo) é um URL. Aos endereços de ftp completos (ftp://nomedoservidor.com/ficheiro.zip) também se dá o nome de URL. Um URL é composto pelo nome do protocolo (por exemplo 'http://') o nome do servidor (www.servidor.pt) e nome do ficheiro (/index.html). Quando o url não tem o nome do ficheiro (exemplo: http://www.servidor.pt/) o servidor assume que se está a pedir o ficheiro 'index.html'.
Upload 
Upload é o processo inverso de download, isto é, consiste no acto de transferir ficheiros do seu computador para um computador remoto.
VPN (Virtual Private Network)
Quer dizer Rede Privada Virtual. Normalmente designa uma rede na qual existem pontos interligados que utilizam a Internet como base de comunicação. A comunicação entre estes pontos utiliza técnicas de encriptação de modo a que toda esta rede seja virtualmente privada. Por exemplo, uma empresa com dois escritórios em diferentes locais geográficos. Utilizando a Internet, os dois escritórios ligam as suas redes numa só, sem que os outros utilizadores da Internet possam ter acesso à sua Rede Privada.
WYSIWYG (What You See Is What You Get)
Abreviatura de ''What You See Is What You Get'' (Aquilo que você vê é aquilo que você terá). Quando se diz que um determinado programa é WYSIWYG, significa que aquilo que o utilizador está a ver no ecrá é aquilo que vai sair na impressora ou o resultado final do trabalho. Por exemplo: o Microsoft Word é WYSIWYG porque aquilo que se vê no ecrã é exactamente aquilo que sai na impressora. O Microsoft Frontapage é WYSIWYG porque aquilo que se vê na parte de editor de páginas web é o que se vai ver quando o programa produzir os ficheiros html finais.
World Wide Web (WWW)
World Wide Web, ou apenas Web, é o termo utilizado quando nos referimos à imensidão de páginas existentes em toda a Internet; Página web é o termo utilizado para nos referirmos a uma determinada página; E web site, também conhecido por "sítio" ou "sítio web" é o conjunto de páginas web num determinado endereço. Por exemplo: todas as páginas web do Truques e Dicas formam um web site porque estão todas alojadas no endereço do Truques e Dicas, que é o www.tutorialmaluko.blogspot.com

Tutorial de HTML 2

Além de imagens, também existe a possibilidade de colocar um pequeno reprodutor de som na página. Embora muita gente ache a musica de fundo algo de gosto duvidoso, desta maneira será possível parar a música, através de um pequeno controle tipo aparelhagem.
<P ALIGN="CENTER">
<BGSOUND SRC="musica.mid">
<EMBED SRC="musica.mid" WIDTH="140" HEIGHT="25" AUTOSTART="TRUE" CONTROLS="SMALLCONSOLE" VOLUME="60"OOP="FALSE"></EMBED>
</P>


O aspecto será o seguinte:
 
 
Nota-se que foram utilizados dois ‘tags’ para fazer a mesma coisa. Porquê? Os dois browsers mais utilizados, o Internet Explorer da Microsoft e o Navigator da Netscape têm certas diferenças na sua interpretação do HTML. Por isso, por vezes, é necessário incluir dois comandos diferentes para uma mesma função, visto que cada um destes comandos se destina a um dos browsers.
O ‘tag’ <BGSOUND> tem no parâmetro SRC a localização do ficheiro de som a tocar. No exemplo trata-se de um ficheiro .MID, mas pode perfeitamente ser um som .WAV ou .AU.
De forma similar, o ‘tag’ <EMBED> tem em SRC o ficheiro a tocar. Mas este ‘tag’ é substancialmente diferente. <EMBED> é um ‘tag’ poderosíssimo que tem como função a inserção de ‘plug-ins’ multimédia, que além de som também podem ser programas em Java, filmes ou mesmo visores de mundos em realidade virtual. Os parâmetros de <EMBED> são específicos conforme o conteúdo e é um domínio já bastante avançado da criação de páginas.

Na criação de páginas em HTML, as tabelas são algo que serve para muito mais que para a criação de tabelas propriamente ditas. Na verdade, é rara a página bem construída que não as utilize para melhor controlar a localização do texto, imagens e outros elementos de uma página.
Vamos seguir atentamente a criação de uma página com tabelas, visto que este é um dos processos onde os iniciados ao HTML encontram mais dificuldades.
<HTML>
<HEAD><TITLE>Página com uma tabela simples
</TITLE></HEAD>
<BODY>

<TABLE ALIGN="CENTER" BORDER="2">
Isto parece um pouco óbvio. O ‘tag’ <TABLE> inicia a nossa tabela. O parâmetro ALIGN define a localização da tabela na página (neste caso ficará centrada), e BORDER define a largura da borda.
<TR>
Agora, este ‘tag’ parece bem mais estranho. <TR> significa Table Row, e indica que vamos introduzir uma linha na nossa tabela. Parece lógico, dado que normalmente as tabelas se definem por linhas e colunas. No entanto…
<TD ALIGN="CENTER">Uma célula</TD>
<TD ALIGN="CENTER">Duas células</TD>

Poder-se-ia dizer que o <TD> diz respeito à divisão em colunas, duas neste caso. No entanto, isto é pouco exacto visto que, como vamos ver mais à frente, um <TD> não corresponde necessariamente a uma coluna da nossa tabela. Na verdade este ‘tag’ apenas divide a linha actual em várias células. Mas atenção! Se quisermos apenas uma célula, teremos sempre que utilizar na mesma um <TD>! Outra coisa a notar, o parâmetro ALIGN deste ‘tag’ diz respeito ao alinhamento por defeito do texto contido na célula.
</TR>
</TABLE>

</BODY>
</HTML>

Fechamos todos os ‘tags’ abertos e assim concluímos a nossa tabela:
 
 
vamos ver agora mais alguns exemplos de como utilizar tabelas.Primeiramente vamos ver como se utiliza uma tabela para fazer uma página de entrada num site, com uma imagem centrada no ecrã.
<HTML>
<HEAD>
<TITLE>Site de Eduardo Sousa – Carregue na imagem para entrar</TITLE>
</HEAD>
<BODY BGCOLOR="#000000" TEXT="#FFFFFF">
<TABLE ALIGN="CENTER" WIDTH="100%" HEIGHT="100%">
<TR>
<TD ALIGN="CENTER" VALIGN="MIDDLE">
<A HREF="principal.htm">
<IMG SRC="imagem.jpg" ALT="Clique para entrar">
</A>
</TD></TR>
</TABLE>
</BODY>
</HTML>


O resultado será este:
 

Como vimos, é obrigatório respeitar sempre a hierarquia <TABLE><TR><TD> e o facto de esta tabela ter apenas uma célula não dispensa nenhum destes ‘tags’.
Começando por <TABLE>, WIDTH HEIGHT definem o tamanho da tabela. Neste caso foi fornecido um valor em percentagem, relativo ao tamanho do ecrã. Assim conseguimos criar uma tabela que ocupa a totalidade do ecrã. Caso estivesse escrito <TABLE WIDTH="100">, o valor seria interpretado em termos absolutos, em pixeis, e tendo em conta que a maioria das pessoas têm o seu ecrã com 800 pixeis de largura, o resultado da tabela seria bem diferente. Cabe a cada um julgar as situações em que devem ser utilizadas percentagens ou valores em pixeis
Em <TD>, surgem ALIGN e VALIGN. Se o primeiro é um parâmetro que surge em muitos ‘tags’ e diz respeito ao alinhamento horizontal (pode conter "CENTER", "LEFT" ou "RIGHT"), VALIGN é um parâmetro que nos surge apenas no ‘tag’ <TD>, e diz respeito ao alinhamento vertical. Pode por isso conter os valores "MIDDLE", "TOP" ou "BOTTOM", respectivamente para o centro, em cima ou em baixo.
 
Finalmente, vamos analisar uma tabela complexa:<BODY BGCOLOR="#000000" TEXT="#FFFFFF">
<TABLE BGCOLOR="#000099" ALIGN="CENTER" WIDTH="400" HEIGHT="300" BORDER="3">

<TR>
<TD ALIGN="CENTER" COLSPAN="3"> 1 </TD>
</TR>

<TR>
<TD ALIGN="CENTER" ROWSPAN="2"> 2 </TD>
<TD ALIGN="CENTER" ROWSPAN="2"> 3 </TD>
<TD ALIGN="CENTER"> 4 </TD>
</TR>

<TR><TD ALIGN="CENTER"> 5 </TD></TR>
</TABLE>
</BODY>

Para melhor compreender esta estrutura é conveniente vermos o resultado final:
 
 
É por isto que não se pode associar os ‘tags’ <TR> e <TD> com linhas e colunas. Se bem que exista alguma verdade nessa associação, podemos, de facto, ter apenas um <TD> para várias colunas, e um <TR> para várias linhas, como se pode ver no resultado. Analisemos então o HTML que inserimos.Começamos por introduzir um novo parâmetro em <TABLE>. Através de BGCOLOR conseguimos definir, tal como fizemos para a o corpo da página, a cor de fundo da tabela. Este parâmetro também pode ser utilizado em <TR> e em <TD> para definir a cor de fundo de uma determinada linha ou célula.
Depois introduzimos <TD COLSPAN="3">. Este parâmetro define o número de colunas que uma determinada célula ‘percorre’. Assim, como acontece na nossa tabela, se tivermos uma única célula com três células por baixo, teremos que percorrer três colunas. No entanto, teremos sempre que considerar como número de colunas na nossa tabela o maior numero possível, por exemplo, se a célula 5 estivesse dividida em duas colunas, o parâmetro COLSPAN da célula 1 teria que ter um valor igual a 4.
Semelhante temos também ROWSPAN, que se aplica a linhas. Vemos este parâmetro aplicado nas células 2 e 3, o que faz com que o <TR> seguinte a ser aberto vá ocupar o espaço que ficou debaixo da célula 4.

Quem já navegou um pouco pela Internet com certeza já encontrou páginas em que, por exemplo, existe um menu estático no lado esquerdo do ecrã e o conteúdo do lado direito é que vai mudando.

Para tal é utilizado um processo mais complexo no qual visualizamos ao mesmo tempo no ecrã mais que uma página HTML. Para isso usa-se aquilo que iremos chamar de sistema de ‘frames’.

O princípio é simples. Temos uma página que nos indica a posição na qual as outras páginas serão colocadas. No exemplo referido de um menu do lado esquerdo, ateríamos, por exemplo uma página principal.htm que nos diz para exibir a página menu.html no lado esquerdo e a página conteudo.htm no lado direito.

Vamos agora ver como criar uma página com três ‘frames’, uma do lado esquerdo, e do lado direito um cabeçalho e o corpo, como no seguinte esquema:
 
esquerda
cima
conteudo
 
<HTML>
<HEAD><TITLE>Página com Frames</TITLE></HEAD>

<FRAMESET COLS ="160,*" BORDER="0" FRAMESPACING="0">
<FRAME SRC="esquerda.htm" NAME="esquerda" NORSIZE FRAMEBORDER="NO">

<FRAMESET ROWS ="90,*">
<FRAME SRC="cima.htm" NAME="cima" NORESIZE SCROLLING="NO" FRAMEBORDER="NO"><FRAME SRC="conteudo.htm" NAME="conteudo" FRAMEBORDER="NO">
</FRAMESET>

</FRAMESET>

<NOFRAMES>
<BODY BGCOLOR="#FFFFFF">
Esta página usa frames, mas o seu browser não as consegue visualizar.
</BODY>
</NOFRAMES>
</HTML>


Vejamos: esta página é algo diferente daquilo que aprendemos até agora. Isto porque aquilo que vemos no ecrã não é esta página, mas sim aquelas que esta refere.

Para definir frames, utiliza-se o ‘tag’ <FRAMESET>. Como não se trata propriamente do corpo da página, este ‘tag’ define uma área após a área <HEAD>, mas não contido dentro do ‘tag’ <BODY>. Ao utilizar o parâmetro COLS, divide a página em colunas, neste caso definidas por "160,*". Isto significa que são criadas duas, uma com 160 pixeis de largura e outra que ocupa o resto do espaço disponível no ecrã. As medidas das frames podem ser fornecidas em pixeis, em percentagem do espaço disponível ou por um asterisco, que significa ‘o resto’. Estas colunas são definidas da esquerda para a direita. Temos também BORDER e FRAMESPACING, que definem a borda e o espaçamento entre frames.

Dentro de <FRAMESET>, podemos então definir a frame propriamente dita ou subdividi-la pela ordem em que foram criadas as colunas. Temos então inserido o ‘tag’ <FRAME>, que se refere à primeira coluna (de 160 pixeis). SRC define qual o ficheiro HTML a ser exibido nessa frame, NAME, muito importante, indica qual o nome da frame, para que as links possam lá recair (veremos isto mais à frente). NORESIZE indica que a frame não pode ser redimensionada com o rato, e FRAMEBORDER, mais uma vez, a borda da frame. Utiliza-se <FRAME FRAMEBORDER> e <FRAMESET BORDER> mais uma vez por uma questão de compatibilidade entre o Internet Explorer e o Netscape Navigator. SCROLLING pode ser definido com "YES" ou "NO" para obrigar a barra de scroll a estar sempre visível ou escondida.
 
 
A segunda coluna que definimos é então ocupada por um novo <FRAMESET>, este agora que divide essa área em duas linhas, utilizando ROWS. De forma semelhante a COLSROWS divide a área a que diz respeito em linhas, lidas de cima para baixo.
No final temos ainda uma estranha área<NOFRAMES>. Esta, que dentro de si contém uma área<BODY>, destina-se a alojar o conteúdo do corpo da página visível nos browsers antigos (anteriores ao Netscape 2.0), que não suportam frames.

Como é que fazemos com que as links ‘caiam’ sobre uma das frames que criamos?

Aí entra o parâmetro NAME de <FRAME>. Através do nome que definimos, podemos usar o seguinte código, por exemplo no ficheiro ‘esquerda.htm’:

<A HREF="link.htm" TARGET="conteudo">Link</A>
Através de TARGET podemos definir o ‘alvo’ de uma link, que terá o nome que atribuímos à frame desejada. Podemos ainda utilizar TARGET="_blank", que abre a link numa nova janela, e TARGET="_ top", que abre a link no topo de toda a hierarquia de frames no ecrã, apagando as frames existentes. Quando não é atribuído um TARGET, as links abrem por defeito na própria frame onde existem.

Tutorial de HTML

HTML significa ‘HyperText Markup Language’, e é uma linguagem universal destinada à elaboração de páginas com hiper-texto, como o nome indica. O conceito de hiper-texto é bastante simples: Certos itens de um documento contêm uma ligação a outra zona do mesmo documento ou, como é mais vulgar, a outros documentos.
A principal aplicação do HTML é a criação de páginas na Web, e convém esclarecer que não se trata de uma linguagem de programação. De facto, o HTML é antes uma espécie de linguagem de formatação, um ficheiro de texto que é formatado através de uma série de comandos – ‘tags’.

Antes de mais, importa esclarecer que para a criação de uma página em HTML não é necessário nenhum software especial. Se bem que existam programas especializados, o Notepad do Windows ou mesmo o Edit do MS-DOS são mais que suficientes para a criação de uma página.

Como disse no Capítulo I, o HTML consiste em texto formatado por ‘tags’. Embora existam várias dezenas destes ‘tags’, apenas uma pequena parte destes é utilizada normalmente. Há algumas regras básicas que é necessário compreender antes de se começar com a criação de páginas...
 Todos os ‘tags’ são inseridos entre o sinal de menor e maior:
<tag>

Tirando aqueles que representam a posição de um objecto (a inserção de uma imagem, por exemplo), todos os ‘tags’ de formatação devem ser abertos e fechados (utilizando o caracter ‘/’):
<tag> </tag>
Todos os ‘tags’ obedecem a uma hierarquia, como no seguinte exemplo:
<a> <b> <c> </c> </b> </a>

O primeiro a abrir é o último a fechar, e vice-versa.
<a> <b> <c> </a> </b> </c> É ERRADO.
É indiferente utilizar maiúsculas ou minúsculas nos ‘tags’. Nestes tutoriais irei utilizar maiúsculas apenas por uma questão de leitura.
<tag> é igual a <TAG> e a <Tag>
Todas as páginas em HTML são identificadas pelo ‘tag’ <HTML>, que terá obrigatóriamente que estar no início. Obviamente, qualquer página irá acabar com </HTML>.
<HTML>
.
.
.
</HTML>
Todas as páginas em HTML contêm duas partes: Aquela definida por <HEAD>, e que contém todas as informações do cabeçalho da página; Outra parte definida por <BODY>, contém quase tudo aquilo que iremos ver realmente na nossa página.
<HTML>
<HEAD>
.
.
</HEAD>
<BODY>
.
.
</BODY>
</HTML>

Para criarmos a nossa primeira página em HTML, como já disse no capítulo anterior, basta qualquer simples editor de texto, como o Notepad. Podemos começar por inserir o seguinte:
<HTML>
<HEAD><TITLE>A minha primeira página</TITLE></HEAD>
<BODY></BODY>
</HTML>
 
Dica:
Devemos criar uma pasta nova no nosso disco para conter a página, e devemos gravar o nosso ficheiro de texto como 'index.htm'. Porquê? Quando a página está a ser visualizada no nosso disco, é indiferente, mas nos servidores onde são alojadas as páginas na Internet, a página inicial por defeito chama-se index.html ou index.htm.
 
Se visualizarmos a página que acabámos de criar num browser (programa que permita navegar na internet, por ex. IExplorer), teremos qualquer coisa como isto:
 
 
Que conclusão podemos tirar? O texto que aparece como título da janela é definido pelo ‘tag’ <TITLE>, que surge sempre na área correspondente ao cabeçalho da página (<HEAD>).
 
Vamos agora fazer a seguinte alteração:<HTML>
<HEAD>
<TITLE>A minha primeira página</TITLE>
</HEAD>
<BODY>
Olá mundo!
</BODY>
</HTML>


Iremos obter o seguinte resultado:
 
 
Como já disse antes, a área definida pelo ‘tag’ <BODY> é aquela onde reside quase todo o conteúdo visível de uma página. Vamos concentrar-nos nesta área.
Comecemos por acrescentar uma frase:
<BODY>
Olá mundo!
Chamo-me Eduardo.
</BODY>

Inesperadamente, o resultado obtido será o seguinte:
 
 
Convém então esclarecer algo: Em HTML, os espaçamentos e mudanças de linha processam-se de um modo algo diferente. Todo o texto é interpretado continuamente, e na verdade é possível que todo o HTML de uma página esteja numa única linha. Os espaços, tal como neste tutorial, apenas servem para tornar o código mais legível a quem o cria. Vamos introduzir o seguinte ‘tag’:<BODY>
Olá mundo!
<BR>
Chamo-me Eduardo.
</BODY>


Este <BR> (de Break) dá instruções ao browser para fazer uma mudança de linha. Assim, o resultado deverá ser este:
 

Vamos agora tentar o seguinte:
<BODY>
Olá mundo! Chamo-me Eduardo.
</BODY>


Iremos obter novamente o seguinte resultado:
 
 
Porquê? Como foi dito, a noção de espaçamento em HTML é um pouco diferente, e os browsers não reconhecem mais que um único espaço entre caracteres. Para contornar isto, utiliza-se uma referência especial - &nbsp; (Non-Breaking SPace), que convém esclarecer que não é um ‘tag’. Antes de mais explicações, experimentemos isto:<BODY>
Olá mundo!
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
Chamo-me Eduardo.
</BODY>


O resultado será este:
 
Dica:
 
Estes caracteres especiais são utilizados para definir caracteres que normalmente não são reconhecidos pelo HTML. Por exemplo, visto que os sinais de maior e menor são utilizados pelo próprio HTML para definir os ‘tags’, se quisermos utilizar estes sinais na nossa página utilizaremos &gt; e &lt;respectivamente.
 
Uma das bases do HTML é o facto de ser uma linguagem de hiper-texto. Vamos agora tentar introduzir uma ligação a outra página:<BODY>
Olá mundo! Chamo-me Eduardo.<BR>
Visitem a minha <A HREF="outra.htm"> outra página</A>.
</BODY>


iremos então obter uma ligação a uma página, que seria o ficheiro ‘outra.htm’ gravado na mesma pasta que o ficheiro da página que estamos a editar. Seria interessante criar rapidamente essa página para testar a ligação que acabámos de criar.
 
 
Este ‘tag’ é um pouco diferente dos que já vimos. Pode parecer confuso, mas não é. O ‘tag’ <A> é aquele destinado à introdução de uma link, mas no entanto necessita de um parâmetro (o HREF) para indicar aonde é feita essa ligação. Tudo aquilo que se segue irá estar ‘linkado’, até o ‘tag’ ser fechado com </A>.
O parâmetro HREF pode conter também o endereço de outro site, como em <A HREF="http://www.site.com"> (neste caso é indispensável o prefixo http://) ou qualquer outro ficheiro sem ser .HTM ou .HTML. Por exemplo, para fazer uma link para download usar-se-ia <A HREF="ficheiro">.
 
Dica:
 
IMPORTANTE: Aconselho vivamente que todos os ficheiros referidos numa página, quer links a outras páginas, quer imagens, etc, tenham o seu nome em minúsculas, pois a grande maioria dos servidores Web fazem uma distinção entre maiúsculas e minúsculas. Existe uma forte possibilidade que se tivermos uma link a ‘pagina.htm’, quando o ficheiro se chama ‘Pagina.htm’, esta link não funcione.

Todas as páginas que vemos na Internet têm algo mais que texto corrido e monótono. Antes de mais, podemos mudar a cor de uma página:
<HTML><HEAD><TITLE>Página com cor</TITLE></HEAD>
<BODY BGCOLOR="#FFFF00" TEXT="#0000FF" LINK="#FF0000">
Texto normal<BR><A HREF="outra.htm">Texto com link</A>
</BODY>
</HTML>

O resultado será o seguinte:
 
 
Aqui foram acrescentados três parâmetros adicionais ao ‘tag’ <BODY>BGCOLOR define a cor de fundo da página, TEXT a cor por defeito do texto, LINK a cor de uma hiper-ligação. Existem ainda os parâmetros adicionais ALINK e VLINK que definem, respectivamente, a cor de uma ligação activa (quando se clica sobre ela) e a cor de uma ligação já visitada previamente.
O que está dentro destes parâmetros? O código hexadecimal correspondente à cor (mais informação sobre isto encontra-se no artigo sobre o uso da cor, na seguinte tabela podemos ver alguns dos mais importantes:
 
Dicas:
 
Branco: #FFFFFFAmarelo: #FFFF00 
Preto: #000000Magenta: #FF00FF
Cinza: #999999Azul claro: #00FFFF
Vermelho: #FF0000Laranja: #FF6600
Verde: #00FF00Verde escuro: #006600
Azul: #0000FFAzul escuro: #000066
 
No entanto, muitas vezes muito mais importante que as cores, é o alinhamento dos elementos da página. Por defeito tudo fica alinhado à esquerda, mas é possível mudar isso:<BODY>
<DIV ALIGN="CENTER">TEXTO CENTRADO</DIV>
<DIV ALIGN="RIGHT">TEXTO À DIREITA</DIV>
Texto à esquerda
</BODY>


O texto em maiúsculas tem o seu alinhamento alterado, a utilização do ‘tag’ <DIV> também provoca quebras de linha:
 
 
Porquê? O ‘tag’ <P> é utilizado para a definição de parágrafos, como o seguinte exemplo o demonstra:<BODY>
<P>Bloco de texto</P>
<P>Outro bloco de texto<BR>com mudança de linha</P>
</BODY>


Existe uma diferença clara entre o espaçamento introduzido por uma mudança de parágrafo e aquele que surge através do ‘tag’<BR>, de quebra de linha:
 

Além do aspecto global do texto, podemos também escolher o tipo de letra que utilizamos. Antes de mais, temos os ‘tags’ <B>,<I> e <U>, respectivamente para letra carregada, em itálico e sublinhada:
<BODY>
Normal<BR>
<B>Carregado</B><BR>
<I>Italico</I><BR>
<U>Sublinhado</U><BR>
<B><I>Carregado e Italico</I></B>
</BODY>


Obtemos este resultado:
 
 
Além disto, também podemos escolher a fonte, o seu tamanho e cor com <FONT>:
<BODY>
<P>Letra normal</P>
<P><FONT FACE="Arial">Letra com a fonte Arial</FONT></P>
<FONT FACE="Arial">
<P><FONT SIZE="5">Tamanho 5</FONT></P>
<P><FONT SIZE="2">Tamanho 2</FONT></P>

<FONT SIZE="5">
<P><FONT COLOR="#0000FF">Azul T.5</FONT></P>
<P><FONT COLOR="#FF0000">Vermelho T.5</FONT></P>
</FONT>

</FONT>
<P><FONT FACE="Times New Roman" SIZE="7" COLOR="#006633">
Podemos combinar varios parametros</FONT></P>
</BODY>


Este já está um pouco mais complicado. Existem várias maneiras de fazer isto, mas esta demonstra como se devem hierarquizar os ‘tags’ correctamente. Bem executado, teremos este resultado:
 
 
O parâmetro COLOR, que já vimos aplicado no ‘tag’ <BODY>, contém a cor do texto no seu código hexadecimal (ver Apêndice E). O parâmetro SIZE contém o tamanho do tipo de letra, que é um algarismo entre 1 (mais pequeno) e 7 (maior). Finalmente,FACE contém o nome do tipo de letra a utilizar.
 
Dica:
 
Apesar de existirem inúmeros tipos de letra, é aconselhável que uma página apenas utilize o Arial ou o Times New Roman, visto que com outros existe uma grande possibilidade que quem vai visitar a página não tenha essa fonte instalada no seu computador.

Toda a manipulação de texto e de cor que vimos pode parecer interessante, mas é raríssima a página na Internet que não contém pelo menos uma imagem.
Podemos começar por ver como se insere um fundo numa página:
<HTML>
<HEAD><TITLE>Página com imagem</TITLE></HEAD>


<BODY BACKGROUND="imagem.jpg">
<FONT FACE="Arial" SIZE="4">Imagem de fundo</FONT>
</BODY>
</HTML>


Teremos como fundo da página a imagem especificada no parametro BACKGROUND, presente na mesma pasta que a nossa página.
 
 
Embora não se veja na imagem acima, a imagem repete-se em padrão. Não é aconselhável a utilização de fundos complexos, visto que podem tornar o texto pouco legível. Também é recomendável a escolha de uma cor suficientemente contrastante para o texto.
No entanto, para colocarmos uma imagem no corpo da nossa página utilizamos o ‘tag’ <IMG>. Este ‘tag’ insere uma imagem no ponto onde é colocado, e não é fechado, visto que não se trata de um ‘tag’ de formatação.
<BODY BGCOLOR="#66CCFF">
<P>Olá, sou o Eduardo</P>
<P><IMG SRC="eduardo.jpg" ALT="Sou eu!"></P>
</BODY>

Tem o resultado seguinte:
 
 
As imagens são objectos inseridos no meio do texto, pelo que a sua colocação requer algum planeamento:<DIV ALIGN="CENTER">
Olá, sou o Eduardo.<IMG SRC="eduardo.jpg" ALT="Sou eu!">
Benvindos à minha página.
</DIV>

Tem um resultado um pouco infeliz:
 
 
Vamos então analizar o ‘tag’ <IMG>. O parâmetro SRC (SouRCe) indica o ficheiro da imagem. Deve ser um ficheiro .GIF ou .JPG (ver Dicas para um bom design), e devemos ter atenção às maiusculas e minúsculas do seu nome. O parâmetro ALTindica o texto que irá aparecer enquanto a imagem não é descarregada da Internet, ou que aparece quando passamos com o rato por cima da Imagem.Uma conclusão muito importante é que podemos inserir uma imagem numa secção formatada pelo ‘tag’ <A>, de modo a criar uma link nessa imagem:
<P>Clique abaixo para continuar</P>
<P>
<A HREF="paginadois.htm"><IMG SRC="link.gif" BORDER="4"></A>
</P>

Teremos então uma link para ‘paginadois.htm’ na imagem ‘link.gif’:
 
 
O parâmetro BORDER define a largura da borda da imagem. No caso de esta fazer uma hiper-ligação, a cor desta borda será a cor por defeito, aquela que pode ser definida por <BODY LINK="…">, senão será igual à cor do texto. Podemos ainda utilizarBORDER="0" para suprimir a borda...