ne Re oe MANUAL DE MICROSOFT FRONTPAGE 2003 a ibs — 3 Microsofe Office a roniPage: 2003 Professora: Sara Matias Ano Lectivo 2008/2009COMO TRABALHAR COM O MICROSOFT FRONTPAGE 2003 O Microsoft FrontPage 6 uma aplicacao que permite: © A criagao de paginas HTML (HyperText Markup Language) num ambiente WYSIWYG (What You See Is What You Get) (O que vé, é o que obterd). = Criar, gerir e publicar Web sites num computador local ou através de uma ligagdo a um servidor Web (acessivel através de uma rede local ou através da Internet). Criar paginas de informacdo (Web) no Frontpage Para criar uma pagina Nova do FrontPage, aceda ao menu Ficheiro, escolha a op¢ao Novo... No lado direito, escolha a opgao Web site de uma pagina. 3 Fetero lai) Apart de pons eastete Maks modes de pga Modelos Procrd nine 5) wot ome ove (Web) no Frontpage De seguida, é apresentada uma caixa de didlogo com uma lista de modelos (templates), a partir dos quais pode criar uma nova pagina web. Se nenhum deles se adequar as suas necessidades, deve comegar a partir de Web site de uma pagina ouWeb site vazio. a pasta onde vai ser criada a nova web, por exemplo, c:\websites\novaweb: Li a ‘Gert |pcts| tneont serve | Webstede asset de Assert so Asatonte de Ome Uimsplgna reefacede.. Webpara. Web sts, [ecto a cae o drovo Web Haag ee. og Pe or Se eee eee ee @ @ webtp webste vase mf Criar paginas de informacao (Web) no Frontpage © FrontPage cria, assim, uma web, com a estrutura indicada, sobre a qual podemos comegar a trabalhar imediatamente. A janela do FrontPage fica dividida em duas janelas essenciais: a Lista de Pastas, onde podemos criar, mover, copiar, alterar 0 nome ou apagar novas pastas ou paginas HTML, e, a direita, a vista de paginas HTML habitual do FrontPage: Exheiro Edter Yer Insert Frmater Ferromentas Tabels Qodos Frames Janda Ajuda: 2: G-ANA BGA FT ABAZ/O- OHI ase Bon viog Normal + Tines New Roman 13 (2tori Ms 8 | ESR RA WIE Udo pastas _) Cal X||[igy Wed ee | indexttm [Grcivetsesrovensd [ei] "senate 1 Cl images @ index. tem Nota: Caso nao veja a Lista de Pastas, aceda ao menu Ver e seleccione Lista de Pastas.Criacao de uma pagina HTML em FrontPage Existem varias maneiras de criar uma pagina HTML no FrontPage. Podemos utilizar 0 botao criar uma nova pagina normal na barra de ferramentas, a opgao Novo... do menu Ficheiro (seleccionado posteriormente a opgao Pagina em branco), ou fazendo um clique com 0 botdo direito do rato em qualquer uma das janelas de visualizagao (excepto no modo de visualizagao Tarefas) e escolher Nova -> Pagina no menu. es de jalizacao de Webs em FrontPage © FrontPage dispde de quatro opgées essenciais de visualizagao de paginas Web. O modo Estrutura, onde podemos criar 0 conteido de uma pagina HTML de uma forma muito semethante a outros programas, como 0 Word, por exemplo. Este é 0 modo de edigéo wysiwyg de paginas HTML do FrontPage. Para além deste modo de visualizagdo, o FrontPage dispde também do modo Cédigo, onde podemos ver, alterar, apagar ou adicionar cédigo ao cédigo HTML da nossa pagina, o modo Dividir, onde podemos visualizar ao mesmo tempo o modo Estrutura e 0 modo Cédigo, e o modo Pré-visualizagéo, que permite ver como a pagina se comporta num browser e o seu aspecto estrutura]Eovidir ELcédign QPré-visualizacto | «|Vistas para as Webs em FrontPage O FrontPage disponibiliza ainda um conjunto de vistas para as Webs (para tal deve seleccionar-se a opgdo Web Site): Times New Rom: 3 (12p00 « s ‘acme Bat 8. Em baixo, as opgdes de visualizagao irao ser substituidas pelas diversas opgées de vistas ‘ S=Sfooce BRelatérios deNavegario & Hiperigaries @Tarefas Vistas para as Webs em FrontPage Pastas - Permite ver as pastas e ficheiros existentes numa web, de um modo muito semelhante ao Windows Explorer. Permite criar, copiar, mover, alterar 0 nome e apagar ficheiros ou pastas de um modo simples. Website Remote - Permite publicar ficheiros a partir de um web site remoto para um web site local. Relatérios - Esta vista disponibiliza um conjunto de relatorios para nos facilitar a manutengdo de uma web. Navegacae - A maioria dos Web Sites tém o seu contetido organizado numa estrutura hierarquica, como um organigrama. No topo da estrutura temos a home page (pagina principal), e a partir desta temos varias ramificagdes, dependendo do tipo de contetido de cada pagina. Este modo de visualizagéo permite ver a estrutura de navegagao da web, num esquema grafico, e permite-nos visualizar ou alterar a estrutura do siteVistas para as Webs em FrontPage Hiperligacées - Permite-nos analisar a estrutura de hiperligagées de uma pagina HTML, através de um esquema. Tarefas - Este modo de visualizagéo permite-nos ver uma lista de tarefas pendentes relativas a web. As tarefas podem ser criadas manualmente a medida que forem surgindo, ou automaticamente, como resultado de outros processos. Pagina - Esta ¢ a vista onde podemos visualizar e editar as paginas HTML. Esta & composta pelos quatro modos de visualizaao ja referidos (Estrutura, Dividir, Cédigo, Pré-visualizagao). - Esta esta presente sempre que estamos a editar um ficheiro (clicar em cima do nome do ficheiro na lista de pastas por exemplo) Visualizagaéo em Browser O FrontPage permite que uma pagina seja pré-visualizada num browser, através da opcéo Pré-visualizar no browser, no menu Ficheiro, ou do botéo correspondente, na barra de ferramentas (pode-se também escolher qual o browser onde queremos pré-visualizar) Da ekeenei ceria leash eter eda eaten ube ates Eicheiro Editar Yer Inserir Formatar Ferramentas Tabela ado: D-#- BAe) S-jafa}7iadagio. Normal = Times New Reman 3(i2pto~ NZ S| Pré-visualizar no browser Editar uma pagina Apés criar uma nova pagina, temos, no FrontPage, uma pagina HTML em branco, que podemos agora preencher com o contetido que temos em mente, Podemos criar e alterar o contetido da pagina, o titulo, esquema de cor, ou outrascaracteristicas da nossa pagina. Se criou uma web, pode simplesmente fazer um clique com o rato sobre a pagina que quer editar, através da janela Lista de Pastas: Pawebstes|novaneb [lens] 7 & CD _private Pi | | Gravar uma pagina Para gravar uma pagina, pode escolher uma das varias maneiras possiveis. Se esta a editar uma pagina que nunca tenha gravado anteriormente, pode escolher a opcdo Guardar ou Guardar como do menu Ficheiro. Pode também utilizar a combinagao de teclas CTRL + G, ou ainda fazer um clique sobre o botéo Guardar na barra de ferramentas, Se a pagina jé foi gravada anteriormente, basta apenas fechar a pagina e confirmar a gravagao. O FrontPage grava as alteragdes automaticamente. Guardar Eliminar uma pagina Se estivermos a trabalhar sobre uma Web, podemos, através da janela Lista de Pastas seleccionar um ou mais ficheiros da nossa web, e remové-los. Depois de seleccionado(s), basta escolher a opgao Eliminar do menu Editar:|X cow conte =|! Soper ome [Bo sss date, At Piane Bla om wi Ou clicar com o botdo direito sobre um item seleccionado e escolher a opcdo Eliminar do menu, ou carregar na tecla Eliminar. Em qualquer dos casos, 0 FrontPage mostra uma caixa de didlogo a pedir a confirmagéo da remogdo dos ficheiros: Tem a certeza de que deseja einer "index. hint, home page do seu web ste? ia emia = home page do seu website, Bto pode rear em boscbes quebradas,barras de hperigacies adie © errze publica piginae Fo yolkar a mostar. (ee) {oT Definir as propriedades de uma pagina Através da caixa de didlogo Propriedades da pagina podemos modificar a aparéncia global da nossa pagina, alterando a cor ou imagem de fundo, margens, titulo, cor das hiperligagées, e outras. Para abrir a caixa de didlogo Propriedades da pagina, pode escolher a opgao Propriedades no menu Ficheiro, ou, fazer um clique sobre a pagina com o botdo direito do rato, e escolher, no menu, a opg4o Propriedades da pagina:& aa (B coer Abrir pagina em nova janela Inserco de texto, imagens e outros elementos FrontPage permite inserir texto e outros objectos, a partir de ficheiros externos. Através do menu Inserir podemos inserir entre outros: Formularios, Ficheiros (HTML, Word, Excel, e outros), video, imagens e graficos externos de diferentes formatos, como GIF, JPEG, PNG, WMF, AVI, TIFF, e outros Quebra... Lrhaborzotal 128 Comte ps spor Daa hr. ‘Simbolo... conti. Mavegasso. Fats da gee, 14 congonert wen mance Fears a SY ecto erative a tokio. Fichero.. B® bo scanner ou da cdmara, Marcador: CoHH8 | gga plead Fomrafas B Hestoesdo.. cottk |) re en formato Hash 4B toro deseo (termes aitondtias AL worcset.. ‘1 side.,Alinhamento e espacamento de linhas A barra de ferramentas dispée de botdes para alinhar o paragrafo a esquerda, a direita, ou ao centro, a semelhanga do Word. Adicionalmente, no menu Formatar, escolhendo a op¢ao Paragrafo, é exibida uma caixa de didlogo, com variadas opgées de configurago do paragrafo actual, e na secedo inferior da janela, uma pré-visualizagao do aspecto do paragrafo a medida que as alteragdes sdo efectuadas: agens Para inserir imagens no FrontPage, existem varias técnicas disponiveis : + Arrastar uma imagem da janela do Windows Explorer para a pagina; + Arrastar uma imagem do Internet Explorer para a pagina; + Copiar imagens de outros programas (Adobe Photoshop, Paint, ou outros) para o clipboard utilizando a opgao copiar no menu editar do respectivo programa, e, de seguida, escolher a op¢o paste do menu editar no FrontPage; + Arrastar imagens de uma pagina aberta no FrontPage para uma outra pagina; + Arrastar uma imagem de um local para outro, dentro da mesma pagina;+ Através da opgao Imagem -> Do Ficheiro no menu Inserir. Propriedades gerais de uma imagem Para aceder as propriedades gerais de uma imagem, clique com o botdo direito do rato sobre a imagem, e escolha a op¢4o Propriedades da imagem: a By 23, coow iG Color iy teearea metconets Alterar tipo de ficheiro de imagem.. arr barat ernst agers Abrir pagina em nova janele cet ros tives oe Propredade & trertgacto, arrows eins arena Na caixa de propriedades Picture Properties podemos configurar varios aspectos da imagem, como a sua localizaco, representac6es alternativas, hiperligagdo, formato de imagem, tamanho, e outros: ecaco G e | gen: ESSE pce. s “pose ero de mone.Inclusao de video Podemos incluir ficheiros de video numa pagina HTML. Para o fazer escolha a opgdo Imagem -> Video... no menu Inserir. &) cotar 2 covier GB ce GB rariatutzar auecmaticamente ‘Aterar tipo de ficheiro de imagem. Mostrar bara de ferramencas de imagens Abrir pina em nova janela ea aeereereeald Hiperligacées Para criar uma hiperligacao no FrontPage: 1. Seleccione o texto ou imagem para o qual deseja criar uma hiperligagao; 2 Escolha, no menu Inserir a opcéo Hiperligagao, ou clique no botdo Hiperlink na barra de ferramentas. Aparece a caixa de didlogo Inserir Hiperligagao; 3. Especifique 0 enderego de destino no campo Enderego; 4, Clique em OK.edie, | Pocraen [Grooms =] | Ql tons eb Ja ro rem abe) a i a sed Sat | cobenr neste a} vit Graamena | Figmas Cl foams conetads 5) dosent o Goarneye | Febetros Goamerto | recetes Jy ees [ —“—s—s—sSOSSOSCSCSCiY terres | ebcrérico concede Para apagar uma hiperligacdo no FrontPage: 1. Clique com o botdo direito sobre o texto ou imagem que contém a hiperligagao que deseja apagar; 2. Seleccione do menu a op¢ao Propriedades da Hiperligacao; 3. © enderego aparece seleccionado no campo URL, carregue em Remover a ligagao para apagar o enderego; 4, Clique em OK. Bey i Criagaéo de Marcadores (Bookmarks} Por vezes, especialmente quando temos uma pagina longa, é conveniente utilizar hiperligagées para saltar para um ponto da mesma pagina. Os marcadores oferecem essa funcionalidade. Permitem que se faga uma ligagao de um pontode uma pagina para outro ponto da mesma, ou até para uma outra pagina relativamente extensa, num ponto que seja ou nao no topo da pagina. Para defi um marcador: 1.Abra a pagina de destino no FrontPage (se nao for a mesma que a pagina de origem); 2.Seleccione o elemento que vai possibilitar o salto para a secgao da pagina de destino (imagem, texto, etc), Este elemento sera o marcador; 3.Escolha, no menu Inserir a opgaéo Marcador. Aparece uma caixa de didlogo; 4.Escreva 0 nome que deseja dar a este marcador no campo Nome do Marcador. Utilize um nome diferente para cada marcador na mesma pagina: 5.Clique em OK. Para criar uma hiperligagao cujo destino é um marcador: 1, Abra a pagina que vai conter a hiperligacao; 2. Crie uma hiperligagéo normal, especificando no campo URL o enderego da pagina; 3. Seleccione a opgao Marcador e escolha um marcador; 4.Clique em OK. ta hige ie exe: olor =] comeCriagdo de imagem de mapa Os Image Maps, também chamados de hotspots, permitem que varias partes de uma mesma imagem estejam associadas a diferentes hiperligagées Para adicionar um hotspot a uma imagem no FrontPage: 1. Clique uma vez sobre a imagem para a seleccionar; 2. Seleccione a ferramenta de hotspot rectangular, circular ou poligonal na barra de ferramentas Imagens; 3. Com a ferramenta de hotspot rectangular ou circular, clique no ponto de origem, e arraste o rato até definir a drea que pretende para o hotspot. Com a ferramenta de hotspot poligonal, clique com o rato em cada canto da area que deseja criar. Para fechar o poligono, faga duplo clique no ponto mais préximo do Ultimo ponto, e a linha final sera criada até ao ponto inicial; BABB OB) 2 aa S/O Ole a t= y 2 it a x [QOOCYS ta Tabelas 4. Posicione o ponto de insergao no local onde a tabela deve aparecer; 2. Escolha a opgdo Inserir->Tabela no menu Tabela. Aparece a caixa de didlogo Inserir Tabela; 3. Especifique as caracteristicas da nova tabela; 4, Clique em OK.is Ferementas de exuena — Activa Ferranertas de e=auoma © Em pleets amt frome =] fm 8 ‘rea das cts: fr 4 specifier ura: Enacaneto ete cites: F 3 fe Frames ou Molduras Para além da utilizagao de tabelas, existe um outro método para dispor 0 contetido das paginas no browser, as Frames Uma pagina especial, chamada Frameset, define o desenho (layout) dos frames, e as paginas correspondentes ao contetido de cada um dos frames. Mais tarde, tecorrendo as Hiperligages podemos carregar outras paginas numa frame em resposta as selecgdes dos utilizadores. Para criar um Frameset: 1, Escolha Novo->Pagina ou Web no menu , e escolha, Modelos de Pagina (no lado direito do ecran). Na caixa Modelos de Paginas, escolha dos tiposde pagina Paginas com Frames, aquela que mais se adapta ao Frameset que pretende criar. Inserietabela 2x) Ferramertas de equera Active Feranents de e=quoma © (esacivarFrramertas dequana ecto ere cer, F 3} F163 oars wets (Ta eo Se pe IF Fecha tine da tabla ew @ (oes tir inagem de find Tua ete TF redeine par nous tables se =] see Para dividir um frame em dois, seleccione o frame que pretende dividir, e escolha, no menu Frames a opgéo Dividir Frames. Se pretender apagar um frame, seleccione o frame, e escolha a op¢do Eliminar Frames no menu Frames, Criar hiperligagées em Framesets Uma vez definidos e criados o Frameset e os frames, as hiperligagdes de qualquer um dos frames podem mostrar uma nova pagina na mesma frame, numa frame diferente, ou numa janela diferente. Esta acedo ¢ indicada pelo atributo Frame de Destino, que especifica o nome da frame onde a pagina de destino da hiperligagdo deve ser exibidayea tepvamene fa, 2) =a |B — a ae 7 eae sie tt J ‘A, ae sooo a Ca) coat | Formularios No FrontPage podemos criar formularios facilmente. Para criar um formuldrio: 1. Posicione 0 ponto de insergéo no local onde deveraé aparecer o primeiro elemento do Formulario; 2. Escolha, no menu Inserir a op¢éo Formulario > Formulario. Sera criado o formulario, indicado no FrontPage por um rectangulo tracejado, contendo apenas um botéo Submeter e um botdo Repor; 3. Para cada elemento que queira no formulario, posicione o ponto de insergéo dentro deste, escolha no menu Inserir a opgéo Formulario, e escolha, do menu resultante, o tipo de elemento a inseri | st lara aks a | aed | aa J airalel [es | igen [aoe eae eo, [= Ba haste (eee epee See aba Behe) 3 a 1 Gite || sine =e ae eden ole or Samer Smee |) cae (eiceed| Careers ox | oe ||No Interior do formulario, também pode adicionar outros elementos para além destes. Quer sejam imagens, tabelas, texto, hiperligagdes ou outros. Criar 0 aspecto visual do formuldrio 6 apenas uma parte da tarefa. Tera também de configurar as propriedades, tanto do formulario em si, como de cada um dos elementos que dela fazem parte. Para ver ou modificar as propriedades do formulario, clique com o botao direito sobre este e escolha a op¢ao Propriedades do Formulario. Para ver ou modificar as propriedades de um elemento do formuldrio, clique sobre este com o botéo direito e escolha Propriedades do Campo de Formulario.