download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou...

53
1

Transcript of download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou...

Page 1: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

1

Page 2: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

Construindo hipertextos na internet

APRESENTAÇÃO

Muitos de seus alunos navegam na internet. Este processo de busca de informações na rede pode ser muito valioso para a construção de conhecimento, bem como pode torna-se um ato inútil, sem relevância e qualidade pedagógica.

Baseado no conceito de WebQuest, em “Construindo hipertextos na internet” vamos usar o ambiente virtual para estimular a pesquisa, o pensamento crítico e a produção de hipertextos de uma forma prática e confiável. A idéia é que os alunos não apenas naveguem na Internet, mas que também criem websites.

A situação é a seguinte: os alunos são divididos em grupos, coletam materiais na internet e outros meios, fazem uma seleção das informações e construem um novo discurso, hipertextos, tendo assim como resultado um website que será publicado também na Internet e poderá ser acessado por outros alunos.

2

A atividade desenvolvida aqui é fruto de encontros e debates entre educadores que estão ligados a projetos desenvolvidos com o uso de tecnologias na sala de aula e atentos na motivação dos alunos para participar da inclusão digital.

WebQuest

É uma metodologia de pesquisa na Internet voltada para o processo educacional, que associa a pesquisa e sitematização de informações coletadas na Web a resultados de aprendizagem.

Page 3: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

3

Nome: Construindo hipertextos na internet

Público alvo: 7ª a 8ª série do ensino fundamental e ensino médio

Disciplina: Multidisciplinar

Tema transversal: Ética e Cidadania

Softwares necessários: Internet Explorer e FrontPage

Tempo previsto: 9 aulas

Objetivos:

- Engajar o trabalho em equipe, a partir de um projeto dividido em etapas intencionais, deliberadas e com metas a serem alcançadas;

- Estimular a pesquisa e a seleção de informações relevantes ao tema pretendido;

- Desenvolver habilidades de leitura e escrita

- Familiarizar os alunos com conceitos e linguagens utilizados na internet;

- Construir um site a partir de comandos básicos no FrontPage.

Planejamento da Atividade:

Na sala de aula (2 aulas):

- Apresentação e discussão do tema com os alunos;- Discussão a respeito da música “Pela Internet” de Gilberto Gil;- Organização dos grupos de trabalho e definição do tema de cada grupo- Distribuição e preenchimento da folha de atividade.

No laboratório de informática (7 aulas):

Primeiro Encontro (3 aulas)

- Pesquisa na internet sobre o tema;- Seleção dos textos, imagens e links mais relevantes;- Abordagem do tema, por meio de diferentes perspectivas, de acordo com a visão de algumas personalidades. Ex: geógrafo, historiador, economista- Edição do texto final para cada uma das páginas do site;

Segundo Encontro (4 aulas)

- Discussão a respeito de conteúdo e design;- Visita a alguns sites; - Apresentação do programa FrontPage e explicação básica de como utilizar o programa;- Criação do Website;- Publicação na internet- Socialização das descobertas e avaliação da aprendizagem

Page 4: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

ETAPA 1 – Introdução ao tema

1.1 Inicie a aula conversando com os alunos sobre a importância da seleção de informação. Por exemplo, pergunte o que eles assistiram ontem na TV ou leram no jornal.

1.2Questione-os também sobre os conteúdos que eles lêem na internet. Os sites costumam responder a perguntas básicas como: O que é? Por que? Onde? Apresentam argumentos ou fatos fundamentando as afirmações apresentadas?

1.3Apresente a proposta da atividade. Comente como será feita a atividade:

- Escolha de um tema, pesquisa na Internet e outros meios, seleção e edição de textos e imagens, planejamento, montagem e publicação do website.

Observação: o tema poderá ser combinado com os alunos de acordo com a proposta de trabalho da escola ou negociado com o grupo, conforme as necessidades de aprendizagem apresentadas.

1.4 Por fim, apresente alguns termos associados a Internet. Imprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida, ouçam a música.

4

DICA

Imprimir só uma página

Caso você não queira imprimir todas as páginas deste arquivo. Vá na janela de impressão e no box Intervalo de páginas digite na caixa em branco 5, assim só o texto a ser distribuído aos alunos será impresso.

Page 5: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

Pela InternetComposição: Gilberto Gil

Criar meu website Fazer minha home-page Com quantos gigabytes

Se faz uma jangada Um barco que veleje

Que veleje nesse infomar Que aproveite a vazante da infomaré Que leve um oriki do meu velho orixá

Ao porto de um disquete de um micro em Taipé

Um barco que veleje nesse infomar Que aproveite a vazante da infomaré

Que leve meu e-mail até Calcutá Depois de um hot-link Num site de Helsinque

Para abastecer

Eu quero entrar na rede Promover um debate

Juntar via Internet Um grupo de tietes de Connecticut

De Connecticut acessar O chefe da Macmilícia de Milão

Um hacker mafioso acaba de soltar Um vírus pra atacar programas no Japão

Eu quero entrar na rede pra contactar Os lares do Nepal, os bares do Gabão

Que o chefe da polícia carioca avisa pelo celular Que lá na praça Onze tem um videopôquer para se jogar

5

Website: conjunto de páginas na internet sobre um determinado tema.

Home-page: é a página inicial de um site, onde se encontram os links para as demais páginas.

Gigabytes: bytes é a medida utilizada em informática para medir o tamanho de um arquivo. No caso, um gibabyte equivale a um bilhão de bytes.

Infomar: INFO + MAR, junção da palavra informação com a palavra mar, no sentido de grande quantidade de informação está disponível como se fosse um mar, infinito.

E-mail: eletronic mail, ou correio eletrônico em português, é o serviço de troca de mensagens pela internet. Dizer vou enviar um e-mail é o mesmo que, vou enviar uma carta, só que este processo se dá pelo computador.

Hot-link: o mesmo que link, local passível de clique, que executa a ligação entre objetos de uma mesma página ou de páginas distintas na internet.

Site: o mesmo que website.

Hacker: é uma pessoa viciada em computador com amplo conhecimento em informática e que geralmente faz mal uso desse conhecimento, invadindo sistemas seguros e quebrando senhas para seu puro prazer ou para roubar informações sigilosas.

Vírus: pequenos programas desenvolvidos para corromperem o funcionamento e estabilidade dos computadores, apagando e modificando arquivos. Eles são geralmente transmitidos pela Internet, e-mail, disquetes, entre outros.

Page 6: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

ETAPA 2 – Organização do grupo de trabalho

2.1Divida os alunos em grupos de 8 integrantes. Indique pelo menos 16 temas para que os grupos possam escolher um.

2.2 Em seguida, os grupos devem estruturar o trabalho. Para que um site seja interessante é importante que contenha os seguintes tópicos:

- Uma introdução, que forneça informações básicas para despertar o interesse do internauta (HOME);

- Links relativos ao tema que abordem os aspectos essenciais para compreensão do asunto apresentado (LINKS);

- Imagens que ilustrem o que está sendo tratado;

2.3 O site deverá ter uma HOME e os links necessários, de acordo com o assunto a ser abordado, sendo que um dos links deverá ter o título “Personalidades”, em que os alunos abordarão o tema de acordo com diferentes perspectivas, conforme será explicado mais adiante:

Lembre os alunos de que os textos de base e as imagens serão extraídos basicamente da internet, mas que podem ser incluídas informações obtidas em bibliotecas, revistas e jornais.

6

Page 7: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

ETAPA 3 – Folha de atividade

3.1 Distribua a folha de atividade, ela deverá ter a seguinte diagramação:

3.2 Peça para que os alunos preencham a folha de atividade. Eles devem escrever o tema escolhido para a construção do site e os títulos dos links de cada página.

7

Atividade: Construindo hipertextos para internet

Tema escolhido: ___________________________________________________

Conteúdo:

HOME PERSONALIDADES

Layout:

Grupo: ____________________________________________________________________________________________________________________

série: ________

Page 8: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PRIMEIRO ENCONTRO

ETAPA 1 – Pesquisa do conteúdo

Inicie a atividade com a pesquisa na internet sobre cada um dos temas. Peça para que os grupos dividam a pesquisa entre os integrantes: alguns buscam textos e outros imagens.

O ideal é que cada integrante do grupo fique responsável por uma área do site, por exemplo, um dos alunos pesquisa o texto da home, dois buscam as imagens e o restante procuram conteúdo sobre os links.

Veja como os alunos podem realizar a pesquisa no passo a passo abaixo:

PASSO 1 – Criar nova pasta

Antes de iniciar a pesquisa, peça aos alunos que criem uma nova pasta de trabalho. É nesta pasta que eles vão gravar todo o material pesquisado e editado para a montagem do site.

Converse com o responsável pelo laboratório de informática sobre o local de armazenamento das pastas. Em algumas escolas existem locais especifíco para a gravação de arquivos dos alunos. Em nosso exemplo, vamos criar uma pasta em Meus Documentos.

- Abra a pasta Meus Documetos, clique no menu Arquivo, aponte para Novo e escolha a opção Pasta.

8

Dê um nome a pasta, que pode ser o título do trabalho.

Page 9: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 2 – Acessar o site de pesquisa

Para realizar a pesquisa os alunos devem consultar sites de busca na internet, como por exemplo os sites http://search.msn.com.br, www.google.com.br, www.cade.com.br

PASSO 2 – Acessar o site de pesquisa

Para realizar a pesquisa os alunos devem consultar sites de busca na internet, como por exemplo os sites http://search.msn.com.br, www.google.com.br, www.cade.com.br

Para isso, os alunos devem acessar o programa Internet Explorer e digitar o endereço do site de busca, em nosso exemplo usaremos o MSN Search,, que permite buscar tanto sites como imagens.

9

Page 10: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 3 – Digitar palavra-chave

Para pesquisar os sites relacionados ao tema pretendido digite uma palavra chave e em seguida clique em Buscar.

Em nosso exemplo, vamos pesquisar sobre a floresta amazônica. A primeira palavra chave a ser utilizada será o próprio título do trabalho floresta+Amazônia.

Os alunos devem utilizar diferentes combinações para encontrar o conteúdo específico a que procuram, como em nosso exemplo: rio+Amazônia, biodiversidade+Amazônia, ribeirinhos+Amazônia, transamazônica.

10

Page 11: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 4 – Escolher conteúdo

Após clicar no botão Buscar, uma nova janela será exibida com os resultados da pesquisa.

Observe que um resumo é apresentado logo abaixo do título do site. Os alunos devem clicar sobre os itens que julgarem mais relacionados com tema escolhido para abrir o site.

11

Page 12: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 5 – Copiar conteúdo pesquisado

Para copiar o conteúdo dos sites e depois editá-los, iremos utilizar o Microsoft Word. Veja como proceder:

- No site, selecione o texto desejado arrastando o cursor do mouse. Em seguida, clique no menu Editar, opção Copiar.

- Abra o programa Microsoft Word. Clique no menu Editar opção Colar.

12

IMPORTANTE!

Qual é a fonte?

Os alunos devem anotar todas as fontes (endereços dos sites) de onde copiarem a informação. Dar créditos aos autores é imprescindível, além de trazer credibilidade ao trabalho. É importante que fique claro no trabalho quando um trecho é copiado integralmente de outro site e quando é um texto elaborado pelo aluno a partir da leitura de diversas fontes.Para evitar a cópia é importante que o professor traga questões desafiadoras e que exijam relações entre os conhecimentos, ou também que exija a abordagem do tema por diferentes perspectivas, conforme será proposto mais adiante.

Page 13: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 6 – Salvar arquivo

Peça para os alunos salvar o arquivo do Word. Para isso, clique no menu Arquivo e selecione a opção Salvar.

Escolha um nome para a apresentação, defina o local para armazenar o documento e clique em Salvar.

13

Page 14: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 7 – Pesquisar imagens

Para pesquisar somente imagens no site de busca, clique na aba Imagens.

- Uma nova janela será exibida com as imagens encontradas. Para visualizar uma imagem, clique uma vez sobre ela, você será remetido ao site de origem da imagem.

14

Page 15: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 8 – Salvar imagem

Para salvar as imagens que estão presentes no site, clique com o botão direito do mouse sobre a figura e clique em Salvar imagem como.

Os alunos devem salvar todas as imagens na pasta criada para o trabalho.

15

Page 16: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

ETAPA 2 – Edição dos textos e imagens

2.1 Após terminarem a pesquisa individual, peça para que os integrantes de cada grupo se reunam e compartilhem os resultados da pesquisa.

É importante que os alunos se sintam seguros com o material coletado para então dar início a edição. Caso falte alguma informação, o grupo pode se subdividir mais uma vez e enquanto um ou dois alunos pesquisam as informações que faltam, o restante inicia o processo de edição.

2.2 A edição dos textos será feita no próprio Microsoft Word e depois copiado para o editor de websites. Lembre os alunos que os textos devem ser curtos e objetivos para não cansar o leitor.

2.3 A edição das imagens devem ser feitas num editor de imagens, como o Paint. Verifique qual está disponível nos computadores de sua escola.

Avise os alunos para incluir em uma linha fina, o autor da fotografia. Veja o exemplo:

16

Fotógrafo: João Paulo Zazo

Page 17: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

ETAPA 3 – Edição da área Personalidades

3.1 Com todos os textos prontos, nesta etapa os alunos vão editar a área personalidades. Em geral, cada aluno vai escolher uma personalidade e escrever um texto com aproximadamente 20 linhas sobre o tema do website na visão do personagem, ou seja, conforme as características do personagem escolhido.

3.2 É importante que você defina quais serão os personagens possíveis em cada um dos websites. Em nosso exemplo, temos:

Geógrafo – o texto deve apresentar observações sobre a localização da floresta, as características que apresenta como o clima, principais rios e relevo.

Botânico – é fundamental falar sobre a vegetação da floresta, biodiversidade e preservação da mesma.

Ecologista – comentar a importância da floresta para o mundo e os efeitos de sua destruição.

Escritor – narrar uma história com base em uma lenda.

Socialite – descrever uma aventura na Amazônia, como são as pessoas, o visual encantador, as casas primitivas, a arte indígena.

Artista Plástico – falar sobre a cultura indígena, os ornamentos de cada povo, a beleza da mulher, os rituais.

Historiador – o texto deve apresentar informações sobre os primeiros povos, o desenvolvimento da sociedade e situação política da região.

Economista – destacar as riquezas e os principais produtos comercializados.

17

Page 18: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

SEGUNDO ENCONTRO

ETAPA 1 – Planejamento do site

1.1 Antes de iniciar a montagem do site, é necessário que esse seja planejado. O projeto gráfico do site precisa ser definido, ou seja, aspectos como a diagramação dos textos e imagens devem ser pensadas, além é claro, da definição das cores, fontes, entre outros itens.

Utilize o texto “Planejar é preciso!” como guia para esta tarefa.

1.2 Após apresentar as observações sobre os preceitos de conteúdo e design aos alunos, peça para que eles criem o projeto gráfico do site.

Eles devem fazer alguns esboços para a home e um geral para as páginas de link. Veja o esboço do site de exemplo A Floresta Amazônica:

1.3 Por fim, peça aos alunos para passarem a versão final do esboço para a folha de atividade.

18

DICA

Imprimir só algumas páginas

Caso você não queira imprimir todas as páginas deste arquivo. Vá na janela de impressão e no box Intervalo de páginas digite na caixa em branco 19-21, assim só o texto a ser distribuído aos alunos será impresso.

HOME PÁGINAS TIPOS

foto

texto de abertura

título do texto

links foto temáticatexto

título do texto

linksmais fotos

Page 19: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

Planejar é preciso!

Para construir um bom Website não basta apenas dominar bem os programas, é preciso saber como aplicar seus recursos de forma certa.

É fundamental antes de começar, fazer um planejamento, no qual exista harmonia entre o design e o conteúdo, ou seja, a forma como será apresentada a informação graficamente.

Basicamente, o que devemos fazer é criar um site que tenha uma estrutura simples e clara. Opte por criar telas que facilitam a leitura e a navegação do usuário.

Construir um site é uma mistura de arte com técnica e exige muito bom senso para alcançar os melhores resultados possíveis.

Conheça quais são os itens a serem observados para o planejamento de um site:

Estrutura em blocos de informação

Um website, sendo um meio de comunicação visual, precisa organizar o conteúdo em áreas bem estruturadas para que o olho humano possa distinguir facilmente cada grupo de informação.

Imagine colunas e linhas. O conteúdo deve estar em blocos de forma a dirigir os olhos do leitor para as informações mais importantes da página.

Solução: deixar espaços em branco ao separar parágrafos, fotografias ou legendas é uma forma de criar blocos de informação visualmente distinguíveis.

Outra forma é usar linhas de contorno e/ou cores de fundo para formar caixas que separam os diversos blocos.

Veja o exemplo do no site Ayrton Senna: http://senna.globo.com/

19

Page 20: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

Links para navegação

Outro fator importante a ser observado é o mecanismo de navegação dos links. Este mecanismo deve permitir aos usuários passarem facilmente de uma página a outra em função do que querem ler.

Um modelo bastante comum encontrado na internet é a Estrutura em tabelas, como no site Microsoft Brasil: www.microsoft.com.br

Outra opção de distribuir o conteúdo e os links de navegação é colocar somente chamadas curtas para o conteúdo ao longo da página (no tamanho da tela) e mostrá-lo aos poucos conforme o usuário vai clicando.

Neste caso, a página de entrada (home) deve ser graficamente bem atrativa. O objetivo principal é impressionar os visitantes.

Veja o exemplo no site Instituto Ayrton Senna: http://senna.globo.com/institutoayrtonsenna/

Cores

20

Bloco em linha no topo – geralmente contém o título do site e alguns links para navegação geral no site;

Bloco em coluna no lado esquerdo - Contém os links principais para cada uma das áreas. São os subtítulos;

Bloco em coluna no centro da página – Geralmente contém chamadas para o conteúdo principal.

Bloco em linha no fim da página – São informações de rodapé como avisos, contato, entre outros.

Page 21: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

A cor é um dos itens fundamentais ao construir um projeto gráfico, pois as cores transmitem significados e quando utilizadas de forma correta enriquecem o trabalho.

No esquema abaixo temos um diagrama de cores, nele está representado as cores primárias (amarelo, vermelho e azul), secundárias (verde, laranja e lilás - mistura entre as cores primárias) e as terciárias.

Observe que as cores estão distribuídas de forma equilibrada, primárias seguidas das secundárias, que por sua vez está seguida pelas terciárias. Do lado oposto a uma cor, temos a cor complementar, ou seja, a cor de equilíbrio e mais contrastante. Por exemplo, a cor complementar do vermelho é o verde. 

A temperatura das cores designa a capacidade que as cores têm em transmitir sensações quentes ou frias. Do lado esquerdo do diagrama temos cores vibrantes, denominadas cores quentes e do lado direito temos cores que sugerem tranqüilidade, denominadas de cores frias.

Você pode criar um trabalho harmonioso de diversas maneiras, usando apenas cores quentes ou frias, ou usando as cores complementares para gerar o equilíbrio. O importante é saber dosar a cor e usar a criatividade para construir um bom trabalho.

fonte: Este texto foi produzido por Luciana Tenório, editora de multimeios, em 12 de fevereiro de 2005.

21

Page 22: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

ETAPA 2 – Montar o site

Com o conteúdo e o projeto gráfico do site definidos, o próximo passo é iniciar a montagem do site no programa FrontPage.

Nesta etapa, você deverá apresentar o programa e ajudar os alunos a criarem as páginas conforme o planejamento feito. Siga as instruções do passo-a-passo:

PASSO 1 – Nova pasta

Antes de iniciar a montagem do site, peça aos alunos que criem uma nova pasta dentro da pasta anteriormente criada para esta aula. Esta pasta deverá ser chamada de Site e todos os arquivos referentes ao site deverão ser salvos nela.

- Para criar uma nova pasta, abra a pasta do projeto. Clique no menu Arquivo, aponte para Novo e escolha Pasta.

22

DICA

O que é o FrontPage?

O Microsoft FrontPage é o editor de sites para a web.

Com este software trabalhamos de forma muito parecida aos programas do Pacote Office como o Word, por exemplo, sem a necessidade de conhecer necessariamente programação e linguagens como o HTML ou outras mais complexas.

Dê o nome para pasta, digite Site e pressione a tecla Enter.

Page 23: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 2 – Conhecer o programa

Para acessar o editor de web, clique sobre o Menu Iniciar, aponte para Programas e procure pelo programa FrontPage.

O Microsoft FrontPage oferece as seguintes ferramentas:

23

Barra de menu – onde estão todos os comandos possíveis de serem realizados com o programa

Barra padrão – onde encontramos atalhos relacionados a manipulação dos arquivos, como salvar e imprimir.

Barra de formatação – onde estão todos os atalhos relacionados a edição do arquivo como alterar cor e alinhar texto.

Área de edição – é aqui que você vai desenvolver seu trabalho.

Ícones de modo Selecione qual será o modo de edição: página, mapa de navegação, entre outros.

Page 24: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 3 – Iniciar projeto

Para iniciar a montagem, precisamos selecionar um layout, ou seja, um modelo próximo ao pensado pelos alunos para a estrutura do site. Este procedimento facilitará o trabalho.

- Peça aos alunos que cliquem na setinha do botão Novo e selecionem o item Página. A janela Modelos de página será exibida.

24

DICA

Os alunos devem selecionar um dos modelos, aquele que esteja mais próximo do que foi pensado inicialmente dos esboços que eles fizeram. Em nosso exemplo vamos usar Corpo de uma coluna com conteúdo e barra lateral.

Page 25: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 4 – Substituir informações

Observe que o modelo selecionado será exibido na tela. Os alunos agora vão substituir os espaços indicados conforme o tema de trabalho desenvolvido.

Veja o exemplo:

.

25

No quadro superior podemos colocar o título do nosso site, que deverá aparecer sempre, em todas as páginas.

No quadro a esquerda, podemos colocar as palavras-chave que serão os links para as outras páginas.

Quadro central, é aqui que podemos criar o texto de abertura, ou seja, apresentação do site

DICA

Para substituir os textos, basta seleciona-los e pressionar a tecla Delete do teclado para apagá-los.

Em seguida, digite o novo texto ou copie o texto produzido no Word usando as teclas Ctrl+C (para copiar) e Ctrl+V (para colar)

Page 26: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 5 – Inserir imagem

Para inserir uma imagem, posicione o cursor do mouse no local onde deverá ficar a imagem. Clique em Inserir, Figura e escolha Do arquivo. Peça aos alunos que localizem a pasta correspondente ao grupo.

Em seguida, eles devem abrir a pasta Site que deverá conter todas as fotos a serem usadas. Por fim, eles vão selecionar a imagem desejada.

26

DICA

Você pode editar a imagem, reduzindo o seu tamanho. Para isso, clique na imagem, posicione o cursor do mouse em uma das extremidades e arraste até ficar no tamanho desejado.

Importante: Não é aconselhável ampliar uma imagem, pois isso destorcerá a imagem, deixando-a embaçada.

Page 27: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 6 – Formatar página

Agora os alunos vão formatar o site conforme as cores definidas no projeto gráfico de cada grupo.

- Para atribuir uma cor a uma área (bloco), clique com o botão direito do mouse sobre a área que desejada e clique na opção Propriedades da célula...

- Em seguida, escolha uma cor em Plano de fundo. Clique no botão Aplicar, para ver como ficou, ou no botão OK para concluir.

27

Page 28: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 7 – Criar links

Para criar os links, ou seja, a ligação entre a home e as demais páginas, siga os passos:

- Selecione a palavra onde o usuário deverá clicar para dar o link. Clique com o botão direito sobre a palavra e escolha a opção Hiperlink...

Observe que a palavra aparece sublinhada, com uma linha logo abaixo.

28

No item Endereço, digite o nome da página que será chamada e a extensão .htm. Por exemplo: biodiversidade.htm

Page 29: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 8 – Salvar Home

A primeira página de um site é chamada de Home, que significa casa em português. Esta página recebe um nome especial index.htm, para que o sistema possa ententer que é a partir dela que a navegação do site será iniciada.

- Para salvar a Home, clique no Menu Arquivo, opção Salvar Como.

29

Em Nome do arquivo digite index.htme pressione Salvar

Page 30: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 9 – Nova página

Para compor a nova página os alunos dem seguir os passos 3 a 7: iniciar projeto, substituir informação, inserir imagem, formatar página e criar links.

30

DICA

Fique atento ao salvar a página

O nome da página deverá ser o mesmo atribuído ao link no passo anterior. Por exemplo, o link Os Ribeirinhos terá como nome a página: ribeirinhos.htm

Page 31: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

DICA

Conferir links

Clique sobre todos os links e verifique se estão funcionando. Caso a página ao lado apareça, isso significa que o link não está correto.

Neste caso, confira se a página está com o mesmo nome dado ao link.

PASSO 10 – Testar site

Para visualizar como está o site, clique no botão Visualização, na parte inferior direita da tela.

- Para testar os links abra a pasta Site e clique duas vezes sobre o arquivo index.htm.

O Internet Explorer será aberto e você poderá navegar pelo site como se ele estivesse no ar, ou seja, publicado.

31

Page 32: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

ETAPA 3 – Publicar o site

Com todos os sites prontos, nesta etapa vamos publicá-los na internet. Para isso precisamos de um Servidor, que armazena o site no sistema e o disponibiliza para todos os usuários da web.

Em nosso exemplo, usaremos o servidor do Yahoo, que é gratuito. Caso sua escola já tenha um servidor, o ideal é que o trabalho dos alunos sejam armazenados lá. Solicite a ajuda do monitor responsável pelo laboratório nesta tarefa.

Siga os passos abaixo e veja como é o procedimento para a publicação de um site na internet.

PASSO 1 – Acessar site do Servidor de serviços

Para acessar o site do servidor onde será armazenados os sites, digite o endereço http://www.yahoo.com.br

- Clique no link GeoCities.

32

Page 33: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 2 – Inciar cadastro

Na página do GeoCities, observe que algumas ferramentas para a elaboração de um site são apresentadas, com a ajuda do assistente. Como os alunos já estão com o sites prontos, o próximo passo é escolher a opção Construa seu site.

33

O termo de adesão é exibido. Leia-o! Este documento traz informação importantes sobre as regras de utilização do Servidor. No final da página, clique no botão Eu aceito.

Page 34: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 3 – Preencher formulário

Após aceitar o termo de compromisso, o próximo passo é preencher o formulário de adesão. Informações gerais sobre o responsável pelo site são solicitadas.

Para confirmar todas as informações, clique em Enviar este formulário.

34

IMPORTANTE

Ao clicar em Enviar o formulário, uma mensagem de erro pode ser exibida.

Neste caso, provavelmente um dos dados informados pelos alunos não foi aceito pelo sistema. Corrija-o e tente novamente.

Page 35: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 4 – Escolher tema

O próximo passo é selecionar qual é o tema do site. Conforme o item escolhido, o banner de publicidade dos anunciantes do Yahoo será exibido.

35

Page 36: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 5 – Finalizar cadastro

Peça para os alunos anotarem os dados do cadastro, pois estas informações serão solicitadas na construção e manutenção do site.

Em seguida, clique no link Construa suas páginas agora!

PASSO 6 – Iniciar a publicação do site

Clique no endereço http://geocities.yahoo.com.br/nomedousuario criado para visualizar a página inicial.

36

Page 37: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 7 – Abrir gerenciador de arquivos

Clique em Gerenciador de arquivos para transferir os arquivos criados no FrontPage para o servidor do Yahoo.

Uma nova janela será exibida, clique em Abrir Gerenciador de Arquivos.

37

Page 38: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 8 – Transferir arquivos

Agora iremos informar onde estão os arquivos a serem transferidos.

Para isso, clique em Procurar, selecione a pasta Site, onde estão os arquivos realizados no FrontPage e, em seguida, clique em Abrir.

Para finalizar o processo, clique em Carregar arquivos.

38

IMPORTANTE

Repita a operação, até selecionar todos os arquivos que devem compor o site. Todas as imagens também devem ser enviadas.

Page 39: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

PASSO 9 – Acessar o site criado

Pronto, agora é só acessar sua página e navegar pelo conteúdo publicado. Para isso abra o navegador de Internet e digite o endereço do site, por exemplo:

http://geocities.yahoo.com.br/floresta_amazonica/

39

Page 40: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

ETAPA 4 – Conclusão da atividade

Com os sites on-line, confira com seus alunos quais foram os resultados a que eles chegaram.

4.1 Questione-os:

- Qual é o site favorito? Você gosta mais da forma (projeto gráfico) ou do conteúdo?

- Algum site apresenta problemas de comunicação: textos ou imagens?

- O que poderia ser feito para melhorar cada um dos sites?

4.2 Agora, comente sobre a importância de cada um dos elementos mencionados na aula para a elaboração de um bom site:

- Pesquisa e seleção de informações condudentes;

- Edição de textos concisos, de leitura fácil e agradável;

- Mapa de navegação dos links simples e claro;

- Projeto gráfico sem muitos ornamentos;

4.3 Finalize a atividade debatendo com os alunos o quanto um projeto é fundamental em qualquer situação.

Mas o que é projetar?

Projeto é uma atividade simbólica, intencional e natural do ser humano. Por meio dele o homem busca a solução de problemas e desenvolve um processo de construção do conhecimento.

A aprendizagem por projetos é gerada pelos conflitos, pelas perturbações nos sistemas particulares de significações dos alunos. Tem que vir a responder a questões como: Por que? O que é? É verdade?

40

Page 41: download.microsoft.comdownload.microsoft.com/.../Hipertextos_internet.doc  · Web viewImprima ou escreva na losa a letra da música “Pela internet” de Gilberto Gil e, em seguida,

Equipe de professores que participaram do desenvolvimento deste material:

Coorddenação

Luciana Salgado

Consultoria

Claudia StippeClaudio Fernando AndréCarmem Lúcia PrataMary Grace MartinsWellington MacielRubem Paulo SaldanhaTereza Cristina Jordão

41

Equipe Microsoft Educação Brasil

Adriana ManettiGerente de Programas Educacionais

Adriana Siliano PettengillSupervisora de Marketing

Ana Teresa RalstonGerente de Programas Educacionais

Jean Paulo Silva Ramos Gerente de Programas Educacionais

Produção: Criax Comunicação e Design

Fábio Stefanini JorDiretor

Luciana Tenório de OliveiraEditora de multimeios

Sérgio YamasakiEditor de conteúdo