manual paginas web i.pdf
TRANSCRIPT
Páginas web, recorrendo ao Weebly Por: Fernando Ferreira As páginas web podem ser criadas, de raiz, usando software específico, como o
Dreamweaver , ou recorrendo a assistentes online, fornecidos por empresas que lhe
permitem criar um web site, sem necessidade de muitos conhecimentos técnicos, como é o
caso de:
A forma mais fácil, poderosa e acessível experiência de criação de sites!
• Construtor de sites do tipo arrastar & soltar. Não é necessário nenhum conhecimento
técnico.
• Hospedagem de Alta Capacidade. Hospedagem numa confiável infra-estrutura de
hospedagem em nuvem, monitorada dia e noite por uma equipa.
• 100 Temas Profissionais. Não terá dificuldade para encontrar o visual perfeito para o seu
site.
• Blogging sem esforço. A ferramenta de blogging utiliza a mesma interface do tipo arrastar
& soltar que torna o Weebly surpreendente. Adicione fotos & vídeos com facilidade.
• Milhares de Recursos Multimídia. Galerias de fotos, apresentações de slides atraentes,
alta qualidade em vídeo e áudio, mapas, …
Agora vamos começar um projeto. Todas as explicaçõe s abaixo devem ser seguidas passo-a-passo, cuidadosamente, cabendo ao professor optar, quando existem diversas opções, pela que desejar para o seu projet o. Comece por criar uma pasta no computador “webbly ”. Depois, deve seguir os seguintes passos, para criar um web site gratuito no webbly 1. Faça o seu registo fazendo clique em “Sign Up. It’s Free ”
2. Depois de se ter registado, pode iniciar a construção do seu web site, atrás planeado no exercício 1.
• Introduza o título e o tipo de site:
• Insira o domínio desejado. O sistema informa se já existe ou se está livre:
• E pronto! Pode verificar que tem 5 separadores para personalizar: elementos , desenho , páginas , editores e definições .
Agora basta clicar e arrastar, pois o seu site está sem conteúdo.
Separador Elementos
• Altere o título :
• Faça clique em Logo , para inserir uma imagem que será o seu logótipo . Para isso vá ao google e grave na sua pasta de trabalho “webbly” uma imagem que será usada como o seu logótipo.
• Altere a imagem de fundo com clique em Edit Image :
Obterá:
Opte por Add Text. Insira o texto desejado:
ProfJR
Faça clique em Save e faça a sua opção:
Obterá:
Experimente agora Add Image:
Escolha uma imagem no google e guarde-a na sua pasta. Depois volte aqui para a inserir. Pode arrastar a imagem usando o rato de forma a mostrar a parte desejada. Veja um exemplo:
Sempre que sair da página de edição e desejar voltar à edição, basta inserir o endereço: http://www.weebly.com/weebly/main.php e fazer clique em Editar :
No separador Elementos pode ainda criar mais elementos, que veremos mais à frente.
Separador Páginas Vamos inserir uma nova página. Para isso faça clique no separador Páginas.
Prof JR
Prof JR
Aqui pode personalizar a página que já possui Home :
Depois faça clique em Adicionar página . Crie a página Contactos :
Se desejar inserir uma palavra-passe para acesso a esta página, tornando-a por exemplo reservada para sócios ou clientes, isto é possível, mas apenas com pagamento a webbly.
Faça as suas opções e depois faça clique em Guardar definições . Agora deverá, no separador Elementos , inserir o conteúdo da página. Insira um “Parágrafo com Titulo ”, onde deve escrever o texto desejado:
Para inserir o seu e-mail, escreva por exemplo o seu nome e selecione. Depois faça clique no símbolo “cadeado”, para aí associar o link do e-mail:
Publicar o site Para publicar o site online, com estas duas páginas, faça clique em Publicar , no topo do ecrã, para definir qual será o domínio:
Defina o seu domínio com extensão webbly pois se optar por .com terá de pagar o alojamento. Depois faça clique em Gravar . Pode partilhar nas redes sociais, como o Facebook. Feche página e abra-a num browser: www.profjr.webbly.com, para ver como está online. Anote as correções a fazer. Vamos voltar à edição! Agora ao separador Desenho .
Separador Desenho Aqui pode definir o design do seu site, usando uma das opções apresentadas no topo do ecrã (Favoritos ), as Opções de concepção ou Todos os temas :
profjr
• Se optar pelos Favoritos , basta clicar sobre um deles para alterar o aspecto do seu site:
• Em Opções de concepção , pode alterar as cores dos links, as cores dos textos, etc:
• Se optar por Todos os temas terá de optar pela categoria (Business , Colorful , …) desejado e depois escolher: clique em Preview Theme e depois se gostar em Use Theme ; caso não goste, clique em Cancel .
����
Separador Editores Os Editores são pessoas a quem você deu permissão para editar o seu site. Faça clique em Adicionar editores . Depois terá de indicar os e-mails das pessoas que podem editar o site, separados por virgula, assim como o perfil destes (administrador que pode editar todas as páginas ou autor , em que pode apenas alterar algumas).
Se optar por autor , terá de pagar esse serviço. Opte então por administrador e indique a mensagem que estes devem receber. No fim clique em Add Editors .
NOTA: Indique o e-mail de um seu colega professor, para mais à frente testar esta capacidade do webbly.
Separador Definições Aqui pode personalizar algumas definições do seu site, tais como Definições gerais (titulo, .,.), Search Engine Optimization (para o site ser pesquisavel na web), definições de comércio eletrónico, etc.
Altere o título do seu site.
Crie mais três páginas além de Home e Contactos , como por exemplo: Dados profissionais , Blog , Links úteis . Para criar uma página Blog , deverá: 1. No separador Páginas , clique em Adicionar blog (botão ao lado de Adicionar página ). Insira alguns dados. 2. Ao clicar em Guardar definições obterá o blog, que poderá personalizar: insira título, descrição, texto no botão:
3. No botão pode escrever um texto e definir vários links :
Blog Prof JR
4. Opte por Arquivo no seu website . Para isso, escolha um documento seu, currículo ou outro, grave-o em PDF na sua pasta webbly . Depois volte aqui e clique Upload a new file . O ficheiro será copiado para o servidor webbly. 5. Altere a imagem do blog. Para isso grave uma imagem a seu gosto na pasta webbly e depois volte aqui para a carregar . Nesta página de blog pode ainda inserir um post , clicando no botão New Post . Depois, pode:
• Escrever um titulo e escolher uma data.
• Arrastar elementos da barra superior para baixo, por exemplo um paragrafo de texto, que
pode escrever e formatar.
• Pode definir algumas opções para o blog:
• No final, clique em Publish Live (ou grave em Drafts):
È agora hora de gravar todas as páginas:
• Clique no topo do ecrã em Gravar todas as páginas. • Depois faça clique em Publicar , para o seu site ser atualizado e fique online. • Aceda no browser ao seu endereço (seja por exemplo: www.profjr.webbly.com) para ver o
aspeto online do seu site. • Anote o que deseja alterar. Relativamente ao blog criado : 1. Teste a página Blog . Adicione um comentário. 2. Envie o endereço do seu blog para todos os professores deste curso e peça para
inserirem um comentário no blog. Relativamente à criação de utilizadores , recorda-se que indicou um colega para também administrar o seu site? Para que o colega que indicou possa trabalhar no seu site, peça-lhe agora que vá ao seu e-mail pois terá uma mensagem do webbly informando que foi convidado a ser também administrador do site. Quando esse professor clicar a mensagem tem assim a hipótese de criar uma conta para depois puder ser administrador e alterar o seu site:
Para criar as outras páginas Dados profissionais e Links úteis , deverá usar o separador Páginas . Atrás usamos o botão para abrir um ficheiro, use-o agora para abrir um link:
�
Selecione Abra link numa nova janela , para abrir uma nova com esse link mantendo por detrás a página. Insira outros links, usando botões, clicando a arrastando-os do topo para a zona da página. Insira uma caixa de pesquisa e um formulário de contacto . Crie a página Dados profissionais, com textos e imagens. NOTA: Ao criar uma nova página, se optar pela opção abaixo, criará uma página que liga diretamente ao site indicado por si:
�