46
NVU Versão 1.0.0

Tutorial NVU

Embed Size (px)

DESCRIPTION

Tutorial NVU CTCbr

Citation preview

Page 1: Tutorial NVU

NVUVersão 1.0.0

Page 2: Tutorial NVU

Sumário

I Sobre essa Apostila 2

II Informações Básicas 4

III GNU Free Documentation License 9

IV Nvu 18

1 O que é o Nvu 19

2 Plano de ensino 202.1 Objetivo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202.2 Público Alvo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202.3 Pré-requisitos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202.4 Descrição . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202.5 Metodologia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202.6 Cronograma . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202.7 Programa . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 212.8 Avaliação . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 222.9 Bibliografia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22

3 Lição 1 233.1 1 - Instalação . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 233.2 2 - Introdução . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243.3 3 - Formatação de textos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 253.4 4 - Listas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28

4 Lição 2 304.1 1 - Imagens . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 304.2 2 - Tabelas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 314.3 3 - Links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 344.4 4 - Formulários . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34

5 Lição 3 365.1 1 - Camadas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 365.2 2 - Templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 365.3 3 - Estilos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39

1

Page 3: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

5.4 4 - Gereciador de site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 415.5 4 - Publicação do site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43

2

Page 4: Tutorial NVU

Parte I

Sobre essa Apostila

3

Page 5: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

Conteúdo

O conteúdo dessa apostila é fruto da compilação de diversos materiais livres publicados na in-ternet, disponíveis em diversos sites ou originalmente produzido no CDTC (http://www.cdtc.org.br.)

O formato original deste material bem como sua atualização está disponível dentro da licençaGNU Free Documentation License, cujo teor integral encontra-se aqui reproduzido na seção demesmo nome, tendo inclusive uma versão traduzida (não oficial).

A revisão e alteração vem sendo realizada pelo CDTC ([email protected]) desde outubrode 2006. Críticas e sugestões construtivas serão bem-vindas a qualquer hora.

Autores

A autoria deste é de responsabilidade de Beatriz Marília Ferreira Ribeiro ([email protected]).

O texto original faz parte do projeto Centro de Difusão de Tecnologia e Conhecimento quevêm sendo realizado pelo ITI (Instituto Nacional de Tecnologia da Informação) em conjunto comoutros parceiros institucionais, e com as universidades federais brasileiras que tem produzido eutilizado Software Livre apoiando inclusive a comunidade Free Software junto a outras entidadesno país.

Informações adicionais podem ser obtidas através do email [email protected], ou dahome page da entidade, através da URL http://www.cdtc.org.br.

Garantias

O material contido nesta apostila é isento de garantias e o seu uso é de inteira responsabi-lidade do usuário/leitor. Os autores, bem como o ITI e seus parceiros, não se responsabilizamdireta ou indiretamente por qualquer prejuízo oriundo da utilização do material aqui contido.

Licença

Copyright ©2006, Instituto Nacional de Tecnologia da Informação ([email protected]) .

Permission is granted to copy, distribute and/or modify this document under the termsof the GNU Free Documentation License, Version 1.1 or any later version published bythe Free Software Foundation; with the Invariant Chapter being SOBRE ESSA APOS-TILA. A copy of the license is included in the section entitled GNU Free DocumentationLicense.

4

Page 6: Tutorial NVU

Parte II

Informações Básicas

5

Page 7: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

Sobre o CDTC

Objetivo Geral

O Projeto CDTC visa a promoção e o desenvolvimento de ações que incentivem a dissemina-ção de soluções que utilizem padrões abertos e não proprietários de tecnologia, em proveito dodesenvolvimento social, cultural, político, tecnológico e econômico da sociedade brasileira.

Objetivo Específico

Auxiliar o Governo Federal na implantação do plano nacional de software não-proprietário ede código fonte aberto, identificando e mobilizando grupos de formadores de opinião dentre osservidores públicos e agentes políticos da União Federal, estimulando e incentivando o mercadonacional a adotar novos modelos de negócio da tecnologia da informação e de novos negóciosde comunicação com base em software não-proprietário e de código fonte aberto, oferecendotreinamento específico para técnicos, profissionais de suporte e funcionários públicos usuários,criando grupos de funcionários públicos que irão treinar outros funcionários públicos e atuar comoincentivadores e defensores dos produtos de software não proprietários e código fonte aberto, ofe-recendo conteúdo técnico on-line para serviços de suporte, ferramentas para desenvolvimento deprodutos de software não proprietários e do seu código fonte livre, articulando redes de terceiros(dentro e fora do governo) fornecedoras de educação, pesquisa, desenvolvimento e teste de pro-dutos de software livre.

Guia do aluno

Neste guia, você terá reunidas uma série de informações importantes para que você comeceseu curso. São elas:

• Licenças para cópia de material disponível;

• Os 10 mandamentos do aluno de Educação a Distância;

• Como participar dos foruns e da wikipédia;

• Primeiros passos.

É muito importante que você entre em contato com TODAS estas informações, seguindo oroteiro acima.

Licença

Copyright ©2006, Instituto Nacional de Tecnologia da Informação ([email protected]).

6

Page 8: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

É dada permissão para copiar, distribuir e/ou modificar este documento sob os termosda Licença de Documentação Livre GNU, Versão 1.1 ou qualquer versão posteriorpúblicada pela Free Software Foundation; com o Capitulo Invariante SOBRE ESSAAPOSTILA. Uma cópia da licença está inclusa na seção entitulada "Licença de Docu-mentação Livre GNU".

Os 10 mandamentos do aluno de educação online

• 1. Acesso à Internet: ter endereço eletrônico, um provedor e um equipamento adequado épré-requisito para a participação nos cursos a distância;

• 2. Habilidade e disposição para operar programas: ter conhecimentos básicos de Informá-tica é necessário para poder executar as tarefas;

• 3. Vontade para aprender colaborativamente: interagir, ser participativo no ensino a distân-cia conta muitos pontos, pois irá colaborar para o processo ensino-aprendizagem pessoal,dos colegas e dos professores;

• 4. Comportamentos compatíveis com a etiqueta: mostrar-se interessado em conhecer seuscolegas de turma respeitando-os e se fazendo ser respeitado pelos mesmos;

• 5. Organização pessoal: planejar e organizar tudo é fundamental para facilitar a sua revisãoe a sua recuperação de materiais;

• 6. Vontade para realizar as atividades no tempo correto: anotar todas as suas obrigações erealizá-las em tempo real;

• 7. Curiosidade e abertura para inovações: aceitar novas idéias e inovar sempre;

• 8. Flexibilidade e adaptação: requisitos necessário à mudança tecnológica, aprendizagense descobertas;

• 9. Objetividade em sua comunicação: comunicar-se de forma clara, breve e transparente éponto - chave na comunicação pela Internet;

• 10. Responsabilidade: ser responsável por seu próprio aprendizado. O ambiente virtual nãocontrola a sua dedicação, mas reflete os resultados do seu esforço e da sua colaboração.

Como participar dos fóruns e Wikipédia

Você tem um problema e precisa de ajuda?

Podemos te ajudar de 2 formas:

A primeira é o uso dos fóruns de notícias e de dúvidas gerais que se distinguem pelo uso:

. O fórum de notícias tem por objetivo disponibilizar um meio de acesso rápido a informaçõesque sejam pertinentes ao curso (avisos, notícias). As mensagens postadas nele são enviadas a

7

Page 9: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

todos participantes. Assim, se o monitor ou algum outro participante tiver uma informação queinteresse ao grupo, favor postá-la aqui.Porém, se o que você deseja é resolver alguma dúvida ou discutir algum tópico específico docurso. É recomendado que você faça uso do Fórum de dúvidas gerais que lhe dá recursos maisefetivos para esta prática.

. O fórum de dúvidas gerais tem por objetivo disponibilizar um meio fácil, rápido e interativopara solucionar suas dúvidas e trocar experiências. As mensagens postadas nele são enviadasa todos participantes do curso. Assim, fica muito mais fácil obter respostas, já que todos podemajudar.Se você receber uma mensagem com algum tópico que saiba responder, não se preocupe com aformalização ou a gramática. Responda! E não se esqueça de que antes de abrir um novo tópicoé recomendável ver se a sua pergunta já foi feita por outro participante.

A segunda forma se dá pelas Wikis:

. Uma wiki é uma página web que pode ser editada colaborativamente, ou seja, qualquer par-ticipante pode inserir, editar, apagar textos. As versões antigas vão sendo arquivadas e podemser recuperadas a qualquer momento que um dos participantes o desejar. Assim, ela oferece umótimo suporte a processos de aprendizagem colaborativa. A maior wiki na web é o site "Wikipé-dia", uma experiência grandiosa de construção de uma enciclopédia de forma colaborativa, porpessoas de todas as partes do mundo. Acesse-a em português pelos links:

• Página principal da Wiki - http://pt.wikipedia.org/wiki/

Agradecemos antecipadamente a sua colaboração com a aprendizagem do grupo!

Primeiros Passos

Para uma melhor aprendizagem é recomendável que você siga os seguintes passos:

• Ler o Plano de Ensino e entender a que seu curso se dispõe a ensinar;

• Ler a Ambientação do Moodle para aprender a navegar neste ambiente e se utilizar dasferramentas básicas do mesmo;

• Entrar nas lições seguindo a seqüência descrita no Plano de Ensino;

• Qualquer dúvida, reporte ao Fórum de Dúvidas Gerais.

Perfil do Tutor

Segue-se uma descrição do tutor ideal, baseada no feedback de alunos e de tutores.

O tutor ideal é um modelo de excelência: é consistente, justo e profissional nos respectivosvalores e atitudes, incentiva mas é honesto, imparcial, amável, positivo, respeitador, aceita asidéias dos estudantes, é paciente, pessoal, tolerante, apreciativo, compreensivo e pronto a ajudar.

8

Page 10: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

A classificação por um tutor desta natureza proporciona o melhor feedback possível, é crucial, e,para a maior parte dos alunos, constitui o ponto central do processo de aprendizagem.’ Este tutorou instrutor:

• fornece explicações claras acerca do que ele espera e do estilo de classificação que iráutilizar;

• gosta que lhe façam perguntas adicionais;

• identifica as nossas falhas, mas corrige-as amavelmente’, diz um estudante, ’e explica por-que motivo a classificação foi ou não foi atribuída’;

• tece comentários completos e construtivos, mas de forma agradável (em contraste com umreparo de um estudante: ’os comentários deixam-nos com uma sensação de crítica, deameaça e de nervossismo’)

• dá uma ajuda complementar para encorajar um estudante em dificuldade;

• esclarece pontos que não foram entendidos, ou corretamente aprendidos anteriormente;

• ajuda o estudante a alcançar os seus objetivos;

• é flexível quando necessário;

• mostra um interesse genuíno em motivar os alunos (mesmo os principiantes e, por isso,talvez numa fase menos interessante para o tutor);

• escreve todas as correções de forma legível e com um nível de pormenorização adequado;

• acima de tudo, devolve os trabalhos rapidamente;

9

Page 11: Tutorial NVU

Parte III

GNU Free Documentation License

10

Page 12: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

(Traduzido pelo João S. O. Bueno através do CIPSGA em 2001)Esta é uma tradução não oficial da Licença de Documentação Livre GNU em Português Brasi-

leiro. Ela não é publicada pela Free Software Foundation, e não se aplica legalmente a distribuiçãode textos que usem a GFDL - apenas o texto original em Inglês da GNU FDL faz isso. Entretanto,nós esperamos que esta tradução ajude falantes de português a entenderem melhor a GFDL.

This is an unofficial translation of the GNU General Documentation License into Brazilian Por-tuguese. It was not published by the Free Software Foundation, and does not legally state thedistribution terms for software that uses the GFDL–only the original English text of the GFDL doesthat. However, we hope that this translation will help Portuguese speakers understand the GFDLbetter.

Licença de Documentação Livre GNU Versão 1.1, Março de 2000

Copyright (C) 2000 Free Software Foundation, Inc.59 Temple Place, Suite 330, Boston, MA 02111-1307 USA

É permitido a qualquer um copiar e distribuir cópias exatas deste documento de licença, masnão é permitido alterá-lo.

INTRODUÇÃO

O propósito desta Licença é deixar um manual, livro-texto ou outro documento escrito "livre"nosentido de liberdade: assegurar a qualquer um a efetiva liberdade de copiá-lo ou redistribui-lo,com ou sem modificações, comercialmente ou não. Secundariamente, esta Licença mantémpara o autor e editor uma forma de ter crédito por seu trabalho, sem ser considerado responsávelpelas modificações feitas por terceiros.

Esta Licença é um tipo de "copyleft"("direitos revertidos"), o que significa que derivações dodocumento precisam ser livres no mesmo sentido. Ela complementa a GNU Licença Pública Ge-ral (GNU GPL), que é um copyleft para software livre.

Nós fizemos esta Licença para que seja usada em manuais de software livre, por que softwarelivre precisa de documentação livre: um programa livre deve ser acompanhado de manuais queprovenham as mesmas liberdades que o software possui. Mas esta Licença não está restrita amanuais de software; ela pode ser usada para qualquer trabalho em texto, independentementedo assunto ou se ele é publicado como um livro impresso. Nós recomendamos esta Licença prin-cipalmente para trabalhos cujo propósito seja de introdução ou referência.

APLICABILIDADE E DEFINIÇÕES

Esta Licença se aplica a qualquer manual ou outro texto que contenha uma nota colocada pelodetentor dos direitos autorais dizendo que ele pode ser distribuído sob os termos desta Licença.O "Documento"abaixo se refere a qualquer manual ou texto. Qualquer pessoa do público é um

11

Page 13: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

licenciado e é referida como "você".

Uma "Versão Modificada"do Documento se refere a qualquer trabalho contendo o documentoou uma parte dele, quer copiada exatamente, quer com modificações e/ou traduzida em outralíngua.

Uma "Seção Secundária"é um apêndice ou uma seção inicial do Documento que trata ex-clusivamente da relação dos editores ou dos autores do Documento com o assunto geral doDocumento (ou assuntos relacionados) e não contém nada que poderia ser incluído diretamentenesse assunto geral (Por exemplo, se o Documento é em parte um livro texto de matemática, aSeção Secundária pode não explicar nada de matemática).

Essa relação poderia ser uma questão de ligação histórica com o assunto, ou matérias relaci-onadas, ou de posições legais, comerciais, filosóficas, éticas ou políticas relacionadas ao mesmo.

As "Seções Invariantes"são certas Seções Secundárias cujos títulos são designados, comosendo de Seções Invariantes, na nota que diz que o Documento é publicado sob esta Licença.

Os "Textos de Capa"são certos trechos curtos de texto que são listados, como Textos de CapaFrontal ou Textos da Quarta Capa, na nota que diz que o texto é publicado sob esta Licença.

Uma cópia "Transparente"do Documento significa uma cópia que pode ser lida automatica-mente, representada num formato cuja especificação esteja disponível ao público geral, cujosconteúdos possam ser vistos e editados diretamente e sem mecanismos especiais com editoresde texto genéricos ou (para imagens compostas de pixels) programas de pintura genéricos ou(para desenhos) por algum editor de desenhos grandemente difundido, e que seja passível deservir como entrada a formatadores de texto ou para tradução automática para uma variedadede formatos que sirvam de entrada para formatadores de texto. Uma cópia feita em um formatode arquivo outrossim Transparente cuja constituição tenha sido projetada para atrapalhar ou de-sencorajar modificações subsequentes pelos leitores não é Transparente. Uma cópia que não é"Transparente"é chamada de "Opaca".

Exemplos de formatos que podem ser usados para cópias Transparentes incluem ASCII sim-ples sem marcações, formato de entrada do Texinfo, formato de entrada do LaTex, SGML ou XMLusando uma DTD disponibilizada publicamente, e HTML simples, compatível com os padrões, eprojetado para ser modificado por pessoas. Formatos opacos incluem PostScript, PDF, formatosproprietários que podem ser lidos e editados apenas com processadores de texto proprietários,SGML ou XML para os quais a DTD e/ou ferramentas de processamento e edição não estejamdisponíveis para o público, e HTML gerado automaticamente por alguns editores de texto comfinalidade apenas de saída.

A "Página do Título"significa, para um livro impresso, a página do título propriamente dita,mais quaisquer páginas subsequentes quantas forem necessárias para conter, de forma legível,o material que esta Licença requer que apareça na página do título. Para trabalhos que nãotenham uma página do título, "Página do Título"significa o texto próximo da aparição mais proe-minente do título do trabalho, precedendo o início do corpo do texto.

12

Page 14: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

FAZENDO CÓPIAS EXATAS

Você pode copiar e distribuir o Documento em qualquer meio, de forma comercial ou nãocomercial, desde que esta Licença, as notas de copyright, e a nota de licença dizendo que estaLicença se aplica ao documento estejam reproduzidas em todas as cópias, e que você não acres-cente nenhuma outra condição, quaisquer que sejam, às desta Licença.

Você não pode usar medidas técnicas para obstruir ou controlar a leitura ou confecção decópias subsequentes das cópias que você fizer ou distribuir. Entretanto, você pode aceitar com-pensação em troca de cópias. Se você distribuir uma quantidade grande o suficiente de cópias,você também precisa respeitar as condições da seção 3.

Você também pode emprestar cópias, sob as mesmas condições colocadas acima, e tambémpode exibir cópias publicamente.

FAZENDO CÓPIAS EM QUANTIDADE

Se você publicar cópias do Documento em número maior que 100, e a nota de licença doDocumento obrigar Textos de Capa, você precisará incluir as cópias em capas que tragam, clarae legivelmente, todos esses Textos de Capa: Textos de Capa da Frente na capa da frente, eTextos da Quarta Capa na capa de trás. Ambas as capas também precisam identificar clara elegivelmente você como o editor dessas cópias. A capa da frente precisa apresentar o título com-pleto com todas as palavras do título igualmente proeminentes e visíveis. Você pode adicionaroutros materiais às capas. Fazer cópias com modificações limitadas às capas, tanto quanto estaspreservem o título do documento e satisfaçam a essas condições, pode ser tratado como cópiaexata em outros aspectos.

Se os textos requeridos em qualquer das capas for muito volumoso para caber de formalegível, você deve colocar os primeiros (tantos quantos couberem de forma razoável) na capaverdadeira, e continuar os outros nas páginas adjacentes.

Se você publicar ou distribuir cópias Opacas do Documento em número maior que 100, vocêprecisa ou incluir uma cópia Transparente que possa ser lida automaticamente com cada cópiaOpaca, ou informar, em ou com, cada cópia Opaca a localização de uma cópia Transparentecompleta do Documento acessível publicamente em uma rede de computadores, à qual o públicousuário de redes tenha acesso a download gratuito e anônimo utilizando padrões públicos deprotocolos de rede. Se você utilizar o segundo método, você precisará tomar cuidados razoavel-mente prudentes, quando iniciar a distribuição de cópias Opacas em quantidade, para assegurarque esta cópia Transparente vai permanecer acessível desta forma na localização especificadapor pelo menos um ano depois da última vez em que você distribuir uma cópia Opaca (direta-mente ou através de seus agentes ou distribuidores) daquela edição para o público.

É pedido, mas não é obrigatório, que você contate os autores do Documento bem antes deredistribuir qualquer grande número de cópias, para lhes dar uma oportunidade de prover vocêcom uma versão atualizada do Documento.

13

Page 15: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

MODIFICAÇÕES

Você pode copiar e distribuir uma Versão Modificada do Documento sob as condições das se-ções 2 e 3 acima, desde que você publique a Versão Modificada estritamente sob esta Licença,com a Versão Modificada tomando o papel do Documento, de forma a licenciar a distribuiçãoe modificação da Versão Modificada para quem quer que possua uma cópia da mesma. Alémdisso, você precisa fazer o seguinte na versão modificada:

A. Usar na Página de Título (e nas capas, se houver alguma) um título distinto daquele do Do-cumento, e daqueles de versões anteriores (que deveriam, se houvesse algum, estarem listadosna seção "Histórico do Documento"). Você pode usar o mesmo título de uma versão anterior seo editor original daquela versão lhe der permissão;

B. Listar na Página de Título, como autores, uma ou mais das pessoas ou entidades responsá-veis pela autoria das modificações na Versão Modificada, conjuntamente com pelo menos cincodos autores principais do Documento (todos os seus autores principais, se ele tiver menos quecinco);

C. Colocar na Página de Título o nome do editor da Versão Modificada, como o editor;

D. Preservar todas as notas de copyright do Documento;

E. Adicionar uma nota de copyright apropriada para suas próprias modificações adjacente àsoutras notas de copyright;

F. Incluir, imediatamente depois das notas de copyright, uma nota de licença dando ao públicoo direito de usar a Versão Modificada sob os termos desta Licença, na forma mostrada no tópicoabaixo;

G. Preservar nessa nota de licença as listas completas das Seções Invariantes e os Textos deCapa requeridos dados na nota de licença do Documento;

H. Incluir uma cópia inalterada desta Licença;

I. Preservar a seção entitulada "Histórico", e seu título, e adicionar à mesma um item dizendopelo menos o título, ano, novos autores e editor da Versão Modificada como dados na Página deTítulo. Se não houver uma sessão denominada "Histórico"no Documento, criar uma dizendo otítulo, ano, autores, e editor do Documento como dados em sua Página de Título, então adicionarum item descrevendo a Versão Modificada, tal como descrito na sentença anterior;

J. Preservar o endereço de rede, se algum, dado no Documento para acesso público a umacópia Transparente do Documento, e da mesma forma, as localizações de rede dadas no Docu-mento para as versões anteriores em que ele foi baseado. Elas podem ser colocadas na seção"Histórico". Você pode omitir uma localização na rede para um trabalho que tenha sido publicadopelo menos quatro anos antes do Documento, ou se o editor original da versão a que ela se refirader sua permissão;

K. Em qualquer seção entitulada "Agradecimentos"ou "Dedicatórias", preservar o título da

14

Page 16: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

seção e preservar a seção em toda substância e fim de cada um dos agradecimentos de contri-buidores e/ou dedicatórias dados;

L. Preservar todas as Seções Invariantes do Documento, inalteradas em seus textos ou emseus títulos. Números de seção ou equivalentes não são considerados parte dos títulos da seção;

M. Apagar qualquer seção entitulada "Endossos". Tal sessão não pode ser incluída na VersãoModificada;

N. Não reentitular qualquer seção existente com o título "Endossos"ou com qualquer outrotítulo dado a uma Seção Invariante.

Se a Versão Modificada incluir novas seções iniciais ou apêndices que se qualifiquem comoSeções Secundárias e não contenham nenhum material copiado do Documento, você pode optarpor designar alguma ou todas aquelas seções como invariantes. Para fazer isso, adicione seustítulos à lista de Seções Invariantes na nota de licença da Versão Modificada. Esses títulos preci-sam ser diferentes de qualquer outro título de seção.

Você pode adicionar uma seção entitulada "Endossos", desde que ela não contenha qual-quer coisa além de endossos da sua Versão Modificada por várias pessoas ou entidades - porexemplo, declarações de revisores ou de que o texto foi aprovado por uma organização como adefinição oficial de um padrão.

Você pode adicionar uma passagem de até cinco palavras como um Texto de Capa da Frente, e uma passagem de até 25 palavras como um Texto de Quarta Capa, ao final da lista de Textosde Capa na Versão Modificada. Somente uma passagem de Texto da Capa da Frente e uma deTexto da Quarta Capa podem ser adicionados por (ou por acordos feitos por) qualquer entidade.Se o Documento já incluir um texto de capa para a mesma capa, adicionado previamente porvocê ou por acordo feito com alguma entidade para a qual você esteja agindo, você não podeadicionar um outro; mas você pode trocar o antigo, com permissão explícita do editor anterior queadicionou a passagem antiga.

O(s) autor(es) e editor(es) do Documento não dão permissão por esta Licença para que seusnomes sejam usados para publicidade ou para assegurar ou implicar endossamento de qualquerVersão Modificada.

COMBINANDO DOCUMENTOS

Você pode combinar o Documento com outros documentos publicados sob esta Licença, sobos termos definidos na seção 4 acima para versões modificadas, desde que você inclua na com-binação todas as Seções Invariantes de todos os documentos originais, sem modificações, e listetodas elas como Seções Invariantes de seu trabalho combinado em sua nota de licença.

O trabalho combinado precisa conter apenas uma cópia desta Licença, e Seções InvariantesIdênticas com multiplas ocorrências podem ser substituídas por apenas uma cópia. Se houvermúltiplas Seções Invariantes com o mesmo nome mas com conteúdos distintos, faça o título de

15

Page 17: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

cada seção único adicionando ao final do mesmo, em parênteses, o nome do autor ou editororigianl daquela seção, se for conhecido, ou um número que seja único. Faça o mesmo ajustenos títulos de seção na lista de Seções Invariantes nota de licença do trabalho combinado.

Na combinação, você precisa combinar quaisquer seções entituladas "Histórico"dos diver-sos documentos originais, formando uma seção entitulada "Histórico"; da mesma forma combinequaisquer seções entituladas "Agradecimentos", ou "Dedicatórias". Você precisa apagar todas asseções entituladas como "Endosso".

COLETÂNEAS DE DOCUMENTOS

Você pode fazer uma coletânea consitindo do Documento e outros documentos publicadossob esta Licença, e substituir as cópias individuais desta Licença nos vários documentos comuma única cópia incluida na coletânea, desde que você siga as regras desta Licença para cópiaexata de cada um dos Documentos em todos os outros aspectos.

Você pode extrair um único documento de tal coletânea, e distribuí-lo individualmente sobesta Licença, desde que você insira uma cópia desta Licença no documento extraído, e siga estaLicença em todos os outros aspectos relacionados à cópia exata daquele documento.

AGREGAÇÃO COM TRABALHOS INDEPENDENTES

Uma compilação do Documento ou derivados dele com outros trabalhos ou documentos se-parados e independentes, em um volume ou mídia de distribuição, não conta como uma Ver-são Modificada do Documento, desde que nenhum copyright de compilação seja reclamado pelacompilação. Tal compilação é chamada um "agregado", e esta Licença não se aplica aos outrostrabalhos auto-contidos compilados junto com o Documento, só por conta de terem sido assimcompilados, e eles não são trabalhos derivados do Documento.

Se o requerido para o Texto de Capa na seção 3 for aplicável a essas cópias do Documento,então, se o Documento constituir menos de um quarto de todo o agregado, os Textos de Capado Documento podem ser colocados em capas adjacentes ao Documento dentro do agregado.Senão eles precisarão aparecer nas capas de todo o agregado.

TRADUÇÃO

Tradução é considerada como um tipo de modificação, então você pode distribuir traduçõesdo Documento sob os termos da seção 4. A substituição de Seções Invariantes por traduçõesrequer uma permissão especial dos detentores do copyright das mesmas, mas você pode incluirtraduções de algumas ou de todas as Seções Invariantes em adição às versões orignais dessasSeções Invariantes. Você pode incluir uma tradução desta Licença desde que você também in-clua a versão original em Inglês desta Licença. No caso de discordância entre a tradução e a

16

Page 18: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

versão original em Inglês desta Licença, a versão original em Inglês prevalecerá.

TÉRMINO

Você não pode copiar, modificar, sublicenciar, ou distribuir o Documento exceto como expres-samente especificado sob esta Licença. Qualquer outra tentativa de copiar, modificar, sublicen-ciar, ou distribuir o Documento é nula, e resultará automaticamente no término de seus direitossob esta Licença. Entretanto, terceiros que tenham recebido cópias, ou direitos de você sob estaLicença não terão suas licenças terminadas, tanto quanto esses terceiros permaneçam em totalacordo com esta Licença.

REVISÕES FUTURAS DESTA LICENÇA

A Free Software Foundation pode publicar novas versões revisadas da Licença de Documen-tação Livre GNU de tempos em tempos. Tais novas versões serão similares em espirito à versãopresente, mas podem diferir em detalhes ao abordarem novos porblemas e preocupações. Vejahttp://www.gnu.org/copyleft/.

A cada versão da Licença é dado um número de versão distinto. Se o Documento especificarque uma versão particular desta Licença "ou qualquer versão posterior"se aplica ao mesmo, vocêtem a opção de seguir os termos e condições daquela versão específica, ou de qualquer versãoposterior que tenha sido publicada (não como rascunho) pela Free Software Foundation. Se oDocumento não especificar um número de Versão desta Licença, você pode escolher qualquerversão já publicada (não como rascunho) pela Free Software Foundation.

ADENDO: Como usar esta Licença para seus documentos

Para usar esta Licença num documento que você escreveu, inclua uma cópia desta Licençano documento e ponha as seguintes notas de copyright e licenças logo após a página de título:

Copyright (c) ANO SEU NOME.É dada permissão para copiar, distribuir e/ou modificar este documento sob os termos da Licençade Documentação Livre GNU, Versão 1.1 ou qualquer versão posterior publicada pela Free Soft-ware Foundation; com as Seções Invariantes sendo LISTE SEUS TÍTULOS, com os Textos daCapa da Frente sendo LISTE, e com os Textos da Quarta-Capa sendo LISTE. Uma cópia da li-cença está inclusa na seção entitulada "Licença de Documentação Livre GNU".

Se você não tiver nenhuma Seção Invariante, escreva "sem Seções Invariantes"ao invés dedizer quais são invariantes. Se você não tiver Textos de Capa da Frente, escreva "sem Textos deCapa da Frente"ao invés de "com os Textos de Capa da Frente sendo LISTE"; o mesmo para osTextos da Quarta Capa.

Se o seu documento contiver exemplos não triviais de código de programas, nós recomenda-mos a publicação desses exemplos em paralelo sob a sua escolha de licença de software livre,

17

Page 19: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

tal como a GNU General Public License, para permitir o seu uso em software livre.

18

Page 20: Tutorial NVU

Parte IV

Nvu

19

Page 21: Tutorial NVU

Capítulo 1

O que é o Nvu

O Nvu (pronuncia-se Nview) é um poderoso editor de documentos HTML de código abertodesenvolvido pela Linspire, licenciado sob a Mozilla Public License (MPL). Esse editor é exce-lente para inciantes em programação web, pois permite criar páginas mesmo que não se tenhaconhecimento da linguagem HTML, por meio de uma interface gráfica.

O curso, com base na distribuição Debian, possui uma semana começando na segunda-feirae terminando no domingo da última semana. Todo o conteúdo do curso estará visível somente apartir da data de início. Para começar o curso, você deve ler o Guia do aluno a seguir.

20

Page 22: Tutorial NVU

Capítulo 2

Plano de ensino

2.1 Objetivo

Capacitar o usuário para o uso autônomo do ambiente de edição de páginas web Nvu.

2.2 Público Alvo

Usuários finais ou novatos que desejam migrar os seus sistemas proprietários para softwarelivre.

2.3 Pré-requisitos

Os usuários deverão ser, necessariamente, funcionários públicos e ter conhecimentos básicospara operar um computador.

2.4 Descrição

O curso será realizado na modalidade Educação a Distância e utilizará a Plataforma Moodlecomo ferramenta de aprendizagem. O curso tem duração de uma semana e possui um conjuntode atividades (lições, fóruns, glossários, questionários e outros) que deverão ser executadas deacordo com as instruções fornecidas. O material didático está disponível on-line de acordo comas datas pré-estabelecidas em cada tópico. A versão adotada do Nvu é a 1.0, caso possua outraversão podem ocorrer diferenças com relação a este material.

2.5 Metodologia

O curso está dividido da seguinte maneira:

2.6 Cronograma

• Descrição das atividades

21

Page 23: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

• De seguda-feira a domingo

• Lição 1 - instalação, introdução, textos e listas;

• Lição 2 - imagens, tabelas, links e formulários;

• Lição 3 - camadas, templates, estilos, gerenciador de site e publicação.

• De quinta-feira a domigo

• Avaliação de aprendizagem

• Avaliação do curso

As lições contêm o contéudo principal. Elas poderão ser acessadas quantas vezes forem neces-sárias, desde que esteja dentro da semana programada. Ao final de cada lição, você receberáuma nota de acordo com o seu desempenho. Responda com atenção às perguntas de cada lição,pois elas serão consideradas na sua nota final. Caso sua nota numa determinada lição for menorque 6.0, sugerimos que você faça novamente esta lição. // Ao final do curso será disponibilizada aavaliação referente ao curso. Tanto as notas das lições quanto a da avaliação serão consideradaspara a nota final. Todos os módulos ficarão visíveis para que possam ser consultados durantea avaliação final. // Aconselhamos a leitura da "Ambientação do Moodle"para que você conheçaa plataforma de Ensino a Distância, evitando dificuldades advindas do "desconhecimento"sobrea mesma. // Os instrutores estarão a sua disposição ao longo de todo curso. Qualquer dúvidadeverá ser enviada no fórum. Diariamente os monitores darão respostas e esclarecimentos.

2.7 Programa

O curso oferecerá o seguinte conteúdo:

• Instalação;

• Introdução;

• Formatação de textos;

• Listas;

• Imagens;

• Tabelas;

• Links;

• Formulários;

• Camadas;

• Templates;

• Estilos;

• Gerenciador de sites;

• Publicação do site.

22

Page 24: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

2.8 Avaliação

Toda a avaliação será feita on-line.Aspectos a serem considerados na avaliação:

• iniciativa e autonomia no processo de aprendizagem e de produção de conhecimento;

• capacidade de pesquisa e abordagem criativa na solução dos problemas apresentados.

Instrumentos de avaliação:

• participação ativa nas atividades programadas;

• avaliação ao final do curso;

• o participante fará várias avaliações referente ao conteúdo do curso. Para a aprovação eobtenção do certificado o participante deverá obter nota final maior ou igual a 6.0 de acordocom a fórmula abaixo:

• Nota Final = ((ML x 7) + (AF x 3)) / 10 = Média aritmética das lições

• AF = Avaliações

2.9 Bibliografia

• Site oficial: http://www.nvu.org/

• Nvu user guide: http://nvudev.com/guide/html/

23

Page 25: Tutorial NVU

Capítulo 3

Lição 1

O Nvu (pronuncia-se Nview) é um poderoso editor de documentos HTML de código abertodesenvolvido pela Linspire, licenciado sob a Mozilla Public License (MPL). Esse editor é exce-lente para inciantes em programação web, pois permite criar páginas mesmo que não se tenhaconhecimento da linguagem HTML, por meio de uma amigável interface gráfica.

3.1 1 - Instalação

Siga os seguintes passos:

1. Faça o download do Nvu em http://www.nvu.com/download.php

2. Escolha o arquivo apropriado para seu sistema operacional ou distribuição do Linux. Aexplicação seguinte é para instalação no Debian e distribuições derivadas dele. Para essasdistribuições o arquivo é nvu-1.0-pc-linux2.6.10-gnu.tar.bz2

3. Entre no diretório onde o arquivo foi salvo e o descompacte: tar vxjpf nvu-1.0-pc-linux2.6.10-gnu.tar.bz2

4. Entre no diretório criado ao descompactar o arquivo: cd nvu-1.0/

5. Execute o nvu: ./nvu

24

Page 26: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

3.2 2 - Introdução

Esta é a tela que vemos ao abrir o Nvu. É por meio desta interface que aprenderemos aconstruir páginas HTML. Então, a primeira coisa a fazer é conhecê-la.

A primeira barra mostrada na figura é a barra de título. Ela mostra o nome da ferramenta(Nvu) e o nome do documento no qual estamos trabalhando. Nesse caso no lugar do nome dodocumento temos untitled (não intitulado) porque não há nenhum documento aberto.

A segunda barra, logo abaixo da barra de títulos, é a barra de menus. Nas próximas liçõesaprenderemos mais sobre as funções dela.

Abaixo da barra de menus está a barra de ferramentas. Esta barra tem alguns atalhospara facilitar ações que poderiam ser executadas utilizando-se barra de menus, como criar umnovo documento ou inserir uma imagem.

A quarta barra é a barra de formatação, que, como o nome sugere, dá opções de forma-tação do texto. Nesta barra pode-se escolher o tipo da fonte, o tamanho, o alinhamento do textoalém de outras opções. Assim como a barra de ferramentas, a barra de formatação facilita açõesque poderiam ser realizadas utilizando-se a barra de menus.

25

Page 27: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

Abaixo da barra de formatação, do lado direito, está a área onde será criada a página. É nesseretângulo branco que inserimos o texto, as figuras, tabelas e demais elementos da página. O Nvué uma interface do tipo wysiwyg (what you see is what you get) o que significa que o resultadofinal será igual ao que é visto na edição do documento.

A barra de modo de edição fica logo abaixo da área de edição. Ela tem as seguintesopções:Normal - é a aba mais utilizada na construção da página. Mostra uma visão muito parecida como resultado final.HTML tags - mostra as tags HTML como símbolos, dessa forma tem-se uma visão clara dapágina e uma boa noção sobre o código.Source - mostra o código HTML. É possível editar esse código caso você tenha conhecimentoda lingugem HTML.Preview - mostra como será o resultado final, como a página será vista pelos leitores.

A última das barras é a barra de status, que fica abaixo da barra de modo de edição.

3.3 3 - Formatação de textos

Começaremos nossa página editando um texto. Copie o parágrafo abaixo e cole-o na área deedição, no modo de edição normal.

"Centro de Desenvolvimento de Tecnologia e Conhecimento

Objetivo Geral O Projeto CDTC visa a promoção e o desenvolvimento de ações que incenti-vem a disseminação de soluções que utilizem padrões abertos e não proprietários de tecnologia,em proveito do desenvolvimento social, cultural, político, tecnológico e econômico da sociedadebrasileira.

Objetivo Específico Auxiliar o Governo Federal na implantação do plano nacional de softwarenão-proprietário e de código fonte aberto, identificando e mobilizando grupos de formadores deopinião dentre os servidores públicos e agentes políticos da União Federal, estimulando e incen-tivando o mercado nacional a adotar novos modelos de negócio da tecnologia da informação e denovos negócios de comunicação com base em software não-proprietário e de código fonte aberto,oferecendo treinamento específico para técnicos, profissionais de suporte e funcionários públicosusuários, criando grupos de funcionários públicos que irão treinar outros funcionários públicos eatuar como incentivadores e defensores de produtos de software não proprietários e código fonteaberto, oferecendo conteúdo técnico on-line para serviços de suporte, ferramentas para desenvol-vimento de produtos de software não proprietários e de seu código fonte livre, articulando redesde terceiros (dentro e fora do governo) fornecedoras de educação, pesquisa, desenvolvimento e

26

Page 28: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

teste de produtos de software livre."

Então, salve o documento com o nome CDTC. Para salvar um arquivo você pode clicar no terceirobotão da barra de ferramentas ou ir em file -> save as. Será perguntado o nome do arquivo,escreva CDTC neste campo. Em seguida, clique em Save.

Observe que, após salvar, o nome do arquivo aparece na barra de título.

No menu format é possível definir o tamanho e tipo da fonte, a cor, o estilo e o alinhamento dotexto, uma imagem de fundo para a página e algumas outras opções de formatação.

Para mudar o alinhamento do texto para justificado, por exemplo, faça o seguinte:

1. selecione todo o texto;

27

Page 29: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

2. clique no menu format e posicione o ponteiro do mouse sobre align;

3. aparecerão as opções left, center, right e justify. Escolha esta última.

Selecionando todo texto e clicando no botão align justify sobre a barra de ferramentasteríamos o mesmo resultado final.

Caso queira mudar o tipo da fonte, siga os seguintes passos:

1. selecione o texto;

2. clique no menu format e posicione o ponteiro do mouse sobre font;

3. aparecerão diversos tipos de fonte, escolha um deles.

Uma forma mais rápida de fazer isso é selecionar o texto e escolher o tipo da fonte na terceiralista de seleção da barra de ferramentas.

Outra opção de formatação é a de estilos de texto. Alguns exemplos de estilos são: negrito,itálico e sublinhado. Pode-se escolher o estilo do texto no menu format -> text style ou usandoos botões seguintes:

Além desses três estilos, que são os mais frequentemente utilizados, há outros que só podemser escolhidos por meio do menu format.

Pode-se também mudar a cor da fonte por meio do menu Format -> Text Color . Paramudar o tamanho da fonte selecionamos o texto que terá seu tamanho de fonte alterado e usamoso menu Format -> Size.

Para mudar o formato dos parágrafos, selecione a parte do texto a ser modificada e escolha,na primeira caixa drop-down da barra de formatação, o formato mais apropriado. Os possíveisformatos são:Body Text - o texto fica com tipo do fonte padrão;Paragraph - uma tag de parágrafo (<p>,</p>) é inserida. Consequentemente são criadas mar-gens superior e inferior nessa parte do texto;Heading (1 a 6) - usado para títulos. Este formato deixa as letras maiores e em negrito. Otamanho da fonte depende do nível escolhido. Quanto menor o nível maior o tamanho da letra.Os níveis vão de 1 até 6;Addres - usado para inserir uma assinatura na página e permitir que os leitores entrem em con-tato com o autor.Para aplicar o que acabou de aprender faça o seguinte:

1. Mude o tamanho do título do texto (Centro de Desenvolvimento de Tecnologia e Conheci-mento) para x-large. Mude também sua cor para a que preferir e seu estilo para negrito;

2. Mude o tamanho dos subtítulos (Objetivo Geral e Objetivo Específico) para large;

3. Defina o alinhamento de todo texto como justificado.

Você deve conseguir um resultado como o da figura abaixo:

28

Page 30: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

3.4 4 - Listas

Para inserir uma lista em uma página clique em um dos botões seguintes ou use os menusFormat -> List -> Numbered ou Format -> List -> Bulleted, que correspondem, respecti-vamente, a esses botões.

Dependendo da opção escolhida aparecerá o número 1 ou uma bolinha preta. Digite o pri-meiro item da lista e pressione Enter. Aparecerá, então, o número dois ou outra bolinha. Repitaeste procedimento até o fim da lista. Após a inserção do último item, pressione Enter duas ve-zes (na primeira vez aparecerá um número ou uma bolinha para que você adicione um item,na segunda vez o número ou a bolinha sumirá). Se, posteriormente, você quiser adicionar no-vos elementos à lista basta posicionar o cursor após o último elemento dela e pressionar Enter.Aparecerá espaço para um novo item.

É possível mudar a formatação da lista por meio do menu Format -> List ou clicando como botão direito do mouse sobre a lista. Em ambos os casos escolha a opção Format -> ListProperties. Você verá a seguinte tela:

29

Page 31: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

Em list type, você terá as opções lista não-numerada (Bullet List), lista numerada (NumberedList) e lista de definição (Definition List). Escolhendo Bullet List será possível escolher se antes decada item aparecerá um círculo aberto, um círculo fechado ou um quadrado. Escolhendo Numbe-red List terá as opções de algarismos arábicos, algarismos romanos maiúsculos ou minúsculosou letras maiúsculas ou minúsculas. Após escolher as opções de formatação de sua lista cliqueem OK.

Para criar uma lista de definição use o menu Format -> List -> Definition. Neste caso,após a inserção de um elemento da lista, você poderá escrever uma descrição sobre ele. Comono exemplo abaixo:

Primeiro elementodescrição do primeiro elemento

Segundo elementodescrição do segundo elemeto

Terceiro elementodescrição do terceiro elemento

O Nvu permite a criação de listas aninhadas, isto é, criar uma lista dentro de outra. Para criaruma lista dentro de outra já existente, faça o seguinte:

1. Posicione o cursor antes de onde será inserida a nova lista;

2. Pressione Shift+Enter

3. Digite os itens da nova lista da mesma forma feita anteriormente.

É possivel definir um tipo diferente de formatação para cada uma das listas.

30

Page 32: Tutorial NVU

Capítulo 4

Lição 2

4.1 1 - Imagens

Os browsers aceitam imagens nos formatos ’gif’, ’jpg’ e ’png’. Para inserir uma imagem emsua página, faça o seguinte:

1. Clique no menu Insert -> Image ou no botão

aparecerá a seguinte tela:

2. Na aba location clique em Choose File e escolha o arquivo da figura que deseja inserir.

3. Deixe marcada a caixa ’URL is relative to page location’.

4. Em Tooltip escreva um título que identifique a imagem.

31

Page 33: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

5. No campo alternte text escreva uma pequena descrição sobre a imagem. Esta mensagemserá mostrada caso o browser não possa mostrar a imagem ou enquanto ela estiver sendocarregada.

6. Clique em OK.

Para mudar o tamanho da imagem, clique sobre ela e aparecerão pequenos quadrados emseus cantos e no ponto médio de cada lado. Clicando sobre um deles e arrastando a imagemserá redimensionada.

Para mudar o alinhamento do texto em relação a imagem, faça o seguinte:

1. Dê um duplo clique sobre a imagem. Será aberta a janela Image Properties;

2. Clique na aba Appearance;

3. Na caixa de seleção Align text to image escolha a opção que preferir.

4.2 2 - Tabelas

Inserido Tabelas

Para inserir uma tabela a sua página, use o botão:

ou o menu: Insert -> Table . Será, então, aberta uma janela que lhe permite escolher onúmero de linhas e de colunas de sua tabela, como ilustrado abaixo:

Há duas formas de definir esses parâmetros, na aba Quickly ou na aba Precisely. Na primeiradelas, basta arrastar o mouse sobre a figura de uma tabela cinza, as células marcadas em azulrepresentam as células que estarão presentes na tabela que será criada. Na aba Precisely, seránecessário digitar o número de linhas (rows) e de colunas (columns) da tabela. No parâmetrowidth defina a largura da tabela (em pixels ou porcentagem em relação à largura da janela).

Na aba Cell, você pode definir o alinhamento do texto em relação à célula nos campos Horiz.alignment e Vert. alignment. O campo Cellspacing define a distância entre as células da tabela.

32

Page 34: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

Depois de definir cada um desses parâmetros clique em OK para que a tabela seja inserida.

Formatando Tabelas

É possível, após inserir uma tabela, formatá-la. Para isso dê um duplo clique sobre a tabela.Será aberta a janela Table Properties, ilustrada abaixo:

Você poderá mudar o número de linhas ou de colunas da tabela da mesma forma feita em suainserção. Os campos Height e Width definem, respectivamente, a altura das linhas e a larguradas colunas. Para mudá-las, basta digitar o novo valor no campo e escolher a unidade de medidanuma caixa drop-down a direita desse valor. As possíveis unidades de medida são pixels ouporcentagem em relação ao tamanho da janela.

A espessura da borda externa da tabela pode ser alterada no campo Border. A espessurapadrão é de 2 pixels. O campo Spacing permite modificar a distância entre as células e o campoPadding serve para definir o tamanho do espaço entre a borda das células e seu conteúdo.

Em Table Alignment é possível escolher se a tabela ficará a direita ou a esquerda da página,logo abaixo está o campo Background Color que tem como função definir a cor de fundo databela. Para alterar essa cor, clique sobre o retângulo a direita e escolha a cor na janela que seráaberta.

Para mudar a formatação das células, clique sobre a aba Cells na janela que foi aberta.

33

Page 35: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

Na primeira caixa drop-down dessa aba você deve escolher se quer mudar as propriedadesde uma linha, uma coluna ou uma célula. Usando os botões Previous e Next selecione a linha,tabela ou coluna que deseja editar. Você verá a tabela com a parte selecionada destacada.

Nos campos Height e Width você deve escolher a altura e a largura da parte selecionada,como feito na aba Table, a diferença é que na aba Cells as mudanças serão aplicadas apenas àregião selecionada, e não à tabela inteira.

A direita desses campos é possível de definir o alinhamento do texto em relação à célula.As possibilidades de alinhamento vertical são no alto da célula (top), em uma altura intermediária(middle) ou na parte de baixo dela (bottom). As opções de alinhamento horizontal são as mesmasexplicadas em formatação de texto, ou seja, left, center, right e justify. Escolha a mais apropriadapara sua tabela.

Clicando sobre o retângulo a direita de Background Color será aberta uma janela para quevocê esolha a cor de fundo da região selecionada.

Depois de mudar todos os parâmetros que achar necessário, clique em OK.

Inserindo Imagens de Fundo

É possível definir uma imagem de fundo na tabela ou em uma das células. Para isso, siga osseguintes passos:

1. clique na aba HTML Tags na barra de modo de edição;

2. pressione a tecla Ctrl e ao mesmo tempo clique sobre a tag HTML correspondente à célulaou à tabela na qual a figura será inserida. OBS: as tags HTML são representadas pelospequenos retângulos amarelos que aparecem à esquerda das células e da tabela;

3. fazendo o passo anterior, uma das tags da barra de status ficará em negrito. Clique com obotão direito do mouse sobre essa tag. Então posicione o cursor do mouse sobre InlineStyles e em seguida clique em Background Properties;

4. na janela que será aberta escolha uma cor de fundo (clique no retângulo a direita do campocolor) e a imagem que deseja inserir (para isso clique no botão Choose File e escolha oarquivo da imagem). A cor de fundo ficará visível nas partes transparentes da imagem;

34

Page 36: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

5. clique em OK.

Para ver a imagem, volte para a aba Normal da barra de status.

4.3 3 - Links

ÂncorasUma âncora marca determinado local de uma página para que, posteriormente, quando o

leitor clicar em um link associado a ela, a página seja posicionada nesse local. Para inserir umaâncora em sua página, faça o seguinte:

1. posicione o cursor no local desejado para inserir a âncora;

2. clique no botão Anchor da barra de ferramentas;

3. na janela Named Anchor Properties dê um nome para âncora. É importante que não hajaduas ou mais âncoras com o mesmo nome.

LinksLinks são textos ou imagens que permitem a navegação nas páginas.Para transformar um texto em link faça o seguinte:

1. selecione o texto (de preferência com poucas palavras) a ser transformado em link e cliqueno botão link da barra de ferramentas;

2. será aberta a janela Link properties no campo Link Location;

(a) digite o endereço de e-mail e marque o campo ’The above is an email address’, nestecaso clicando sobre o link será aberto o cliente de email com o endereço do link;

(b) ou escolha uma das âncoras da lista que fica acima do botão Choose file;

(c) ou clique no botão Choose File e escolha um arquivo, assim quando clicar nesse linko arquivo escolhido será aberto;

(d) ou digite um endereço de uma página da internet;

3. clique em OK.

Para transformar uma figura em um link o procedimento é semelhante ao anterior, porém, aoinvés de selecionar um texto, clique sobre a figura a ser transformada em link e depois cliquesobre o botão link. Então, faça as partes 2) e 3) do procedimento anterior.

4.4 4 - Formulários

Os formulários permitem uma comunicação entre os visitantes da página e o servidor do site.

Inserindo Formulários

Para inserir um formulário, faça o seguinte:

1. Clique no botão Form da barra de ferramentas;

35

Page 37: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

2. na janela Form properties, que será aberta dê um nome ao formulário (em Form name),em Action URL digite o endereço do script para o qual os dados serão enviados. Escolha,então, o método pelo qual os dados serão enviados. Existem dois métodos: post e get. Ométodo post é usado na transferência de grande volume de dados, já o método get só podeser usado para transferência de até 128 caracteres;

3. clique em OK.

Após a inserção do formulário, você deve adicionar os campos, imagens, botões e demaiselementos que forem necessários a ele. Para isso, você deve, primeiramente, posicionar o cursorno local dentro do formulário (delimitado por um retângulo azul de linhas tracejadas) onde querque o elemento seja inserido, depois use o menu Insert -> Form ou clique sobre a seta à direita dobotão Form da barra de ferramentas. Na lista de seleção que aparece, escolha o tipo do elementoque deseja adicionar e preencha a janela que será aberta com as informações necessárias. Aseguir serão dados alguns exemplos de como inserir alguns elementos em um formulário.

Se você quiser adicionar uma imagem no seu formulário:

1. escolha a opção Form Image;

2. clique na aba location e em seguida no botão Choose File;

3. selecione o arquivo da imagem a ser inserida e clique em OK.

Caso queira inserir um campo para que seja digitada uma senha:

1. escolha a opção Form Field;

2. será aberta a janela Form Field Properties, em Field Type selecione o tipo Password;

3. em Field Name dê um nome ao campo;

4. clique em OK.

Para inserir uma lista de seleção:

1. escolha a opção Selection List;

2. no campo List Name, dê um nome à lista;

3. no campo Text, digite a primeira opção da sua lista e clique em Add Option;

4. repita o passo 3 até que todos os elementos da lista tenham sido inseridos;

5. clique em OK.

36

Page 38: Tutorial NVU

Capítulo 5

Lição 3

5.1 1 - Camadas

O Nvu permite que partes do texto, figuras ou outros elementos sejam transformados emcamadas. Dessa forma, esses elementos podem se movidos e sobrepostos. Para tranformar umelemento em uma camada, faça o seguite:

1. selecione um ou vários elementos que serão transformados em uma camada;

2. clique no botão:

da barra de formatação.

Para mover a camada, clique no pequeno quadrado com quatro setas acima da figura (desta-cado em vermelho) e arraste-a para o local que desejar.

Caso faça sobreposição de camadas, você pode escolher qual delas ficará sobre a outrausando os botões:

5.2 2 - Templates

Templates são páginas feitas com o objetivo de serem reutilizadas posteriormente. Os templa-tes facilitam a construção dos sites, porque a estrutura já foi projetada anteriormente, bastando,

37

Page 39: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

então, acrescentar o conteúdo da página. Dessa forma pode-se fazer várias páginas com amesma estrutura básica.

Para criar um novo template, faça o seguinte:

1. clique no menu File -> new;

2. marque a opção ’A blank template’;

3. clique em create.

Após criar seu template, edite normalmente a página, ou seja, adicione formulários, tabelas,figuras e demais elementos necessários. Você deve definir quais partes de sua página serãoeditáveis. Para isso, faça o seguinte:

1. clique na aba HTML tags da barra de modo de edição;

2. clique sobre a tag correspondente à área que será editável, uma da barra de status ficaráem negrito;

3. clique com o botão direito do mouse na tag em negrito;

4. posicione o cursor do mouse sobre Templates e clique em Make editable, será aberta ajanela Insert an editable área.

5. em area name digite um nome para a área;

6. se você quiser, marque uma ou mais das opções listadas em Options, descritas a seguir:Area is optional: será permitido que essa área seja deletada na página criada a partir dotemplate;Area is repeatable: será permitido que essa área seja duplicada na página criada a partirdo template;Area is movable: esta área será uma camada na página criada a partir do template.

7. depois de escolher as opções clique em OK.

Depois disso, salve o template:

38

Page 40: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

1. clique no menu file -> save as;

2. escolha um nome para seu tamplate e clique em OK e depois em Save.

O Nvu permite que páginas já existentes sejam transformadas em templates. Para transformarum documento em um template faça o seguinte:

1. abra o documento;

2. clique no menu Format -> Page Title And Properties;

3. marque a opção ’This page is a template’;

4. clique em OK;

5. clique no menu File -> Save as;

6. escolha um novo nome ou deixe com o nome antigo;

7. clique em Save.

Para criar uma página baseada em um template, faça o seguinte:

1. clique no menu File -> New;

2. marque a opção ’A new document based on a template’;

39

Page 41: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

3. clique no botão Choose File e escolha o template no qual a página será baseada;

4. clique em Create.

Agora modifique sua página editando ou adicionando o que for necessário.

5.3 3 - Estilos

Estilos definem como determinados elementos como títulos, tabelas ou parágrafos, da suapágina irão ser mostrados na tela. O editor de estilos do Nvu é chamado Cascade, ele é capazde criar estilos internos e externos.

É possível escolher os elementos aos quais os estilos serão aplicados, para isso usamosclasses, que são justamente estilos que podem ser aplicados nos locais que você escolher.

Estilos internos são um conjunto de regras que ficam na seção HEAD da página. Essasregras podem ser aplicadas a todos os elementos de determinado tipo ou a alguns deles (comofoi explicado sobre classes).

Estilos externos são econômicos, pois permitem que um mesmo estilo seja usado em váriossites. Nesse caso, é usado um link para uma página externa de estilo. Essas páginas de estilotambém contêm um conjunto de regras. Elas são um arquivo de texto com a extensão css.

Criação de estilos

Para abrir o Cascade, clique no menu Tools -> CSS editor, depois de abri-lo marque a op-ção expert mode. A diferença entre ’expert mode’ e ’beginner mode’ é que nesse último não épossível criar estilos externos.

Estilos InternosPara criar um estilo interno, faça o seguinte:

1. abra o Cascade;

40

Page 42: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

2. clique em ’style elt’ e em seguida em ’Stylesheet’;

3. clique em ’RULE’;

4. na aba General marque a opção ’Style applied to all elements of type’;

5. no campo de texto digite a tag correspondente ao elemento para o qual a regra será criada;

6. clique em ’Create style rule’.

Agora você deve informar como quer que seja a aparência do elemento que você escolheu.Para isso, siga os seguintes passos:

1. no retângulo branco do lado esquerdo da janela, clique na tag do elemento que você esco-lheu;

2. use as abas ’Text’, ’Background’, ’Border’ e etc para definir como você quer a aparênciadesse elemento;

3. depois de definir todos os atributos que desejar clique em Close.

ClassesPara criar uma classe, faça o seguinte:

1. abra o Cascade;

2. crie um estilo, da mesma forma explicada acima;

3. no retângulo do lado esquerdo da página clique sobre o estilo que você acabou de criar;

4. clique em Rule e marque a opção ’named style’;

5. digite um nome para sua classe;

6. clique em Create style rule, você verá que o nome da classe aparecerá no retângulo do ladoesquerdo precedido de um ponto.

41

Page 43: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

Para escolher como será a aparência dos elementos, proceda da mesma forma explicadaanteriormente.

Agora você deve escolher os elementos aos quais as regras da classe serão aplicadas. Então,faça o seguinte:

1. na barra de modo de edição escolha a aba HTML tags;

2. clique sobre a tag correspondente ao elemento ao qual a regra será aplicada, então, essatag será mostrada em negrito na barra de status;

3. na barra de status, clique com o botão direito do mouse na tag em negrito;

4. posicione o cursor do mouse sobre Classes, serão mostrados um ou mais nomes de clas-ses, escolha a classe que você acabou de criar.

Estilos ExternosPara criar um estilo externo faça o seguinte:

1. abra o Cascade;

2. marque a opção expert mode e clique em Style elt;

3. digite um título no campo title e clique em Create Stylesheet;

4. clique em Export Stylesheet and switch to exported version;

5. será aberta a janela Select a CSS file, digite um nome com a extensão css e clique em save;

6. na janela Stylesheets, clique em Rule e crie as regras da mesma forma que você fez nosestilos internos.

5.4 4 - Gereciador de site

O gerenciador de sites do Nvu, ilustrado abaixo, permite fácil navegação no seu site ou entresites.

42

Page 44: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

Se ele não estiver aparecendo, tecle em F9.Depois de criar sua página e abrir o gerenciador, faça o seguinte :

1. clique em Edit Sites, a janela Publish Settings será aberta;

43

Page 45: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

2. em Site Name digite um nome para o site;

3. clique no botão Select directory e selecione a pasta onde está o site;

4. clique em OK. O nome do site será mostrado no gereciador de sites. É possível adicionarvários sites no gerenciador. Para que um dos arquivos seja mostrado na área de edição dêum duplo clique sobre ele.

Na caixa drop-down na parte de cima do gereciador de sites, é possível escolher quais arqui-vos serão mostrados (documentos html, arquivos de imagens ou todos os arquivos).

Para adicionar um site remoto, faça o seguinte:

1. clique em Edit Sites, a janela Publish Settings será aberta, como no procedimento anterior;

2. em Site Name digite um nome para o site;

3. no campo Web site information digite o endereço da sua página;

4. no primeiro campo de Publishing server digite o endereço do seu servidor ftp;

5. em User name digite seu nome de usuário no servidor;

6. em Password digite sua senha, se quiser que a senha seja gravada para não ter que digitá-ladas próximas vezes marque a opção Save password;

7. clique em OK.

5.5 4 - Publicação do site

Instruções para publicação de seu site:primeiro, adicione o site que você quer publicar ao gerenciador de sites, como explicado na

página anterior. Então, clique no botão Publish

da barra de ferramentas. Será aberta a seguinte janela:

44

Page 46: Tutorial NVU

CDTC Centro de Difusão de Tecnologia e Conhecimento Brasil/DF

Faça o seguinte:

1. em site name, selecione o nome do site que você configurou anteriormente;

2. então os campos Page Title e Filename serão preenchidos automaticamente, verifique seestão corretos;

3. no campo Site subdirectory for tis page digite o nome do subdiretório do servidor noqual o site será adicionado;

4. se quiser marque a opção Include images and other files, esta opção serve para queseja feito o upload de estilos externos e das imagens da página;

5. se você fez o passo 4, então escolha entre as opções Use same location as page ouUse this site subdirctory;

6. clique em OK, será mostrada uma janela como esta:

45