Scribd Logo
Fazer o upload

Bem-vindo(a) ao Scribd!

  • Ufcd0792 FT12 PDF

    Enviado por

    ajsm
    116 visualizações2 páginas

    Título original

    UFCD0792_FT12.pdf

    Direitos autorais

    © Attribution Non-Commercial (BY-NC)

    Formatos disponíveis

    PDF, TXT ou leia online no Scribd

    Você considera este documento útil?

    Este conteúdo é inapropriado?

    Denunciar este documento

    Direitos autorais:

    Attribution Non-Commercial (BY-NC)
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    116 visualizações2 páginas

    Ufcd0792 FT12 PDF

    Enviado por

    ajsm

    Direitos autorais:

    Attribution Non-Commercial (BY-NC)
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    de 2

    160945 Agrupamento de Escolas de Esgueira Direo Regional de Educao do Centro 401456 Escola Secundria Dr.

    Jaime de Magalhes Lima

    Curso de Educao e Formao de Adultos Tcnico de Informtica Sistemas - Formao Tecnolgica


    UFCD 0792 Criao de pginas Web em Hipertexto

    Ficha de Trabalho 12
    INTRODUO:

    Como j foi anteriormente referido, possvel criar hiperligaes com base em imagens. Mas, para criar vrias hiperligaes com base numa s imagem, tem de se definir nesta um ou mais pontos ativos. O conjunto destes pontos ativos permite criar diferentes formas, como crculos, retngulos e polgonos, construindo desta maneira, um mapa da imagem (Image map), em que cada uma das formas geomtricas possibilita uma hiperligao para outro documento. Para definir as zonas das imagens necessrio conhecer as coordenadas dos pontos essenciais, que identificam as formas dessas zonas num mapa de imagem. No crculo necessrio indicar as coordenadas do centro e o raio. ( centrox,centroy,raio) No retngulo necessrio indicar as coordenadas do canto superior esquerdo e o canto inferior direito (esquerdax, cimay, direitax, baixoy) Nos polgonos necessrio indicar as coordenadas dos vrtices ( X1,Y1, X2,Y2, Xn,Yn) Uma maneira bastante simples de criar um mapa de imagem utilizar um programa de edio de imagem e ir anotando a posio do cursor nos pontos para criar as formas que se desejam. A criao do mapa de imagem (do lado do cliente) feita aproveitando a capacidade de processamento deste. Para utilizar este mtodo, necessrio enviar o mapa de imagem dentro do documento HTML., indicando ao browser o que fazer, atravs da utilizao do atributo usemap da tag <img> Exemplo: <img src=nome do ficheiro de imagem usemap =#nome do mapa de imagem /> Para definir um mapa de imagem utiliza-se a tag <map> que necessita de fecho </map> . Dentro desta tag, utiliza-se a tag <area> que contm atributos que permitem definir as zonas do mapa de imagem e as respectivas hiperligaes, entre outros. Atributos da tag <map> : id - igual a um valor_unico ( define um nome nico que identifica o mapa) name - igual a um valor_unico ( o mesmo que o anterior, permitindo manter a compatibilidade com o browsers antigos) Atributos da tag <area> : Atributo coords shape = rect coords= esquerdax, cimay, direitax, baixoy shape = circ coords= centrox,centroy,raio shape = poly coords =X1,Y1, X2,Y2, Xn,Yn url rect ou rectangle circ ou circle poly ou polygon Especifica as coordenadas que definem as reas com hiperligaes Especifica o valor do url atribudo a cada rea Define os tipos de formas geomtricas
    Pgina 1 de 2

    href shape

    UFCD-0792-Criao de pginas Web em Hipertexto

    Escola Secundria Dr. Jaime Magalhes Lima Exemplo: <html> <head> <title> Mapa de Imagem</title> <!Mapa de Imagem--> </head> <body> <img src= imagem.gif usemap= #Mapa de Imagem border= 1 /> <map id= Mapa de Imagem name= Mapa de Imagem> <area shape= circ coords= 0,0,55 href= http://... title= circulo /> <area shape= poly coords= 100,66,80,123,129.124 href= http://... title= triangulo /> </map> </body> </html> EXERCCIO: Utilizando a aplicao Notepad ++, crie uma pgina web em que: 1. O Ttulo da nova Pgina seja EXERCCIO 12 MAPA DE IMAGEM 2. A pgina dever ser constituda por 2 frames horizontais. A de cima fixa (com valor definido em pixis) e a de baixo dever ter scrooling. 3. Na frame de cima deve surgir uma pgina com a imagem imagemFT12.jpg

    4. Ao clicar na rvore, deve surgir, na frame de baixo, uma pgina com o texto RVORE. Ao clicar na casa deve surgir o texto CASA. Ao clicar no pssaro ou na menina dever surgir, na frame de baixo, o texto PSSARO e MENINA, respetivamente. 5. Grave o ficheiro com o nome exerc12HTML (em formato .html) 6. Visualize a pgina num browser disponvel. 7. Envie os ficheiros, para o local apropriado na plataforma moodle. Bom Trabalho!

    UFCD-0792-Criao de pginas Web em Hipertexto

    Pgina 2 de 2

    Você também pode gostar