You are on page 1of 134

FRONTPAGE 2000 APOSTILA

SUMRIO
1. FrontPage 2000.................................................................................................................. 4
1.1 Introduo.................................................................................................................. 4
1.2 A Linguagem HTML e o FrontPage.......................................................................... 4
1.3 Alguns Conceitos....................................................................................................... 5
1.4 O que o FrontPage faz................................................................................................ 6
1.5 Qual a Aplicabilidade do FrontPage.......................................................................... 6
1.6 Como o FrontPage Funciona...................................................................................... 7
1.7 Os Modos de Visualizao do FrontPage.................................................................. 7
1.8 O que uma Web faz.................................................................................................... 8
1.9 Qual a Aplicabilidade de uma Web........................................................................... 8
1.10 Como uma Web Funciona.......................................................................................... 8
1.11 O que o Formatar Fonte faz e qual sua Aplicabilidade............................................ 11
1.12 Como o Formatar Fonte Funciona........................................................................... 12
1.13 Para que Serve Formatar o Pargrafo...................................................................... 15
1.14 Como Funciona a Formatao de Pargrafo............................................................ 16
1.15 Recuos...................................................................................................................... 17
1.16 Espaamentos........................................................................................................... 18
1.17 Qual a Aplicao dos Efeitos de Animao............................................................. 20
1.18 Como Funcionam os Efeitos de Animao.............................................................. 20
1.19 O que Fazem e qual a Aplicabilidade das Linhas Horizontais................................ 22
1.20 Como as Linhas Horizontais Funcionam................................................................. 22
1.21 O que e para que Serve o Letreiro Digital............................................................. 23
1.22 Como Funciona o Letreiro Digital ........................................................................... 23
1.23 O que e qual a Aplicabilidade do Contador de Acessos....................................... 25
1.24 Como Funciona o Contador de Acesso.................................................................... 25
1.25 Qual o objetivo das Propriedades da Pgina............................................................ 26
1.26 Acessando as Propriedades da Pgina e Alterando o Plano de Fundo..................... 27
1.27 Definindo a Cor Padro de Texto e o Ttulo da Pgina........................................... 30
1.28 Definindo as Cores dos Hyperlinks......................................................................... 31
1.29 O que fazem e qual a Aplicabilidade dos Temas..................................................... 32
1.30 Como os Temas Funcionam..................................................................................... 33
1.31 Personalizando os Temas......................................................................................... 33
1.32 Alterando as Cores do Tema.................................................................................... 34
1.33 Alterando os Elementos Grficos............................................................................ 36
1.34 Alterando o Formato do Texto................................................................................. 37
1.35 Salvando o Tema...................................................................................................... 38
1.36 Conhecendo os Tipos de Imagens para Internet...................................................... 39
1.37 O que as Imagens Fazem e qual a sua Aplicabilidade............................................. 39
1.38 Inserindo Clip-art..................................................................................................... 40
1.39 Configurando o Editor de Imagens.......................................................................... 42
1.40 Inserindo Imagens de Arquivos............................................................................... 43
2. Criando Pginas............................................................................................................... 46
2.1 Criando a Pgina Primatas....................................................................................... 46
2.2 Criando a Pgina Marsupiais................................................................................... 48
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 1
FRONTPAGE 2000 APOSTILA




2.3 Criando a Pgina Felinos......................................................................................... 48
2.4 Criando a Pgina Paquidermes................................................................................ 49
2.5 Criando a Pgina Pssaros....................................................................................... 49
2.6 Criando a Pgina Rpteis......................................................................................... 50
3. Tpicos mais utilizados: Marcadores,Numerao ... ....................................................... 50
3.1 Qual a Funo dos Marcadores e Numerao.......................................................... 50
3.2 Inserindo Marcadores............................................................................................... 51
3.3 Usando uma Imagem como Marcador..................................................................... 52
3.4 Inserindo Numerador............................................................................................... 52
4. Tabelas............................................................................................................................. 53
4.1 O que as Tabelas Fazem e qual sua Aplicabilidade................................................. 53
4.2 Como as Tabelas Funcionam................................................................................... 54
4.3 Modificando Atributos da Tabela............................................................................ 55
4.4 Modificando Atributos da Clula............................................................................. 57
4.5 Mesclando Clulas................................................................................................... 58
4.6 Dividindo Clulas.................................................................................................... 60
4.7 Praticando o Dividir Clulas.................................................................................... 62
4.8 Incluindo Linhas e Colunas...................................................................................... 62
4.9 Removendo Linhas e Colunas.................................................................................. 64
5. Hyperlinks........................................................................................................................ 64
5.1 O que so e qual a Aplicabilidade dos Hyperlinks.................................................. 64
5.2 Criando Link para E-mail ........................................................................................ 65
5.3 Criando Link para outra Pgina do Site................................................................... 66
5.4 Criando Link para uma Nova Pgina....................................................................... 67
5.5 Criando Link para um Endereo da WWW............................................................. 69
5.6 Criando Link para um Ponto da Pgina................................................................... 70
6. Componentes.................................................................................................................... 73
6.1 Qual a Funo do Gerenciador de Anncio em Faixa............................................. 73
6.2 Como o Gerenciador de Anncio em Faixa Funciona............................................. 74
6.3 O que o Boto em Foco faz e qual sua Aplicabilidade............................................ 76
6.4 Como o Boto em Foco Funciona............................................................................ 76
6.5 Criando Outros Botes para a Pgina...................................................................... 77
6.6 Alterando o Foco do Boto de Texto para Imagem................................................. 78
7. Links para Pginas Criadas.............................................................................................. 78
7.1 Links para os Marsupiais......................................................................................... 78
7.2 Links para os Felinos............................................................................................... 79
7.3 Links para os Paquidermes...................................................................................... 80
7.4 Links para os Pssaros............................................................................................. 81
7.5 Links para os Rpteis............................................................................................... 82
8. Quadros (frames).............................................................................................................. 82
8.1 O que os Quadros Fazem e qual sua Aplicabilidade................................................ 82
8.2 Como Funcionam os Quadros.................................................................................. 83
8.3 Configurando Cada Quadro..................................................................................... 83
8.4 Definindo a Pgina Inicial do Quadro...................................................................... 84
8.5 Criando uma Nova Pgina....................................................................................... 85
8.6 Salvando as Novas Pginas e os Quadros................................................................ 86
8.7 Configurando as Propriedades dos Quadros............................................................ 88
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 2
FRONTPAGE 2000 APOSTILA




8.8 Desativando Bordas e Controlando Espaos entre os Quadros............................... 91
8.9 Criando Vnculos entre os Quadros......................................................................... 92
9. Pgina Principal e Links.................................................................................................. 94
9.1 Alterando a Pgina Principal e Links para os Felinos............................................. 94
9.2 Alterando a Pgina Principal e Links para os Marsupiais....................................... 94
9.3 Alterando a Pgina Principal e Links para os Paquidermes..................................... 95
9.4 Alterando a Pgina Principal e Links para os Pssaros........................................... 96
9.5 Alterando a Pgina Principal e Links para os Rpteis............................................. 96
9.6 Criando os Links do Cabealho............................................................................... 97
9.7 Dividindo e Excluindo Quadros............................................................................... 98
10. Mapa de Imagens......................................................................................................... 98
10.1 O que o Mapa de Imagens faz e qual sua Aplicabilidade........................................ 98
10.2 Criando o Mapa de Imagens.................................................................................... 99
10.3 Criando o Vnculo Padro...................................................................................... 101
11. Formulrio.................................................................................................................. 102
11.1 Para que serve o Formulrio.................................................................................. 102
11.2 Como os Formulrios Funcionam.......................................................................... 103
11.3 Criando os Botes de Opo.................................................................................. 104
11.4 Criando Caixa de Texto de uma Linha.................................................................. 105
11.5 Criando Outras Caixas de Texto no Formulrio.................................................... 107
11.6 Criando o Menu Suspenso..................................................................................... 108
11.7 Acrescentando mais Campos................................................................................. 110
11.8 Criando Caixa de Seleo...................................................................................... 110
11.9 Criando Caixa de Rolagem de Texto..................................................................... 112
11.10 Criando o Restante do Formulrio..................................................................... 113
11.11 Configurando o Boto de Ao.......................................................................... 114
11.12 Para que serve Configurar o Formulrio............................................................ 115
11.13 Configurando o Formulrio............................................................................... 115
12. Barra de Navegao................................................................................................... 117
12.1 O que a Barra de Navegao faz e qual sua Aplicabilidade.................................. 117
12.2 Como a Barra de Navegao Funciona.................................................................. 118
13. Organograma.............................................................................................................. 119
13.1 Criando o Organograma do Zo............................................................................ 119
13.2 Criando a Barra de Navegao do Zo.................................................................. 121
13.3 Alterando as Propriedades da Barra de Navegao............................................... 123
14. Relatrios................................................................................................................... 124
14.1 Qual a Funo dos Relatrios................................................................................ 124
14.2 Como Construir um Relatrio................................................................................ 125
15. Importao................................................................................................................. 126
15.1 Qual o Objetivo da Importao.............................................................................. 126
15.2 Importando um Arquivo......................................................................................... 126
15.3 Importando uma Web............................................................................................. 128
16. Publicar...................................................................................................................... 131
16.1 O que Publicar..................................................................................................... 131
16.2 Como funciona a Publicao do Site..................................................................... 132
16.3 Fazendo Upload pela Primeira Vez....................................................................... 132
16.4 Publicando as Alteraes do Site........................................................................... 134
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 3
FRONTPAGE 2000 APOSTILA





1. FrontPage 2000
1.1 Introduo
A WWW (World Wide Web), existe a apenas alguns anos, e tem revolucionado o
modo de comunicao entre as pessoas. Alm de enviar mensagens de correio
eletrnico pelo mundo, qualquer um pode criar suas prprias informaes
personalizadas e disponibiliz-las atravs de uma Pgina Web qualquer pessoa
que possua um navegador da Web.
As pginas da Web existem deste 1991, quando a WWW foi inventada. Naquele
tempo, um grupo de pessoas colaborou para a criao de vrios padres que
permitiram que os computadores de todo o mundo "falassem" uns com os outros
eletronicamente. Um dos mais importantes padres criados por eles foi a HTML,
linguagem de marcao que est por trs de cada pgina da Web.
O FrontPage uma ferramenta de criao, gerenciamento e publicao de sites da
Web. Tudo isto feito de forma interativa, sem precisar necessariamente, de saber
utilizar e programar em HTML.
1.2 A Linguagem HTML e o FrontPage
A linguagem HTML composta por uma grande quantidade de cdigos,
denominados tags, que so inseridos em um arquivo de texto comum. Cada uma
dessas tags possui um propsito especfico e usada para marcar como
determinadas informaes devem aparecer em um navegador. Para criar arquivos
HTML, necessrio um editor de texto simples, como por exemplo, o Bloco de
Notas do Windows. Na verdade, o nico modo pelo qual voc pode distinguir
arquivos HTML de arquivos de texto sem olhar dentro deles consiste em examinar
suas extenses de arquivos geralmente .HTM ou .HTML em lugar de .TXT ou
.Doc.
Como voc pode imaginar, aprender a construir sites da Web com este tipo simples
de ferramenta para o tratamento HTML requer tempo e esforo.
Desde ento, foram criados vrios programas que auxiliam na criao de sites da
Web, e o FrontPage um deles. Ao usar o FrontPage, ele toma conta de todo
trabalho difcil para voc, pois, nos bastidores, ele se encarrega de gerar todo o
cdigo HTML necessrio. Portanto, quando voc salva uma determinada pgina da
Web gerada no FrontPage, na verdade, est criando um arquivo de texto em HTML.
Depois disto voc utiliza o seu navegador favorito para ler essa HTML e interpretar
cada tag. O FrontPage permite que voc penetre na parte oculta e edite o cdigo
HTML diretamente, mas, na maioria das vezes, voc usar a interface grfica do
FrontPage.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 4
FRONTPAGE 2000 APOSTILA




1.3 Alguns Conceitos
HTML: significa Hypertext Markup Language, ou Linguagem de Marcao de
Hipertexto. a linguagem de marcao que est por trs de cada pgina da Web,
controla o modo exato pelo qual o texto e os grficos (figuras) so apresentados
atravs de um navegador.
Navegador ou Browser: o programa que todos precisam ter em seu computador
para explorar a Internet. o navegador que l arquivos HTML, comunica com um
dos milhares de servidores que compem a WWW e recebe de volta, do servidor, o
arquivo HTML que dever ser exibido na tela em forma de textos e figuras. um
interpretador de HTML que l os cdigos contidos no arquivo e decide como exibi-
los.
Web: uma rede global composta por milhares de computadores diferentes que
constantemente conversam uns com os outros. Cada computador da WWW
chamado de servidor da Web e contm vrios arquivos HTML.
Pgina da Web: o arquivo contendo comandos HTML.
Site: um conjunto de pginas HTML relacionadas entre si.
Site da Web do FrontPage: para o FrontPage, um grupo de pginas da Web
relacionadas entre si geralmente chamado de site da Web sempre chamado de
Site da Web do FrontPage. Ela diferente da World Wide Web (WWW) que
geralmente citada na frase "navegar pela Web". Tal "Web" o conjunto de
computadores interligados pelo mundo inteiro que enviam pginas HTML para todos
os lados medida que estas so solicitadas por usurios (conforme conceito visto
anteriormente).
Java: uma linguagem popular que os programadores utilizam para criar programas
interativos, denominados applets, que so executados diretamente dentro de uma
pgina da Web. Ela est otimizada para funcionar especificamente na WWW e
funciona exatamente do mesmo modo em todos os tipos de computadores, dentre
os quais os Macs, os Pcs e as mquinas UNIX.
CGI: (Common Gateway Interface) uma linguagem de programao, que
possibilita que pginas da Web se comuniquem e compartilhem informaes com o
servidor no qual residem atravs de banco de dados.
Pixel: uma unidade de medida para monitores de computador que se refere ao
nmero de pontos que compe a tela. Um monitor VGA tem 640 pixels de largura
por 480 pixels de altura. Cada pixel corresponde a um dos pontos da tela do seu
computador que compem toda a imagem.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 5
FRONTPAGE 2000 APOSTILA




1.4 O que o FrontPage faz
Como vimos a linguagem da Internet conhecida como HTML. O FrontPage gera o
HTML partir de um editor visual do texto, das formataes, das figuras que
acrescentamos, das tabelas e qualquer outro objeto que utilizarmos em nossa
pgina.
1.5 Qual a Aplicabilidade do FrontPage
Normalmente os cdigos para a construo de uma pgina so construdos em um
editor de texto simples como o bloco de notas do Windows. O desenvolvedor da
pgina precisa conhecer os cdigos e digit-los de maneira correta. Criar pginas
desta forma nos traz um nico problema, perdemos muito tempo na digitao dos
cdigos, o FrontPage veio para resolver este problema, como ele um gerador de
HTML, ns precisamos nos preocupar apenas com a esttica da pgina e o
FrontPage se encarrega de transformar o que digitamos e formatamos em cdigo
HTML. Agilizando o processo de criao do site. Alm, de trazer vrios recursos
criados em outras linguagens para Internet, como J ava, para serem apenas
configurados em nosso site.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 6
FRONTPAGE 2000 APOSTILA




1.6 Como o FrontPage Funciona

1.7 Os Modos de Visualizao do FrontPage
Do lado esquerdo da tela do FrontPage encontramos a Barra de Modos, ou seja, as
maneiras de trabalhar com o FrontPage. A seguir descrio de cada um desses
modos.
Pgina
O modo de visualizao Pgina ser utilizado para fazer a edio das pginas que
faro parte do site que est sendo criado.
Pastas
O modo de visualizao Pastas mostra de que modo o site organizado. Todos os
arquivos HTML e imagens so exibidos e podem ser organizados em vrias
subpastas, como por exemplo a subpasta Images onde so armazenados todos os
grficos (figuras) utilizados na Web.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 7
FRONTPAGE 2000 APOSTILA




Relatrios
O modo de visualizao Relatrios ser utilizado para voc gerenciar a web que
estiver trabalhando. Poder ser visualizado um resumo do site, os arquivos lentos,
os desatualizados, etc.
Navegao
O modo de visualizao Navegao usado para construo de barras de
navegao automatizadas entre pginas da Web. Ou, pode tambm ser utilizado
simplesmente para montagem de um organograma do site, facilitando o controle e
navegao entre os arquivos que voc criou. (O assunto Barras de Navegao ser
abordado mais adiante nesta apostila).
Hyperlinks
Este modo de visualizao oferece uma representao grfica de como cada arquivo
do site est vinculado a outro. Por meio de um sistema hierrquico, o FrontPage
desenha linhas entre os arquivos vinculados. Mostrando a organizao dos links,
assim voc consegue identificar se os links criados esto bem distribudos ou
confusos.
Tarefas
O ltimo modo de visualizao apresenta uma lista de tarefas que voc marcou para
serem concludas. Ao longo do processo de construo do site, voc pode
freqentemente tomar nota de tarefas que devem ser concludas antes que o site
esteja terminado. Estas tarefas podem ser lidas e concludas uma por vez.
1.8 O que uma Web faz
Uma Web o grupo de arquivos relacionados disponibilizados em um servidor Web
na Internet. O FrontPage trabalha com webs.
1.9 Qual a Aplicabilidade de uma Web
As webs facilitam a organizao dos arquivos. mais aconselhvel utilizar webs
para construo de sites do que pginas soltas. Alm do controle dos arquivos
serem facilitados, vrios recursos do FrontPage sero mais explorados se utilizados
em uma web. Existem vrios modelos e assistentes que o auxiliaro na criao da
sua web ou site.
1.10 Como uma Web Funciona
Para criar uma web:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 8
FRONTPAGE 2000 APOSTILA




1. Clique no menu Arquivo / Novo / Web ou na seta direita do boto Nova
Pgina na barra de ferramentas Padro e selecione a opo Web, conforme
a figura a seguir mostra.

2. Ser exibida a janela para escolha do modelo ou assistente para criao da
Web.

3. Primeiro selecione o tipo de web que ser criada. Para trabalharmos escolha
Web vazia.
4. Depois na caixa Especifique o local da nova web defina em qual pasta do
winchester o seu site ser armazenado. Este caminho dever ser digitado. O
caminho que guardaremos os arquivos ser C:\ Meus
documentos\zoologico, o primeiro site que criaremos ser para o zoolgico
de BH.
5. Depois clique em OK.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 9
FRONTPAGE 2000 APOSTILA




6. Voc visualizar a tela no modo de exibio Pgina que utilizado para
edio das pginas do site. Do lado esquerdo est sendo visualizado a lista
de pastas da web que pode ser ocultada.

7. Se desejar ocultar a lista de pastas clique no boto Lista de pastas na
barra de ferramentas Padro. Para exibi-la, clique novamente no boto Lista
de pastas.
8. Selecione o modo de exibio de Pastas.
Como criamos uma web vazia ser necessrio acrescentarmos pginas nesta web.
Para criar uma pgina nova:
1. Clique no boto Nova Pgina na Barra de Ferramentas Padro.
2. Um novo arquivo aparecer do lado direito da tela com o nome index.htm de
sugesto, se desejar altere o nome do arquivo.
Quando o FrontPage sugere o nome index.htm isto significa que este ser o
arquivo de entrada do site. Se o arquivo que for criar neste momento for o
principal mantenha este nome.
Utilize nomes de arquivos para Internet com apenas 8 dgitos, apesar da
maioria dos provedores aceitarem nomes de arquivos maiores, o melhor
manter 8 dgitos. Tambm evite letras maisculas e smbolos prprios do
computador (como *, /, +) nos nomes de arquivos.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 10
FRONTPAGE 2000 APOSTILA




Se voc precisar escolher um modelo para a pgina nova:
1. Clique no menu Arquivo / Novo, escolha um dos modelos e clique em OK.

Est janela s aberta quando utilizamos o menu Arquivo / Novo, quando
clicamos no boto Nova pgina na Barra de Ferramentas Padro inserida
uma pgina em branco automaticamente.
Para editarmos a pgina d um clique duplo sobre a pgina. Voc ser enviado para
o modo Pgina. O cursor estar piscando no incio da pgina aguardando a
digitao do texto.

1.11 O que o Formatar Fonte faz e qual sua Aplicabilidade
Formatar significa dar forma, melhorar a aparncia do texto. Em pginas para
Internet a formatao deve ser bem feita para no expulsar o usurio do site.
Usando a formatao voc conseguir transformar o seu site em um ponto atraente
da Internet, fazendo com que usurios que visitaram o seu site, voltem outras vez
para ver as informaes importantes e as formataes novas que voc est criando.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 11
FRONTPAGE 2000 APOSTILA




Formatao envolve fonte, pargrafo, bordas, efeitos e vrios itens que veremos no
decorrer deste material.
1.12 Como o Formatar Fonte Funciona
Digite o texto abaixo:

Aps digitar o texto, vamos salvar as alteraes que fizemos nesta pgina. Clique no
boto Salvar na barra de ferramentas Padro ou clique no menu Arquivo / Salvar.
Agora vamos formatar o texto desta pgina. As formataes de texto so
basicamente as mesmas que podemos fazer em um texto no Microsoft Word.
Selecione o primeiro pargrafo da pgina, ou a primeira frase.
Clique no menu Formatar / Fonte.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 12
FRONTPAGE 2000 APOSTILA





Na caixa Fonte escolha um tipo de letra para o texto.
Observao
Utilize sempre fontes que sejam padro da instalao do Windows. Isso se deve ao
fato de que ao acessar uma pgina na Internet e uma fonte especificada, essa
fonte precisar ser localizada no micro do usurio no no local onde a pgina est
hospedada (armazenada). E a maioria das pessoas no possuem uma biblioteca de
fontes muito grande no micro. As fontes que atualmente esto sendo mais utilizadas
so Arial, Tahoma e Verdana.
Na caixa Estilo da fonte determine qual ser o estilo de fonte utilizado. Na caixa
Tamanho escolha qual ser o tamanho da fonte para o texto. Na caixa Cor escolha
uma cor para ser aplicada ao texto.
Ao clicar na caixa Cor notar que so mostradas as cores padres, as cores que se
encontram no documento e a opo Mais cores que utilizaremos para criar uma cor
diferente das existentes.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 13
FRONTPAGE 2000 APOSTILA





Clique na opo Mais cores, ser mostrada a janela a seguir:

Clique em uma das cores para selecion-la, mas se a cor que voc est precisando
no est sendo visualizada nesta tela poderemos cri-la ou selecion-la de um
objeto que est na pgina.
Para criar um nova cor, clique no boto Personalizar, a janela a seguir ser
mostrada:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 14
FRONTPAGE 2000 APOSTILA





Primeiro clique na cor que ser a principal, depois mova o Controle de
luminosidade da cor at que a caixa Cor Slido mostre a cor no tom desejado.
Seguindo estes passos voc est criando um cor personalizada, para grav-la clique
no boto Adicionar s cores personalizadas.
Para utilizar a cor que acabou de ser criada clique no boto OK, novamente em OK
e no boto OK da janela Formatar Fonte.
Esto disponveis tambm vrios efeitos que podem ser utilizados na formatao da
fonte, ao clicar sobre o efeito uma visualizao ser mostrada. Teste cada um dos
efeitos e o que for realmente necessrio deixe marcado. (Sugerimos que utilize a
opo Forte).
Depois de fazer as configuraes necessrias clique no boto OK.
1.13 Para que Serve Formatar o Pargrafo
Formatar pargrafo significa dar forma, melhorar a aparncia do texto. Em pginas
para Internet a formatao deve ser bem feita para no expulsar o usurio do site.
Usando a formatao voc conseguir transformar o seu site em um ponto atraente
da Internet, fazendo com que usurios que visitaram o seu site, voltem outras vez
para ver as informaes importantes e as formataes novas que voc est criando.
Formatao envolve fonte, pargrafo, bordas, efeitos e vrios itens que veremos no
decorrer deste material.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 15
FRONTPAGE 2000 APOSTILA




1.14 Como Funciona a Formatao de Pargrafo
Alm de fazermos a formatao de fonte, ser necessrio fazermos a formatao de
pargrafos. Primeiro definiremos o alinhamento dos pargrafos, ou seja, a posio
dos pargrafos em relao s margens da pgina.
Abra a web Zoolgico que est na pasta c:\Meus documentos \ Zoologico. Depois
abra o arquivo index, clique no modo Pastas e d um clique duplo sobre o nome do
arquivo. Selecione o primeiro pargrafo (Posicione o ponteiro do mouse na margem
esquerda da pgina, a seta apontar para a direita, d um clique duplo). Clique no
Formatar / Pargrafo.

No FrontPage h quatro tipos de alinhamento: Centralizado, Esquerdo, Direito e
J ustificado. Como estamos com o pargrafo de ttulo da pgina, vamos utilizar o
alinhamento Centralizado. Clique na seta da caixa Alinhamento e marque a opo
Centralizado. E clique em OK.
Este alinhamento pode ser feito pelos botes na barra de Formatao,
mas podemos notar que o cone Justificar no est na barra de Formatao. Para
justificar um pargrafo devemos utilizar o menu Formatar / Pargrafo.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 16
FRONTPAGE 2000 APOSTILA




Selecione os outros dois pargrafos da pgina (posicione o ponteiro do mouse na
margem esquerda da pgina, a seta apontar para a direita, clique, mantenha o
boto pressionado e arraste at a ltima linha do terceiro pargrafo) e os justifique.
Note que no modo Normal esta formatao aparentemente no funcionou. Temos
trs maneiras diferentes de visualizar a pgina no FrontPage. O modo Normal,
HTML e o Visualizao. Para selecionar qualquer um deles utilize as guias na parte
inferior da tela, conforme a figura a seguir:

O modo Normal utilizado para a criao da pgina, que onde estamos
trabalhando. O modo HTML o utilizado para visualizar e alterar o cdigo HTML que
foi gerado pelo FrontPage. O modo Visualizao utilizado para visualizar a pgina
como se estivesse em um navegador.
Salve o arquivo e clique no modo de Visualizao, perceber que os pargrafos
esto justificados.
1.15 Recuos
Alm de justificar os pargrafos gostaria que a primeira linha estivesse recuada, ou
seja, afastada da margem esquerda e apenas o segundo pargrafo estivesse
recuado direita e esquerda.
Para controlar o recuo de primeira linha:
1. Selecione o pargrafo e clique no menu Formatar / Pargrafo.
2. No grupo Recuos escolha a quantidade de pixels que ser utilizada para
Recuar a primeira linha.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 17
FRONTPAGE 2000 APOSTILA





3. Clique em Ok e visualize a aparncia do pargrafo.
4. Agora selecione apenas o segundo pargrafo para fazermos os recuos
direita e esquerda. O recuo pode ser aplicado pelos cones Aumentar
recuo , ou Diminuir recuo . Quando estes cones so utilizados, o
recuo aplicado esquerda e direita simultaneamente na mesma
proporo.
5. Mas voc pode definir exatamente a quantidade de pixels dos recuos, clique
no menu Formatar / Pargrafo e na caixa Antes do texto digite a quantidade
de pixels para o recuo, este ser o recuo esquerda. Na caixa Depois do
texto tambm digite a quantidade de pixels, este ser o recuo direita. Para
o nosso exemplo utilize 30 pixels em cada um dos recuos.
6. Clique em OK e visualize o resultado clique na guia Visualizao.
1.16 Espaamentos
Podemos perceber que entre os pargrafos existe um espao, este chamado de
espaamento entre pargrafos. Existem tambm os espaos aplicados entre as
palavras do pargrafo e entre as linhas de um pargrafo.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 18
FRONTPAGE 2000 APOSTILA




Sendo que no pargrafo abaixo do ttulo gostaria de utilizar um espaamento entre
as linhas de 1,5 e o espaamento antes maior do que o j utilizado, selecione este
pargrafo e:
1. Clique no menu Formatar / Pargrafo.
2. No grupo Espaamento defina a medida em pixels dos espaamentos Antes,
Depois, Palavra e Espaamento de linhas, conforme o necessrio.
Lembre-se de utilizar um Espaamento de linha da mesma altura da fonte
ou maior, para que as linhas do pargrafo no fiquem sobrepostas.
Para o nosso exemplo, no grupo Espaamento na caixa Antes digite 50, e
no Espaamento de linhas escolha a opo 1,5 linhas.

3. Clique em OK. Os pargrafos estaro com a seguinte aparncia:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 19
FRONTPAGE 2000 APOSTILA





1.17 Qual a Aplicao dos Efeitos de Animao
Os efeitos de animao criam um impacto mais forte quando os visitantes acessam
o site, do que estarmos utilizando apenas textos simples.
Quando precisamos destacar uma notcia em um ponto do site, ou quando
precisamos chamar ateno a um assunto importante em nosso site, utilizamos
estes efeitos.
Para animar um texto usando o FrontPage ser necessrio utilizar efeitos de HTML
Dinmico. Mas no precisaremos programar em HTML o prprio FrontPage traz
vrios efeitos que podem ser aplicados ao texto em vrios eventos diferentes como
ao carregar a pgina, ou executar o efeito se o usurio passar o mouse sobre o
texto, etc.
1.18 Como Funcionam os Efeitos de Animao
Para aplicar um efeito ao texto, selecione o texto que gostaria de aplicar o efeito. No
nosso exemplo vamos acrescentar um novo pargrafo. O texto ser: "Venha nos
visitar! Conhea nosso novo elefante e nos ajudem colaborando com um nome para
o nosso novo hspede!"
Aps digitar o pargrafo, selecione-o:
1. Clique no menu Formatar / Efeitos de HTML dinmico. Ser mostrada a
seguinte barra de ferramentas:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 20
FRONTPAGE 2000 APOSTILA





2. Primeiro escolha o evento, ou quando acontecer o efeito. Para texto o ideal
o evento Carregar pgina. Assim que marcar qual o evento voc poder
escolher o Efeito.
3. Na caixa Aplicar escolha um dos efeitos. Uma sugesto utilizar a opo
Saltar. Mas no deixe de experimentar os outros efeitos.
Alguns efeitos precisam de ser configurados. Quando for necessrio
configur-lo ser aberta a terceira caixa da barra de Efeitos de HTML
dinmico, nesta caixa voc encontrar as configuraes que so permitidas
para o efeito escolhido.

Ao escolher o efeito o texto ser destacado com um quadro, mostrando que ali
existe um efeito de HTML dinmico. Se quiser retirar este destaque do texto, clique
no boto. Ao escolher o efeito o texto ser destacado com um quadro, mostrando
que ali existe um efeito de HTML dinmico. Se quiser retirar este destaque do texto,
clique no boto . Realar os efeitos de HTML dinmico.

Para testar o efeito aplicado, visualize a pgina. Voc pode visualizar utilizando a
guia Visualizao ou visualizar a pgina que est criando no navegador, basta
clicar no boto Visualizar no navegador que o mais aconselhvel.
Lembre-se de Salvar o arquivo antes de visualiz-lo.
Ao clicar neste boto uma janela do navegador instalado em seu computador
ser aberta. Se voc possuir mais de um navegador instalado em seu
computador (ex.: Internet Explorer e Netscape Navigator) ser aberto o
navegador que voc definiu como padro. Para abrir a pgina no navegador
especfico, clique no menu Arquivo / Visualizar no navegador, clique sobre
o navegador desejado para selecion-lo e clique no boto Visualizar.
Para modificar o efeito, clique na caixa Aplicar da barra de ferramentas Efeitos de
HTML dinmico, selecione o pargrafo novamente e escolha outro efeito.
Para remover o efeito de um texto, selecione o texto e clique no boto Remover
efeito na barra de ferramentas Efeitos de HTML dinmico.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 21
FRONTPAGE 2000 APOSTILA




Observao
Se a barra de Efeitos de HTML dinmico no estiver visvel, clique novamente no
menu Formatar / Efeitos de HTML dinmico.
1.19 O que Fazem e qual a Aplicabilidade das Linhas Horizontais
As linhas horizontais criam um trao em baixo relevo que divide a pgina onde foi
inserida.
Quando estamos tratando de assuntos ou tpicos diferentes dentro de uma mesma
pgina do site necessrio inserir uma marca visual indicando a mudana do
assunto ou do tpico, as linhas horizontais fazem esta diviso com clareza. Estas
linhas so muito utilizadas em sites de FAQs (Questes mais freqentes), onde so
respondidas as dvidas mais freqentes dos usurios. Entre uma pergunta e outra
acrescentada uma linha para que no seja feita confuso entre as respostas.
1.20 Como as Linhas Horizontais Funcionam
Vamos inserir um trao horizontal, na pgina Index que estamos construindo para o
zoolgico. Clique abaixo da caixa demarcada com a animao do texto.
Para inserir um trao horizontal:
1. Clique no menu Inserir / Linha Horizontal.
2. Ser mostrada uma linha ocupando toda a largura da tela. Podemos
configurar esta linha. D um clique duplo sobre ela.

3. Na caixa Largura defina o tamanho do trao. Voc poder defini-lo em Pixels
ou pela Porcentagem da janela que o mais aconselhvel, porque
independente da resoluo do monitor do visitante do seu site, o trao ser
adaptado ao tamanho da tela. No nosso site escolha 80% da Porcentagem da
janela.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 22
FRONTPAGE 2000 APOSTILA




4. Na caixa Altura defina a espessura do trao em pixels. No nosso exemplo
escolha 4 pixels.
5. Quando definimos que o tamanho do trao ser menor que 100% da tela,
necessrio definir o alinhamento deste trao. Na caixa Alinhamento escolha
uma das opes: esquerda, Centralizado ou direita. Para o nosso
exemplo utilizaremos Centralizado.
6. Voc poder escolher uma cor para o trao. Clique na seta da caixa Cor e
escolha a cor que desejar.
Ao escolher uma cor para o trao ele se tornar slido, como se
estivesse clicando na caixa Linha slida.
7. Aps fazer todas as alteraes clique em OK. Salve o arquivo que est
trabalhando.
1.21 O que e para que Serve o Letreiro Digital
O letreiro digital anima o texto escolhido como um mensagem de um placar
eletrnico. O texto rola de um lado para outro com a velocidade determinada.
Voc pode utilizar o letreiro digital para dar notcias recentes respeito do site, para
informar sobre promoes, novidades, chamando a ateno para um determinado
assunto.
1.22 Como Funciona o Letreiro Digital
Vamos inserir um letreiro digital na pgina index do site do zoolgico, abra o arquivo
e posicione o cursor no incio do primeiro pargrafo (abaixo do ttulo), pressione a
tecla ENTER para gerar um novo pargrafo.
Para inserir um letreiro digital:
1. Clique no menu Inserir / Componente / Letreiro digital.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 23
FRONTPAGE 2000 APOSTILA





2. Na caixa Texto digite a mensagem desejada. Para o site do zoolgico "Venha
conhecer os nossos novos animais e ajude-nos a batizar o novo gorila do
Zoo!".
3. No grupo Direo escolha para qual lado o texto ser movimentado primeiro,
para a Esquerda ou para a Direita. Deixe a opo Esquerda marcada.
4. No grupo Velocidade devemos definir o Intervalo que o tempo, em
milissegundos, que o texto do letreiro digital aguarda antes de mover.
Tambm necessrio definir a Quantidade que a velocidade do texto em
pixels (a quantidade de pontos que o monitor utiliza para formar as imagens).
Nesta opo digite 10.
5. Na opo Comportamento escolha como o texto ser animado. Rolar, rola o
texto na direo selecionada. Deslizar, desliza o texto a partir da direo
selecionada at a borda oposta da janela e fica parado nesta posio.
Alternar, alterna o texto entre rolagem e deslizamento. Selecione a opo
Rolar.
6. Como o Letreiro Digital um objeto na pgina ele pode ser posicionado ao
lado de um texto. Se for necessrio utilizar o Letreiro Digital dessa forma voc
dever escolher como esta caixa ser alinhada em relao ao texto. No grupo
Alinhar com o texto marque a opo que for mais apropriada. No nosso
caso Parte superior.
7. No grupo Tamanho podemos definir a altura e a largura do Letreiro Digital,
em pixels. Mas se voc no sabe o tamanho exato da caixa utilize as alas de
redimensionamento depois que terminar de alterar as propriedades do
Letreiro Digital.
8. No grupo Repetir voc define como o Letreiro Digital ser exibido na pgina
ativa se Continuamente, enquanto o usurio estiver visualizando a pgina o
letreiro estar executando o comportamento selecionado. Se desmarcar esta
opo a caixa Vezes ser habilitada para que voc defina a quantidade de
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 24
FRONTPAGE 2000 APOSTILA




vezes que o comportamento do Letreiro Digital executar o comportamento
definido.
9. Podemos tambm definir a Cor do plano de fundo do Letreiro Digital. Clique
na seta da caixa Cor do plano de fundo e escolha a cor que desejar. A
opo Automtico define a cor do plano de fundo como transparente.
10. Clique no boto OK.

A imagem acima mostra a aparncia do Letreiro Digital aps clicar em OK. As caixas
pretas que aparecem em volta do Letreiro Digital so as alas de
redimensionamento, que tambm indicam que o objeto est selecionado. Posicione
o ponteiro do mouse sobre uma delas, o ponteiro se transformar em uma seta com
duas pontas, clique, mantenha o boto pressionado e arraste para a direo que
precisar para aumentar ou diminuir o tamanho do Letreiro Digital.
Para o letreiro que estamos criando, arraste a ala central do lado direito at o final
da palavra "batizar".
Tambm vamos modificar a fonte do Letreiro Digital. Se o letreiro no estiver
selecionado, clique sobre ele. Utilize o menu Formatar / Fonte ou a barra de
Formatao para alterar as formataes do letreiro digital. Escolha uma fonte, uma
cor e o tamanho que desejar. Depois centralize o letreiro.
Salve o arquivo, e clique no boto Visualizar no navegador. Se desejar, volte ao
FrontPage e altere o comportamento do Letreiro Digital, salve o arquivo e visualize
no navegador para escolher o que acha mais interessante.
1.23 O que e qual a Aplicabilidade do Contador de Acessos
O contador de acesso registra quantas vezes a pgina foi visitada, ou seja, quantos
visitantes acessaram o site.
Voc utiliza o contador de acesso quando quer mostrar ao seu pblico o nmero de
visitantes do site, indicando se est sendo muito ou pouco visitado. Tambm para
um retorno se o investimento com o site foi vlido ou no. O contador de acesso
um indicador da aceitabilidade do site para o pblico.
1.24 Como Funciona o Contador de Acesso
Clique abaixo da linha horizontal e clique no menu Inserir / Componente /
Contador de acesso.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 25
FRONTPAGE 2000 APOSTILA





Escolha um dos modelos de contadores que o FrontPage oferece.
Se voc quiser definir o nmero inicial do contador de acesso, marque a caixa
Redefinir o contador para e digite o nmero inicial.
Se desejar que a aparncia do contador seja com um nmero fixo de dgitos
independente do nmero de acessos, marque a opo Nmero fixo de dgitos e
digite a quantidade de dgitos desejada. Clique em OK.
Ser mostrado na pgina o texto [CONTADOR DE ACESSO]. Salve o arquivo.
Observao
Este contador de acesso que o FrontPage oferece s funciona quando o provedor
onde a pgina ser publicada possuir as extenses do FrontPage. Portanto, ao
visualizar a pgina no navegador ser mostrado apenas o espao do contador.
Este contador de acesso tambm no vlido para concursos com o nmero de
visitantes do site, porque como vimos podemos inicializ-lo com o nmero que
desejarmos. Para ter um contador de visitantes confivel, solicite ao provedor onde
seu site ser hospedado o contador de acessos que ele disponibiliza. Ser enviado
um cdigo HTML que voc dever inserir no ponto da pgina onde o contador
dever ser mostrado.
1.25 Qual o objetivo das Propriedades da Pgina
Acessamos as propriedades da pgina para alterar o plano de fundo, para definir
ttulo para pgina, alterar margens, determinar as cores dos links visitados e ativos,
entre outros.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 26
FRONTPAGE 2000 APOSTILA




Atravs das propriedades das pginas podemos escolher qual a melhor aparncia
para o site. A cor que utilizamos como fundo da pgina pode afastar ou atrair mais
visitantes. Se escolhermos cores de links que no ficam visveis com a cor de fundo
estaremos confundindo os visitantes do site. Ento definir as propriedades das
pginas essencial para o desenvolvimento do site.
1.26 Acessando as Propriedades da Pgina e Alterando o Plano de Fundo
Para acessar as propriedades da pgina, clique com o boto direito do mouse sobre
qualquer ponto da pgina e clique na opo Propriedades da pgina ou clique no
menu Arquivo / Propriedades.
Mudando o Plano de Fundo
Plano de fundo o nome dado ao fundo de pgina e pode ser uma figura (GIF ou
J PG) ou simplesmente uma cor. H duas formas para escolher um plano de fundo,
uma delas clicar no menu Formatar / Plano de fundo. Outra acessar as
propriedades da pgina clicando com o boto direito do mouse em qualquer ponto
da tela e selecionando a opo Propriedades da pgina.
Clique na guia Plano de fundo.

Para definir uma Cor como plano de fundo
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 27
FRONTPAGE 2000 APOSTILA




1. Acesse as propriedades da pgina conforme descrito no item anterior.
2. Clique na guia Plano de fundo. Na caixa Plano de fundo estar uma cor
padro, escolha uma outra cor e clique em OK.
Definindo uma figura como plano de fundo
1. Habilite a opo Figura de plano de fundo e clique no boto Procurar.

2. Voc poder escolher uma figura que j faz parte da sua Web clicando sobre
o nome da mesma na lista de arquivos que aparece (normalmente as figuras
ficam armazenadas na pasta Images) ou escolher uma das outras duas
opes indicadas na figura acima. Vamos inserir uma imagem do winchester.
Clique no boto .
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 28
FRONTPAGE 2000 APOSTILA





3. Na caixa Examinar selecione o c:\gifs\zoologico, na lista de arquivos
selecione o fundo.jpg. Aps escolher a figura, clique em OK.
4. A opo Marca dgua quando habilitada, fixa a figura que est como Plano
de fundo da pgina de forma que ao usar a barra de rolagem, o texto
deslocar pela tela, porm a figura permanecer na mesma posio.
5. Clique OK novamente e veja na tela como ficou a pgina. Salve o arquivo.
6. Ao clicar no boto Salvar ser exibida a janela Salvar arquivos
incorporados.

7. Esta janela ser exibida sempre que voc inserir na pgina um arquivo
externo, (uma imagem, som, vdeo). Voc pode renomear o arquivo clicando
no boto Renomear. Os nomes de arquivos para Internet, preferencialmente,
devem ter apenas 8 dgitos, no utilizar letras maisculas, no utilizar
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 29
FRONTPAGE 2000 APOSTILA




acentuao e espaos em branco, porque alguns provedores tm restries
aos nomes devido ao sistema operacional utilizado.
8. O ideal tambm definir em qual pasta o arquivo ser salvo. Clique no boto
Alterar pasta e selecione a pasta Images e clique em OK. Assim
manteremos organizado o site. Clique em OK novamente, o arquivo est
salvo. Se desejar, clique no boto Visualizar no navegador para navegar na
pgina.
1.27 Definindo a Cor Padro de Texto e o Ttulo da Pgina
Definindo a cor padro do texto
Tambm podemos escolher qual a cor padro para o texto da pgina que estamos
criando. Acesse as propriedades da pgina, de uma das formas j citadas.
Na caixa Texto escolha uma cor. Esta ser definida como a cor padro para os
textos da pgina, clique em OK. Lembre-se de escolher uma cor que fique legvel
com o plano de fundo que est utilizando.
Definindo o ttulo da pgina
Em um navegador, o ttulo da pagina aparece na barra de ttulo, ou seja, na parte
mais alta da tela. Este ttulo serve para identificar a Home Page, ajudando o visitante
a reconhecer a pgina que esta navegando.
Para definir o ttulo da pgina, siga os seguintes passos:
1. Clique com o boto direito do mouse em qualquer ponto da pgina.
Selecione a opo Propriedades da pgina.
2. Verifique se a guia Geral est selecionada. Na caixa Ttulo, digite o
ttulo desejado e clique em OK. Para o nosso site o ttulo desta pgina
ser "Zoolgico de Belo Horizonte".
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 30
FRONTPAGE 2000 APOSTILA





1.28 Definindo as Cores dos Hyperlinks
Trs cores podem ser definidas para um hyperlink:
Hyperlink: a cor que aparecer na tela em todos os hyperlinks que ainda no
foram visitados.
Hyperlink Visitado: a cor que aparecer na tela em todos os hyperlinks que j
foram visitados, ou seja, todas as pginas do site que j foram visitadas.
Hyperlink Ativo: a cor que aparecer na tela para o hyperlink que estiver
selecionado.
Para definir estas cores, acesse as Propriedades da pgina conforme descrito
acima e na guia Plano de fundo, escolha as cores desejadas.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 31
FRONTPAGE 2000 APOSTILA





1.29 O que fazem e qual a Aplicabilidade dos Temas
Os temas alteram o efeito de toda a pgina da Web. Eles personalizam a fonte, cor,
altura e as caractersticas do texto de maneira que as informaes fiquem em
harmonia com o modo que os grficos aparecem. Automatizam a coordenao entre
grficos de fundo, cores, marcadores, manchetes e linhas horizontais.
Usar Temas como usar um decorador de interiores em cada pgina do site e
garantir que todas as pginas combinem agradavelmente umas com as outras. Os
temas possibilitam que voc construa um site inteiro no qual todos as pginas
exibam uma aparncia coerente, o que auxilia o visitante da sua Web a percorr-lo
de uma forma mais agradvel e simples.
O uso de temas, alm de melhorar a aparncia, muitas vezes, diminui o tempo de
download do seu site da Web. Se, para tentar emular o modo pelo qual os temas
funcionam, voc inserir vrios grficos e imagens na sua pgina, rapidamente
descobrir que o download de cada pgina poder levar um bom tempo. Os temas
do FrontPage, por outro lado, tiram proveito de cache do navegador e permitem que
voc faa download de diversos grficos apenas uma vez, mas os veja em vrias
pginas.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 32
FRONTPAGE 2000 APOSTILA




1.30 Como os Temas Funcionam
Para definir um Tema vlido para todo um site, primeiro abra o site da Web do
FrontPage que voc deseja alterar. Vamos abrir o site do Zoolgico que est na
pasta c:\ Meus documentos \ zoolgico.
1. Clique no menu Formatar / Tema.

2. Escolha um dos temas da lista de acordo com a visualizao que mais lhe
agradar.
3. Logo abaixo da caixa que contm a lista de temas, encontra-se um conjunto
de trs caixas de verificao que permitem que voc escolha e use apenas
certas partes de um tema que voc desejar:
Cores vivas: ativa e desativa o uso de cores vivas e brilhantes.
Elem. grficos ativos: ativa e desativa GIFs animados.
Figura de plano de fundo: quando ativado, aplica a imagem de fundo do
tema, no permitindo que voc personalize.
4. Clique no boto OK e o FrontPage percorrer todo o site e, a cada pgina,
acrescentar os componentes do tema.
5. Abra o arquivo index e veja como ele ficou aps o uso do tema.
1.31 Personalizando os Temas
Voc tambm poder formatar ou personalizar um tema com as suas preferncias
de cor, fonte e elementos grfico.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 33
FRONTPAGE 2000 APOSTILA




Clique no menu Formatar / Tema e clique no boto Modificar.

Ao clicar no boto Modificar voc visualizar os botes para modificar Cores,
Elementos grficos e Texto.
1.32 Alterando as Cores do Tema
Para modificar as cores clique no boto Cores.
Ser mostrado na guia Esquema de cores os esquemas j existentes. Ao clicar em
qualquer um dos esquemas, as cores selecionadas sero mostradas na caixa de
visualizao do lado direito da tela.
Tambm possvel utilizar um disco de cores onde o FrontPage joga as cores mais
apropriadas para fazerem jogo com a que voc escolheu.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 34
FRONTPAGE 2000 APOSTILA





Se desejar poder alterar o brilho das cores movendo o controle deslizante de
Brilho.
Mas voc poder escolher uma cor especfica para cada elemento da pgina. Clique
na guia Personalizar, escolha qual elemento voc quer alterar a cor na caixa Item e
depois altere a Cor.

Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 35
FRONTPAGE 2000 APOSTILA




Faa as alteraes de cores que desejar, utilize as cores que mais gosta, e clique
em OK.
1.33 Alterando os Elementos Grficos
Os elementos grficos so todos as imagens que fazem parte do tema, como a faixa
de pgina, os marcadores, a linha horizontal, a barra de navegao e etc. Ao alter-
los voc estar modificando radicalmente o tema. Clique no boto Elemen. grfico
ser exibida a seguinte janela:

1. Primeiro selecione o Item que ser alterado o grfico. Vamos alterar a Lista
com marcadores.
2. Conforme o item escolhido ser necessrio alterar mais de uma figura. No
caso do item Lista com marcadores teremos que escolher trs figuras.
Clique no boto Procurar e escolha uma imagem que j est na Web ou uma
imagem do winchester. Clique no boto para procurar no winchester, v at a
pasta c:\ Arquivos de Programas \ Arquivos comuns \ Microsoft Shared \
Clipart \ themes1 \ bullets e selecione o arquivo bd14752.gif. Clique em OK e
OK novamente.
Lembre-se que s podero ser utilizadas imagens no formato .gif, .jpg ou
.png.
Selecione o item Faixa, para alterar a fonte do texto da faixa.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 36
FRONTPAGE 2000 APOSTILA




Clique na guia Fonte escolha uma fonte, escolha um Tamanho, defina o Estilo, e
qual o Alinhamento horizontal e Vertical do texto.
Clique em OK.
1.34 Alterando o Formato do Texto
Para cada tipo de texto que temos em uma pgina uma fonte diferente pode ser
definida. Como por exemplo, ttulos, sub-ttulos, corpo de texto, etc.
Fazendo esta alterao no tema ser bem mais rpida a construo do site.
Clique no boto Texto.

1. Primeiro selecione o Item que ser alterado. Selecione o item Ttulo 1.
2. Depois escolha a fonte que ser utilizada. Voc poder visualiz-la do lado
direito da tela.
Para alterar outros estilos de texto, clique no boto Mais estilos. Escolha qual
ser o comando HTML a ser formatado.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 37
FRONTPAGE 2000 APOSTILA





Clique no boto Modificar e dentro da janela que ser exibida clique no boto
Formatar e escolha qual o tipo de formatao desejar.
3. Aps alterar todos os estilos de texto clique em OK e em OK novamente.
1.35 Salvando o Tema
Se voc vai utilizar essas mesmas formataes em outros sites conveniente salvar
essas formataes em um novo tema.
Clique no boto Salvar como e digite um nome significativo para o tema criado.
Para o nosso site digite Zoolgico. Depois clique no boto OK. Desta maneira o
tema personalizado est salvo e poder ser utilizado em outros sites.
Clique em OK, o tema ser aplicado na pgina.
Para que os estilos de texto sejam utilizados em textos j formatados como no caso
da pgina Index, voc deve selecionar o pargrafo e aplicar o estilo, clicando na
caixa Estilo. Assim as formataes do tema sero aplicadas a pginas
j prontas.
Salve o arquivo Index.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 38
FRONTPAGE 2000 APOSTILA




1.36 Conhecendo os Tipos de Imagens para Internet
Imagens, ou grficos, podem ser fotografias, cones, botes e outros elementos. Em
geral, todos os grficos existentes na Web encontram-se em um dos dois formatos
famosos: GIF e J PEG.
GIF a abreviatura de Graphical Interchange Format e esse formato foi
originalmente desenvolvido para constituir um eficiente e flexvel meio para as
pessoas de todo o mundo enviarem grficos de computador umas s outras.
Transformaram-se no primeiro tipo de arquivos grficos a encontrar suporte na
WWW. As imagens GIF aceitam o uso de somente 256 cores. Esta limitao ajuda a
manter baixo o tamanho dos arquivos que contenham pequenos grficos, mas no
funcionam muito bem com grandes imagens e, em particular, com fotografias.
O formato J PEG, ou J oint Photographic Expert Group, foi projetado especificamente
para fotografias e imagens com milhes de cores. O formato J PEG provou ser
significativamente mais eficiente quanto compactao eletrnica de grandes
fotografias e atualmente encontra suporte em praticamente todos os navegadores
grficos da Web. Geralmente, as imagens J PEG lidam com cores e detalhes de
imagens melhor que as imagens GIF.
Normalmente, o formato GIF empregado em cones, botes, barras e fundos. Os
arquivos J PEG so usados mais freqentemente em fotografias, logotipos
complexos e mapas. O FrontPage lida sem problemas com ambos.
Como nem todas as imagens que voc desejar usar vm num desses formatos
reconhecveis, o FrontPage possui um conjunto prprio de filtros que
automaticamente convertem imagens de todos os tipos para o padro GIF ou J PEG.
As imagens sero salvas no padro GIF se usarem apenas 256 cores diferentes e
sero salvas no padro J PEG se usarem mais cores. O FrontPage converte
automaticamente TIFF, PCX, BMP e vrios outros formatos sempre que voc usar
um deles na pgina Web.
1.37 O que as Imagens Fazem e qual a sua Aplicabilidade
As imagens transmitem aos visitantes do site uma idia que, se colocada em
palavras no causaria tanto impacto. Alm de transformarem o site em um ambiente
agradvel de obter informaes ou servios.
As imagens transmitem idias com mais impacto que o texto. Sempre utilize
imagens no site para mostrar os produtos, os servios, para identificar as pessoas
que fazem parte da equipe. Atravs das imagens podemos conhecer cidades sem
nunca ter passado por perto delas. Mostre o seu negcio ou a sua pessoa utilizando
imagens no site.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 39
FRONTPAGE 2000 APOSTILA




1.38 Inserindo Clip-art
Podemos inserir imagens de duas formas no site, as imagens do Clip-art do Office
ou imagens que estejam armazenadas no winchester.
Clip-Art
O FrontPage vem com uma grande quantidade de imagens que voc pode usar na
pgina da Web. H aproximadamente 400 cones, barras, botes e marcadores que
podem ser inseridos ou personalizados para a sua pgina da Web. Alm disto, se
voc possui o Microsoft Office 95 ou 97ou 2000, voc ter o clip-art deste Office
tambm sua disposio.
Inserindo um Clip-art
Vamos abrir o site do zoolgico que est na pasta com as iniciais do seu nome
dentro da pasta Personal Class.
1. Insira uma nova pgina no site. Clique no boto Nova pgina na barra de
ferramentas padro.
2. Clique no menu Inserir / Figura / Clip-art.

3. As figuras so exibidas por Categorias. Clique sobre o nome da categoria,
como estamos criando o site para o zoolgico, clique na categoria Animais.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 40
FRONTPAGE 2000 APOSTILA




4. Observe as figuras e clique sobre a figura do leo. Ser mostrado um
pequeno menu onde voc poder escolher entre quatro opes.

5. Para inserir uma imagem clique no boto Inserir clipe.
Depois de ter includo a imagem, voc pode arrast-la e solt-la em diferentes
pontos da pgina. Basta posicionar o ponteiro do mouse sobre a imagem,
clicar, manter o boto pressionado e arrastar para o ponto desejado, desde
que seja um pargrafo.
No caso da figura do leo ao inseri-la na pgina podemos notar um fundo
branco que no deu uma aparncia muito boa pgina. Este fundo nos
mostra que esta imagem no est transparente. O FrontPage traz um recurso
que torna uma cor da imagem transparente.
Selecione a imagem do leo (clique sobre ela), ao selecion-la ser mostrada
uma barra de ferramentas na parte inferior da janela.

1. Insere uma figura de um arquivo que est no winchester.
2. Insere texto sobre a imagem.
3. Cria uma miniatura da imagem, desde que esta no seja muito pequena.
4. Define uma posio absoluta para a imagem, ou seja, a posio que a
imagem for inserida ser gravada e independente da resoluo do monitor do
visitante, a imagem ser sempre mostrada naquela posio.
5. Define a posio absoluta da imagem e traz a imagem para frente dos outros
objetos ou texto.
6. Define a posio absoluta da imagem e leva a imagem para traz dos outros
objetos ou texto.
7. Gira a imagem para a esquerda.
8. Gira a imagem para a direita.
9. Inverte a imagem horizontalmente. Ex.: uma seta para a esquerda aps
utilizar este boto estar para direita.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 41
FRONTPAGE 2000 APOSTILA




10. Inverte a imagem verticalmente. Ex.: uma seta para cima aps utilizar este
boto estar para baixo.
11. Aumenta o contraste entre as partes mais claras e as mais escuras da
imagem.
12. Diminui o contraste entre as partes mais claras e as mais escuras da imagem.
13. Aumenta o brilho das cores da imagem.
14. Diminui o brilho das cores da imagem.
15. Corta parte da figura que estiver selecionada.
16. Define uma o cor da imagem como transparente.
17. Modifica uma imagem em cores para preto e branco.
18. Desbota as cores da imagem.
19. Cria um efeito chanfrado na imagem, como se fosse um boto tridimensional.
20. Cria uma amostra de uma imagem redimensionada.
21. Seleciona imagens.
22. Cria uma rea interativa em forma de retngulo.
23. Cria uma rea interativa em forma de crculo.
24. Cria uma rea interativa em forma de polgono.
25. Mostra as reas interativas da imagem, sem mostrar a imagem.
26. Restaura todas as propriedades originais da imagem, tamanho, cores, brilho,
contraste, etc.
Para definir fundo branco como transparente, clique no boto Definir cor
transparente e clique sobre o fundo branco da imagem.
Para redimensionar uma imagem:
1. Selecione a imagem.
2. Envolta sero mostradas umas caixas pretas, que so as alas de
redimensionamento.
3. Posicione o ponteiro do mouse sobre uma dessas alas, o ponteiro se
transformar em uma seta com duas pontas, clique, mantenha o boto
pressionado e arraste at atingir o tamanho desejado.
Alm disso, voc pode dar um clique duplo em qualquer imagem e o FrontPage
ativar o programa de edio de imagens que estiver configurado, permitindo que
voc faa modificaes nessa imagem especfica.
Observao
Para posicionar figuras uma ao lado da outra ser necessrio utilizar tabelas, que
veremos em outro tpico.

1.39 Configurando o Editor de Imagens
Para verificar o editor de imagens configurado no FrontPage, clique no menu
Ferramentas / Opes, na guia Configurar editores veja se existe algum editor
configurado para arquivo do tipo gif ou jpg.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 42
FRONTPAGE 2000 APOSTILA





Se no existir nenhum editor configurado conforme a figura anterior, clique no boto
Adicionar e preencha os campos com as informaes solicitadas.
1.40 Inserindo Imagens de Arquivos
Qualquer imagem pode ser inserida no FrontPage. Faa o download dos arquivos de
imagem que sero utilizados no site clicando aqui. Este arquivo est compactado.
Crie na rea de trabalho do seu micro uma pasta chamada gifs e descompacte nela
o arquivo zoo.zip que voc acabou de fazer o download.
Para isto:
1. Clique no menu Inserir / Figura / Do arquivo ou no boto Inserir figura
do arquivo na barra de ferramentas.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 43
FRONTPAGE 2000 APOSTILA





2. Para inserir uma figura que j faz parte da sua Web, localize-a na lista de
arquivos e clique sobre ela.
3. Se a imagem ainda no faz parte da sua Web, escolha uma das opes pela
internet, um arquivo do winchester, pelo scanner ou um clip-art, indicadas
na figura acima.
4. Selecione a imagem do leo e apague-a. Clique no boto para inserir uma
imagem do winchester. V at a pasta Gifs que est na rea de trabalho,
dentro da pasta zoolgico selecione a figura caldae.gif e clique em OK.
5. A imagem foi inserida. Clique no menu Inserir / Figura / Do arquivo e no
winchester na pasta zoolgico que est dentro da pasta gifs (que j est
sendo mostrada), escolha a imagem logoleao.gif e clique em OK.
6. Clique no menu Inserir / Figura / Do arquivo e no winchester na pasta
zoolgico que est dentro da pasta gifs (que j est sendo mostrada), escolha
a imagem caldad.gif e clique em OK.
7. A imagens foram posicionadas uma ao lado da outra mas na margem
esquerda, o ideal ser centralizado. Clique no boto Centralizar na barra de
Formatao.
8. Salve o arquivo com o nome informacoes, sem acentuao como j
dissemos antes. Assim que voc escolher um nome ser exibida a janela para
salvar arquivos incorporados.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 44
FRONTPAGE 2000 APOSTILA





9. Clique no boto Alterar pasta e selecione a pasta Images. Clique em OK. Se
necessrio redimensione o tamanho das imagens.
10. Altere o ttulo da pgina (Arquivo / Informaes) para Informaes aos
visitantes. Salve o arquivo e visualize-o no navegador.
11. Passe o ponteiro do mouse sobre as imagens, nada acontece. Mas gostaria
que um texto fosse visualizado quando o ponteiro do mouse pairasse sobre a
imagem. Volte ao FrontPage.
12. Clique com o boto direito do mouse sobre a imagem do meio. No menu de
contexto escolha a opo Propriedades da figura.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 45
FRONTPAGE 2000 APOSTILA





13. Na caixa Texto digite "O Zoolgico de Belo Horizonte o aguarda
ansiosamente!". Clique em OK. Salve o arquivo, visualize no navegador.
14. Pare o mouse sobre a parte maior da figura, a mensagem que digitamos ser
exibida.
OBSERVAO:
Se necessrio, o FrontPage converter automaticamente outros tipos de imagem
para o formato GIF ou J PEG.
2. Criando Pginas
Impreterivelmente para seguir os prximos tpicos e execut-los, crie em seu micro
a seguinte hierarquia de pastas: na rea de trabalho, crie a pasta gifs e, dentro da
pasta gifs, crie a pasta zoolgico. Em seguida, faa o download do arquivo zo.zip,
clicando aqui!

2.1 Criando a Pgina Primatas
Voc ir criar agora algumas pginas que sero utilizadas no decorrer desta
disciplina (ou Programa de Aprendizagem). Crie a pgina de acordo com a figura,
seguindo as instrues que esto logo abaixo.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 46
FRONTPAGE 2000 APOSTILA




Pgina primatas

Digite o primeiro pargrafo. Pressione a tecla ENTER para criar o segundo
pargrafo, alinhe-o direita. Insira a figura filme.gif que est na pasta zoolgico que
se encontra dentro da pasta gifs na rea de trabalho. Clique com o boto direito do
mouse sobre a imagem filme e selecione a opo Propriedades da figura, na caixa
Texto digite "Assista um filme", clique em OK.
Insira a figura foto.gif que est na pasta zoolgico que se encontra dentro da pasta
gifs na rea de trabalho. Clique com o boto direito do mouse sobre a imagem foto e
selecione a opo Propriedades da figura, na caixa Texto digite "Veja minha
melhor pose", clique em OK. Deixe o cursor piscando depois do boto foto, e inclua
uma linha horizontal (Inserir / Linha horizontal).
Salve o arquivo com o nome primatas, assim que a janela Salvar arquivo
incorporado for aberta, altere a pasta para Images, se necessrio, clique em OK.
Altere o ttulo da pgina, clicando em qualquer ponto com o boto direito do mouse,
selecionando a opo Propriedades da pgina, digite Primatas na caixa Texto
dentro da guia Geral.
Digite o segundo pargrafo, alinhe-o esquerda. Pressione a tecla ENTER para
criar o segundo pargrafo, alinhe-o direita. Selecione a imagem foto e clique no
boto Copiar na barra de Ferramentas. Clique no pargrafo e pressione o boto
Colar. Assim no precisaremos alterar as propriedades da imagem. Pressione a
tecla ENTER para criar o prximo pargrafo. Deixe o cursor piscando depois do
boto foto, e inclua uma linha horizontal (Inserir / Linha horizontal).
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 47
FRONTPAGE 2000 APOSTILA




Digite o terceiro pargrafo, alinhe-o esquerda. Pressione a tecla ENTER para criar
o segundo pargrafo, alinhe-o direita. Pressione o boto Colar. Assim no
precisaremos alterar as propriedades da imagem.
2.2 Criando a Pgina Marsupiais
Pgina Marsupiais
Insira uma nova pgina. Aparncia ser a seguinte:

Siga os passos do arquivo anterior (primatas). O ttulo da pgina ser
Marsupiais, o nome do arquivo tambm ser Marsupiais.
2.3 Criando a Pgina Felinos
Pgina Felinos
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 48
FRONTPAGE 2000 APOSTILA





Siga os passos do arquivo anterior. O ttulo da pgina ser Felinos, o
nome do arquivo tambm ser Felinos.
2.4 Criando a Pgina Paquidermes
Pgina Paquidermes

Siga os passos do arquivo anterior. O ttulo da pgina ser Paquidermes, o nome
do arquivo tambm ser Paquidermes.
2.5 Criando a Pgina Pssaros
Pgina Pssaros
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 49
FRONTPAGE 2000 APOSTILA





Siga os passos do arquivo anterior. O ttulo da pgina ser Pssaros, o nome do
arquivo tambm ser Passaros.
2.6 Criando a Pgina Rpteis
Pgina rpteis

Siga os passos do arquivo anterior. O ttulo da pgina ser Rpteis, o nome do
arquivo tambm ser Repteis.
3. Tpicos mais utilizados: Marcadores,Numerao ...
3.1 Qual a Funo dos Marcadores e Numerao
Os marcadores e numerao criam listas de informaes dentro de uma pgina. So
usados freqentemente para incluir itens de informao inter-relacionados em uma
pgina da Web.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 50
FRONTPAGE 2000 APOSTILA




Quando precisamos dar informaes sobre as empresa, por exemplo, em vez de
utilizarmos um pargrafo extenso, que a maioria dos visitantes no l. Dividimos
estas informaes em listas com marcadores ou numeradores, conforme a
necessidade. Usando as listas as informaes so transmitidas com objetividade e
clareza.
O FrontPage trabalha com marcadores e numerao de forma similar ao Microsoft
Word para endentar e agrupar informaes que devam ser exibidas em conjunto.
Quando se usam marcadores e/ou numerao as informaes ficam em um formato
bem organizado e fcil de ser lido.
3.2 Inserindo Marcadores
Abra a Web Zoolgico, que est na pastas zoolgico dentro da pasta Meus
documentos. Abra o arquivo informacoes e posicione o cursor abaixo das figuras.
1. Clique no menu Formatar / Marcadores e numerao ou no boto
Marcadores na barra de Formatao.

2. Clique na guia Marcadores simples (esta guia s estar disponvel quando
no estiver usando tema no site), escolha um modelo e clique em OK.
3. O marcador j estar sendo mostrado. Digite o texto desejado.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 51
FRONTPAGE 2000 APOSTILA




3.3 Usando uma Imagem como Marcador
1. Clique no menu Formatar / Marcadores e numerao.
2. Clique na guia Marcadores de figura.

Se voc estiver usando um Tema poder usar a imagem sugerida pelo tema
corrente, bastando apenas marcar a opo Usar figuras do tema atual e
clicar em Ok. Que a opo que vamos utilizar.
3. Se quiser escolher uma figura como marcador, clique Especificar uma
imagem e depois clique no boto Procurar.
4. D dois cliques na pasta onde se encontra a figura e d dois cliques sobre o
nome da figura.
5. Clique em OK. Digite os seguintes itens:
Horrio de funcionamento
Preos dos ingressos
Calendrio de eventos
Direes
3.4 Inserindo Numerador
1. Digite os pargrafos que recebero os numeradores e deixe-os selecionados.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 52
FRONTPAGE 2000 APOSTILA




2. Clique no menu Formatar / Marcadores e numerao ou no boto
Numerao na barra de Formatao.

3. Clique na guia Nmeros, escolha um modelo e clique em OK.
Se desejar que a numerao comece a partir de um valor
determinado, digite este valor na caixa Iniciar em.
4. Nesta pgina no utilizaremos numerao.
5. Insira uma linha horizontal aps os itens. Salve o arquivo.
4. Tabelas
4.1 O que as Tabelas Fazem e qual sua Aplicabilidade
Uma tabela propicia um meio para organizao de informaes existentes em uma
pgina da Web, mediante o uso de linhas e colunas. Em virtude da flexibilidade que
oferecem, so muito utilizadas pela possibilidade de estruturar texto e imagens
posicionados de formas diversas.
As tabelas alm de serem utilizadas para mostrar os dados de um levantamento de
dados, tambm so muito utilizadas para organizao de texto e imagens em uma
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 53
FRONTPAGE 2000 APOSTILA




pgina, para criao de texto em colunas, para definio de partes fixas de uma
pgina, como um menu.
4.2 Como as Tabelas Funcionam
Abra a Web zoolgico, que est na pasta com as Meus Documentos. Abra o arquivo
informacoes.
Posicione o cursor depois da linha horizontal, centralize o pargrafo e digite "Horrio
de Funcionamento". Que ser o ttulo da tabela que mostrar os horrios de
funcionamento do zo.
Para inserir uma tabela, clique no menu Tabela / Inserir / Tabela.

Preencha as opes da caixa de dilogo para montar a tabela:
Linhas: especifica o nmero de linhas da tabela. Para a tabela que vamos criar
precisamos de 4 linhas.
Colunas: especifica o nmero de colunas da tabela. Precisamos de 3 colunas.
Alinhamento: especifica o alinhamento da tabela em relao pgina. Esquerda,
Direita, Centralizado e Justificar. Vamos definir o alinhamento centralizado.
Tamanho da borda: especifica a largura da borda da tabela. Este valor deve estar
entre 0 e 100. Quando 0 (zero) a borda fica invisvel. Para a nossa tabela
utilizaremos 2.
Enchimento da clula: o nmero de pixels entre a borda da tabela e o contedo
de uma determinada clula. Mantenha o sugerido pelo FrontPage.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 54
FRONTPAGE 2000 APOSTILA




Espaamento da clula: o nmero de pixels entre clulas de uma tabela. Quando
alterado reflete nas bordas da tabela. Mantenha o sugerido pelo FrontPage.
Especificar largura: largura da tabela. Poder ser definida em porcentagem ou em
pixels. mais provvel que voc queira especificar a largura por porcentagem, de
modo que a tabela possa fazer automaticamente seu prprio redimensionamento
segundo o tamanho do monitor de cada visitante. A nossa tabela ocupar 90% da
tela.
Escolha as configuraes desejadas e clique em OK.
O texto da tabela ser o seguinte:

Ao fazer a digitao poder acontecer que o texto passe para a segunda linha da
clula. Ser necessrio redimensionar a largura das colunas. Posicione o ponteiro
do mouse na borda da coluna, ele se transformar em uma seta com duas pontas,
clique, mantenha o boto pressionado e arraste at que o texto ocupe apenas uma
linha dentro da clula.
Voc pode tambm alterar a formatao de fonte. Primeiro precisamos selecionar as
clulas que vo ser formatadas. Posicione o ponteiro do mouse dentro da primeira
clula da seqncia, no nosso exemplo "Primavera ...", ele estar em formato de
haste. Clique, mantenha o boto pressionado e arraste at a ltima clula. Utilize o
menu Formatar / Fonte ou a barra de Formatao, para formatar o texto como
desejar.
Salve seu arquivo ao terminar.
4.3 Modificando Atributos da Tabela
Depois que a tabela est pronta muitas vezes necessrio fazer alteraes no
tamanho da tabela, nas cores da borda e no alinhamento.
Para alterar atributos da tabela, clique dentro da tabela com o boto direito do
mouse, e selecione a opo Propriedades da tabela, ou clique no menu Tabela /
Propriedades /Tabela.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 55
FRONTPAGE 2000 APOSTILA





Atributos que podem ser alterados:
Alinhamento: H quatro opes: Esquerdo, Direito, Centralizado e Justificar.
Flutuar: determina como o texto em volta da tabela se comportar.
Enchimento da clula: determina o espao entre o contedo das clulas e as
bordas da tabela.
Espaamento da clula: determina a distncia entre uma clula e outra da tabela.
Especificar largura e Especificar altura: determina o tamanho da tabela, evitando
assim que ela se redimensione sozinha.
Bordas: para as bordas podemos determinar vrias configuraes.
Tamanho: determina a espessura da borda. Quando zero a borda fica
invisvel.
Cor: determina a cor da borda. Se determinada uma cor para a Borda clara
ou uma cor para a Borda escura, a cor ser utilizada como a segunda cor da
borda. Mas se escolher uma cor para a Borda clara e uma outra cor para a
Borda escura, a Cor no ser utilizada. Lembre-se que, como estamos
utilizando tema esta alterao de cor no ser possvel.
Para testar crie uma nova web, usando o modelo Web de uma pgina dentro
da pasta com as iniciais do seu nome que esta dentro da pasta Personal
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 56
FRONTPAGE 2000 APOSTILA




Class, com o nome Teste. Crie uma tabela com os padres sugeridos pelo
FrontPage e altere as cores de Borda clara e Borda escura. Volte web do
zoolgico, clicando no boto correspondente na barra de tarefas.
Plano de fundo: determina o preenchimento utilizado no fundo da tabela.
Voc poder utilizar tambm uma cor como plano de fundo atravs da opo
Cor.
Para escolher uma imagem para plano de fundo da tabela, habilite a opo
Usar figura como plano de fundo e clique no boto Procurar e localize o
arquivo que ser utilizado. Vamos usar uma imagem de fundo na nossa
tabela. Clique no boto Procurar, depois clique no boto , v at a pasta
gifs que est na rea de trabalho, na pasta Fundos escolha um fundo. Clique
em OK, em OK e OK novamente.
4.4 Modificando Atributos da Clula
Alm das alteraes na tabela, podem ser feitas alteraes especficas nas clulas.
Para modificar alguns atributos das clulas, selecione as clulas a serem alteradas e
clique sobre uma delas com o boto direito do mouse. Selecione a opo
Propriedades da clula.

Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 57
FRONTPAGE 2000 APOSTILA




Alm dos atributos que so comuns aos descritos no item anterior (Modificando
atributos da Tabela) e que agora sero aplicados somente s clulas selecionadas,
podemos definir tambm:
Alinhamento Horizontal e Vertical: define como o texto ser alinhado dentro das
clulas. Sendo que para o alinhamento horizontal temos as opes Esquerdo,
Direito, Centralizado e Justificar. E para o alinhamento vertical temos as opes
Parte superior, Parte inferior, Meio e Linha de base.
Se for trabalhar com clulas mescladas precisar definir se a mesclagem ser feita
em linha ou em coluna. Para mesclar em linha, informe quantas linhas fazem parte
da mesclagem na caixa Linhas includas. Para mesclar em coluna, informe quantas
colunas fazem parte da mesclagem na caixa Colunas includas.
4.5 Mesclando Clulas
Em muitos casos necessrio que uma nica clula se transforme em duas ou que
quatro clulas se transformem em uma para podermos criar um ttulo. Como na
tabela abaixo que vamos criar:
Clique no menu Tabela / Inserir / Tabela. Defina os campos conforme a imagem a
seguir:

O texto da tabela ser o seguinte:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 58
FRONTPAGE 2000 APOSTILA





Faa toda a formatao de fonte necessria. Se for preciso altere a largura das
colunas para que o texto fique em apenas uma linha dentro da tabela. Para colocar o
fundo de cor nas primeiras clulas, selecione-as. Clique dentro da primeira clula,
segure o clique e arraste at a segunda clula. Clique com o boto direito do mouse
sobre uma das clulas selecionadas, escolha a opo Propriedades da clula e no
grupo Plano de fundo determine a cor para preenchimento das clulas na caixa
Cor. Clique em OK.
Note que para obter informaes temos dois telefones que esto cada um em sua
clula, ocupando duas linhas. Mas o texto que indica as informaes ocupa apenas
uma linha, apesar de estar dando referncia aos dois telefones. O ideal seria no ter
diviso da segunda nesta clula. Ento precisamos unir estas duas clulas, ou seja,
mesclar.
Para mesclar as clulas:
1. Selecione as clulas que sero mescladas. Neste caso a clula "Para obter
..." e a que est vazia abaixo.
2. Clique no menu Tabela / Mesclar clulas. Ou clique com o boto direito do
mouse sobre uma das clulas selecionadas e escolha a opo Mesclar
clulas. A aparncia da tabela ser a seguinte:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 59
FRONTPAGE 2000 APOSTILA





3. Salve o arquivo.
4.6 Dividindo Clulas
Muitas vezes aps a criao de uma tabela ser necessrio acrescentar uma clula.
Vamos criar mais uma tabela, clique no menu Tabela / Inserir / Tabela e defina os
campos como a imagem a seguir:

O texto ser o seguinte:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 60
FRONTPAGE 2000 APOSTILA





Faa toda a formatao de fonte necessria. Se for preciso altere a largura das
colunas para que o texto fique em apenas uma linha dentro da tabela. Para retirar as
bordas como na imagem, clique com o boto direito do mouse sobre uma das
clulas selecionadas, escolha a opo Propriedades da tabela e no grupo Bordas,
na caixa Tamanho digite 0. Clique em OK.
Ser necessrio acrescentar em cada evento o horrio. Precisaremos dividir cada
uma da clulas.
Para dividir a clula:
1. Clique na clula que ser divida. Vamos fazer primeiro a clula "Festa para
adolescentes".
2. Clique no menu Tabela / Dividir clulas.

3. Marque se a clula ser dividida em colunas (Dividir em colunas) ou se ser
dividida em linhas (Dividir em linhas). Vamos dividir em linhas. Marque a
opo Dividir em linhas.
4. Depois defina qual o Nmero de linhas ou Colunas a clula ser dividida.
Vamos dividir em duas linhas.
5. Clique em OK.
6. A tabela ficar com a seguinte aparncia:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 61
FRONTPAGE 2000 APOSTILA





7. Salve o arquivo.
4.7 Praticando o Dividir Clulas
Agora voc vai digitar o texto e dividir as outras clulas para que a tabela final tenha
a seguinte aparncia:

Salve o arquivo.
4.8 Incluindo Linhas e Colunas
Na tabela que criamos para o calendrio de eventos, ficou faltando uma linha para
mais um evento.
Para inserir linhas ou colunas, deixe o cursor em uma clula prxima ao local que
dever ser feita a insero. Na nossa tabela clique dentro da clula "Parado do
Gorila".
1. Clique no menu Tabela / Inserir / Linhas ou colunas.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 62
FRONTPAGE 2000 APOSTILA





2. Clique Colunas se quiser inserir colunas ou Linhas se quiser inserir linhas.
No nosso caso, deixe a opo Linhas marcada.
3. Em Nmero de linhas, defina o nmero de linhas ou colunas que sero
inseridas. Vamos inserir apenas uma.
4. Para definir a posio da linha ou coluna a ser inserida, escolha Acima da
seleo para inserir acima da clula que foi selecionada, ou Abaixo da
seleo para inserir abaixo da clula selecionada. Ns vamos inserir a linha
Acima da seleo.
5. Clique em OK. A nova linha foi inserida e o contedo ser o seguinte:


Aps digitar, salve o arquivo.
Acrescente o texto e as linhas horizontais abaixo, logo aps a tabela do calendrio
de eventos.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 63
FRONTPAGE 2000 APOSTILA






alve o arquivo. Se desejar clique no boto Visualizar no navegador para ver como
est pgina.
4.9 Removendo Linhas e Colunas
1. Selecione a linha ou coluna que ser removida.
2. Clique no menu Tabela / Excluir clulas.
3. Em nossas tabelas no excluiremos nenhuma linha ou coluna.
5. Hyperlinks
5.1 O que so e qual a Aplicabilidade dos Hyperlinks
A criao de hyperlinks permite que, a partir da pgina da Web, voc aponte para
outra pgina localizada em qualquer ponto da Internet, literalmente qualquer um dos
milhes de arquivos HTML.
Os vnculos de hipertexto so a principal razo para a Web ser to popular. A
possibilidade de, por meio de um simples vnculo, se estabelecer conexo entre
itens de informao inter-relacionados atraente e revela de onde a WWW extraiu
seu nome da construo de uma teia de vnculos espalhados pelo mundo.
A escolha da palavra, frase ou imagem que ser o vnculo importante, porque,
antes que os seus visitantes cliquem em um vnculo, voc sempre desejar fornecer-
lhes pistas descritivas sobre o destino em questo.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 64
FRONTPAGE 2000 APOSTILA




Os principais tipos de hyperlink so: para E-Mail, para outra pgina da mesma Web
ou outra Web, e para a mesma pgina. Estes hyperlinks sero descritos a seguir.
5.2 Criando Link para E-mail
So os hyperlinks que quando o visitante clica sobre eles, a janela do programa de
correio aberta j com o endereo do destinatrio.
Abra a web zoolgico que est na pasta zoologico, dentro da pasta Meus
documentos. Abra o arquivo informacoes. Nas direes existe um endereo de e-
mail que voc ir de transformar em link.
1. Selecione este texto e clique no menu Inserir / Hyperlink (voc pode tambm
clicar no boto Hyperlink ou ainda, se preferir, pressionar as teclas Ctrl e
K simultaneamente).Surgir a tela abaixo:

2. Na caixa URL temos que definir o endereo para o link. Para criar o link para
e-mail clique no boto
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 65
FRONTPAGE 2000 APOSTILA





3. Digite o endereo de e-mail mostrado na figura acima, clique em OK e OK
novamente.
4. Salve o arquivo e visualize a pgina. Voc notar que o texto que foi
selecionado para link est destacado com uma cor diferente, indicando que
ele um hyperlink.
5.3 Criando Link para outra Pgina do Site
So os links que navegam dentro do prprio site, ou seja, que passam de um
arquivo para outro.
Nesta pgina informacoes que estamos criando, no final da pgina temos a palavra
"Home" que ser o link para a pgina inicial do site ou o arquivo Index.
Selecione este texto e clique no menu Inserir / Hyperlink (voc pode tambm clicar
no boto .
1. Hyperlink ou ainda, se preferir, pressionar as teclas Ctrl e K
simultaneamente).
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 66
FRONTPAGE 2000 APOSTILA





2. Na caixa URL temos que definir o endereo para o link. Como um arquivo
da Web, estes arquivos esto sendo mostrados na parte superior da janela,
d um clique sobre o nome do arquivo e clique em OK.
3. Ao visualizar a pgina notar que o texto que foi selecionado para link est
destacado com uma cor diferente, indicando que ele um hyperlink. Salve o
arquivo.
5.4 Criando Link para uma Nova Pgina
Em alguns casos a pgina para a qual voc deseja criar um link ainda no foi criada,
mas voc j quer deixar o link criado, como o caso da palavra "Animais" ao lado do
Home.

Ela ser um link para a pgina que mostra os animais do Zo.
1. Selecione este texto e clique no menu Inserir / Hyperlink (voc pode tambm
clicar no boto Hyperlink ou ainda, se preferir, pressionar as teclas Ctrl e
K simultaneamente).
2. Clique no boto e veja a seguir a tela que surge:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 67
FRONTPAGE 2000 APOSTILA





3. Escolha o modelo para a pgina que ser criada. Vamos usar Pgina
normal.
4. Mas no vamos trabalhar com esta pgina agora, ento o FrontPage trs o
recurso de adicionarmos uma tarefa para nos lembrarmos que temos que
construir esta pgina. Clique na opo Apenas adicionar tarefa da Web e
clique em OK.
5. O FrontPage solicitar o nome do arquivo. Digite animais e clique em Salvar.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 68
FRONTPAGE 2000 APOSTILA





6. Assim o link ser criado e ns continuaremos na pgina informacoes.
5.5 Criando Link para um Endereo da WWW
So os links que levam os visitantes do site a um outro site interessante sobre o
mesmo assunto.
1. Vamos indicar alguns sites de outros zoolgicos. Logo aps o endereo digite
o texto conforme a figura a seguir:

2. Selecione este texto e clique no menu Inserir / Hyperlink (voc pode tambm
clicar no boto Hyperlink ou ainda, se preferir, pressionar as teclas Ctrl e
K simultaneamente).
3. Na caixa URL temos que definir o endereo para o link. Digite o endereo da
pgina ou clique no boto o navegador ser aberto. Navegue at a pgina
desejada e depois volte para o FrontPage. Aparecer na tela de criao de
link o endereo que voc deixou na tela do navegador. Ns vamos apenas
digitar o endereo www.zoologico.com.br.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 69
FRONTPAGE 2000 APOSTILA





4. Clique em OK.
5. Agora selecione o texto "Zoolgico de Salvador" vamos criar o link. Clique no
menu Inserir / Hyperlink.
6. Na caixa URL temos que definir o endereo para o link. Digite o endereo da
pgina www.seagri.ba.gov.br/zoo. Clique em OK.
7. Salve o arquivo. Se estiver conectado Internet, clique no boto Visualizar
no navegador e clique sobre o link para testar. (Voc precisa estar conectado
a internet para que a pgina a qual o link est associado seja carregada).
5.6 Criando Link para um Ponto da Pgina
Voc pode ver que esta pgina est bem grande, o visitante precisa rolar a barra de
rolagem para ver a parte inferior da pgina. Suponha que ele precise visualizar
apenas as direes que ele tem que seguir para chegar ao Zo. Seria mais fcil o
visitante clicar no item direes no incio da pgina e automaticamente ser levado
para o texto que explica sobre as direes. exatamente isso que vamos criar.
Para criar um link para outro ponto do mesmo arquivo, antes de chamar a tela de
criao de Hyperlink, ser necessrio criar o Indicador.
Indicador um nome que atribudo a um ponto qualquer da pgina. Funciona
como uma marca, uma identificao daquele ponto da pgina.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 70
FRONTPAGE 2000 APOSTILA




1. Selecione a palavra o ttulo "Direes" logo depois do calendrio de eventos.
Este ser o ponto para onde o visitante ser direcionado ao clicar no link
direes no incio da pgina, que ainda vamos criar.
2. Clique no menu Inserir / Indicador.

3. Um nome para o indicador j sugerido, clique em OK.
4. Vamos inserir todos os indicadores antes de criarmos os links. Selecione o
ttulo "Calendrio de eventos" antes da tabela.
5. Clique no menu Inserir / Indicador. Digite Calendrio no nome do indicador
e clique em OK.
6. Selecione o ttulo "Preos dos Ingressos" antes da tabela.
7. Clique no menu Inserir / Indicador. Digite Preos no nome do indicador e
clique em OK.
8. Selecione o ttulo "Horrio de Funcionamento" antes da tabela.
9. Clique no menu Inserir / Indicador. Digite Horrio no nome do indicador e
clique em OK.
10. Selecione o ttulo "Conhea outros zoolgicos" depois do endereo de e-mail.
11. Clique no menu Inserir / Indicador. Digite Links no nome do indicador e
clique em OK.
12. Salve o arquivo. Role a barra de rolagem at o incio da pgina, onde esto
os marcadores. Posicione o cursor aps o ltimo item "Direes", pressione a
tecla ENTER para adicionar um novo marcador e digite "Outros Zoolgicos".
Agora vamos criar os links para os indicadores.
1. Selecione o texto do primeiro marcador "Horrio de funcionamento".
2. Clique no menu Inserir / Hyperlink.
3. Na caixa Indicador clique na opo Horrio e clique em OK.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 71
FRONTPAGE 2000 APOSTILA





4. O link est pronto.
5. Selecione o texto do segundo marcador "Preos dos Ingressos".
6. Clique no menu Inserir / Hyperlink.
7. Na caixa Indicador clique na opo Preos e clique em OK.
8. Selecione o texto do terceiro marcador "Calendrio de eventos".
9. Clique no menu Inserir / Hyperlink.
10. Na caixa Indicador clique na opo Calendrio e clique em OK.
11. Selecione o texto do quarto marcador "Direes".
12. Clique no menu Inserir / Hyperlink.
13. Na caixa Indicador clique na opo Direes e clique em OK.
14. Selecione o texto do quinto marcador "Outros Zoolgicos".
15. Clique no menu Inserir / Hyperlink.
16. Na caixa Indicador clique na opo Links e clique em OK.
17. Salve o arquivo e clique no boto Visualizar no navegador para testar.
Ao clicar em dos links voc direcionado para o ponto correto, mas no existe um
link para voltar ao incio da pgina, sendo assim, ser necessrio utilizar a barra de
rolagem. Ento vamos criar este link. Volte ao FrontPage, clicando no boto
correspondente na barra de Tarefas.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 72
FRONTPAGE 2000 APOSTILA




Primeiro vamos criar o indicar do incio da pgina. Posicione o cursor antes da
primeira imagem no incio da pgina. Clique no menu Inserir / Indicador digite
"Topo" no Nome do indicador e clique no boto OK.
Posicione o curso no incio do ttulo "Preo dos ingressos", pressione a tecla ENTER
para criar um novo pargrafo. Posicione o cursor neste novo pargrafo e clique no
boto Alinhar direita na barra de Formatao. Digite "Topo". Conforme a figura
abaixo:


Selecione a palavra "Topo" para criarmos o link.
1. Clique no menu Inserir / Hyperlink.
2. Na caixa Indicador clique na opo Topo e clique em OK.
Salve o arquivo e clique no boto Visualizar no navegador, teste o link Topo. Como
est funcionando vamos criar para as outras partes da pgina.
Agora no precisaremos repetir todo o processo, apenas selecione o link "Topo",
clique no boto Copiar na barra de ferramentas Padro. Posicione o cursor no incio
da frase "Preos dos ingressos", que est antes da tabela, pressione a tecla ENTER
para criar um novo pargrafo. Posicione o cursor neste novo pargrafo e clique no
boto Colar na barra de ferramentas Padro. Clique no boto Alinhar direita na
barra de Formatao.
Posicione o cursor no incio da frase "Calendrio de eventos", que est antes da
tabela, pressione a tecla ENTER para criar um novo pargrafo. Posicione o cursor
neste novo pargrafo e clique no boto Colar na barra de ferramentas Padro.
Clique no boto Alinhar direita na barra de Formatao.
Posicione o cursor no incio da frase "Direes", pressione a tecla ENTER para criar
um novo pargrafo. Posicione o cursor neste novo pargrafo e clique no boto Colar
na barra de ferramentas Padro. Clique no boto Alinhar direita na barra de
Formatao.
Posicione o cursor no incio da frase "Conhea outros zoolgicos", pressione a tecla
ENTER para criar um novo pargrafo. Posicione o cursor neste novo pargrafo e
clique no boto Colar na barra de ferramentas Padro. Clique no boto Alinhar
direita na barra de Formatao.
Salve o arquivo e clique no boto Visualizar no navegador e teste os links.
6. Componentes
6.1 Qual a Funo do Gerenciador de Anncio em Faixa
Este um componente do FrontPage. Ele um Applet Java (um programa escrito
em J ava que aceita parmetros) que tem como objetivo adicionar vrias imagens no
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 73
FRONTPAGE 2000 APOSTILA




mesmo ponto de uma pgina, de forma que aparea uma por vez, com um efeito de
transio entre todas as imagens especificadas.
Quando voc precisar dar uma pequena amostra dos produtos ou fotos das
instalaes do seu negcio, o gerenciador de anncio em faixa pode ser muito til.
6.2 Como o Gerenciador de Anncio em Faixa Funciona
Abra a web zoolgico que est na pasta com as iniciais do seu nome, dentro da
pasta Personal Class. Abra o arquivo informacoes. Vamos acrescentar um
Gerenciador de anncio em faixa para mostrar alguns animais.
1. Clique no menu Inserir / Componente / Gerenciador de anncios em faixa.

2. Configure as opes da caixa de dilogo exibida:
Largura: largura em pixels, da faixa que contm o conjunto de imagens. Que
pode ser alterada pelas alas que so mostradas quando o objeto est
selecionado. Vamos deixar para alterar a largura do gerenciador aps
adicionarmos as imagens.
Altura: altura em pixels, da faixa que contm o conjunto de imagens. Que
pode ser alterada pelas alas que so mostradas quando o objeto est
selecionado. Vamos deixar para alterar a altura do gerenciador aps
adicionarmos as imagens.
Efeito de transio: efeito que ser executado ao passar de uma imagem
para outra. Escolha um dos efeitos oferecidos.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 74
FRONTPAGE 2000 APOSTILA




Mostrar cada figura por (segundos): tempo que cada imagem ser exibida,
em segundos. Vamos definir 4 segundos.
Vincular a: endereo ou nome do arquivo ao qual os visitantes sero
conduzidos se clicarem em qualquer ponto deste conjunto de imagens. O
gerenciador que estamos criando no ser vinculado nenhum arquivo.
Figuras a serem exibidas: conjunto de imagens que o FrontPage deve
carregar em seqncia.
3. Para adicionar cada imagem, clique no boto Adicionar e escolha a imagem
da pasta do site, do winchester ou do clipart. Vamos adicionar a imagem de
dois animais.
4. Clique no boto Adicionar. Na caixa de dilogo Adicionar figura de anncio
em faixa, clique no boto If, para acessar a pasta gifs\zoolgico. Escolha a
imagem gertie.jpg e clique em OK.
5. Clique no boto Adicionar. Na caixa de dilogo Adicionar figura de anncio
em faixa, clique no boto , para acessar a pasta gifs\zoolgico. Escolha a
imagem guarani.jpg e clique em OK.
6. Depois que adicionar todas as imagens, clique em OK.

7. Note que a caixa do Gerenciador de anncio em faixa esta mal dimensionada.
Posicione o ponteiro do mouse sobre uma das alas de redimensionamento,
clique, mantenha o boto pressionado e arraste at que a imagem esteja
totalmente visvel e sem espaos vazios. Como na figura a seguir:

8. Salve o arquivo e clique no boto Visualizar no navegador para testar.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 75
FRONTPAGE 2000 APOSTILA




Para fazer alteraes nas imagens ou no comportamento do Gerenciador de
anncios em faixa, d um duplo sobre a faixa. A caixa de dilogo do Gerenciador
aparece novamente, ento faa as alteraes que desejar e clique em OK.
6.3 O que o Boto em Foco faz e qual sua Aplicabilidade
Este um boto especial que executa um efeito visual toda vez que o mouse paira
sobre ele. Os botes em foco podem aparecer como simples botes de texto,
conduzir a outros sites da Web, disparar sons sempre que o mouse se mova sobre
ele e efetuar vrias outras aes. Normalmente este boto utilizado como
hyperlink.
O boto em foco utilizado em hyperlinks em vez de imagens animadas, dando um
efeito mais profissional pgina.
6.4 Como o Boto em Foco Funciona
Abra a web zoolgico que est na pasta com as Meus documentos, dentro da pasta
zoologico. Clique no boto Nova pgina. Esta pgina ser utilizada como uma barra
de navegao dentro das pginas de quadros que vamos criar mais a frente.
1. Clique no menu Inserir / Componente / Boto em foco.

2. Atravs desta caixa de dilogo, voc pode personalizar o modo pelo qual o
boto em foco aparece na tela do navegador.
Texto do boto: texto que aparece no boto. Para alterar a aparncia do
texto, clique no boto Fonte. O texto deste boto ser Home.
Vincular a: endereo ou nome do arquivo ao qual os visitantes sero
conduzidos se clicarem em qualquer ponto deste boto em foco. Clique no
boto Procurar, verifique se na caixa Examinar voc est vendo a pasta
c:meus documentos\zoolgico. Selecione o arquivo index.htm e clique em
OK.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 76
FRONTPAGE 2000 APOSTILA




Cor do boto: cor inicial com a qual o boto aparece na tela. Escolha a cor
de sua preferncia.
Cor do plano de fundo: cor que ser utilizada na criao do efeito. Escolha a
cor de sua preferncia.
Efeito: seleciona qual efeito visual o boto em foco exibir quando o mouse
se mover sobre ele. Escolha um dos efeitos oferecidos.
Cor do efeito: cor que ser aplicada sobre a cor do boto em foco quando o
mouse se mover sobre ele. A maneira da aplicao da cor depender do
efeito escolhido. Escolha a cor de sua preferncia.
Largura e altura: largura do boto (em pixels) e altura do boto (em pixels).
Vamos manter a altura e a largura sugeridas.
3. Salve o arquivo como rodape e clique no boto Visualizar no navegador
para testar.
4. Se no gostar do efeito que est sendo executado, volte ao FrontPage, d um
clique duplo sobre o boto criado e faa as alteraes que desejar.
6.5 Criando Outros Botes para a Pgina
Agora vamos criar os outros botes que sero necessrios nesta pgina.
1. Como o efeito o mesmo do boto que j foi criado, selecione o boto que
est pronto e clique no boto Copiar na barra de ferramentas Padro.
2. Coloque o cursor piscando depois do primeiro boto, acrescente trs espaos
e clique no boto Colar na barra de ferramentas Padro. Ser adicionado
mais um boto com as mesmas configuraes do original. Ser necessrio
configur-lo.
3. D um clique duplo no boto que foi colado. Na caixa Texto do boto digite
Animais. Clique no boto Procurar do hyperlink e selecione o arquivo
animais na pasta principal do site. Clique no boto OK.
4. Coloque o cursor piscando depois do segundo boto, acrescente trs
espaos e clique no boto Colar na barra de ferramentas Padro. Ser
adicionado mais um boto com as mesmas configuraes do original. Ser
necessrio configur-lo.
5. D um clique duplo no terceiro boto. Na caixa Texto do boto digite
Informaes. Clique no boto Procurar do hyperlink e selecione o arquivo
informacoes na pasta principal do site. Clique no boto OK.
6. Coloque o cursor piscando depois do terceiro boto, acrescente trs espaos
e clique no boto Colar na barra de ferramentas Padro. Ser adicionado
mais um boto com as mesmas configuraes do original. Ser necessrio
configur-lo.
7. D um clique duplo no terceiro boto. Na caixa Texto do boto digite Livro de
Visita. Clique no boto Procurar do hyperlink, como a pgina do livro de
visita ainda no existe, clique no boto . Escolha o modelo Pgina Normal
e marque a caixa Apenas adicionar tarefa da Web. Clique no boto OK.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 77
FRONTPAGE 2000 APOSTILA




8. Na caixa de dilogo Salvar como digite o nome do arquivo livro e clique em
Salvar. E depois clique no boto OK. A aparncia da pgina a seguinte:

9. Salve o arquivo e clique no boto Visualizar no navegador para testar.
6.6 Alterando o Foco do Boto de Texto para Imagem
Se em vez de texto voc quiser que o boto mostre uma imagem ao receber o foco,
ou seja, quando o ponteiro do mouse pairar sobre o boto a imagem seja
modificada, basta personalizar o boto. Tambm poder ser inserido um som no
boto.
Clique no boto Personalizar.

Para Tocar som ao clicar clique no boto Procurar e escolha um som que esteja j
na web ou um som do winchester, o mesmo procedimento deve ser feito para Tocar
um som ao focalizar o boto.
Para escolher uma Figura personalizada para o Boto clique no boto Procurar
correspondente e selecione uma imagem da web ou do winchester. O mesmo deve
ser feito para escolher a imagem Ao focalizar.
Salve o arquivo rodape e feche-o.
7. Links para Pginas Criadas
7.1 Links para os Marsupiais
Vamos criar os links para as fotos e filmes para os animais de cada espcie.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 78
FRONTPAGE 2000 APOSTILA




Abra o arquivo marsupiais. Selecione a primeira imagem Foto. Clique no boto
Hyperlink. Como a pgina com a foto do Precioso ainda no existe, clique no boto
, escolha Pgina normal e clique em OK. Ser aberta a nova pgina. Vamos
inserir a foto do Precioso. Clique no menu Inserir / Figura / Do arquivo, clique no
boto , e acesse a pasta gifs\zoologico, selecione o arquivo precioso.jpg e
clique em OK. A imagem ser inserida na pgina. Clique no boto Centralizar na
barra de Formatao. Salve o arquivo com o nome precioso e clique no boto
Alterar, para modificar o ttulo da pgina, o ttulo ser Foto do Precioso. Ao salvar
ser aberta a caixa de dilogo para Salvar arquivos incorporados, lembre-se de
alterar a pasta para images. Feche o arquivo.
Selecione a segunda imagem foto. Clique no boto Hyperlink. Como a pgina com
a foto do Kiti ainda no existe, clique no boto , escolha Pgina normal e clique
em OK. Ser aberta a nova pgina. Vamos inserir a foto do Kiti. Clique no menu
Inserir / Figura / Do arquivo, clique no boto , e acesse a pasta gifs\zoologico,
selecione o arquivo kiti.jpg e clique em OK. A imagem ser inserida na pgina.
Clique no boto Centralizar na barra de Formatao. Salve o arquivo com o nome
kiti e clique no boto Alterar, para modificar o ttulo da pgina, o ttulo ser Foto do
Kiti. Ao salvar ser aberta a caixa de dilogo para Salvar arquivos incorporados,
lembre-se de alterar a pasta para images. Feche o arquivo.
Selecione a terceira imagem foto. Clique no boto Hyperlink. Como a pgina com a
foto da Rubi ainda no existe, clique no boto , escolha Pgina normal e clique
em OK. Ser aberta a nova pgina. Vamos inserir a foto da Rubi. Clique no menu
Inserir / Figura / Do arquivo, clique no boto , e acesse a pasta gifs\zoologico,
selecione o arquivo rubi.jpg e clique em OK. A imagem ser inserida na pgina.
Clique no boto Centralizar na barra de Formatao. Salve o arquivo com o nome
rubi e clique no boto Alterar, para modificar o ttulo da pgina, o ttulo ser Foto da
Rubi. Ao salvar ser aberta a caixa de dilogo para Salvar arquivos incorporados,
lembre-se de alterar a pasta para images. Feche o arquivo.
Salve o arquivo marsupiais e feche-o.
7.2 Links para os Felinos
Abra o arquivo felinos. Selecione a primeira imagem Foto. Clique no boto
Hyperlink. Como a pgina com a foto da Sucupira ainda no existe, clique no boto
, escolha Pgina normal e clique em OK. Ser aberta a nova pgina. Vamos
inserir a foto da Sucupira. Clique no menu Inserir / Figura / Do arquivo, clique no
boto , e acesse a pasta gifs\zoologico, selecione o arquivo sucupira.jpg e
clique em OK. A imagem ser inserida na pgina. Clique no boto Centralizar na
barra de Formatao. Salve o arquivo com o nome sucupira e clique no boto
Alterar, para modificar o ttulo da pgina, o ttulo ser Foto da Sucupira. Ao salvar
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 79
FRONTPAGE 2000 APOSTILA




ser aberta a caixa de dilogo para Salvar arquivos incorporados, lembre-se de
alterar a pasta para images. Feche o arquivo.
Selecione a segunda imagem Foto. Clique no boto Hyperlink. Como a pgina com
a foto dos filhotes da Sucupira ainda no existe, clique no boto , escolha Pgina
normal e clique em OK. Ser aberta a nova pgina. Vamos inserir a foto dos filhotes
da Sucupira. Clique no menu Inserir / Figura / Do arquivo, clique no boto , e
acesse a pasta gifs\zoologico, selecione o arquivo sebastia.jpg e clique em OK. A
imagem ser inserida na pgina. Clique no boto Centralizar na barra de
Formatao. Salve o arquivo com o nome filhotes e clique no boto Alterar, para
modificar o ttulo da pgina, o ttulo ser Foto dos filhotes da Sucupira. Ao salvar
ser aberta a caixa de dilogo para Salvar arquivos incorporados, lembre-se de
alterar a pasta para images. Feche o arquivo.
Selecione a terceira imagem Foto. Clique no boto Hyperlink. Como a pgina com
a foto da Uai ainda no existe, clique no boto , escolha Pgina normal e clique
em OK. Ser aberta a nova pgina. Vamos inserir a foto da Uai. Clique no menu
Inserir / Figura / Do arquivo, clique no boto , e acesse a pasta gifs\zoologico,
selecione o arquivo uai.jpg e clique em OK. A imagem ser inserida na pgina.
Clique no boto Centralizar na barra de Formatao. Salve o arquivo com o nome
uai e clique no boto Alterar, para modificar o ttulo da pgina, o ttulo ser Foto da
Uai. Ao salvar ser aberta a caixa de dilogo para Salvar arquivos incorporados,
lembre-se de alterar a pasta para images. Feche o arquivo.
Salve o arquivo felinos e feche-o.
7.3 Links para os Paquidermes
Abra o arquivo paquidermes. Selecione a imagem Foto. Clique no boto Hyperlink.
Como a pgina com a foto da Carpacchio ainda no existe, clique no boto ,
escolha Pgina normal e clique em OK. Ser aberta a nova pgina. Vamos inserir a
foto da Carpacchio. Clique no menu Inserir / Figura / Do arquivo, clique no boto
, e acesse a pasta gifs\zoologico, selecione o arquivo carpacchio.gif e clique
em OK. A imagem ser inserida na pgina. Clique no boto Centralizar na barra de
Formatao. Salve o arquivo com o nome carpacchio e clique no boto Alterar,
para modificar o ttulo da pgina, o ttulo ser Foto da Carpacchio. Ao salvar ser
aberta a caixa de dilogo para Salvar arquivos incorporados, lembre-se de alterar
a pasta para images. Feche o arquivo.
Selecione a imagem Filme. Clique no boto Hyperlink. Como a pgina com o filme
da Hermione ainda no existe, clique no boto , escolha Pgina normal e clique
em OK. Ser aberta a nova pgina. Vamos inserir o filme da Hermione. Clique no
menu Inserir / Figura / Vdeo, clique no boto , e acesse a pasta gifs\zoologico,
selecione o arquivo elefante.avi e clique em OK. O filme ser inserida na pgina.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 80
FRONTPAGE 2000 APOSTILA




Ao inserir o vdeo pode ser mostrado uma pequena imagem com um x vermelho em
vez do filme, isso significa que o windows no est preparado para exibir vdeos.
Instale o programa Mdia Player do Windows usando o Painel de Controle.
Clique no boto Centralizar na barra de Formatao. Salve o arquivo com o nome
hermione e clique no boto Alterar, para modificar o ttulo da pgina, o ttulo ser
Filme da Hermione. Ao salvar ser aberta a caixa de dilogo para Salvar arquivos
incorporados, lembre-se de alterar a pasta para images. Feche o arquivo.
Salve o arquivo paquidermes e feche-o.
7.4 Links para os Pssaros
Abra o arquivo passaros. Selecione a primeira imagem Foto. Clique no boto
Hyperlink. Como a pgina com a foto da Electra ainda no existe, clique no boto
, escolha Pgina normal e clique em OK. Ser aberta a nova pgina. Vamos
inserir a foto da Electra. Clique no menu Inserir / Figura / Do arquivo, clique no
boto , e acesse a pasta gifs\zoologico, selecione o arquivo electra.jpg e clique
em OK. A imagem ser inserida na pgina. Clique no boto Centralizar na barra de
Formatao. Salve o arquivo com o nome electra e clique no boto Alterar, para
modificar o ttulo da pgina, o ttulo ser Foto da Electra. Ao salvar ser aberta a
caixa de dilogo para Salvar arquivos incorporados, lembre-se de alterar a pasta
para images. Feche o arquivo.
Selecione a segunda imagem Foto. Clique no boto Hyperlink. Como a pgina com
a foto do Dozer ainda no existe, clique no boto , escolha Pgina normal e
clique em OK. Ser aberta a nova pgina. Vamos inserir a foto do Dozer. Clique no
menu Inserir / Figura / Do arquivo, clique no boto , e acesse a pasta
gifs\zoologico, selecione o arquivo dozer.jpg e clique em OK. A imagem ser
inserida na pgina. Clique no boto Centralizar na barra de Formatao. Salve o
arquivo com o nome dozer e clique no boto Alterar, para modificar o ttulo da
pgina, o ttulo ser Foto do Dozer. Ao salvar ser aberta a caixa de dilogo para
Salvar arquivos incorporados, lembre-se de alterar a pasta para images. Feche o
arquivo.
Selecione a terceira imagem Foto. Clique no boto Hyperlink. Como a pgina com
a foto da Eva ainda no existe, clique no boto , escolha Pgina normal e clique
em OK. Ser aberta a nova pgina. Vamos inserir a foto da Eva. Clique no menu
Inserir / Figura / Do arquivo, clique no boto , e acesse a pasta gifs\zoologico,
selecione o arquivo eva.jpg e clique em OK. A imagem ser inserida na pgina.
Clique no boto Centralizar na barra de Formatao. Salve o arquivo com o nome
eva e clique no boto Alterar, para modificar o ttulo da pgina, o ttulo ser Foto da
Eva. Ao salvar ser aberta a caixa de dilogo para Salvar arquivos incorporados,
lembre-se de alterar a pasta para images. Feche o arquivo.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 81
FRONTPAGE 2000 APOSTILA




Salve o arquivo passaros e feche-o.
7.5 Links para os Rpteis
Abra o arquivo repteis. Selecione a primeira imagem Foto. Clique no boto
Hyperlink. Como a pgina com a foto do Gertie ainda no existe, clique no boto
, escolha Pgina normal e clique em OK. Ser aberta a nova pgina. Vamos
inserir a foto do Gertie. Clique no menu Inserir / Figura / Do arquivo, clique no
boto , e acesse a pasta gifs\zoologico, selecione o arquivo gertie.jpg e clique
em OK. A imagem ser inserida na pgina. Clique no boto Centralizar na barra de
Formatao. Salve o arquivo com o nome gertie e clique no boto Alterar, para
modificar o ttulo da pgina, o ttulo ser Foto do Gertie. Ao salvar ser aberta a
caixa de dilogo para Salvar arquivos incorporados, lembre-se de alterar a pasta
para images. Feche o arquivo.
Selecione a segunda imagem Foto. Clique no boto Hyperlink. Como a pgina com
a foto do Tito ainda no existe, clique no boto , escolha Pgina normal e clique
em OK. Ser aberta a nova pgina. Vamos inserir a foto do Tito. Clique no menu
Inserir / Figura / Do arquivo, clique no boto , e acesse a pasta gifs\zoologico,
selecione o arquivo tito.jpg e clique em OK. A imagem ser inserida na pgina.
Clique no boto Centralizar na barra de Formatao. Salve o arquivo com o nome
tito e clique no boto Alterar, para modificar o ttulo da pgina, o ttulo ser Foto do
tito. Ao salvar ser aberta a caixa de dilogo para Salvar arquivos incorporados,
lembre-se de alterar a pasta para images. Feche o arquivo. Salve o arquivo repteis
e feche-o.
8. Quadros (frames)
8.1 O que os Quadros Fazem e qual sua Aplicabilidade
Os quadros (frames) so utilizados para dividir a tela em quadros independentes,
que se relacionam atravs de links. Atravs dos quadros podemos carregar vrias
pginas HTML ao mesmo tempo sem que uma, necessariamente, sobreponha a
outra.
Quando precisamos manter na tela do site um menu, que no se modifica quando o
visitante clica sobre uma das opes, os quadros sero os melhores auxiliares neste
processo. Se voc precisa mostrar uma imagem que est em outra pgina, mas que
deve ser visualizada na mesma tela onde est o link de chamada, como ser feito no
site que estamos criando. Quando o visitante clicar sobre a imagem foto, que um
link, a imagem do animal ser mostrada do lado esquerdo da tela, sem modificar a
tela do texto com o link.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 82
FRONTPAGE 2000 APOSTILA




8.2 Como Funcionam os Quadros
Abra a web zoolgico que est na pasta Meus documentos. Vamos criar a primeira
pgina de quadros.
1. Na barra de modos selecione Pgina.
2. Clique no menu Arquivo / Novo / Pgina.
3. Clique sobre a guia Pginas de quadros.

Nesta caixa de dilogo, h uma lista com vrios modelos diferentes de quadros que
o FrontPage permite que voc construa. No lado direito h uma anteviso grfica de
como ficar a aparncia de cada um desses modelos.
Selecione o modelo que desejar e clique em OK. Para o nosso site utilizaremos o
modelo Cabealho, rodap e contedo.
8.3 Configurando Cada Quadro
De acordo com o modelo escolhido, o FrontPage divide a tela em quadros. Cada
quadro ter uma pgina HTML. O exemplo a seguir foi dividido em quatro quadros.
Cada quadro chamado de quadro de destino. Este o modelo que estamos
utilizando.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 83
FRONTPAGE 2000 APOSTILA





Devemos agora atribuir a cada quadro um arquivo HTML. Podemos fazer esta
atribuio a arquivos j existentes, ou a novos arquivos.
Para cada quadro, devemos clicar em uma das duas opes que ele oferece:
Definir pgina inicial: para atribuir a um arquivo j existente. Aps clicar sobre ele,
localize o arquivo desejado e clique em OK.
Nova pgina: cria um novo arquivo para ser colocado naquele quadro.
Aps definir arquivos para todos os quadros, o prximo passo ser salvar os
quadros.
8.4 Definindo a Pgina Inicial do Quadro
Vamos criar uma pgina de quadros para cada espcie que ser mostrada no
zoolgico. Primeiro mostraremos a pgina de rodap que j existe. Ento clique no
boto Definir pgina inicial no rodap da pgina de quadros, ou seja na diviso
inferior da pgina.
Na caixa de dilogo Criar hyperlink selecione o arquivo rodape e clique em OK. A
pgina rodape ser mostrada nesta parte do quadro se desejar redimensionar o
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 84
FRONTPAGE 2000 APOSTILA




tamanho do quadro. Posicione o ponteiro do mouse sobre a borda do quadro, clique,
mantenha o boto pressionado e arraste para a direo desejada.
Agora vamos Definir a pgina inicial do quadro principal, ou, o quadro que est no
centro da tela, o maior. Clique no boto Definir pgina inicial. Na caixa de dilogo
Criar hyperlink selecione o arquivo primata e clique em OK. A pgina primata ser
mostrada nesta parte do quadro se desejar redimensione o tamanho do quadro.
8.5 Criando uma Nova Pgina
A pgina que ser o cabealho ainda no existe, ento no quadro que ser o
cabealho, ou seja, o primeiro quadro da pgina na parte superior, clique no boto
Nova pgina. A nova pgina ser mostrada exatamente no espao do cabealho.
Vamos inserir algumas imagens que serviro de links para cada quadro criado das
espcies.
Clique no menu Inserir / Figura / Do arquivo, clique no boto , acesse a pasta
gifs\zoologico e selecione o arquivo felinos.gif, clique em OK. Posicione o cursor
aps do lado direito da imagem, acrescente dois espaos em branco.
Clique no menu Inserir / Figura / Do arquivo, clique no boto , acesse a pasta
gifs\zoologico e selecione o arquivo primatas.gif, clique em OK. Posicione o cursor
aps do lado direito da imagem, acrescente dois espaos em branco.
Clique no menu Inserir / Figura / Do arquivo, clique no boto , acesse a pasta
gifs\zoologico e selecione o arquivo repteis.gif, clique em OK. Posicione o cursor
aps do lado direito da imagem, acrescente dois espaos em branco.
Clique no menu Inserir / Figura / Do arquivo, clique no boto , acesse a pasta
gifs\zoologico e selecione o arquivo passaros.gif, clique em OK. Posicione o
cursor aps do lado direito da imagem, acrescente dois espaos em branco.
Clique no menu Inserir / Figura / Do arquivo, clique no boto , acesse a pasta
gifs\zoologico e selecione o arquivo paquider.gif, clique em OK. Posicione o
cursor aps do lado direito da imagem, acrescente dois espaos em branco.
Clique no menu Inserir / Figura / Do arquivo, clique no boto , acesse a pasta
gifs\zoologico e selecione o arquivo marsupia.gif, clique em OK.
A pgina que ser mostrada esquerda do contedo ainda no existe, ento no
quadro que est esquerda do contedo, clique no boto Nova pgina. A nova
pgina ser mostrada exatamente no espao esquerda. Vamos inserir a imagem
inicial mostrada no quadro. Clique no menu Inserir / Figura / Do arquivo, clique no
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 85
FRONTPAGE 2000 APOSTILA




boto , acesse a pasta gifs\zoologico e selecione o arquivo Logopequeno.gif,
clique em OK.
Voc perceber que o quadro pequeno para a imagem, ento redimensione-o.
8.6 Salvando as Novas Pginas e os Quadros
Precisamos salvar a pgina de quadros e as duas novas pginas que criamos, clique
no menu Arquivo / Salvar.
Estaremos salvando todos os arquivos posicionados nos quadros e ainda ser
pedido para que voc salve o arquivo principal de Quadros. Este arquivo principal
no ser visualizado no navegador, ele apenas ser responsvel por armazenar os
comandos necessrios para associar cada arquivo seu Quadro correspondente e
mais todas as propriedades e configuraes que voc alterar no Quadro.
Observe bem a caixa de dilogo para salvar, pois, no lado direito ser exibida uma
visualizao indicando qual arquivo dever ser salvo no momento. No nosso site
primeiro ser solicitado salvar a pgina que est no quadro superior.

O arquivo se chamar cabecalho e o ttulo ser Cabealho. Clique no boto Salvar.
Ser aberta a caixa de dilogo Salvar os arquivos incorporados, confira se a
pasta images est selecionada e clique em OK.
No segundo, ser salvo o quadro esquerda do contedo.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 86
FRONTPAGE 2000 APOSTILA





O arquivo se chamar exibicao e o ttulo ser Exibio. Clique no boto Salvar.
Ser aberta a caixa de dilogo Salvar os arquivos incorporados, confira se a
pasta images est selecionada e clique em OK.
Por ltimo ser solicitado salvar a pgina que define os quadros.

Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 87
FRONTPAGE 2000 APOSTILA




O arquivo se chamar primataquadro e o ttulo ser Exibio dos Primatas. Clique
no boto Salvar. A pgina de uma espcie est pronta. Antes de continuarmos
vamos ver como a pgina est. Clique no boto Visualizar no navegador na barra
de ferramentas Padro.
Ao visualizar, podemos ver bordas dividindo cada quadro da pgina, esteticamente
estas bordas no so aceitveis. Tambm podemos notar que o cabealho e o
rodap esto grandes podemos diminuir as margens internas e o tamanho do
quadro.
8.7 Configurando as Propriedades dos Quadros
Primeiro vamos configurar o quadro do cabealho, clique com o boto direito do
mouse sobre o quadro e clique em Propriedades do quadro.

O Nome que aparece o nome do quadro no qual voc clicou. Defina o nome que
ser mais fcil para identificar o quadro quando fizer hyperlinks. Neste caso
mantenha superior.
Pgina inicial o arquivo que ser visualizado naquele quadro quando a pgina de
quadros for aberta. Se desejar alterar a pgina inicial, clique no boto Procurar,
selecione o arquivo desejado e clique em OK. O arquivo j est correto no ser
necessrio alterar.
Tamanho do quadro: define o tamanho de cada quadro. O ideal redimensionar o
quadro utilizando as setas de redimensionamento nas bordas do quadro, assim
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 88
FRONTPAGE 2000 APOSTILA




visualizamos o tamanho desejado e o FrontPage atualiza a caixa Tamanho do
quadro automaticamente.
Margens: a distncia em pixels que o texto dentro do quadro ficar afastado das
bordas esquerda e direita (Largura) e das bordas superior e inferior (Altura). Ento,
na caixa altura digite 8.
Redimensionvel no navegador: quando habilitado, permite que o visitante da
pgina redimensione as bordas de cada quadro, enquanto navega pela Web. Isso
pode ocorrer quando uma pessoa que esteja utilizando uma resoluo de tela menor
visite seu site, ou quando um visitante quiser expandir um quadro para ver uma
imagem maior. Deixe esta opo desmarcada.
Mostrar barras de rolagem: define sobre a exibio das barras de rolagem durante
a navegao na Web. As trs opes disponveis so: Sempre, Nunca, ou Se
preciso. Para este quadro mantenha Nunca.
Clique em OK. Clique com o boto direito do mouse no quadro esquerda do
contedo, selecione Propriedades do quadro e as configuraes so as seguintes:

Clique em OK. Clique com o boto direito do mouse no quadro do contedo,
selecione Propriedades do quadro e as configuraes so as seguintes:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 89
FRONTPAGE 2000 APOSTILA





Clique em OK. Clique com o boto direito do mouse no quadro do rodap, selecione
Propriedades do quadro e as configuraes so as seguintes:

Clique em OK e salve o arquivo. Com estas alteraes voc j pode redimensionar a
altura do quadro cabealho e do quadro rodap.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 90
FRONTPAGE 2000 APOSTILA




8.8 Desativando Bordas e Controlando Espaos entre os Quadros
Clique com o boto direito do mouse sobre um dos quadros, e em seguida,
Propriedades do quadro. Acesse o boto Pginas de quadros.

A opo Espaamento do quadro define em pixels a margem entre os quadros.
A opo Mostrar bordas quando habilitada, permite a exibio das bordas que
dividem os quadros. Como no precisamos das bordas, desmarque esta opo. Ao
desmarc-la automaticamente a margem ser zerada. Clique no boto OK, depois
em OK novamente. Salve o arquivo e clique no boto Visualizar no navegador para
testar.
Os quadros esto agora com a seguinte aparncia:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 91
FRONTPAGE 2000 APOSTILA





Clique na imagem Fotos que um link para a foto do Guarani. Quando voc clicou a
foto foi mostrada no mesmo quadro onde estava o texto, mas o nosso objetivo no
esse. Quando o visitante clicar em dos links referentes aos animais, a foto ou o filme
deve ser mostrado no lado esquerdo do quadro.
Para que isso acontea precisaremos criar vnculos entre os quadros e os hyperlinks
j existentes.
8.9 Criando Vnculos entre os Quadros
Normalmente, quando criamos vnculos (links) entre pginas e o visitante clica sobre
um destes links, toda a pgina substituda pela pgina chamada.
Para criar vnculos em quadros, h mais uma opo que dever ser considerada: em
qual quadro carregar a pgina chamada no link. Quando o visitante clicar no
hyperlink do animal a foto dever ser mostrada no quadro fotos, que foi como o
chamamos anteriormente.
Volte ao FrontPage, selecione o primeiro link, que a imagem filme. Clique no boto
Criar hyperlink, observe a opo Quadro de destino localizada na parte inferior da
caixa de dilogo.
Clique no boto Alterar o quadro de destino.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 92
FRONTPAGE 2000 APOSTILA





Na caixa de dilogo Quadro de destino, clique sobre o desenho do quadro onde a
pgina dever aparecer. No nosso site ser o quadro que est esquerda da
pgina, conforme a imagem anterior mostra. Clique em OK e em seguida, OK
novamente.
Selecione o link para a foto. Clique no boto Criar hyperlink, observe a opo
Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no boto
Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique sobre
o desenho do quadro onde a pgina dever aparecer. No nosso site ser o quadro
que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Selecione o segundo link para a foto. Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Selecione o terceiro link para a foto. Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Salve o arquivo e clique no boto Visualizar no navegador para testar.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 93
FRONTPAGE 2000 APOSTILA




Agora todos os links para as fotos dos primatas esto abrindo no quadro correto. Os
links para cada espcie sero criados aps a criao de todas as pginas de
quadro.
9. Pgina Principal e Links
9.1 Alterando a Pgina Principal e Links para os Felinos
Como as pginas de quadros das outras espcies so idnticas a dos primatas,
vamos simplesmente alterar a pgina inicial do quadro principal e alterar os links.
Clique no menu Arquivo / Salvar como e o nome do arquivo ser felinosquadro e
o ttulo Exposio dos felinos.
Clique com o boto direito do mouse sobre o quadro de contedo, selecione a opo
Propriedades do quadro. Na caixa Pgina inicial, clique no boto Procurar e
selecione o arquivo felinos.htm e clique em OK e OK novamente. Agora vamos
alterar os links para as fotos.
Selecione o link para a foto. Clique no boto Criar hyperlink, observe a opo
Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no boto
Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique sobre
o desenho do quadro onde a pgina dever aparecer. No nosso site ser o quadro
que est esquerda da pgina Clique em OK e em seguida, OK novamente.

Selecione o segundo link para a foto. Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.

Selecione o terceiro link para a foto. Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.

Salve o arquivo e clique no boto Visualizar no navegador para testar.
9.2 Alterando a Pgina Principal e Links para os Marsupiais
Clique no menu Arquivo / Salvar como e o nome do arquivo ser
marsupiaisquadro e o ttulo Exposio dos Marsupiais.
Clique com o boto direito do mouse sobre o quadro de contedo, selecione a opo
Propriedades do quadro. Na caixa Pgina inicial, clique no boto Procurar e
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 94
FRONTPAGE 2000 APOSTILA




selecione o arquivo marsupiais.htm e clique em OK e OK novamente. Agora vamos
alterar os links para as fotos.
Selecione o primeiro link para a foto.Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Selecione o segundo link para a foto. Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Selecione o terceiro link para a foto. Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Salve o arquivo e clique no boto Visualizar no navegador para testar.
9.3 Alterando a Pgina Principal e Links para os Paquidermes
Clique no menu Arquivo / Salvar como e o nome do arquivo ser
paquidermesquadro e o ttulo Exposio dos Paquidermes.
Clique com o boto direito do mouse sobre o quadro de contedo, selecione a opo
Propriedades do quadro. Na caixa Pgina inicial, clique no boto Procurar e
selecione o arquivo paquidermes.htm e clique em OK e OK novamente. Agora
vamos alterar os links para as fotos.
Selecione o link para a foto. Clique no boto Criar hyperlink, observe a opo
Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Selecione o link para o filme. Clique no boto Criar hyperlink, observe a opo
Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no boto
Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique sobre
o desenho do quadro onde a pgina dever aparecer. No nosso site ser o quadro
que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Salve o arquivo e clique no boto Visualizar no navegador para testar.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 95
FRONTPAGE 2000 APOSTILA




9.4 Alterando a Pgina Principal e Links para os Pssaros
Clique no menu Arquivo / Salvar como e o nome do arquivo ser passarosquadro
e o ttulo Exposio dos Pssaros.
Clique com o boto direito do mouse sobre o quadro de contedo, selecione a opo
Propriedades do quadro. Na caixa Pgina inicial, clique no boto Procurar e
selecione o arquivo passaros.htm e clique em OK e OK novamente. Agora vamos
alterar os links para as fotos.
Selecione o primeiro link para a foto. Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Selecione o segundo link para a foto. Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Selecione o terceiro link para a foto. Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Salve o arquivo e clique no boto Visualizar no navegador para testar.
9.5 Alterando a Pgina Principal e Links para os Rpteis
Clique no menu Arquivo / Salvar como e o nome do arquivo ser repteisquadro e
o ttulo Exposio dos Rpteis.
Clique com o boto direito do mouse sobre o quadro de contedo, selecione a opo
Propriedades do quadro. Na caixa Pgina inicial, clique no boto Procurar e
selecione o arquivo repteis.htm e clique em OK e OK novamente. Agora vamos
alterar os links para as fotos.
Selecione o primeiro link para a foto. Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 96
FRONTPAGE 2000 APOSTILA




Selecione o segundo link para a foto. Clique no boto Criar hyperlink, observe a
opo Quadro de destino localizada na parte inferior da caixa de dilogo. Clique no
boto Alterar o quadro de destino. Na caixa de dilogo Quadro de destino, clique
sobre o desenho do quadro onde a pgina dever aparecer. No nosso site ser o
quadro que est esquerda da pgina Clique em OK e em seguida, OK novamente.
Salve o arquivo e clique no boto Visualizar no navegador para testar.
9.6 Criando os Links do Cabealho
Agora que todas as pginas de quadros esto criadas podemos criar os links no
cabealho. Selecione a imagem felinos no cabealho, clique no boto Criar
hyperlink, selecione o arquivo felinosquadro.htm. Clique no boto Alterar o
quadro de destino. Na caixa de dilogo Quadro de destino, selecione a opo
Quadro pai, porque o navegador tem que apagar a pgina de quadro que estava
sendo mostrada e mostrar a pgina indicada no link. Clique em OK e OK
novamente.
Selecione a imagem primatas no cabealho, clique no boto Criar hyperlink,
selecione o arquivo primataquadro.htm. Clique no boto Alterar o quadro de
destino. Na caixa de dilogo Quadro de destino, selecione a opo Quadro pai,
porque o navegador tem que apagar a pgina de quadro que estava sendo mostrada
e mostrar a pgina indicada no link. Clique em OK e OK novamente.
Selecione a imagem rpteis no cabealho, clique no boto Criar hyperlink,
selecione o arquivo repteisquadro.htm. Clique no boto Alterar o quadro de
destino. Na caixa de dilogo Quadro de destino, selecione a opo Quadro pai,
porque o navegador tem que apagar a pgina de quadro que estava sendo mostrada
e mostrar a pgina indicada no link. Clique em OK e OK novamente.
Selecione a imagem pssaros no cabealho, clique no boto Criar hyperlink,
selecione o arquivo passarosquadro.htm. Clique no boto Alterar o quadro de
destino. Na caixa de dilogo Quadro de destino, selecione a opo Quadro pai,
porque o navegador tem que apagar a pgina de quadro que estava sendo mostrada
e mostrar a pgina indicada no link. Clique em OK e OK novamente.
Selecione a imagem paquidermes no cabealho, clique no boto Criar hyperlink,
selecione o arquivo paquidermesquadro.htm. Clique no boto Alterar o quadro de
destino. Na caixa de dilogo Quadro de destino, selecione a opo Quadro pai,
porque o navegador tem que apagar a pgina de quadro que estava sendo mostrada
e mostrar a pgina indicada no link. Clique em OK e OK novamente.
Selecione a imagem marsupiais no cabealho, clique no boto Criar hyperlink,
selecione o arquivo marsupiaisquadro.htm. Clique no boto Alterar o quadro de
destino. Na caixa de dilogo Quadro de destino, selecione a opo Quadro pai,
porque o navegador tem que apagar a pgina de quadro que estava sendo mostrada
e mostrar a pgina indicada no link. Clique em OK e OK novamente.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 97
FRONTPAGE 2000 APOSTILA




Salve o arquivo e clique no boto Visualizar no navegador para testar.
Se desejar que a pgina definida no link seja aberta em uma nova janela do
navegador clique na opo Nova janela. Para abrir a pgina chamada no link no
mesmo quadro selecione a opo Mesmo quadro. Para que a pgina aberta ocupe
a janela inteira, ou seja, apague todos os quadros, selecione a opo Pgina
inteira. Para que a pgina seja aberta no quadro anterior ao do link, selecione a
opo Quadro pai.
9.7 Dividindo e Excluindo Quadros
Cada quadro existente pode ser dividido ou ate mesmo excludo da pgina que voc
est construindo.
Para excluir um quadro, clique dentro do quadro a ser excludo, depois clique no
menu Quadros / Excluir quadro.
Para dividir um quadro, selecione o quadro a ser dividido, clique no menu Quadros /
Dividir quadro.

Defina como ser feita a diviso se em colunas (Dividir em colunas) ou se em
linhas (Dividir em linhas) e clique em OK.
10. Mapa de Imagens
10.1 O que o Mapa de Imagens faz e qual sua Aplicabilidade
Usando o mapa de imagens, voc pode vincular vrias reas de uma imagem a
diferentes pontos da Web, ou seja criar hyperlinks diferentes em cada parte da
imagem, dependendo de onde o usurio clicar ele ser conduzido para o local
indicado pelo hyperlink.
Como sabemos uma imagem fala muito mais do vrias palavras. Usando uma
imagem para que o visitante do seu site navegue por ele, ser mais intuitivo e fcil.
Quando o usurio visualizar uma determinada rea da empresa, por exemplo,
discriminada em uma imagem e quando ele passa o mouse sobre esta rea o
ponteiro se transforma em mozinha, indicando link, com certeza ele ir clicar.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 98
FRONTPAGE 2000 APOSTILA




10.2 Criando o Mapa de Imagens
Abra a web zoolgico que est na pasta Meus Documentos. Clique no modo tarefas.
Existem duas tarefas, uma est relacionada com a pgina animais onde criaremos
um mapa de imagens. D um clique duplo sobe esta tarefa e clique no boto Iniciar
tarefa.
Temos que escolher uma imagem boa e facilmente discernvel para usar, e
desenhar os pontos ativos claramente, de modo que, antes de clicarem em qualquer
ponto do mapa de imagens, os visitantes sempre saibam para onde estaro indo.
Clique no menu Inserir / Figura / Do arquivo, na pasta gifs\zoologico o arquivo
mapa.gif, selecione-o e clique em OK.
Esta imagem mostra cada espcie de animal separadamente. Cada parte ser um
link para uma pgina de quadro da espcie.
Precisaremos utilizar a barra de ferramentas Figura, que exibida na parte inferior da
tela quando a imagem est selecionada. Se quiser desenhar um ponto ativo
quadrado ou retangular na imagem, selecione o boto rea interativa em forma
de retngulo. O boto rea interativa em forma de polgono permite que voc
desenhe pontos ativos em forma de polgonos de vrios lados. O boto rea
interativa circular permite que voc desenhe pontos ativos em forma de polgonos
de vrios lados.
1. Para criarmos o hyperlink para os primatas, clique no boto rea interativa
circular. O ponteiro do mouse se transformar em um lpis. Posicione este
lpis no centro do desenho dos primatas, clique e arraste at que o crculo
ocupe todo o desenho referente aos primatas. Solte o clique.
2. Este ponto ativo dever envolver toda a rea que o visitante poder clicar.
3. Ser aberta a caixa de dilogo Criar Hyperlink. Selecione o arquivo
primataquadro.htm e clique em OK.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 99
FRONTPAGE 2000 APOSTILA





4. Voc visualizar o crculo desenhado, se precisar mov-lo, clique sobre ele e
arraste-o. Se precisar redimension-lo, posicione o ponteiro do mouse sobre
uma das alas de redimensionamento e arraste at que o objeto esteja do
tamanho desejado.
5. Vamos criar as outras reas interativas. Clique no boto rea interativa em
forma de retngulo, e desenhe um retngulo para os marsupiais. Ao soltar o
clique, selecione o arquivo marsupiaisquadro.htm e clique em OK. Se
precisar posicione e redimensione o objeto da rea interativa.
6. Clique no boto rea interativa em forma de retngulo, e desenhe um
retngulo para os paquidermes. Ao soltar o clique, selecione o arquivo
paquidermesquadro.htm e clique em OK. Se precisar posicione e
redimensione o objeto da rea interativa.
7. Clique no boto rea interativa em forma de polgono, e desenhe um
polgono para os felinos. Ao soltar o clique, selecione o arquivo
felinosquadro.htm e clique em OK. Se precisar posicione e redimensione o
objeto da rea interativa.
8. Clique no boto rea interativa circular, e desenhe um crculo para os
rpteis. Ao soltar o clique, selecione o arquivo repteisquadro.htm e clique
em OK. Se precisar posicione e redimensione o objeto da rea interativa.
9. Clique no boto rea interativa circular, e desenhe um crculo para os
pssaros. Ao soltar o clique, selecione o arquivo passarosquadro.htm e
clique em OK. Se precisar posicione e redimensione o objeto da rea
interativa.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 100
FRONTPAGE 2000 APOSTILA




10. Salve o arquivo. Como este arquivo foi aberto atravs das tarefas ser exibida
uma caixa de dilogo para marcar a tarefa como concluda.
11. Clique em Sim. Visualize o arquivo no navegador para testar.
10.3 Criando o Vnculo Padro
O vnculo padro ser ativado quando algum clicar dentro da imagem, porm, fora
de todos os pontos ativos criados. Os vnculos de pontos ativos sempre tm
prioridade sobre o vnculo padro que voc informar.
Para determinar este link:
1. Clique com o boto direito do mouse sobre a figura e selecione a opo
Propriedades da figura.

2. Na caixa Hyperlink padro local, voc pode digitar (ou localizar) o nome de
arquivo ou URL referente ao local ao qual deseja que essa imagem conduza o
visitante quando eles clicarem fora do ponto ativo.
3. Clique em OK. No nosso caso no acrescentaremos nenhum link padro.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 101
FRONTPAGE 2000 APOSTILA






Acrescente o texto acima depois do mapa de imagens. As frases Zoolgico de So
Paulo e Zoolgico de Salvador, so links que devem ser abertos em outra janela.

Selecione a frase Zoolgico de So Paulo. Clique no boto Criar hyperlink. Na
caixa URL digite www.zoologico.com.br, clique no boto Alterar quadro de destino
e selecione a opo Nova janela. Assim o site do zo de So Paulo ser mostrado
em outra janela do navegador.

Selecione a frase Zoolgico de Salvador. Clique no boto Criar hyperlink. Na caixa
URL digite www.seagri.ba.gov.br/zoo, clique no boto Alterar quadro de destino e
selecione a opo Nova janela. Assim o site do zo de So Paulo ser mostrado em
outra janela do navegador.

Salve o arquivo e visualize no navegador.
11. Formulrio
11.1 Para que serve o Formulrio
Normalmente, os visitantes que passam pela pgina da Web s chegam a ler o texto
que voc digita e ver as imagens que voc inclui. A web tipicamente uma
conversao unilateral. Os visitantes simplesmente navegam e clicam em diferentes
vnculos.
Os formulrios alteram o paradigma da Web ao permitirem que os visitantes
respondam a determinadas perguntas e digitem dados quando visitarem certos tipos
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 102
FRONTPAGE 2000 APOSTILA




de pginas. Possibilitando a assim a troca de informaes entre os visitantes e o
proprietrio do site.
Os formulrios so parte integrante da comunicao com os visitantes e permite que
eles participem do site. Quando precisamos fazer pesquisa sobre um assunto
relacionado com o site, ou quando desejamos receber opinies dos visitantes
respeito do design e da interao do site, ou quando criamos uma promoo para
recebimento de brindes onde os dados do visitante tem de ser conhecidos, em todas
essas situaes utilizaremos um formulrio.
11.2 Como os Formulrios Funcionam
Para criar formulrios, necessrio que voc acrescente itens especiais,
denominados elementos de formulrios, na pgina.
Alm dos diferentes campos de formulrio, cada formulrio possui um boto
intitulado Submeter. Este boto permite que os visitantes sinalizem quando
terminaram de digitar suas informaes e envia os dados ao servidor da Web que
hospeda a pgina.
Para fazer os formulrios funcionarem apropriadamente, nem sempre necessrio
que voc utilize um servidor da Web que oferea suporte s extenses do
FrontPage. Contudo, para usar este recurso interativo, voc precisa ter permisso
especial do seu provedor da Web. Entre em contato com a empresa que hospeda o
site e verifique se ela permite que voc use formulrios na pgina. Caso contrrio,
quando os visitantes clicarem no boto Submeter, nada acontecer.
Abra a web zoolgico que est na pasta Meus Documentos. Clique no modo tarefas.
Existe uma tarefa que est relacionada com a pgina livro onde criaremos um
formulrio para identificar o visitante do site. D um clique duplo sobe esta tarefa e
clique no boto Iniciar tarefa.
Para inserirmos campos de formulrio utilizaremos o menu Inserir / Formulrio.
Assim que voc inserir o primeiro campo de formulrio, aparecer na tela um limite
pontilhado com os botes: Submeter e Redefinir. Todos os outros campos deste
formulrio devero ser inseridos dentro do limite pontilhado para que faam parte do
mesmo formulrio.
Primeiro acrescente o seguinte texto no incio da pgina:
"Obrigado por visitar nosso site. Ajude-nos a melhor-lo e assine nosso livro de
visitas!".
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 103
FRONTPAGE 2000 APOSTILA




11.3 Criando os Botes de Opo
Acrescentaremos botes de opes onde o visitante poder escolher a forma de
tratamento, se senhor ou senhora.
Em uma lista de botes de opo voc pode selecionar somente uma das opes.
Para acrescentar um conjunto de botes de opo, clique no menu Inserir /
Formulrio / Boto de opo para inserir um por um dos botes que compem um
grupo.
Observe as propriedades dos botes de opo clicando sobre o mesmo com o boto
direito e depois Propriedades do campo do formulrio ou dando clique duplo
sobre o boto de opo.

Todos os botes que fazem parte de um grupo devero ter o mesmo Nome do
grupo. O nome do grupo ser tratamento.
A opo Valor que dar nome individual a cada um dos botes. Para esta primeira
opo digite Senhor.
Tambm poder ser definida qual a opo j estar selecionada quando o visitante
entrar na pgina, bastar marcar o Estado inicial como Selecionado. Mas se no
quiser nenhuma opo marcada em todos os botes que criar marque o Estado
inicial como No selecionado. Vamos marcar o estado inicial No selecionado.
Clique em OK. Ao lado do boto digite Sr. Acrescente dois espaos aps a palavra
Sr.
Clique no menu Inserir / Formulrio / Boto de opo para inserir o segundo boto
que compe o grupo. D um clique duplo sobre o boto e digite Tratamento no
Nome do grupo. Na caixa Valor digite Senhora. Marque o Estado inicial como No
selecionado. Clique em OK. Ao lado do boto digite Sra. Acrescente dois espaos
aps a palavra Sra.
Clique no menu Inserir / Formulrio / Boto de opo para inserir o terceiro boto
que compe o grupo. D um clique duplo sobre o boto e digite Tratamento no
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 104
FRONTPAGE 2000 APOSTILA




Nome do grupo. Na caixa Valor digite Senhorita. Marque o Estado inicial como
No selecionado. Clique em OK. Ao lado do boto digite Srta.
Aps estes botes de opo acrescentaremos uma tabela que nos ajudar a
organizar os prximos campos de formulrio.
11.4 Criando Caixa de Texto de uma Linha
Clique no menu Tabela / Inserir / Tabela e preencha as opes da tabela como a
imagem abaixo mostra:

Dentro da primeira clula da tabela digite Nome:. Vamos tambm diminuir um pouco
a largura da primeira coluna. Posicione o ponteiro do mouse sobre a borda que
divide as duas colunas. O ponteiro se transformar em uma seta com duas pontas,
clique, mantenha o boto do mouse pressionado e arraste para a esquerda at ficar
um pouco maior que a palavra Nome. Conforme a imagem mostra.

Deixe o cursor piscando dentro da segunda clula.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 105
FRONTPAGE 2000 APOSTILA




Agora vamos inserir um campo onde o visitante possa digitar um texto pequeno.
Este a caixa de texto.
Para inserir uma caixa de texto de formulrio, clique no menu Inserir / Formulrio /
Caixa de texto de uma linha. Esta caixa tem propriedades que devem ser alteradas
clicando sobre ela com o boto direito do mouse e em seguida, Propriedades do
campo do formulrio ou dando clique duplo sobre o campo.

Nome: nome pelo qual o FrontPage identificar este campo dentro deste formulrio.
Este campo obrigatrio e deve ser preenchido para todos os outros tipos de
campos do FrontPage. Alm de identificar o campo para o FrontPage, este nome o
que estar visvel no e-mail que receberemos com os dados do usurio do site. O
nome deste campo que acrescentamos Nome.
Observao
Ao dar nome aos campos do formulrio no utilize nenhum tipo de
acentuao, nem espaos entre as palavras.
Valor inicial: texto que vai aparecer inicialmente na tela do visitante. Vamos deix-lo
em branco.
Largura em caracteres: tamanho da caixa de texto que ser apresentada na tela.
Quando voc utiliza as alas de redimensionamento do campo, este campo j
definido automaticamente.
Ordem de tabulao: se o usurio estiver usando a tecla TAB para se movimentar
pelo formulrio, o nmero digitado neste campo informar a ordem a seguir. No
obrigatrio. E automaticamente o FrontPage vai criando a Ordem de tabulao.
Campo de senha: quando Sim, o que o visitante digitar aparecer na tela em forma
de asterisco como uma senha. No e-mail que voc receber o que o usurio digitar
estar visvel.
Para definir a quantidade de caracteres que so inseridos em uma caixa de texto,
clique no boto Validar.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 106
FRONTPAGE 2000 APOSTILA






A maioria das opes nesta caixa de dilogo s funcionaro se o provedor que voc
hospeda o site possuir as extenses do FrontPage, por este motivo vamos trabalhar
apenas com as opes que no necessitam das extenses.

Marque a opo Necessrio para definir o mnimo e o mximo de dados
necessrios neste campo.
Na caixa Compr. mnimo digite a quantidade mnima de caracteres que devem ser
digitados no campo.
Na caixa Compr. mximo digite a quantidade mxima de caracteres que devem ser
digitados no campo. Para o campo Nome defina 50 no Compr. mximo. Clique em
OK e em OK novamente. O campo est criado.
11.5 Criando Outras Caixas de Texto no Formulrio
Coloque o cursor dentro da primeira clula da segunda linha. Digite Endereo.
Posicione o cursor dentro da segunda clula.
1. Clique no menu Inserir / Formulrio / Caixa de texto de uma linha.
2. Redimensione a caixa usando as alas de redimensionamento.
3. D um clique duplo sobre a caixa e preencha a caixa Nome com Endereo.
4. No ser necessrio definir a quantidade mxima de caracteres. Clique em
OK.
Coloque o cursor dentro da primeira clula da terceira linha. Digite Cidade. Posicione
o cursor dentro da segunda clula.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 107
FRONTPAGE 2000 APOSTILA




1. Clique no menu Inserir / Formulrio / Caixa de texto de uma linha.
2. Redimensione a caixa usando as alas de redimensionamento.
3. D um clique duplo sobre a caixa e preencha a caixa Nome com Cidade.
4. A quantidade mxima de caracteres que poder ser digitada 20. Clique no
boto Validar, marque a caixa Necessrio e digite 20 na caixa Compr.
mximo. Clique em OK e em OK novamente.
11.6 Criando o Menu Suspenso
Agora o visitante digitar o estado onde ele reside, como as opes para estados
sero sempre as mesmas, vamos criar uma lista de opes onde o visitante apenas
clicar sobre o nome do estado desejado.
Coloque o cursor dentro da primeira clula da quarta linha. Digite Estado. Posicione
o cursor dentro da segunda clula.
Os Menus suspensos possibilitam que os visitantes selecionem um item de uma
lista de informaes que voc fornea. Para inserir um deles na pgina, clique no
menu Inserir / Formulrio / Menu suspenso.
Acesse as propriedades do Menu suspenso para incluir a lista de itens que ele
dever conter, clicando sobre o mesmo com o boto direito do mouse e depois
Propriedades do campo do formulrio ou dando clique duplo sobre o Menu
suspenso.

D um Nome para o Menu suspenso inserido, o nome ser estado.
Para adicionar os itens que ele dever conter, clique em Adicionar.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 108
FRONTPAGE 2000 APOSTILA





Escolha determina a palavra que vai aparecer na tela do seu visitante. Digite um
item em Escolha. O primeiro estado que acrescentaremos ser o Esprito Santo.
Marque a caixa de seleo Especificar valor e digite o texto que ser visualizado
no e-mail quando o visitante selecionar a opo. Digite apenas a sigla do estado ES.
Clique em OK.
Clique no boto Adicionar, digite So Paulo na caixa Escolha. Marque a caixa de
seleo Especificar valor e digite apenas a sigla do estado SP. Clique em OK.
Clique no boto Adicionar, digite Rio de J aneiro na caixa Escolha. Marque a caixa
de seleo Especificar valor e digite apenas a sigla do estado RJ . Clique em OK.
Clique no boto Adicionar, digite Minas Gerais na caixa Escolha. Marque a caixa
de seleo Especificar valor e digite apenas a sigla do estado MG. Este dever ser
o estado a ser mostrado na pgina do livro de visitas quando o visitante acess-la,
ento marque o Estado inicial como Selecionado. Clique em OK.
Clique no boto Adicionar, digite Acre na caixa Escolha. Marque a caixa de seleo
Especificar valor e digite apenas a sigla do estado AC. Clique em OK.
Clique no boto Adicionar, digite Amazonas na caixa Escolha. Marque a caixa de
seleo Especificar valor e digite apenas a sigla do estado AM. Clique em OK.
Se desejar acrescente os outros estados seguindo os mesmos passos anteriores.
Depois que todas as opes do menu suspenso estiverem adicionadas, voc pode
usar os botes Mover para cima e Mover para baixo para organizar a lista de itens.
Para alterar qualquer uma das opes, selecione-a e clique no boto Modificar.
Assim que estiver tudo pronto clique em OK. E OK novamente.
Salve o arquivo.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 109
FRONTPAGE 2000 APOSTILA




11.7 Acrescentando mais Campos
1. Posicione o cursor aps o menu suspenso, acrescente alguns espaos e
digite CEP. Clique no menu Inserir / Formulrio / Caixa de texto de uma
linha.
2. Redimensione a caixa usando as alas de redimensionamento.
3. D um clique duplo sobre a caixa e preencha a caixa Nome com CEP.
4. A quantidade mxima de caracteres que poder ser digitada 12. Clique no
boto Validar, marque a caixa Necessrio e digite 12 na caixa Compr.
mximo. Clique em OK e em OK novamente.
Ser necessrio acrescentar mais uma linha na tabela, posicione o cursor aps a
caixa do CEP. Pressione a tecla TAB. Ser inserida uma nova linha na tabela.
Coloque o cursor dentro da primeira clula desta nova linha. Digite E-mail. Posicione
o cursor dentro da segunda clula.
1. Clique no menu Inserir / Formulrio / Caixa de texto de uma linha.
2. Redimensione a caixa usando as alas de redimensionamento.
3. D um clique duplo sobre a caixa e preencha a caixa Nome com Email.
4. No ser necessrio definir a quantidade mxima de caracteres. Clique em
OK.
Salve o arquivo. Aps a tabela digite o texto mostrado na prxima figura:

Salve o arquivo.
11.8 Criando Caixa de Seleo
Esse campo possibilita que os visitantes selecionem itens em uma lista, em vez de
digitarem as informaes por conta prpria.
Abaixo da pergunta sobre como o visitante encontrou nosso site, mostraremos vrias
opes que podero ser selecionadas. Para organiz-las vamos inserir um outra
tabela. Clique no menu Tabela / Inserir / Tabela e preencha as opes da tabela
como a imagem a seguir mostra:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 110
FRONTPAGE 2000 APOSTILA





Clique em OK.
Cada caixa de seleo deve ser inserida individualmente. Quando uma caixa
marcada, seu valor gravado como ativo, caso contrrio, como desativado.
Deixe o cursor piscando na primeira clula desta tabela.
Para inserir caixas de seleo, clique no menu Inserir / Formulrio / Caixa de
seleo.
Observe as propriedades da caixa de seleo clicando sobre a mesma com o boto
direito e depois Propriedades do campo do formulrio ou dando clique duplo
sobre a caixa de seleo.

Nome o nome dado cada uma das caixas de seleo. A primeira ser TV.
Valor o valor que ser atribudo a esta caixa quando marcada pelo visitante. Digite
Selecionou.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 111
FRONTPAGE 2000 APOSTILA




Estado inicial como estar a caixa ao abrir o formulrio: Selecionado ou No
selecionado. Esta caixa no estar selecionada. Clique em OK. Acrescente dois
espaos aps a Caixa de seleo e digite Anncio na TV.
Coloque o cursor dentro da segunda clula desta linha.
1. Clique no menu Inserir / Formulrio / Caixa de seleo.
2. D um clique duplo sobre a caixa e preencha a caixa Nome com Site.
3. Na caixa Valor digite Selecionou.
4. O Estado inicial ser No selecionado. Clique em OK. Acrescente dois
espaos aps a Caixa de seleo e digite Site de Busca.
Coloque o cursor dentro da primeira clula da segunda linha.
1. Clique no menu Inserir / Formulrio / Caixa de seleo.
2. D um clique duplo sobre a caixa e preencha a caixa Nome com Visita.
3. Na caixa Valor digite Selecionou.
4. O Estado inicial ser No selecionado. Clique em OK. Acrescente dois
espaos aps a Caixa de seleo e digite Enquanto visitava o Zo.
Coloque o cursor dentro da segunda clula desta linha.
1. Clique no menu Inserir / Formulrio / Caixa de seleo.
2. D um clique duplo sobre a caixa e preencha a caixa Nome com Outro.
3. Na caixa Valor digite Selecionou.
4. O Estado inicial ser No selecionado. Clique em OK. Acrescente dois
espaos aps a Caixa de seleo e digite Outros (Explique abaixo).
11.9 Criando Caixa de Rolagem de Texto
So praticamente idnticos a campos de texto de uma linha, exceto pelo fato de que
eles podem ocupar vrias linhas.
Para que o visitante possa digitar a outra forma que ele encontrou nosso site
precisaremos de uma caixa de texto de rolagem.
Para inserir um campo de texto rolvel, clique no menu Inserir / Formulrio / Caixa
de texto de rolagem.
Acesse as propriedades da Caixa de texto de rolagem, clicando sobre o mesmo
com o boto direito do mouse e depois Propriedades do campo do formulrio ou
dando clique duplo sobre a Caixa de texto de rolagem.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 112
FRONTPAGE 2000 APOSTILA





Digite um Nome para a caixa, o nome ser Como_encontrou. Se desejar que dentro
desta caixa o visitante j encontre uma mensagem digitada, digite a mensagem na
caixa Valor inicial. No vamos digitar nenhuma mensagem.
Para definir o tamanho da Caixa de texto de rolagem, digite a Largura em
caracteres e o Nmero de linhas que a mesma ocupar. Em vez de digitar utilize
as alas de redimensionamento depois que clicar em OK.
Posicione o cursor aps a caixa de texto de rolagem. Digite a seguinte frase:
"Como podemos melhorar nosso site? Por favor, deixe suas sugestes."
Clique no menu Inserir / Formulrio / Caixa de texto de rolagem.
Use as alas de redimensionamento para determinar o tamanho da caixa. D um
clique duplo sobre ela. Na caixa Nome digite Sugestoes. Na caixa Valor inicial
digite Sua sugesto muito importante. Clique em OK. Salve o arquivo.
11.10 Criando o Restante do Formulrio
A partir das caixas de seleo a aparncia da pgina a seguinte:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 113
FRONTPAGE 2000 APOSTILA





Digite o texto que est abaixo da segunda caixa de texto de rolagem. Salve o
arquivo.
Posicione o cursor depois da interrogao da frase "Voc j visitou o Aldeia Zo?",
acrescente dois espaos. Vamos inserir dois botes de opo.
Clique no menu Inserir / Formulrio / Boto de opo. D um clique duplo sobre o
primeiro boto. O Nome do grupo ser Visitou. O Valor ser Sim e o Valor inicial
ser No selecionado. Clique em OK. Acrescente dois espaos aps o boto e
digite Sim.
Clique no menu Inserir / Formulrio / Boto de opo. D um clique duplo sobre o
segundo boto. O Nome do grupo ser Visitou. O Valor ser No e o Valor inicial
ser No selecionado. Clique em OK. Acrescente dois espaos aps o boto e
digite No.
Salve o arquivo.
11.11 Configurando o Boto de Ao
Os botes Submeter e Redefinir so chamados de botes de ao, porque ao
serem utilizados executam aes distintas. O Submeter conforme estiver
configurado no formulrio (que voc ver no prximo mdulo) envia os dados
preenchidos no formulrio e o Redefinir apaga todos os dados que forma
preenchidos no formulrio.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 114
FRONTPAGE 2000 APOSTILA




Acesse as propriedades do Boto de ao Submeter, clicando sobre o mesmo com
o boto direito do mouse e depois Propriedades do campo do formulrio ou
dando clique duplo sobre o Boto de ao.

A alterao que voc precisa fazer a do Rtulo que o que aparecer escrito no
boto. Digite Enviar e clique em OK.
D um clique duplo sobre o boto Redefinir e digite Limpar na caixa Rtulo. Clique
em OK.
Salve o arquivo e visualize no navegador.
Por enquanto o boto Enviar no est funcionando no prximo tpico o
configuraremos para que seja possvel recebermos os dados que o usurio
preencheu.
11.12 Para que serve Configurar o Formulrio
Depois que voc tiver criado todos os elementos do formulrio, ter quase concludo
o processo. Faltar apenas que voc informe ao FrontPage o que voc pretende
fazer com os dados do formulrio toda vez que um visitante clicar no boto
Submeter. Depois que voc tiver programado o boto Submeter, esta pgina de
formulrio estar concluda e voc poder integr-la como parte do seu site da Web
normal.
Ao configurar o formulrio voc estar enviando os dados preenchidos por e-mail ou
para um banco de dados. E a nica forma de um formulrio em um site ter objetivo
se voc puder receber os dados dos visitantes, ento sempre configure o formulrio.
11.13 Configurando o Formulrio
Por padro, quando visitantes clicam no Submeter do formulrio, o FrontPage envia
uma mensagem padro a eles para que eles saibam que a sua transmisso foi
concluda e, depois, salva as respostas dos visitantes em um arquivo privado
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 115
FRONTPAGE 2000 APOSTILA




denominado Form_results.txt no seu servidor da Web. Voc pode encontrar este
arquivo no diretrio _private do seu site da Web do FrontPage.
Abra a web zoolgico que est na pasta com as iniciais do seu nome, dentro da
pasta Personal Class. Abra o arquivo livro.
Para alterar a ao padro do FrontPage, acesse as propriedades do formulrio,
clicando com o boto direito do mouse dentro do limite do formulrio e em seguida,
Propriedades do formulrio.

Esta tela de propriedades permite que voc altere o diretrio e o nome do arquivo
que ser recebido, atravs da opo Nome do arquivo.
Voc tambm poder receber o arquivo por e-mail se preencher a opo Endereo
eletrnico.
Atravs do boto Opes voc poder escolher o formato do arquivo.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 116
FRONTPAGE 2000 APOSTILA





Ao selecionar o formato e as informaes a serem salvas quando o boto Submeter
for clicado, voc pode explorar as diferentes opes que esto sua disposio.
Clique em OK para salvar as opes de ao do seu formulrio.
Seu formulrio est concludo! Mas estas opes s funcionaro se o provedor
estiver com as extenses do Frontpage instaladas.
Se o provedor que voc utiliza no possui as extenses do FrontPage solicite a ele o
arquivo que ser usado para envio do formulrio e a forma de configur-lo no HTML.
12. Barra de Navegao
12.1 O que a Barra de Navegao faz e qual sua Aplicabilidade
Ao entrarmos em um site precisamos de links que nos levam s pginas principais
do site. Na maioria dos sites utilizado ou na parte superior da pgina ou
esquerda da pgina uma barra com esses links, essa barra chamada de barra de
navegao.
Para facilitar a navegao pelo site que utilizamos esta barra. Ela aparece em
quase todas, seno, todas as pginas do site. Com a utilizao da barra de
navegao o desenvolvedor da pgina ganhar tempo para cuidar de outros
detalhes do site.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 117
FRONTPAGE 2000 APOSTILA




12.2 Como a Barra de Navegao Funciona
Criar a barra de navegao usando os comandos que j conhecemos seria muito
trabalhoso. Pensando em agilizar a criao da barra de navegao o FrontPage
trouxe um recurso que nos auxiliar na criao desta barra.
A barra de navegao deve ser um dos ltimos recursos a serem acrescentados ao
site. Ento, depois que todas as pginas do site estiverem prontas que vamos
trabalhar com a barra de navegao. Como todas as pginas que precisamos no site
do zoolgico esto prontas, abra a web zoolgico que est na pasta com as Meus
documentos.
Clique no modo de visualizao Navegao.

Neste modo de visualizao vamos criar um organograma que mostrar a estrutura
do site, em cima deste organograma o FrontPage poder construir a barra de
navegao.
Note que a pgina principal do site j est no organograma, a pgina que chamamos
de index considerada a pgina principal do site. Agora basta ligarmos as outras
pginas pgina principal na ordem que devem aparecer na barra de navegao.
J unto com o organograma estamos visualizando a lista de pastas, de grande
importncia neste modo porque assim podemos escolher os arquivos que vamos
utilizar.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 118
FRONTPAGE 2000 APOSTILA




13. Organograma
13.1 Criando o Organograma do Zo
Para criar o organograma:
1. Clique no arquivo que estar subordinado ao principal, no caso o arquivo
animais, e arraste-o at a caixa do organograma que o representa, um
pontilhado ser mostrado indicar como o arquivo est sendo ligado ao outro.

2. Ao soltar o clique o organograma estar da seguinte forma:

3. Agora vamos fazer o mesmo processo com o arquivo informacoes. Clique
sobre o arquivo, mantenha o boto pressionado, arraste at o zoolgico. A
imagem a seguir mostra como ser a indicao da ligao antes de soltar o
clique.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 119
FRONTPAGE 2000 APOSTILA





4. Solte o clique. Arquivo j est ligado ao index.
5. Vamos fazer o mesmo processo com o arquivo livro. Clique sobre o arquivo,
mantenha o boto pressionado, arraste at o zoolgico e solte o clique. O
organograma estar da seguinte forma:

6. Se precisar alterar o texto mostrado em uma das caixas do organograma.
Clique sobre a caixa com o boto direito do mouse, selecione a opo
Renomear. Digite o texto correto e pressione a tecla ENTER.
7. Relacionado ao arquivo animais esto todas as pginas de quadro que
criamos para cada uma das espcies.
8. Vamos fazer o mesmo processo com o arquivo felinosquadros. Clique sobre o
arquivo, mantenha o boto pressionado, arraste at o animais e solte o clique.
O organograma estar da seguinte forma:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 120
FRONTPAGE 2000 APOSTILA





9. Clique sobre o arquivo marsupiaisquadro, mantenha o boto pressionado,
arraste at o animais e solte o clique.
10. Clique sobre o arquivo paquidermesquadro, mantenha o boto pressionado,
arraste at o animais e solte o clique.
11. Clique sobre o arquivo passarosquadro, mantenha o boto pressionado,
arraste at o animais e solte o clique.
12. Clique sobre o arquivo primataquadro, mantenha o boto pressionado,
arraste at o animais e solte o clique.
13. Clique sobre o arquivo repteisquadro, mantenha o boto pressionado,
arraste at o animais e solte o clique. O organograma estar da seguinte
forma:

13.2 Criando a Barra de Navegao do Zo
Depois que o organograma que mostra a ligao entre os arquivos est pronto,
possvel criar a barra de navegao.
1. Abra um dos arquivos que conter a barra de navegao. Abra o arquivo
index (d um clique duplo sobre ele).
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 121
FRONTPAGE 2000 APOSTILA




Como esta barra ser compartilhada com outros arquivos precisamos
acrescent-la em uma rea da pgina que tambm ser visualizada em
outros arquivos. Toda pgina criada no FrontPage pode trabalhar com
Bordas compartilhadas. So partes da pgina, onde o que for acrescentado
ser visvel em todas as pginas que estiverem trabalhando com as bordas
compartilhadas. Como a barra de navegao.
2. Para visualizar a borda compartilhada na pgina, clique no menu Formatar /
Bordas Compartilhadas.

3. Primeiro temos que definir se todas as pginas do site utilizaro borda
compartilhada ou apenas algumas. Se forem todas marque a opo Todas as
pginas, mas se forem apenas algumas, faa uma por uma, marcando a
opo Pgina atual. Para o nosso site marque a opo Pgina atual.
4. Depois defina em que parte da pgina ser mostrada a borda compartilhada.
Marque Parte superior e Esquerda.
5. Clique em OK.
Voc notar que a barra de navegao j ser mostrada e uma faixa depgina
tambm. Se estamos utilizando Tema estes componentes utilizam oformato
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 122
FRONTPAGE 2000 APOSTILA





6. Se voc quiser alterar a Faixa de pgina d um clique duplo sobre ela.

7. Defina se ela ser uma Figura ou s Texto e qual e qual ser o Texto da
faixa de pgina. Clique em OK.
13.3 Alterando as Propriedades da Barra de Navegao
Para alterar as propriedades da Barra de navegao, d um clique duplo
sobre ela.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 123
FRONTPAGE 2000 APOSTILA





Voc pode definir em qual nvel do organograma os links sero acrescentados
na barra de navegao e quais sero as pginas adicionais. Tambm poder
definir o Orientao e aparncia da barra. Aps fazer as modificaes clique
em OK. Vamos deixar o que foi definido pelo FrontPage.
Salve o arquivo index e feche-o.
Abra o arquivo animais, para visualizar a borda compartilhada na pgina,
clique no menu Formatar / Bordas Compartilhadas.
Marque a opo Pgina atual, Parte superior e Esquerda. Clique em OK.
Salve o arquivo e feche-o.
Abra o arquivo livro, para visualizar a borda compartilhada na pgina, clique
no menu Formatar / Bordas Compartilhadas.
Marque a opo Pgina atual e Esquerda. Clique em OK. Salve o arquivo e
feche-o.
Abra o arquivo index e visualize-o no navegador. Utilize os links da barra de
navegao criada para navegar pelo site do zoolgico.
14. Relatrios
14.1 Qual a Funo dos Relatrios
Os relatrios fornecem informaes sobre os arquivos do site e seu funcionamento.
A parte mais burocrtica e chata da criao de um site o controle dos arquivos, dos
links que no esto funcionando, do tamanho do site, quantas imagens estamos
utilizando, se alguma pgina est lenta, etc.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 124
FRONTPAGE 2000 APOSTILA




14.2 Como Construir um Relatrio
O FrontPage nos traz vrios tipos de relatrios que nos auxiliaro nesta tarefa rdua.
Clique no modo de visualizao Relatrios. Normalmente o FrontPage nos mostra o
Resumo do site.

Ao ler o resumo do site notou que existem alguns arquivos no site que no esto
sendo acessados por nenhum outro. Para saber quais so esses arquivos, ou o
relatrio detalhado sobre os Arquivos desvinculados d um clique duplo sobre
este item do resumo.
Ento voc poder conferir se estes arquivos so necessrios ou no ao seu site,
podendo por meio deste relatrio excluir os arquivos dispensveis.
Abaixo uma lista de todos os relatrios que voc pode estar utilizando no FrontPage:
Resumo do site.
Todos os arquivos.
Arquivos recentemente adicionados, sendo que voc pode
escolher a partir de quantos dias atrs ser feita a pesquisa.
Arquivos recentemente alterados, sendo possvel tambm definir
a partir de quantos dias atrs ser feita a pesquisa.
Arquivos mais antigos.
Arquivos desvinculados.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 125
FRONTPAGE 2000 APOSTILA




Pginas lentas, podendo definir o tempo desejvel para o
carregamento das pginas e encontrar quais esto
ultrapassando este tempo.
Hyperlinks desfeitos.
Erros de componentes.
Status da reviso, onde voc pode controlar as alteraes da
pgina e marcar que tipo de reviso foi feita, por quem e que
dia.
Atribudo a, quando se est trabalhando em grupo para
determinar que far o arquivo especificado.
Categorias.
Status da publicao, onde voc define quais arquivos sero
publicados ou no.
Faa testes com cada um destes relatrio, com certeza vrios deles sero teis no
controle do seu site.
15. Importao
15.1 Qual o Objetivo da Importao
A importao de arquivos, copia arquivos que esto em uma pasta no winchester ou
arquivos que esto na Internet para a Web que voc est trabalhando.
Imagine que voc est trabalhando em um site na empresa, mas uma parte do
trabalho voc vai fazer em casa. Mas ao chegar em casa voc se lembra que
esqueceu os disquetes sobre a mesa. O que fazer? Ento voc se lembra que
publicou o site na Internet para fazer teste. Com a importao do FrontPage voc
conseguir copiar os arquivos do site sem sair de casa.
15.2 Importando um Arquivo
Para importar uma pgina HTML para uma Web existente:
1. Abra a web que ir receber o arquivo. Clique no modo Pgina.
2. Clique no menu Arquivo / Importar, e defina se ser feita acrescentada uma
pgina (Adicionar arquivo) ou se ser acrescentada uma pasta do
winchester (Adicionar pasta) ou se ser importado um site da Internet (Da
Web) clicando no boto correspondente esquerda da tela.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 126
FRONTPAGE 2000 APOSTILA





3. Vamos clicar no boto Adicionar arquivo. Ser exibida a janela Adicionar
arquivo lista de distribuio. V at a pasta gifs\zoologico que est na
rea de trabalho e selecione o arquivo sons. Clique no boto Abrir.

4. O arquivo ser mostrado na lista de arquivos para importao.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 127
FRONTPAGE 2000 APOSTILA





5. Clique no boto OK e o arquivo j far parte da Web.
15.3 Importando uma Web
O FrontPage permite importar a Web da Internet, ou seja, um endereo WWW
qualquer.
Para importar uma Web, no FrontPage, clique no menu Arquivo / Novo / Web.
1. Na janela que ser aberta selecione o Assistente para Importao de Web.
Defina em qual pasta ser criada a nova Web e clique no boto OK.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 128
FRONTPAGE 2000 APOSTILA





2. A primeira opo: De um diretrio de origem de arquivos em um
computador local ou rede, possibilita especificar uma pasta a ser importada
como Web.
Para determinar qual pasta, clique no boto Procurar.
Clique sobre a pasta escolhida.
Aps clicar OK, se nesta pasta voc criou subpastas, habilite a opo Incluir
subpastas.
Clique no boto Avanar.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 129
FRONTPAGE 2000 APOSTILA





o Ser exibida uma lista com todos os
arquivos da pasta que voc selecionou. Se
quiser excluir algum arquivo que foi
selecionado, clique sobre o nome do
mesmo e clique no boto Excluir. Depois
clique no boto Avanar.
o Agora clique no boto Concluir e sua Web
importada j estar na tela.
1. A segunda opo: De um site da World Wide Web, permite importar as
pginas de um site que j faz parte da WWW. Para isto, aps habilitar esta
opo:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 130
FRONTPAGE 2000 APOSTILA





Na caixa Local, digite o endereo WWW do site desejado.
Clique no boto Avanar.
Especifique as opes de limite de espao que a Web ocupar do seu disco,
clique Avanar e Concluir.
Os arquivos da Web especificada j foram importados para o seu disco.
Agora podero ser alterados e personalizados por voc.
Ns no precisaremos fazer esta importao porque nosso site j est pronto.
16. Publicar
16.1 O que Publicar
medida que voc cria e edita pginas com o FrontPage, elas so salvas no disco
rgido do seu computador pessoal. Isso conveniente para voc porque todos os
arquivos com os quais voc precisa trabalhar esto em algum subdiretrio. Ao
visualizar o seu site por intermdio do modo de visualizao Pastas, voc v em um
s diretrio, uma lista de todas as pginas e imagens e de todos os arquivos
relacionados a elas.
A publicao envia os arquivos do site que esto armazenados no winchester para
um provedor de Internet.
Para tornar seus arquivos disponveis para todos os usurios da WWW, voc precisa
public-los na Internet. Ao publicar seus arquivos, voc os estar enviando a um
computador, denominado Servidor da Web, que est conectado em tempo integral
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 131
FRONTPAGE 2000 APOSTILA




Internet. Este servidor da Web possui a incumbncia de hospedar as suas pginas e
envi-las a navegadores sempre que um visitante passar por elas.
16.2 Como funciona a Publicao do Site
Para que voc possa publicar seu site na Internet, voc precisa dispor de um
provedor. Nem todos os servidores de presena na Web so iguais, especialmente
no que se refere ao suporte ao FrontPage, pois, este possui diversos recursos
especiais que exigem um suporte especial dos provedores para que funcionem.
Para poderem usar e exibir corretamente vrios dos recursos especficos do
FrontPage, os provedores de presena na Web precisam instalar programas
especiais denominados extenses do FrontPage nos seus servidores. Essas
extenses permitem que voc crie pginas dinmicas que empreguem recursos
avanados, tais como componentes e formulrios interativos. Pelo uso de extenses
do FrontPage em seus servidores, os provedores de presena na Web pagam uma
taxa Microsoft, e isto explica porque nem todos oferecem suporte a elas. Alm
disto, nenhum outro editor de HTML disponvel pode tirar proveito desses recursos
especiais.
Voc pode usar um servidor que no possua extenses do FrontPage, mas nem
todos os recursos avanados do seu site funcionaro.
O FrontPage vem com um assistente de publicao. Esse assistente
automaticamente invocado toda vez que voc clica no boto Publicar web.
Ao fazer upload das suas pginas pela primeira vez, voc precisa fornecer
importantes informaes sobre para onde as est enviando, e informar o seu nome
de usurio e sua senha. Em uploads posteriores, o FrontPage transfere somente
aqueles arquivos que tiverem sido alterados desde a ltima vez que voc tiver
publicado seu site.
16.3 Fazendo Upload pela Primeira Vez
1. Conecte-se Internet. Clique no boto Publicar web.
2. A caixa de dilogo Publicar web solicita que voc informe o local da Internet
para o qual voc deseja transferir o seu site da Web do FrontPage corrente.
Digite www.nome_do_local.com.br/nome_pasta e clique no boto Publicar.
Se o seu provedor possui as extenses do FrontPage voc dever informar o
endereo http que ser utilizado para navegar (ex.:
www.nome_do_local.com.br), mas se o provedor no possui as extenses do
FrontPage voc deve digitar o endereo de FTP.
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 132
FRONTPAGE 2000 APOSTILA





3. Ao digitar o endereo http o FrontPage pesquisar se o seu provedor possui
as extenses, se no solicitar o endereo de FTP.
FTP a abreviatura de File Transfer Protocol, o qual o meio padro de dois
computadores enviarem um arquivo para o outro na Internet. O site FTP
fornecido pelo seu provedor de presena na Web.

4. Clique no boto OK para aceitar a mudana no endereo que o FrontPage
far. E clique novamente no boto Publicar.
5. A ltima pergunta que o Assistente lhe faz sobre o seu nome e sua senha
de usurio FTP. Qualquer dvida sobre estas informaes, entre em contato
com a linha de suporte tcnico do seu provedor. Pea ao orientador para
digitar a senha do local da publicao.
6. Clique em OK. O FrontPage se conecta com seu provedor e envia todo o seu
site. O processo de transferncia ser ilustrado na tela.
7. Se existir algum arquivo no provedor que no faa parte do site o FrontPage o
informar e perguntar se deseja excluir estes arquivos. Confirme clicando no
boto Sim para todos.

8. Se alguma pgina do site utilizar um componente que s funciona com as
extenses do FrontPage a seguinte mensagem ser mostrada:
Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 133
FRONTPAGE 2000 APOSTILA





9. Clique no boto Continuar e aguarde at que o FrontPage conclua a
transmisso do site.

10. Clique em Concludo. V at o navegador e digite o endereo
www.nome_do_local.com.br/nome_pasta/nome_seu_site e navegue no site.
16.4 Publicando as Alteraes do Site
Depois que voc tiver configurado o seu site, publicar alteraes e atualizaes no
site da Web do FrontPage muito fcil. Toda vez que voc efetuar alteraes em
um arquivo ou conjunto de arquivos do seu site e quiser public-las na internet, voc
precisa apenas clicar no boto Publicar web do FrontPage. O FrontPage recupera
todas as informaes do local da ltima publicao e imediatamente comea a
enviar os seus arquivos para a Internet.
O FrontPage suficientemente inteligente para carregar s as pginas que tiverem
sido alteradas, mantendo o seu tempo de publicao no mnimo necessrio.

Apostila FrontPage 2000 Prof Maria Angela M. Roveredo Santos Jun-01 134

You might also like