O documento fornece instruções sobre como criar sites e blogs educacionais. Ele discute analisar sites existentes para identificar características de design, refletir sobre como integrar currículos escolares em sites, e fornecer condições gerais para a criação de sites como pesquisa orientada, organização de ideias e orientação do professor.

1. Uso pedagógico na construção
de Sites / Blogs

2. 1. Um Olhar com Intenção: Definição de um tema.
•
Análise de alguns sites publicados: Através da ferramenta de buscas do google
http://www.google.com.br/ , analisar diferentes blogs e sites, sobre um tema proposto: por
exemplo: digite a palavra ciberespaço.
•
•
•
•
•
•
•
•
Identifique as características específicas de cada site indicado na pesquisa:
- O público a que se destina
- Objetivos (que parecem transparecer)
- Aspectos mais/menos interessantes
- Ideias interessantes para o desenvolvimento do próprio site / blog
- Perceber as diferentes formas e a distribuição das informações
- Navegação entre as páginas
- Confiabilidade.
28-10-13 15:07

3. 2. Breve Reflexão Sobre a Construção de um Site
•
•
•
•
•
- Qual a importância da criação de um site dentro de um contexto
educacional?
- É possível a integração das Propostas Curriculares dentro dessa
concepção?
- De que maneira isso pode acontecer?
- Através da troca de arquivos entre os professores ou alunos?
- Como os professores de cada área podem contribuir para essa
integração?
28-10-13 15:07
Escola Básica Integrada Elias GarciaSobreda

4. 3. Condições Gerais para a Criação de Sites:
•
•
•
O trabalho junto aos alunos, deve ser direcionado para a pesquisa, organização de ideias e finalização do
trabalho. Ao professor cabe a orientação e a manutenção do site / blog junto aos alunos.
Sugerimos que a pesquisa, o desenvolvimento e organização sejam orientadas por temas (por exemplo,
ainda em cima do tema proposto - ciberespaço: espaço de criação, ambientes de aprendizagem virtual,
cibercultura, autores que tratam deste tema, teoria do construcionismo...isso mesmo..
construcionismo...interativismo...as novas teorias de aprendizagem, ética na internet, uso de imagens na
web, lei de direitos autorais, navegação com segurança na web e principalmente buscar entender: COMO
O ALUNO APRENDE?
Pode-se refletir junto aos alunos, sobre os objetivos claros deste trabalho, a abrangência de um texto
divulgado na web, o cuidado com sua elaboração, a estética das informações e principalmente a
importância do envolvimento de toda a comunidade escolar.
28-10-13 15:07

5. 4. Diagramação:
•
•
•
•
Pesquisas: em livros, revistas, jornais, sites, digitação em editores de textos, dados
organizados em planilhas, apresentações em power point, edição de imagens e som em
moviemaker, textos em colunas, utilização de diferentes editores de textos - como por
exemplo os editores on line do google: http://docs.google.com/, ou softwares livres como o
OpenOffice http://www.broffice.org/, tipos de fontes, tamanho, formatações, verificações
ortográficas, recursos de edição, conversão em paginas para formatos html para a web e a
utilização de ferramentas do idioma do google.
Utilização de recursos midiátricos: como trabalhar uma imagem para a web, como inserir
imagens no site / blog, inserir musicas, digitalização de imagens, youtube, conversão de
textos em pdf ou em word (como no site http://www.zamzar.com/ - não dá para “fazer de
conta” que não existem estes espaços virtuais, eles fazem parte do mundo de nossos alunos.
É interessante criar uma conta no gmail (http://www.gmail.com/) para cada escola, para a
utilização ou o simples conhecimento das ferramentas do google, tais como armazenamento
em núvens, picasa ou o googledocs para edição de textos, power points on line ou o simples
compartilhamento e armazenamento de informações entre os professores e alunos.
A tecnologia do google, segue uma tendencia mundial no conceito de web 2.0. Vale a pena
conhecer as ferramentas que permitem a criação de videos, sites, blogs, edicão de imagens,
sem a necessidade de ser um grande conhecedor de novas tecnologias digitais de informação
e comunicação: NTDIC.
•
28-10-13 15:07

6. 5. Com relação ao direito de uso e divulgação de imagens:
• Todas as imagens, com a presença de alunos
ou professores, devem estar autorizadas e
mantidas dentro do portfólio do professor.
Deve-se ter uma atenção especial ao utilizar
imagens e fotos de pessoas e sites que
quebram direitos autorais ou tenham
conteúdo impróprio, sob pena de serem
punidos de acordo com os termos de uso.
• Conheça o http://creativecommons.org.br/
28-10-13 15:07

7. 6. Fundamental:
•
•
•
•
•
•
•
•
•
•
•
Pensar...
Na primeira página (apresentar o site e indicar os caminhos)
a informação que se quer disponibilizar (nas outras páginas, para o exterior do site...)
Na rede de navegação (estabelecimento de links, criação de menus)
Estar atento(a)...
Clareza da informação
Unidade gráfica e aspectos estéticos
Links para recursos relevantes
Questões éticas (imagens, direitos de autor, ‘spam’…)
Buscar .....
Trabalhar temas buscando embasamento dentro das Diretrizes e Parâmetros Curriculares
Nacionais sendo portanto fundamental a participação da equipe gestora e professores na
elaboração e divulgação dos trabalhos que serão publicados no site.
•
28-10-13 15:07

8. Sonhar .....
•
•
Mesmo que neste momento, os laboratórios não estejam em condições perfeitas,
o uso de tecnologias na educação não se limita, ou sequer está diretamente
relacionado ao uso de computadores, mas sim, na sua concepção, na maneira
como deve ser trabalhado, o que nos leva a refletir, que ao montarmos um
trabalho orientado, com objetividade, formando grupos de pesquisas e com
propostas realmente definidas, são ações que não implicam diretamente na
útopia de um computador por aluno.
É importante termos em mente, que a inclusão social ou digital, passa
fundamentalmente, por um trabalho cujo papel do professor ainda é sempre será
o de articulador de todo o processo. Este portanto, é o momento que iremos optar
pela construção do Blog ou do Site, e refletirmos sobre nosso papel na formação
desses alunos e principalmente sobre qual ferramenta seria mais atrativa para se
trabalhar, levando-se em consideração a dificuldade na construção, aspectos
visuais, recursos disponíveis, o domínio que cada professor possa ter diante desses
recursos e principalmente o nível de conhecimento de seus alunos.
•
Textos e tutoriais adaptados/atualizados: Maria Emilia Cappa - 2003: http://decampinasoeste.edunet.sp.gov.br/como_criar_paginas_e_blogs_eti_maio_.htm
28-10-13 15:07

9. ÍNDICE
28-10-13 15:07

10. 1. O que é o Webnode?
O Webnode é um construtor online de websites (ou blogs em
sua essência) que podemos fazer uso para criar e hospedar nosso
espaço de criação/registros.
Vindo da República Checa, o Webnode é fácil de usar.
A edição do site, é através de uma barra de ferramentas
localizada no topo do Tela a partir da qual poderá ir definindo
que tipo de disposição deseja nos elementos do seu site, que
cores deseja, etc, sem necessitar de conhecimentos técnicos.
28-10-13 15:07

11. 2. Configuração do site.
 Depois de criada a conta, o
primeiro passo é editar as
configurações desejadas para a
página.
 Podemos definir o tipo de site
que desejamos criar;
 É preciso definir o nome para o
site (digitando no campo
apropriado) e o idioma de
exibição. Lembrando que os
espaços ficam com -, portanto é
bom evitar espaços e pensar em
um nome “sonoro” e de fácil
articulação.
Opcionalmente, podemos escolher um slogan (uma chamada) para o nosso
site, que será exibido no cabeçalho da página.
28-10-13 15:07

12. • A segunda etapa consiste na escolha do template (modelo) da página.
• Há vários tipos com uma grande variedade de combinação de cores para cada um
deles.
• Podemos clicar na opção “ver” antes de seleccionar, para ter uma ideia de como
fica a aparência do modelo escolhido no formato da página.
• O posicionamento dos itens pode variar conforme o template escolhido na criação
do site;
Ao concluir este pequeno processo de configuração, a página é
automaticamente criada e está pronta para ser editada.
28-10-13 15:07

13. A última parte do processo serve para escolhermos subpáginas (que são
automaticamente criadas) para enriquecer o site. Estão disponíveis as
opções: sobre nós, contacto, comentários, notícias, galerias de fotos, livro
de visitas, blogs, produtos, nossa equipa, FAQ, calendário de eventos e
portfólio.
Ao selecionar qualquer um destes itens, a estrutura para ele é
automaticamente gerada em conjunto com a restante estrutura.
28-10-13 15:07

14. 3. Opções de Edição
Ao terminarmos as configurações, a página é aberta no interior de um
editor. No próprio corpo do site há uma série de dicas e informações
sobre algumas áreas específicas que podem ser editadas livremente.
Está disponível uma pequena barra de tarefas pela qual podemos
efetuar as modificações necessárias para inserir o conteúdo no modelo
de site criado.
28-10-13 15:07

15. Na opção itens temos o botão novo, onde estão disponíveis as opções de
nova página, novo artigo ou nova lista de itens.
Logo ao lado, na opção “Página”, há funcionalidades para publicação de
alterações, modificar formato da página, apagar itens, configurar
propriedades e segurança utilizada.
28-10-13 15:07

16. Em “Outras opções” podemos definir configurações de pastas, imagens,
opções de formato, idiomas de exibição e configurações adicionais.
Além das ferramentas apresentadas na Barra de tarefas, diversas áreas do
site podem ser modificadas ou reorganizadas “clicando e arrastando” o
conteúdo exibido até o local desejado.
28-10-13 15:07

17. Na parte dos conteúdos, estão as opções para texto e imagem, enquetes,
fóruns, galeria de imagens, artigos, listas e widgets.
A barra de ferramentas está bem desenhada e é fácil de utilizar.
Os módulos podem ser arrastados e editados no local.
A adição de páginas e definição das configurações de cada uma é bem
simples e intuitivo.
28-10-13 15:07

18. 4. Como trocar o template.
O Webnode disponibiliza vários templates. Para alterar o template,
acedemos ao painel de controle e clicamos sobre o “botão” “Opções de
Formato”
e de seguida escolhemos “Modelo”.
28-10-13 15:07

19. 5. Como inserir uma imagem num Bloco de Texto.
Por exemplo se quisermos inserir uma imagem no bloco de texto que diz
“Bem vindo ao nosso site”.
• Clicar em editar conteúdo;
• Escolher o local onde pretendemos inserir a imagem;
• Clicar no botão “inserir/editar imagem;
28-10-13 15:07

20. • Se não tivermos nenhuma
imagem carregada, então clicamos
em “carregar imagem” e de
seguida em “localizar”;
• Escolhemos uma imagem,
28-10-13 15:07

21. • Carregamos a imagem;
• No fim inserimos a imagem e
clicamos em salvar e fechar.
28-10-13 15:07

22. 6. Como inserir um vídeo num Bloco de Texto.
Em primeiro lugar, para que possamos inserir um vídeo no Webnode,
este terá de estar alojado online. Por exemplo um Vídeo do YouTube.
Localizamos o vídeo que queremos inserir e clicamos em editar
conteúdo, num bloco de texto.
Vamos inserir o vídeo “para onde foi o zezinho” no bloco de texto
“bem vindo ao nosso site”.
28-10-13 15:07

23. • Clicamos em “editar conteúdo”;
• Escolhemos o botão “paste HML”;
• Copiamos o código que se encontra na barra inferior do vídeo do Youtube,
que diz incorporar;
• Para copiar podemos utilizar as teclas “ctrl + C” e para colar as teclas “ ctrl
+ V”;
28-10-13 15:07

24. Copiamos o código e colamos no rectângulo que se abre após
clicarmos em “paste HTML”
Clicamos em “inserir” e de seguida em “salvar e fechar”.
28-10-13 15:07

25. O vídeo fica inserido.
Clicamos por fim em
publicar, para salvar as
alterações feitas.
28-10-13 15:07

26. 7. Como excluir uma página, um artigo ou um bloco de texto
Ao trabalharmos com o webnode, por vezes necessitamos de apagar
elementos que adicionamos no site.
7.1. Excluir páginas
Para excluir uma página, clicamos no “editar menu” que aparece perto
do menu de navegação.
28-10-13 15:07

27. De seguida selecionamos a página que queremos eliminar e clicamos em
apagar.
A página desaparecerá da lista no menu da página inicial.
28-10-13 15:07

28. 7.2. Excluir artigos
Na página de “artigos”,
posicionamos o ponteiro do
mouse sobre o artigo que
queremos eliminar e
clicamos no X que aparece
no lado direito.
7.3. Excluir um bloco de texto
Posicionamos o cursor do mouse
sobre o bloco a ser excluido e
clicamos no X que se encontra no
canto superior direito. O bloco
de texto será automaticamente
eliminado.
28-10-13 15:07

29. 8. Adicionar um logotipo ao site. Alterar imagem do Cabeçalho.
No Webnode é possível adicionar um logo para personalizar o site.
Para fazer isso, após acessar o painel de controle, clique em
“Configurações“ no menu superior.
Clicar em “cabeçalho do site” e de seguida no quadrado que tem X.
28-10-13 15:07

30. Na nova janela, clique em “inserir images" se necessário e inserir a imagem
pretendida, em seguida selecionar o logotipo e clicar em “inserir”.
Se pretendermos alterar a imagem do cabeçalho do site, procedemos da
mesma forma, selecionando o quadrado abaixo.
Nota: Nem todas as imagens têm a dimensão adequada para o template do
nosso site. Caso a imagem não seja adequada, clique na opção editar
imagem e faça os redimensionamentos / cortes.
28-10-13 15:07

31. 9. Como editar o nome das páginas no menu de navegação
O Webnode permite editar o nome dado às páginas que aparecem no
menu de navegação, podemos mudar por exemplo: Inicial para Home.
Para fazer isso devemos clicar sobre o link "Editar menu" que aparece
acima do menu de navegação, como podemos ver na imagem seguinte.
28-10-13 15:07

32. Nota: A posição do menu pode mudar de acordo com o template escolhido.
A seguir vemos o editor do menu que permite alterar, além do nome das
páginas, a sua ordem de exibição, criar sub-páginas ou apagar uma
determinada página.
28-10-13 15:07

33. Podemos expandir as propriedades clicando sobre a pequena seta
que aparece no lado esquerdo da janela, junto à página que
desejamos editar e em seguida em "Propriedades".
O próximo passo será definir o nome desejado no campo "Título“.
28-10-13 15:07

34. 10. Como criar links
Para criarmos um link, por exemplo numa imagem (o procedimento será
igual para texto), seleccionamos a imagem na qual queremos estabelecer
um link.
Clicamos em “hiperligação”
Abre-se uma janela. Escolhemos onde queremos apontar o link.
Se for para, por exemplo, uma página da internet, temos de saber o URL.
28-10-13 15:07

35. Diretoria Campinas Oeste – 26/10/2013
TUTORIAL PARA USO PEDAGÓGICO DAS ESCOLAS
CONSTRUÇÃO DE UM BLOG / MINI SITE – FERRAMENTA WEBNODE.
PCNP TECNOLOGIA EDUCACIONAL EMILIA CAPPA
CONTATO: nrtecampoeste@gmail.com
WebSite: http://www.decampinasoeste.com.br
FANPAGE: FACEBOOK – https://www.facebook.com/pages/Diretoria-deEnsino-Campinas-Oeste/375745629133504?ref=ts
TWITTER: https://twitter.com/@decampinasoeste
ESPAÇO ESCOLAS http://www.escolasdecoe.com
28-10-13 15:07