Editor de páginas para Internet
Que programa usar?
Seamonkey Composer
Seamonkey é um conjunto de aplicativos para a internet, contando com: navegador de internet, leitor de emails e grupos de notícias, editor de HTML e catálogo de endereços.
O Seamonkey Composer é um editor de html. Transforma o documento em código html automaticamente, possibilitando assim a não-linearidade do documento.
Se você desejar instalar o Seamonkey Composer para Windows ou Linux, em português, entre na internet e vá para um dos seguintes endereços:
- http://l10n.mozilla.org/pt-BR/seamonkeybr/downloads.html
- http://baixaki.ig.com.br/download/SeaMonkey.htm
Abrindo o Seamonkey Composer
Para começar a usar esse programa, o procedimento é semelhante ao usado para o editor de texto: você deve clicar no botão APLICAÇÕES. Depois, é só escolher as opções CEDERJ e SEAMONKEY COMPOSER. Observe a figura
Começando a criar seu site
Sua primeira ação é criar uma pasta onde guardará tudo referente ao seu site, como imagens, textos, páginas criadas...
Formatação
O Composer, assim como outros editores, possui uma barra de ferramentas de formatação.
Para alterar o estilo do parágrafo e/ou cabeçalho, basta clicar sobre a seta da primeira ferramenta; uma caixa se abrirá. Nela há uma lista de opções de formatação. No exemplo, foi selecionado Corpo do texto.
Que tal experimentar as outras opções para ver como ficam os parágrafos? Escreva algumas linhas e mãos à obra! Experimente as outras opções de formatação: fonte, cores etc.
Salvando sua página
O procedimento para salvar uma página é semelhante ao do Editor de texto. A única diferença está no nome do arquivo.
Como o arquivo é uma página a ser publicada na Internet, alguns cuidados devem ser tomados: o nome do arquivo da página inicial deve se chamar index.html.
Após salvar o arquivo, surgirá uma janela pedindo que você escreva um título para a página. Esse título aparecerá na barra de título no canto superior esquerdo da tela do navegador, identificando a página em que o usuário está naquele momento.
O título é de sua livre escolha e sem restrições de formato. É preferível que tenha relação com o conteúdo da página, senão... pobre de quem visitar sua página.
Propriedades da página
Para modificar as propriedades da página no Composer, basta clicar em Formatar, na barra de menu, e depois em Título e propriedades da página.
Em propriedades da página, pode-se atribuir um título para a página, o nome do autor, além de uma descrição sobre o conteúdo da página.
Para modificar as cores do plano de fundo da página, basta clicar novamente em Formatar, na barra de menu, e depois em Cores e plano de fundo.
Na guia Utilizar cores personalizadas, é possível fazer as modificações indicadas a seguir:
- Texto normal: cor do texto.
- Texto do link (primeira opção): cor do texto do vínculo ou link.
- Texto do link ativo (segunda opção): cor do texto do vínculo quando está sendo selecionado.
- Texto do link visitado (terceira opção): cor do texto do vínculo que já foi visitado.
- No botão relativo a Plano de fundo, você pode escolher uma cor de fundo para a sua página.
- Para inserir uma figura no plano de fundo clique em Escolher Arquivo e depois na figura que você deseja colocar como plano de fundo; depois clique em Abrir.
Inserindo imagens
Para inserir imagens em sua página, o procedimento é bem parecido com o de inserir um fundo. Na barra de menus, escolha Inserir e depois Imagem.
Uma nova caixa de diálogo aparecerá. No campo Endereço da Imagem, você deve escrever o local onde se encontra a figura ou animação que você deseja inserir em sua página. Caso você não saiba, clique em Escolher Arquivo... e escolha a figura na sua pasta de imagens para a Internet. Você começa a ver aí a vantagem de ter todos os elementos da página reunidos na mesma pasta.
Inserindo Links
Assim como acontece com outras ferramentas, pode-se fazer um vínculo (link) de diferentes maneiras. Você deve primeiro selecionar a palavra ou figura que levará o leitor para outra página. Depois, utilizando o menu Inserir, escolha a opção Link.
Ao clicar em Link, aparecerá a seguinte janela:
No campo Texto do Link, digite o texto a ser exibido para o link. No campo Localização do Link digite o caminho para o arquivo ou o endereço eletrônico da página para a qual será feita a ligação. Se você não souber esse caminho, clique em Escolher Arquivo... e procure a página que servirá de destino para a ligação que está sendo criada.
Como se faz uma âncora com nome?
Utilizando o menu Inserir, clique em Âncora com nome...
Você pode também criar vínculos para a mesma página. Neste caso, a palavra selecionada para ser o vínculo, quando clicada, leva para outro local dentro da mesma página (destino). Isso facilita a navegação por textos mais longos ou quando a estrutura da página foi montada com um menu, com vários itens desenvolvidos.
Para inserir um destino, comece pelo destino! Isso quer dizer que você vai colocar o marcador de destino no local para o qual se fará a ligação: coloque o cursor em frente à palavra ou à frase que será o destino e escolha no menu Inserir, Âncora com nome... Uma janela surgirá pedindo que você escolha um nome de referência para esse destino. Neste exemplo, a palavra será agenda.
Escolha um nome curto, sem espaços entre as palavras, sem acentos ou cedilhas, mas que facilite a identificação do destino. Um marcador surgirá onde o cursor estava.
Depois vá para o local do texto onde será a origem do vínculo. Proceda como se fosse criar um vínculo para outra página. Veja a figura a seguir:
No campo Localização do Link, surgirá a lista de todos os destinos criados naquela página. No nosso caso, haverá somente um "#agenda". O nome do destino vem sempre antecedido do símbolo #.
Pronto! Clique em OK e seu vínculo estará concluído.
Como saber se a página está do jeito que você imaginou?
Você pode, a qualquer momento, visualizar sua página no navegador para ver como ela ficará na Internet ou para testar se os vínculos estão funcionando. É necessário que você salve a sua página antes de visualizá-la.
Próximo à Barra de Status está a Barra de ferramentas do modo de edição. Nela temos uma guia chamada Pré-visualização. Ao clicar aí, o navegador permite a simulação da navegação pela página que você está criando.
Dessa forma, você pode testar e verificar como está ficando sua página.
Criando um site com "menu fixo"
Você já deve ter observado que a maioria das páginas na Internet possui um índice que dá acesso ao conteúdo do site. Geralmente esses sites são feitos com uma ferramenta chamada Moldura.
Os editores mais poderosos - como o Dreamweaver, da Macromedia - oferecem ferramentas para facilitar a construção desses menus. Os editores de html gratuitos não apresentam essa facilidade, mas existe uma maneira de fazer a mesma apresentação visual utilizando tabelas!
Você verá um exemplo de como fazer isso. Na verdade você terá uma página básica em que todas as células se repetem, exceto a de conteúdo. As células de título e menus são fixas!
Grave o exemplo em seu computador e o abra no seu editor de html.
Estude como foi montado o site e aproveite a idéia para o seu! Você pode escolher entre montar um site com menu à esquerda ou no topo... use criatividade e imaginação.
Clique aqui para baixar o exemplo: