Como criar seu “Edublog” · UNIVERSIDADE REGIONAL DO NOROESTE DO ESTADO DO RIO GRANDE DO SUL...

UNIVERSIDADE REGIONAL DO NOROESTE DO ESTADO DO RIO GRANDE DO SUL

Como criar seu “Edublog” Blog da Educação

03/07/2011

Sandro Giovani P. Viégas

http://www.laboratoriodematematica.org - http://professorviegas.blogspot.com

Tânia Michel Pereira

1

1. Introdução

Os EDUBLOGS são Weblogs que possuem objetivo de apresentar

conteúdos e fornecer subsídios para que professores e estudantes possam

interagir fora da sala de aula.

Existem diversos páginas para criação de Blogs ou Sites, como o

WordPress1 e o Siteonline, nesse tutorial apresentamos exemplos com o uso

do Blogger2 que pertence ao Google, por ser mais popular, gratuito e de fácil

manipulação.

O Blogger permite a hospedagem de um número ilimitado de blogs nos

servidores do Google, que adotam o endereço www.blogspot.com

Anteriormente, era possível hospedar os blogs em um servidor próprio do

usuário, mas atualmente, o Blogger deixou de suportar publicação via FTP. Os

blogs hospedados no BlogSpot incluem uma barra de navegação do Blogger,

que não pode ser removida, através de alguma opção da interface do Blogger.

Porém, existem tutoriais explicando como removê-la, através de um hack. Os

termos de serviço do Blogger não especificam se tal ação é uma violação ou

não, mas muitos usuários do serviço optam por fazê-la.

Exemplos de Edublog disponíveis na web:

http://jpiton.blogspot.com

http://professorviegas.blogspot.com

http://professoragelci.blogspot.com

1 WordPress é um sistema de gerenciamento de conteúdo na web, escrito em PHP e executado em MySQL, especialmente para a criação de blogs. WordPress foi criado a partir do já desaparecido b2/cafelog e é hoje, junto com o Movable Type, o mais popular na criação de weblogs. 2 Blogger, uma palavra criada pela Pyra Labs, é um serviço do Google, que oferece ferramentas para

edição e gerenciamento de blogs, semelhantemente ao WordPress.

2

http://grupodeapoiointerdisciplinar.blogspot.com

2. Criando uma conta no Blogger

- Procure o utilizar o navegador Firefox – Link para download.

- Abaixo o link da página inicial do Blogger:

http://www.blogger.com/

- O ideal é que você tenha uma conta do Google (Gmail, Orkut, IG), caso não

tenha, acesse a página abaixo para criar sua conta:

CRIAR UMA CONTA NO GMAIL

VÍDEO-AULA – COMO CRIAR UMA CONTA NO GMAIL

Página inicial

1ª Etapa: criando uma conta.

- Preencha todos os campos que são solicitados e clique no botão Continuar.

3

2ª Etapa:

- O Google utiliza um sistema de segurança que serve para evitar spam, você

cadastra seu telefone celular e recebe um código de verificação.

4

3ª Etapa:

- Aparecerá novamente a tela para verificar a sua conta, preencha o código

enviado para o celular e clique em “Verificar”.

4ª Etapa:

- Escolha um título para o seu blog (É como seu blog vai se chamar. Veja, por

exemplo, o título do blog: “SEMINÁRIO INTEGRADOR V”);

- Escolha um endereço do blog (URL) (É o nome do seu blog na internet. A

URL do meu blog chama-se http://seminariointegrador-viegas.blogspot.com);

- Clique em “Continuar”.

5

5ª Etapa:

- Escolha um dos modelos;

- Clique em “Continuar”;

- Aparecerá uma tela avisando que seu blog está pronto. Agora é só começar a

usar seu blog.

6

Se ficar com dúvida, você poderá assistir ao vídeo abaixo

que também explica detalhadamente como criar um blog

no Blogger:

http://www.youtube.com/watch?v=IGIdqZbqAy4&feature=related

3. Começando a usar o seu blog

3.1. Postagem

Na aba “postagem” você irá colocar suas informações gerais, você pode

salvar para editar posteriormente ou publicar diretamente (aba laranja).

Na postagem você pode inserir textos, links, imagens e vídeos.

7

3.2 . Textos nas postagens

Exemplo:

- Escreva seu texto

- Formate o texto, escolhendo cores, tipo de fonte, tamanho e etc.

8

- Escolhendo a fonte.

3.1. Inserindo figuras nas postagens

Exemplo:

- Irão aparecer as opções abaixo:

- Você pode escolher uma imagem disponível no seu computador, de

uma URL ou dos Álbuns do Picasa (caso você já tenha esse outro serviço do

Google).

9

- Após carregar a imagem, clique sobre ela e depois em “adicionar

selecionadas”.

- Após inserir a imagem ficará assim:

- Você pode visualizar, salvar e se estiver satisfeito com o resultado “publicar”.

10

3.2. Inserindo vídeo nas postagens

-Da mesma forma que na imagem, na postagem tem um ícone para

inserir vídeos conforme a figura abaixo:

- Após clicar no ícone de vídeo aparecerá a tela abaixo:

- Da mesma forma que você fez para a imagem, pode buscar um vídeo

no seu computador ou no Youtube.

- Se escolher um vídeo do seu computador, clique em fazer upload,

conforme a figura abaixo:

11

12

- Outra opção é fazer o upload de um vídeo do Youtube, conforme

abaixo (processo mais rápido).

- Escolha o vídeo de sua preferência.

- Escolha e depois clique em “selecionar”.

13

4. Disponibilizando arquivos no Blog

O Blogger não possui a função para armazenar arquivos, por isso,

precisamos utilizar um site de hospedagem, existem vários na Web, mas uma

sugestão é utilizar o Google Docs, por ser do Google que dá suporte ao

Blogger.

Abra a página principal do Google Docs e crie sua conta assim como foi

feito para criar o Blog (caso você ainda não tenha um e-mail do Gmail).

- Depois de criada a sua conta no Gmail, inicie a sessão para adicionar

os arquivos.

14

Aparecerá a página onde você irá fazer o “upload” dos arquivos, ou seja,

disponibilizar os arquivos em um “HD virtual” na internet, onde terá a opção de

compartilhar publicamente ou não.

Escolha um ou mais arquivos do seu computador, selecionando “Fazer

Upload” e depois “Arquivos”. Após escolher o arquivo irá aparecer uma janela

solicitando que você confirme o upload, clique em “iniciar upload”.

Aparecerá o documento em uma página, no canto superior direito,

selecione “compartilhar”.

15

Selecione a opção “pública na Web” e depois salve a escolha.

Após salvar, aparecerá uma janela com o link que você irá disponibilizar

em seu Blog para download.

16

4.1. Disponibilizando o link para download dos arquivos em uma

postagem.

Na postagem selecione a opção “ Link “ , irá aparecer a opção “Editar

link”, cole o link do arquivo disponibilizado no Google Docs em “Endereço da

Web”.

Após clicar em “Ok”, teremos o link na postagem, coloque o título e

depois “Publicar postagem”.

5. Adicionando “Gadgets”3 no Blog

3 Gadgets - são uma nova categoria de mini-aplicativos criadas para proporcionar informações e dados

úteis, ou para melhorar uma aplicação ou um serviço Windows ou Web. Os exemplos de Gadgets

17

- Na aba “Design” escolha a opção “Adicionar Gadget”.

- O Blogger oferece várias opções de Gadgets, nesse tutorial vamos

mostrar algumas.

5.1. Gadget “Páginas”

O Gadget “Páginas” permite que você adicione várias páginas em seu blog.

podem ser desde um dispositivo que lhe informe o clima que funciona em seu desktop, em sua homepage ou no seu Blog, um dispositivo RSS que extrai seus feeds favoritos ou a extensão de uma aplicação de negócios que mostra o estado atual de como anda seus negócios.

18

- Clique em “salvar” para confirmar essa opção.

- Adicionando o Gadget na coluna lateral, as páginas serão disponibilizadas na

forma de link.

Visualização

- Adicionando o Gadget na parte superior, o menu ficará na forma de “abas”.

- Para alterar a forma é só arrastar o Gadget para onde desejar.

- Nas páginas poderão ser adicionadas informações assim como comentado

no item sobre postagens.

5.2. Gadget HTML/JavaScript

Esse Gadget tem a função de adicionar novas funcionalidades ao Blog,

como relógio, contador de pessoas online, contador de visitantes, Banners e

etc.

19

5.2.1. Código HTML para adicionar um relógio

Em qualquer provedor de pesquisas que for digitado “Código HTML para

adicionar um relógio” irá aparecer uma infinidade de opções.

Exemplo: http://www.clocklink.com/

20

- Escolhendo como exemplo a opção “Digital”, temos:

- Escolha um relógio e clique em “View HTML Tag” e depois “Accept”, irá

aparecer uma página para escolher a cor, localização e tamanho do mesmo.

21

- Tela do código HTML

- Após colar o código e colocar o título, clique em salvar.

22

- Clique em visualizar para ver o resultado final.

Obs: para que funcione corretamente, o Adobe Flash player 4 deve

estar instalado corretamente em seu computador, caso não tenha, faça o

download no link abaixo:

http://get.adobe.com/br/flashplayer/

5.2.2. Código HTML para adicionar um contador de pessoas online

- Exemplo de site com código de contador online:

- http://whos.amung.us/showcase/

4 O Adobe Flash Player (ou Flash Player) é um reprodutor de multimédia e aplicações amplamente distribuído, anteriormente criado e disponibilizado pela Macromedia, mas que agora pertence à Adobe Systems. Está embutido em alguns navegadores e está disponível como um plugin para outros (como Mozilla Firefox, Konqueror, Opera, Safari, Internet Explorer). Cada versão do plugin possui compatibilidade reversa.

23

- Os procedimentos para adicionar o Gadget são os mesmos do relógio

comentados no item anterior.

Obs: para que funcione corretamente, o Adobe Flash player 5 deve

estar instalado corretamente em seu computador, caso não tenha, faça o

download no link abaixo:

http://get.adobe.com/br/flashplayer/

5.2.3. Código HTML para adicionar banner

Um site bem interessante para adicionar banners personalizados é o

http://www.flashvortex.com/banners.php.

- Escolhe o modelo de banner a seu gosto e clique em CLICK HERE TO EDIT

THIS , preencha os espaços em branco com textos para o banner e depois

clique em “Generate Animation”, será gerado um código.

5 O Adobe Flash Player (ou Flash Player) é um reprodutor de multimédia e aplicações amplamente distribuído, anteriormente criado e disponibilizado pela Macromedia, mas que agora pertence à Adobe Systems. Está embutido em alguns navegadores e está disponível como um plugin para outros (como Mozilla Firefox, Konqueror, Opera, Safari, Internet Explorer). Cada versão do plugin possui compatibilidade reversa.

24

- Copie o código e cole no Gadget conforme o que foi descrito para o

relógio online.

- Resultado final.

25

Obs: para que funcione corretamente, o Adobe Flash player 6 deve

estar instalado corretamente em seu computador, caso não tenha, faça o

download no link abaixo:

http://get.adobe.com/br/flashplayer/

7. Design do Blog

As janelas podem ser rearranjadas no blog de acordo com sua preferência,

para isso, selecione a opção “Painel” e depois “Design”.

Após clicar em “Painel”, aparecerá a opção abaixo.

Após clicar em “Design”, aparecerá a opção abaixo.

6 O Adobe Flash Player (ou Flash Player) é um reprodutor de multimédia e aplicações amplamente distribuído, anteriormente criado e disponibilizado pela Macromedia, mas que agora pertence à Adobe Systems. Está embutido em alguns navegadores e está disponível como um plugin para outros (como Mozilla Firefox, Konqueror, Opera, Safari, Internet Explorer). Cada versão do plugin possui compatibilidade reversa.

26

Para mover os “elementos de página”7, clique com o botão esquerdo do mouse

em cima do elemento que deseja mover e, com o botão seguro, arraste o

elemento para a nova posição, conforme o exemplo abaixo:

Visualização do blog antes de mover o elemento (clique em visualizar blog).

7 Elementos de página é onde ficam as funções de gadgets (inserir texto, figura, relógio, postagens e

etc..)

27

Em design, mova o elemento (solte o elemento na posição desejada):

Salve a sua escolha antes de visualizar (clicando em salvar no botão laranja).

Visualização do blog após mover o elemento (clique em visualizar blog):

28

8. Divulgando o seu Blog

O blog só terá utilidade se for visualizado com frequência, para isso, a

divulgação é muito importante.

Algumas sugestões de estratégias de divulgação e aumento do número

de visitantes

- Use sua conta do Gmail para seguir outros blogs relacionados ao

ensino (use o gadget “seguidores”);

- Em todos os documentos (provas, trabalhos, textos sobre os conteúdos

e etc.), coloque o link com endereço do seu blog no rodapé;

29

- No primeiro dia de aula em cada turma, divulgue o endereço;

- Atualize seu blog com frequência;

- Torne seu blog atrativo, com enquetes (use o gadget “enquetes”),

vídeos e imagens, porém, não exceda em inclusão de banners, pois isso deixa

o blog mais “pesado”, ou seja, demora mais tempo para abrir, o que pode fazer

com que as pessoas desistam de acessá-lo;

- Procure responder a todos os comentários feitos nas postagens.

30

9. Atividades

a) Crie um blog com endereço eletrônico que contenha seu nome e um

título relacionado à Matemática;

b) Faça uma postagem relacionada a algum conteúdo de Matemática, que

contenha texto, imagem, vídeo e link com arquivo para download;

Obs.: utilize um vídeo da TV Escola, disponível no link:

http://tvescola.mec.gov.br/index.php?&option=com_zoo&view=item&item_id=5209

c) Crie ao menos duas páginas extras (além da principal) com conteúdos

de Matemática, que contenham texto, imagem, vídeo e link com arquivo

para download;

Obs.: utilize um vídeo da TV Escola, disponível no link:

http://tvescola.mec.gov.br/index.php?&option=com_zoo&view=item&item_id=5209

d) Adicione relógio, contador de pessoas online e um banner para seu

blog;

e) Elabore um plano de aula que contemple conteúdos de Matemática,

salientando como o blog poderia ser utilizado em suas aulas, o

documento deve ser salvo com a seguinte denominação:

blog_nome_sobrenome.doc ou blog_nome_sobrenome.pdf, onde

aparece nome coloque o seu primeiro nome e no lugar de sobrenome,

coloque seu último sobrenome. Exemplo: se o nome for Maria da Graça

dos Santos, então o nome do arquivo deve ser blog_maria_santos.doc

ou blog_maria_santos.pdf. Esse arquivo deverá ser anexado em seu

blog, usando um link para download conforme descrito no item 4 dessa

apostila.

Bom trabalho!

31