Ol pessoal, eu sou o instrutor Anderson e estamos aqui para mais um resumo da aula de Dreamweaver.

Na aula que abrangeu os captulos 5 e 6 da apostila, aprendemos a criar links e a trabalhar com imagens. Vimos que um link uma ligao que acontece entre uma pgina e outra ou ento de uma pgina para outro site. Dreamweaver MX Aula 5/6 Criao de links Existem quatro tipos de links: Links de e-mail: os links de e-mail, so aqueles que ao clicar, o computador abrir o programa de gerenciamento de emails, dependendo do seu computador, este programa poder ser o Outlook Express (se utilizar o Internet Explorer) ou o Mozilla Thunderbird (caso utilize o Mozilla Firefox). Para criar um link de e-mail bastante simples: digite o texto que a pessoa ir clicar (Exemplo: Clique aqui para nos enviar um e-mail). Em seguida, selecione este texto. V agora at o inspetor de propriedades e na caixa LINK digite mailto: seu_email@provedor.com.br. Fcil no ? Links Relativos: estes links so aqueles que ligam a pgina que voc est utilizando com outra pgina que existe dentro do seu site. Observe que ao criar este tipo de link, voc no precisar colocar um longo endereo no link, como http://www.nomedosite.com.br/nome_da_pagina.html. Se voc j tem a pgina destino criada, voc deve proceder da seguinte maneira: selecione a palavra ou frase que servir de link. Aps ter selecionado, observe que no inspetor de propriedades haver uma caixa chamada LINK. Note que do lado direito desta caixa, existe uma pasta amarela, onde voc poder clicar e escolher o arquivo que quer fazer a ligao, ou se preferir, pode ir ao smbolo que h do lado desta pasta (no formato de um alvo), clicar sobre este alvo e arrastar at o arquivo que desejar. A lista de arquivos fica do lado direito da tela do Dreamweaver. Pronto, seu link foi criado! Links absolutos: so aqueles links que voc cria, mas que far a ligao com uma pgina de um outro site. Por exemplo, se criarmos um texto chamado, Clique aqui para ler um jornal podemos selecionar esta frase, ir ao inspetor de propriedades e na caixa LINK digitar: http://www.folha.com.br. Repare que neste caso, o endereo do site deve estar completo. Se voc digitar o endereo do site comeando pelo www e no colocando o http:// muito provavelmente ir gerar um erro. Links de ncora: links de ncora so aqueles que voc cria mas que ligam a um tpico dentro da mesma pgina. Um exemplo seria uma pessoa colocar na sua pgina um texto muito grande que dividido em diversos tpicos. Os tpicos mais importantes poderiam receber uma ncora para que fosse mais fcil para o leitor chegar mais rpido onde deseja, e no ficar procurando o lugar pela barra de rolagem. Para criar um link de ncora voc tem que fazer assim: clique no inicio de cada tpico e em seguida, clique no boto que tem o formato de uma ncora que fica na barra de ferramentas comuns. Ao fazer isto, uma tela ser aberta e voc ter que digitar alguma coisa, uma palavra que sirva de referencia para o link que est sendo criado. Quando voc clicar no boto OK observar que antes do tpico que voc digitou, agora aparecer um smbolo amarelo. Repita esta operao para todos os tpicos que forem receber a ncora. Agora no inicio da pgina, voc criar novamente os tpicos, para que as pessoas clicarem e irem para o local do texto que o

tpico est apontando. Depois de escrever os tpicos novamente no inicio da pgina, selecione um tpico. Agora v at o inspetor de propriedades, e arraste o alvo at o smbolo amarelo que existe no inicio do tpico que voc criou. Faa isso com todos. E est pronta a sua pgina. Observaes sobre links: todas as vezes que criamos um link para uma pgina ou para um outro site, os links seguiro o modelo tradicional da Internet no que se refere a cores. Ou seja, links ainda no visitados ficam azuis, os links que esto sendo usados ficam roxos e os links que j foram visitados ficam cinza. Entretanto, se voc desejar criar um site diferente com links de outra cor, muito fcil, depois de ter criado os links (ou antes, se preferir), clique no menu Modificar e escolha a opo Propriedades da Pgina. Na tela que ser aberta, clique nas caixas de cores que existem prximas s opes Links, Links Ativos e Links Visitados. O nico problema que voc ter que fazer isto em todas as pginas do seu site. um pouco trabalhoso, mas logo em breve utilizaremos uma forma de criar uma vez s este tipo de formatao de links, utilizando um sistema chamado CSS. Aguardem!

Imagens O Dreamweaver aceita praticamente todo tipo de imagem em suas pginas. E so vrios os tipos de imagens: existem as que chamamos de imagens BMP que so aquelas que a gente cria no Paint e que ficam pesadssimas numa pgina de Internet, existem as JPG ou JPEG que so as mais utilizadas, por serem leves e terem bastante qualidade, existem as imagens PNG que so geradas pelo programa Fireworks que no so muito prticas em pginas de Internet tambm pelo seu tamanho e existem os GIFs, que so geralmente imagens com tamanho e peso muito pequenos, mas que s suportam 256 cores. Para que uma imagem fique em seu site, em primeiro lugar, ela dever estar gravada dentro da pasta raiz do seu site. Se voc utilizar uma imagem que no est dentro desta pasta, o Dreamweaver ir pedir para que voc salve-a no lugar correto. Mas se voc estiver decidido(a) a no gravar esta imagem na pasta raiz do seu site, sabe o que ir acontecer? Quando o seu site for ao ar, aparecer no lugar da imagem apenas um quadrado branco com um X vermelho no canto superior esquerdo, e seu site ficar horroroso. Depois que gravar a imagem na pasta raiz e desejar coloca-la dentro da pgina, basta clicar sobre esta imagem (que est na relao de arquivos do site, no painel Arquivos, do lado direito da tela) e arrastar para o local onde ela dever ficar na pgina. Simples no ? Ento mas depois que fizer isto, existem outras coisas a serem feitas. Note que se voc colocar uma imagem em uma pgina que j contm texto, o texto ficar em cima e embaixo da imagem, deixando um grande espao em branco ao redor da figura. Isto acontece porque o Dreamweaver no um programa que d tanto suporte assim para trabalhar com texto e imagens ao mesmo tempo, mas h uma soluo. Veja que quando a imagem est selecionada, aparece uma linha preta ao redor dela, e o inspetor de Propriedades ser alterado para trabalhar somente com a imagem. Na parte inferior direita do inspetor de propriedades, aparecer uma opo chamada Alinhar, que geralmente fica com a opo Padro (Default) selecionada. Se a sua figura deve ficar esquerda da sua pgina, voc deve clicar na opo Alinhar e escolher Esquerda. Isto far com que o texto fique ao redor da sua imagem. Esta opo serve para qualquer lugar da pgina que a figura ficar posicionada.

No inspetor de propriedades, quando a figura est selecionada tambm apresentar outras opes como por exemplo, modificar a largura e altura da imagem. Se quiser fazer isto, poder digitar novos valores nas caixas L e U. Ao lado desta caixa existe uma opo chamada Orig, ela serve para que voc troque a sua imagem por outra sem precisar deletar a imagem atual. Se voc colocou uma imagem errada na sua pgina e deseja trocar por outra, basta clicar no smbolo do alvo da caixa Orig e arrastar at uma outra imagem do painel Arquivos, que fica do lado direito da sua tela. O mesmo vale para a caixa Link. Se voc desejar transformar a sua imagem em um link, clique sobre a imagem e digite o destino do link nesta caixa. A ultima opo que iremos estudar a opo ALT. Esta caixa um local destinado para um texto alternativo, que aparecer na sua imagem quando o site estiver no ar e voc posicionar o cursor do mouse sobre a imagem. Este texto s aparecer quando voc utiliza o Internet Explorer, no Mozilla Firefox no acontece nada.