16
eletrônicos 5 Criação e publicação de páginas na Internet C C C C C ADERNOS

Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

Embed Size (px)

Citation preview

Page 1: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CADERNOS ELETRÔNICOS 5 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET

eletrônicos

5Criação epublicação depáginas na Internet

CCCCCADERNOS

Page 2: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 52

Programa Acessa São PauloO Programa Acessa SP é uma iniciativa

do Governo do Estado de São Paulo e temcomo objetivo combater a exclusão digital,levando os recursos da Internet à populaçãode baixa renda, estimulando o desenvolvimentodas comunidades.

Para isso o Governo do Estado criou osInfocentros, espaços com acesso gratuito àInternet. Existem três tipos de Infocentros: osInfocentros Comunitários, criados em parceriacom entidades comunitárias (associações demoradores, amigos de bairro etc.); osInfocentros Municipais, criados em parceria comprefeituras paulistas; e os Postos Públicos deAcesso à Internet, criados em parceria comórgãos do próprio Governo do Estado em quehá grande fluxo de população.

Para facilitar o uso dos equipamentos,os usuários contam com monitores treinadose comprometidos com o projeto para auxiliá-los. Esses monitores são capacitados paraatender às necessidades específicas de cadausuário. Também são responsáveis pelagestão dos Infocentros.

Outra preocupaçãodo Acessa é a oferta deconteúdo relevante para opúblico-alvo assim como oestímulo à criação deconteúdo por parte dacomunidade. Assim, os Infocentros tambémfuncionam como centros de informação eserviços voltados para o desenvolvimentocomunitário, possibilitando acesso àsinformações nas áreas de saúde, educação,negócios e serviços governamentais disponíveisna Internet etc. Para isso desenvolvemosprodutos como os MiniCursos Acessa SãoPaulo, a parceria Acessa/WebAula, Dicionáriosde LIBRAS e a Rede de Projetos.

As comunidades providas de umInfocentro são estimuladas a desenvolveremprojetos e atividades que utilizem os recursosda tecnologia de forma criativa e educativa. Paraisso foi criado o portal na Internet, para que osusuários dos Infocentros possam disponibilizarconteúdos elaborados pela comunidade eassim produzir conhecimentos próprios.

Os Cadernos Eletrônicos foram desenvolvidos pelo Centro de Inclusão Digital e Educação Comunitária da Escola do Futuro da USP (CIDEC) para o Programa AcessaSão Paulo do Governo do Estado de São Paulo, por meio de sua Secretaria da Casa Civil. A reprodução parcial ou integral deste caderno é permitida e estimulada somentepara fins não comerciais e mediante citação da fonte. Maio/2003

ExpedienteADERNOSC eletrônicos

Escola do Futuro - USPTel.: (11) 3091-6366/3091-9107 e-mail: [email protected]

Av. Profº. Lucio Martins Rodrigues, Trav. 4 - Bloco 18 -CEP 05508-900 São Paulo/SP

Programa Acessa São PauloGovernador: Geraldo AlckminSecretaria de Estado da Casa Civil: Arnaldo MadeiraDiretor-Presidente da Imprensa Oficial: Hubert AlquéresCoordenador do Núcleo de Projetos Institucionais: ÉmersonBento PereiraCoordenador do Programa Acessa São Paulo: FernandoGuarnieriEquipe do Programa Acessa São Paulo: Alan Nicoliche daSilva, Alexandre Geraldi, Felipe Borgognoni, Flávia Brandão,Gílson Bevilacqua, Gisele Fabris dos Reis, Key Farias,Leandro Benetti, Michele Karine Damasco Silva, NeideNovaes, Ricardo Mallet, Silvana MaiéskiPortal do Acessa São Paulo: www.acessasaopaulo.sp.gov.br

Cadernos EletrônicosReitor: Adolpho José MelfiVice-Reitor: Hélio Nogueira da CruzPró-Reitor de Pesquisa: Luiz Nunes de OliveiraSupervisão Científica: Fredric M. LittoCoordenação Editorial e Pedagógica: Carlos SeabraCoordenação de Produção: Drica Guzzi e Akira ShigemoriRoteiro, Pesquisa e Redação: Maria da Conceição C. OliveiraProjeto Gráfico/DTP: Ronald Chira e Ludimyla RussoWeb Designer: Daniela MatieloIlustração da Capa: Francisco Sá Godinho (Kiko)Revisão: Bete AbreuColaboradores: Alda Ribeiro, Nilson G. S. JúniorCadernos Eletrônicos: www.cidec.futuro.usp.br/cadernos

Programa Acessa São PauloTel.: (11) 6099-9579/6099-9641 e-mail: [email protected]

Rua da Mooca, 1921, MoocaCEP 03103-902 São Paulo/SP

Page 3: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CADERNOS ELETRÔNICOS 5 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET 3

A Internet pode ser um veículo de educação, lazer, trabalho, fonte de renda,pesquisa, informação, organização, mobilização etc. Tudo depende da forma comoutilizamos a rede. Por exemplo: se tivermos conhecimento de algo que interessa amuitas pessoas, dispostas a pagar para adquiri-lo, podemos cobrar para ensiná-laspor meio de um curso online. Podemos também publicar nossas idéias na defesa dealguma causa ou grupo ou apenas registrar nossas angústias e felicidades em umdiário digital.

A Internet é o único veículo pelo qual podemos, sem pagar nada, publicar nossaprodução. Para isso basta ter acesso a um computador ligado à rede e aprenderalguns passos para criar uma página pessoal.

Neste caderno você conhecerá algumas ferramentas que estão disponíveis parafazer e publicar seu website. Você aprenderá a selecionar o material e como organizá-lo para publicação. Saberá como fazer páginas online e obterá dicas de como usareditores offline. Verá como é fácil hospedar suas páginas em servidores gratuitos.Conhecerá um pouco sobre a linguagem com a qual se “escreve” a imensa maioria daspáginas na web. Descobrirá que quando editamos uma página offline precisamos deum aplicativo chamado FTP para transferir nossos arquivos para o servidor em que ahospedamos. Também saberá como criar e organizar links em sua homepage eaprenderá algumas estratégias fundamentais para divulgar seu website. Descobriráo que é um blog e como você pode montar o seu.

Ao final você encontrará sugestões de remissão entre os cadernos eletrônicosrelacionados, uma seção onde encontrar links para downloads de programas freewareou para cursos oferecidos online. Há também um glossário com os principais termos dainformática e da Internet utilizados neste caderno.

Vamos começar?

Introdução

ÍndiceSelecionando e organizando o conteúdo de seu primeiro site....................................................

HTML e a linguagem de rede...........................................................................................................

Como fazer páginas online e offline................................................................................................

Design gráfico: cuidados com o visual do site..............................................................................

O que evitar no visual do seu site.....................................................................................................

Hospedagem de páginas................................................................................................................

Colocando seu site no ar com FTP..................................................................................................

Sobre registros de domínio e escolha dos nomes de subdomínios............................................

Divulgar é preciso, apareça!.............................................................................................................

O que é e como montar um blog.....................................................................................................

4

5

7

8

8

9

10

10

11

12

13

14

1.

2.

3.

4.

5.

6.

7.

8.

9.

10.

Remissão entre cadernos e links na Internet.......................................................................................

Glossário...................................................................................................................................................

Page 4: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 54

1 Selecionando e organi-zando o conteúdo deseu primeiro site

Um exemplo bem-humorado de página sobre dietas paramanter, ganhar ou perder peso.

Algumas pessoas de sua comunidade têm umasérie de materiais históricos como fotos antigas eoutros documentos que seria muito interessante queos moradores do bairro vissem?

Você gostaria de criar um jornal ou uma revista

No Infocentro Associação Popular de Saúde, em São Paulo-SP, monitores e usuários criaram um jornal online com temasinteressantes para o público jovem da comunidade.

Enfim, para tudo isso e para qualquer outraidéia que você tenha e queira tornar pública, umadas melhores maneiras de atingir seu objetivo éconstruir uma homepage.

Comece sua empreitada navegando um poucopela rede, apreciando websites de categoriassemelhantes ao tema que você deseja publicar(família, cultura, arte etc.). Assim, você poderá ter boasidéias para desenvolver seu próprio site ou o de suacomunidade. Faça isso por meio dos sites sugeridosem matérias na imprensa, indicados por amigos, oupesquisando em bons sites de busca com a palavra-chave do tema que deseja desenvolver.

O passo seguinte é organizar o material eselecionar aquilo que você deseja publicar online.É importante que você seja criterioso nessaseleção, pois esse material poderá ser visto pormilhões de visitantes. Informações erradas em umsite podem criar muitos transtornos e abalar toda acredibilidade de quem coletou as informações.Certifique-se de que os conteúdos são de fontesreconhecidamente confiáveis.

Como FazerPassos para construir sua

homepage:1. Navegue, pesquise, observediferentes modelos de websites.2. Selecione, prepare e organize oconteúdo do material para seuwebsite.3. Escolha um provedor que forneçaeditores online e hospedagemgratuita.4. Divulgue seu website.

Você tem uma série de crônicas familiaresque acha que valem a pena ser lidas por outras

pessoas?

Muitas pessoas desejam compartilhar eventos significativosda vida familiar. Isso é possível por meio de uma homepage.

Você conhece várias receitas de pratos simples,saborosos e de baixo custo que gostaria decompartilhar? Você deseja simplesmente disponibilizarseu currículo online para aumentar suas chances deencontrar um trabalho?

para divulgar tais materiais, assim como outroseventos do seu bairro?

Page 5: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CADERNOS ELETRÔNICOS 5 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET

Na fase de preparo do material para apublicação, avalie: há textos para serem digitados,revisados? Há fotos para serem digitalizadas? Vocêdeseja disponibilizar arquivos sonoros?

Nesta etapa de produção você deve consideraralguns aspectos como, por exemplo, o tamanho dosarquivos que disponibilizará em seu site. Quantomaiores esses arquivos mais tempo levará para quesua página possa ser carregada no browser para servista pelos visitantes. Páginas que demoram para abrirou não carregam rapidamente costumam irritar osinternautas que acabam por abandonar a visita.

Todas as etapas anteriores são fundamentaispara que você possa poupar tempo e conseguirestruturar uma página leve, objetiva, organizada, clara,atraente para a navegação e com outras qualidadesque um bom website deve ter. Agora vamos conhecerum pouco da linguagem e das ferramentas disponíveisna rede para que você possa construir seu site.

Antigamente para se fazer uma página naInternet era preciso saber um pouco de linguagemde marcação, ou HTML, ou contratar os serviçosde um webdesigner. Atualmente, vários servidoresoferecem editores online para que os usuáriospossam criar suas páginas na web sem precisarter qualquer conhecimento dessa linguagem.Entretanto, HTML é ainda a linguagem mais utilizadapara confeccionar páginas. Por isso, neste tópicovamos conhecer um pouquinho sobre seus códigos.

HTML é a sigla de “Hyper-Text MarkupLanguage”, que quer dizer: “Linguagem deMarcação para Hiper-Texto”. De forma bastantesintética poderíamos dizer que um hipertexto équalquer documento que se vincula a outrosdocumentos, criando referências entre si. Essasreferências e outras características de formatação;como tamanho e forma da fonte, alinhamento dotexto, divisão de parágrafos; são todas criadas pormeio de comandos de marcação, colocados emlocais específicos do texto principal.

2 HTML e alinguagem de rede

DicaNão coloque todo o material

que tem ou que deseja disponibilizarde uma única vez no ar. É interessanteque você planeje atualizações de seusite, definindo uma periodicidadepara fazê-las. Deixe um aviso paraseus visitantes sobre essaperiodicidade, ou crie um cadastropara avisá-los por e-mail sobre asatualizações. Não deixe o site muitotempo sem novidades eatualizações, caso contrário o públiconão retornará a ele.

É bom saberO termo hipertexto foi usado

pela primeira vez por Theodor H.Nelson nos anos sessenta paraexprimir a idéia de escrita e leituranão-linear em um sistema deinformática. Exemplificando: quandovocê está navegando em umapágina da Internet, dentro dela vocêencontra diversos links que seconectam entre si. Com um clique domouse nesses links, você pode ouvirum som, ver uma imagem ou assistira uma animação. Dessa forma aleitura deixa de ser linear. Entre essesblocos vinculados pelos links você tema liberdade de escolher várioscaminhos de leitura. Em outraspalavras, a web é um grandeconjunto de fragmentos deinformação que se vinculam entre si.

Jornal Comunitário online da Associação de Moradores doJardim 9 de Julho, desenvolvido para contar a história do Jardim9 de Julho.

5

Page 6: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5

6

Os comandos de marcação recebem o nomede marcas, embora seu nome mais popular seja aversão em inglês “tag”. Marcações ou tags sãoqualquer tipo de convenção de texto que diga aonavegador como se comportar a partir daqueleponto. Em HTML, assim como em todas as outraslinguagens de marcação, esse princípio básico éobedecido. Em HTML, as tags vêm envolvidas entreos sinais de maior e menor que (<>). Por exemplo:se no decorrer de um texto, você deseja que umaou mais palavras sejam realçadas em negrito, vocêcolocará uma ou mais palavras dentro da marcação<b> palavra ou palavras </b> (b vem de Bold, negritoem inglês).

Tags de negrito e itálico criadas em um bloco de notassalvo como arquivo .html.

Ao lado você podever o resultado ao abrir estearquivo no navegador.

A HTML, geralmente,serve de base para todas asoutras linguagens demarcação.

Como fazerTodos os editores de HTML

possuem recursos para a geração delinks em sua página de forma rápidae intuitiva. Na ausência de um desseseditores, você pode editar diretamenteo HTML introduzindo uma tagchamada HREF. Uma tag HREF éconstruída da seguinte forma:<A HREF=“http://[endereço destino do link]”>Texto explicativo para o link </A>.Um exemplo de um link codificadodiretamente em HTML é:<A HREF = “http://www.funasa.gov.br”>Fundação Nacional de Saúde </A>.

6

O ALT é uma tag do código HTML para criarlegendas para as imagens do site. Quandoposicionamos o cursor do mouse sobre umaimagem, surge uma caixinha, com um texto,descrevendo a imagem que é apresentada ouquando se desabilita o carregamento de imagensem browsers gráficos. É recomendável que estejasempre presente.

As homepages que incluem imagens comos textos ALT são benéficas para um melhorentendimento da imagem e principalmente parausuários com deficiência visual. Pessoas comdeficiência visual utilizam softwares especiais quepossuem uma voz artificial que lê o que está escritona tela para o internauta, inclusive o que estiver emALT. Infelizmente, muitas homepages ainda nãofornecem esse tipo de recurso.

Exercício de uma imagem com o comando ALT feito nobloco de notas. Repare no texto escrito entre as aspas.

No browser, a mesma frase aparece em uma caixa quandoposicionamos o mouse em cima da imagem.

DicaPara se visualizar o código HTML

de uma página, clique com o botãoesquerdo do mouse e escolha a opção“Exibir Código Fonte”. Observando ocódigo você aprenderá mais sobreHTML. Foi assim que muitas pessoascomeçaram.

Page 7: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CADERNOS ELETRÔNICOS 5 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET

3 Como fazer páginasonline e offline

Em qualquer computador é possívelconfeccionar páginas da web, pois até mesmo obloco de notas do Windows pode ser utilizado paracriar uma página, utilizando a linguagem HTML.

Como fazer

Experimente! Abra um blocode notas e escreva algum textoutilizando algumas tags como:<HTML> Início do Documento<HEAD> Início do Cabeçalho<BR> Quebra de Linha<B> Bold, negrito<I> Itálico<BODY> Início do Corpo do Texto daPágina</BODY> Fim do Texto da Página</HTML> Fim do DocumentoSalve o bloco de notas com aextensão .html, depois visualize emum browser como ficou suaformatação.

A maioria dos servidores que oferecemeditores online e hospedagem requer do usuário aescolha de uma categoria para inserir o site quedeseja construir e hospedar. Feita essa escolha,basta seguir as instruções dos editores online.

Você também pode editar suas páginas semestar conectado à rede. Para isso, é necessário quevocê tenha instalado em seu micro algum programaeditor de HTML. O Windows, por exemplo, ofereceo Microsoft FrontPage.

Depois de prontas, a transferência de suaspáginas e arquivos para o servidor que irá hospedá-las deve ser feita com um aplicativo de FTP, comoveremos adiante.

Esses são alguns dos recursos oferecidos pelo Kit.net epelo Bol, disponíveis em Língua Portuguesa.

Para tornar esse processo mais fácil e menostedioso, alguns programadores criaram softwaresque, a partir desses modelos já consagrados,permitem que alteremos apenas alguns elementos,sem necessariamente editarmos por completo umapágina. Esses programas, os chamados editores deHTML online, com apenas alguns cliques de mouseoferecem várias soluções para a confecção depáginas. Com eles, podemos escolher um modelopadrão, configurar as cores, fontes, imagens e itensafins, liberando-se de ter de dominar todos os códigospara confecção de páginas, podendo preocupar-seapenas com o conteúdo.

Já existe na rede, em Língua Portuguesa, umasérie de servidores que oferece esses editores paraa criação de homepages. Esses servidoresdisponibilizam editores de HTML com instruçõespasso-a-passo para quem não conhece essalinguagem.

Dica

Há uma série de bons editoresde HTML gratuitos e alguns emLíngua Portuguesa que permitemque você edite suas páginas emmodo offline, como o Bragasoft VisualHTML e o Fast HTML. Existe ainda oMAX’s HTML Beauty, o HotDogProfessional e o Bask HTML. Consultea seção “Links na Internet” parasaber onde adquirir esses aplicativos.

7

Page 8: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 58

4 Design gráfico:cuidados com o visualdo site

O visual (também chamado pelosprofissionais de “design”) do seu site deve ajudarchamando a atenção do usuário para os elementosmais importantes da página. É preciso tomar algunscuidados com a cara do site para facilitar a suavisualização e leitura. Homepages com um aspectomal elaborado não estimulam a sua visitação e nemo retorno dos internautas.

Ao utilizar imagens para ilustrar o conteúdo,você pode aprimorar bastante uma homepage. Poroutro lado, as imagens podem congestionar aestrutura e retardar os tempos de download. Assim,é importante usá-las criteriosamente e editá-las paraa web. De forma semelhante, a animação com umobjetivo pode aperfeiçoar o conteúdo online, mas éimportante permitir que os usuários decidam sedesejam ver uma introdução animada ou pulardiretamente para o conteúdo de seu site. Para isso,você deve oferecer um método fácil e destacadopara desativá-la.

Dica

Limite os estilos de fonte eoutros atributos de formação detexto, como tamanhos, cores, etc. napágina, porque o texto com um visualmuito pesado pode se desviar dosignificado das palavras e até serconfundido com anúncios publicitários.

É importante usar texto com contraste e coresde plano de fundo, para que os caracteres fiquem omais legível possível. Se o fundo da tela for escuro,as letras devem estar em cores claras. Assim ocontraste fica mais evidente e mais fácil de ler.

As informações mais importantes da páginadevem estar visíveis “acima da dobra” (na primeiratela de conteúdo, sem rolar), pois muitas vezes ousuário não percebe que há mais informações para“abaixo da dobra” e acaba não interagindo com esseconteúdo. O que é importante precisa ser mostradologo no início.

Um outro cuidado que se deve tomar é coma quantidade de texto. As pessoas que utilizam aInternet geralmente não têm muito tempo disponível

para ler textos longos. Por essa razão, orecomendável é escrever somente o necessário.Isso não significa que não se pode ter textos grandesna Internet. No caso de artigos com muito texto, omais indicado é que eles sejam distribuídos napágina de forma uniforme, para que seja fácilimprimir. Longos textos são melhores de seremlidos impressos em papel, além de poupar energiaelétrica e tempo de conexão com a linha telefônica.

Cada caso é um caso e deve ser estudadopara cada objetivo que se quer atingir. Alguns sitespodem precisar de mais espaço se o conteúdo foraltamente visual. Outros sites podem funcionarmelhor sem imagem alguma. A receita aqui é vocêsaber o que quer informar e qual é a melhor maneirade fazê-lo.

5 O que evitar novisual do seu site

No portal do Acessa SP, as notícias mais recentes estãono alto da tela para chamar a atenção do leitor.

Navegando pela Internet você deve encontrarmuitos sites que não lhe agradam por causa dovisual, embora não saiba exatamente por que vocênão gostou. Vamos ver alguns aspectos que devemser evitados ao se fazer um site para que você nãocometa erros e também saiba como identificar asfalhas dos sites de que não gostou. Vamos usarcomo exemplo um site que foi desenvolvido porBruno Ávila justamente para ilustrar o que não deveser feito. O site está disponível no endereçowww.brunoavila.com.br/artigo-19-03-03.htm.

Segundo o criador da página do exemplo, oprimeiro cuidado é com a cor de fundo em conflitocom a cor da fonte (letras). O fundo xadrez dificultaa leitura do que está escrito principalmente porque

Page 9: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CADERNOS ELETRÔNICOS 5 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET 9

6 Hospedagemde páginas

Já vimos que é simples e barato fazer páginasde Internet e que elas podem servir para as maisdiversas finalidades. Entretanto, para que cumpramcom seus propósitos, elas devem estar hospedadasem algum lugar no qual possam ser vistas por outrosusuários. Usualmente, “hospedar” uma página ou siteequivale ao ato de se “contratar” os serviços de umservidor que fornecerá o endereço lógico para que apágina possa ser visualizada, acessada por você eoutras pessoas que assim desejarem.

Há servidores que oferecem editores onlinepara a confecção de páginas pessoais e também

Dica

Quando for escolher umservidor para hospedar o seu site,avalie: o espaço em disco oferecido;se ele tem acesso via FTP e se ofereceferramentas online de editoração eserviços adicionais, como suporte aASP, PHP, bancos de dados etc.

a letra está na cor branca. O ideal seria que o fundoestivesse em uma cor apenas, de preferêncianeutra, como branco ou em tons mais claros comletras em cores escuras. Ou então o inverso, comum fundo de uma cor mais escura, preto porexemplo, e o texto escrito com letras brancas paraaumentar o contraste.

Um outro cuidado é com o estilo do menu,que é o índice das seções que existem no site.Comparando um pouco com um livro, as seçõessão como os capítulos. É importante que o visualdo menu não seja muito diferente do estilo de todoo site. As cores e o tipo de fonte devem seguir opadrão do site. No exemplo utilizado, a cor do menunão poderia estar com um fundo verde e com umaletra de tamanho tão grande. O estilo de fonte usadotambém deveria ser menos chamativo. O menudeve ser discreto, pois o principal é o conteúdo queestá por trás dos links que o menu contém.

Seguindo esse cuidado do que chamar aatenção, não se deve inserir elementos demais. Noexemplo de site, o excesso de figuras, como atesoura cortando a fita, acabou poluindo o visual,pois desviou a atenção para ela. É preciso usaresses elementos para destacar o que é importante.Imagens que não estão diretamente ligadas aoconteúdo do site não devem aparecer.

Como foi dito no tópico anterior, não se deveabusar das animações. Se você visitar o site deexemplo, verá que o desenho animado imitando aplaca de trânsito que representa site em construçãoestá exagerado.

Além disso, caso todo o conteúdo da páginanão esteja totalmente pronto, o mais indicado é nãopublicar. Links ou avisos de que a página ainda estáem construção frustram o internauta. Dificilmenteele voltará para verificar se o site já está pronto.Provavelmente ele não voltará nunca mais.

Site criado especialmente para ilustrar o que não fazer novisual da página.

DicaAntes de começar a desenhar

seu site no computador, faça umrascunho, no papel, usando lápis oucanetas. Esse exercício vai ajudar adecidir como a página seráorganizada, como os textos serãodistribuídos, onde irão as imagens equais recursos visuais serão utilizados.Se desejar, mostre esse rascunho aoutras pessoas para perguntar oque elas acham.

Por fim, o recomendado é navegar bastantepela Internet, procurar sites que você gosta visual-mente e entender quais são as características queagradam e poderiam ser adotadas em seu site.Quanto mais referências você tiver, melhor.

Page 10: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 510

7 Colocando seu siteno ar com FTP

No tópico anterior você aprendeu que, depoisde contratado um serviço de hospedagem, épossível enviar material para o seu site,disponibilizando-o para que outros usuários possamvisitá-lo. Esse envio de arquivos pode ser feito pormeio de uma ferramenta específica do servidor quehospeda o seu site, ou por meio de FTP.

Mas o que é FTP? Você já sabe que a siglasignifica “File Transfer Protocol” (Protocolo ParaTransferência de Arquivos). O FTP foi a soluçãoencontrada, desde os tempos mais remotos daInternet, para possibilitar a cópia de arquivos entrecomputadores espalhados pelo mundo,independente das características das redesencontradas pelo caminho.

Para utilizar o FTP, primeiramente énecessário dispor de um software específico. Oscomputadores equipados com Windows podemutilizar o Windows Explorer para fazer atualizaçõesde sites. Mas existem outros aplicativos de FTPdisponíveis no mercado e alguns são versõesshareware como o FTPPro.

8 Sobre registros de domí-nio e escolha dos nomesde subdomínios

Um domínio é simplesmente o nome dado aum site da Internet, o nome que digitamos quandoqueremos entrar nesse site. Exemplos de domíniossão “kico.com.br”, “abrinq.org.br” ou “brasil.gov.br”.

Para que um domínio se torne de conhecimento

É bom saber

Cada domínio é composto detrês partes principais:1: O nome da organização detentorado domínio, que pode ser o seu nomereal ou, mais freqüentemente, umnome de fantasia. Em“embratel.com.br”, por exemplo,embratel representa o nome daorganização.2: O nome de domínio correspondeao tipo de organização envolvida.Existem inúmeros tipos deorganizações admitidos e o maiscomum é o “com”, que abrangeorganizações comerciais. O “org” querepresenta organizações não-governamentais (as ONGs), o “edu”representa as educacionais e o “gov”engloba todos os órgãos dosgovernos. Por exemplo, o site“terceirosetor.org.br” representa umaONG, dado o seu sufixo.3ª: Essa última parte do nome dedomínio representa o país. Assim,“chicobuarque.com.br” indica um sitecom registro de domínio no Brasil;“sapo.pt” representa um siteregistrado em Portugal e “fbi.gov”indica um site do governo dosEstados Unidos. Quando omitido,indica que o site esta registrado nosEstados Unidos.

hospedagem gratuita para essas páginas. Há outrosque, embora não ofereçam os editores, prestamserviços de hospedagem gratuita.

Alguns servidores limitam o tráfego mensal dedados. Tráfego mensal é a soma de todas asinformações enviadas aos seus visitantes durante ummês. Cada página visualizada, cada imagem ou foto,ainda que seja uma simples figura de canto de tela,representa uma informação nova que o servidor estáenviando ao browser e tem um peso, que é medidoem Kbytes. Se a homepage que você deseja criarterá muitas imagens, dê preferência a um servidorque não tenha esse tipo de limitação.

Feita a escolha do servidor para hospedagemde seu site, basta “contratar” o serviço. Geralmenteisso é feito por meio do preenchimento de umformulário em uma página que solicita diversos dados,entre eles um nome de usuário e senha para acessoa seu espaço de armazenamento.

Definidas todas essas informações, geralmenteo servidor envia um e-mail para confirmação docadastro e ativação de sua conta. Basta seguir ospassos descritos nesse e-mail e pronto: você terá umespaço de hospedagem para seu site.

Page 11: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CADERNOS ELETRÔNICOS 5 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET 11

9 Divulgar é preciso,apareça!

Divulgar suas páginas na rede é, talvez, aparte mais simples do trabalho, mas é essencialpara que sua produção possa ser vista, lida eapreciada. Normalmente, basta fazer um cadastrodo seu site nos mecanismos de busca por meio dopreenchimento de um formulário em que vocêindicará com algumas palavras-chaves o tipo deinformação contida em sua página, em que categoriao seu site se enquadra, o endereço de seu site, seue-mail e eventualmente o nome do responsável.

Às vezes esses mecanismos de buscasolicitam que você coloque marcações específicasem seu site (eles fornecem as instruções para quevocê faça isso) de modo que os mecanismos debusca possam reordenar mais facilmente seuscadastros. No final deste caderno, veja uma listade alguns endereços de mecanismo de busca noqual você pode cadastrar o seu site.

Uma outra forma muito eficiente de se divulgarpáginas é por meio da participação em anéis, eminglês “rings”. Rings são servidores que cadastramsites de uma determinada categoria de conteúdocomum e apresentam links ou anúncios em todosos outros sites componentes. Assim, quando umvisitante tem acesso a um dos sites do anel, podenavegar para o site seguinte ou anterior e aindasolicitar, aleatoriamente, um outro site, dentre ossites participantes do anel.

Uma maneira mais cara de se divulgar sitesé com banners. Banners nada mais são do queespaços reservados para propaganda em sites demuito acesso, exibidos de maneira aleatória, cujafinalidade é anunciar seu site. Entretanto, o uso debanners como recurso de divulgação normalmenteé restrito a sites comerciais, dado ao alto custo eao retorno pouco garantido. São poucos internautasque se interessam pelos banners e clicam nelespara ver seu conteúdo.

Exemplo de como divulgar sua homepage, neste casousando o geocities.

O Anel de Poesia é um dos maiores webrings em LínguaPortuguesa.

público, ele deverá ser “registrado” junto aos órgãosreguladores da Internet em um país. No Brasil, essepapel regulador é exercido pela FAPESP (Fundaçãode Amparo à Pesquisa do Estado de São Paulo). AFAPESP disponibiliza um site no qual é possívelfazer o registro de todos os domínios que têm osufixo “br”. Esse site é o www.registro.br. É sempreválido lembrar que o registro não é gratuito. Umataxa anual é cobrada pela FAPESP à empresa,pessoa ou organização.

A única finalidade do registro de um site égarantir sua unicidade dentro da Internet. Os órgãosreguladores como a FAPESP agem, neste contexto,no sentido de impedir que duas pessoas ouempresas façam o registro do mesmo nome dedomínio.

Subdomínios são oferecidos por provedorespara seus usuários ou pelos servidores queoferecem editores online ou hospedagem gratuitade site. Para ter um subdomínio você não precisaefetuar nenhum registro na FAPESP, basta tercriatividade e escolher um nome que representebem o conteúdo do seu site. Endereços comowww.infocentrodombosco.hpg.ig.com.br sãoexemplos de subdomínios grátis.

Page 12: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5

Além dos editores online você pode criar edisponibilizar uma página na rede no formato de blog.

Os blogs foram criados para possibilitar apublicação de diários na Internet, mas a propostainicial se transformou bastante. Hoje, além de exporas confissões e os segredos adolescentes, elesfuncionam como verdadeiros Zines (pequenosjornais), nos quais pessoas comuns expõemopiniões e recebem comentários em tempo integral.Os blogs também são usados como meio deprotesto, denúncia e pedido de auxílio: nos EstadosUnidos, um sem-teto do Tennessee acessa aInternet de uma biblioteca pública e relata em seublog o dia-a-dia de quem vive nas ruas!

Blog produzido e administrado por monitores e usuáriosdo Infocentro Pétalas de Amor, São Paulo, Capital.

Quando os blogs surgiram na década de 1990,a idéia inicial era disponibilizar os diários em formade páginas de Internet, preservando o anonimato,quando desejado. Entretanto, editar páginas para apublicação de um diário era um processo morosoque não justificava a relação custo e benefício de taloperação. Foi nesse momento que surgiram osprimeiros servidores a oferecer utilitários onlinecapazes de editar páginas de maneira rápida ebastante fácil. O sucesso de tal iniciativa foi tantoque vários serviços de blog pipocaram pela rede ecresceram exponencialmente.

Por meio de uma homepage ou de um blog,autores potenciais, mas sem apoio institucional oudo marketing tradicional, podem, sem custo algum,tornar-se conhecidos por milhares de pessoas. Essapossibilidade é bem mais remota se o mesmo autor

Depois de realizar os rituais de “batismo” deseu blog, ou seja, após criar uma conta de blog comnome válido, escolher um estilo para ele e acategoria a que ele pertence, você pode começar aenviar conteúdo para ser publicado no endereço deseu blog. Essa é uma tarefa bem fácil.

Observe os botões que simplificam asfunções mais usuais de formatação de texto, bemcomo de inserção de imagens e outras no exemplodo blog a seguir:

Seu blog precisará de um nome (subdomínio), que lhe serárequisitado no momento do cadastramento da sua conta,como exemplificado nesta imagem, no Blig.

10 O que é e comomontar um blog

necessitasse de livros impressos para publicar seutrabalho, pois o custo de edição, publicação,divulgação e distribuição é bastante elevado.

Se você deseja criar seu próprio blog, faça umapesquisa em um bom site de busca. Ao digitar a palavra-chave blog no campo de pesquisa, aparecerá uma listacom uma infinidade de servidores que colocam à suadisposição o utilitário para edição e publicação de blogs.Navegue por esses sites e avalie as vantagens edesvantagens de cada um para decidir em qual dosservidores você criará e hospedará o seu blog. Naveguetambém pelos blogs de usuários hospedados nessesservidores para ter uma idéia de como construir o seu.Depois de escolher o servidor, você precisará cadastraruma conta de blog. Para isso é necessário ter uma contade e-mail vinculada ao servidor do blog.

12

Page 13: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CADERNOS ELETRÔNICOS 5 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET

Remissão entre osCadernos Eletrônicos

Seção downloads

Caderno 2: Editoração e processamento de textospara conhecer um pouco mais sobre recursos parausar um corretor ortográfico e publicar o conteúdode suas páginas livres de erros ortográficos.Caderno 4: Navegação e pesquisa na Internet lhefornece dicas de pesquisa e de bons sites de busca.Caderno 7: Uso da impressora e tratamento deimagens você encontrará dicas de tratamento dasimagens que ilustrarão o seu site.Caderno 8: Comunidades virtuais - listas, chats eoutros, você pode conhecer outros recursos paraincrementar sua homepage.

Editores de páginas online eservidores gratuitos:

www.vilabol.com.brwww.hpg.ig.com.br/www.kit.nethttp://br.geocities.yahoo.com/www.tripod.lycos.com

Redija o texto no campo apropriado eexperimente destacar um texto em negrito ou itálicoe você verá que durante a edição ele aparecerá entre

Editores de HTML freeware:

www.softwarelivre.rs.gov.brhttp://superdownloads.ubbi.com.br/programas/6webhtm.htmlhttp://www.pegar.com.br

Servidores e editores de blog:www.blogger.com/www.weblogger.com.br/http://blig.ig.com.br/

Cursos online, tutoriais e outros:

www.acessa.sp.gov.br/webaulawww.cdcc.sc.usp.br/tutorial/index.htmwww.e-govestado.weblogger.terra.com.brwww.e-govmunicipio.weblogger.terra.com.brwww.e-govfederal.weblogger.terra.com.br

Websites dos Infocentros:

http://infosaem.weblogger.com.br/www.infocentrolimeira.hpg.com.brwww.infocentrodombosco.hpg.ig.com.brwww.casadecultura.freesites.com.br/www.jornal9dejulho.kit.netwww.associacaoforcajovem.kit.netwww.infocentroaps.hpg.com.br

Tela com o texto editado. É dessa forma que o texto daimagem anterior será visualizado online.

as tags. Clique em “Publicar” ou “Enviar”. Pronto!Seu texto já estará no ar, disponível para quemdesejar lê-lo.

Então, que tal pôr a mão na massa? Escolhaum servidor que ofereça editores de HTML online ehospedagem gratuita, arregace as mangas, mobilizetoda a sua disposição e criatividade e faça a suaprópria homepage ou o seu blog.

Saiba que, ao tomar essa decisão e entrar emação, você estará contribuindo para aumentar oconteúdo em Língua Portuguesa na rede. Lembre-se de que o conteúdo em nossa língua na rede aindaé muito reduzido portanto, ainda há muito a ser dito.Você também irá compartilhar com outras pessoasconhecimentos e pensamentos que até então sóvocê possuía. Dessa forma, deixará de ser apenasalguém que navega na Internet. Você passará a fazersuas próprias ondas! Mãos à obra!

Os monitores dos Infocentros estão criando blogs paracatalogar os serviços de governo eletrônico existentes.

13

Page 14: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5

GlossárioASP: “Active Server Pages” ou “Páginas Ativas de Servidor”.ASP é uma linguagem criada pela Microsoft (códigofechado portanto) e que é utilizada para a criação depáginas dinâmicas para a web. Uma página dinâmica éelaborada, em tempo real, pelo servidor e entregue aobrowser no formato HTML.Blog: é uma abreviação de weblog, web (rede) e log(registro). Qualquer registro freqüente de informações podeser considerado um blog (últimas notícias de um jornalonline, por exemplo). A maioria das pessoas tem utilizadoos blogs como diários pessoais.Browser: navegador, programa para abrir e exibir aspáginas da web como o Explorer, da Microsoft, o Navigator,da Netscape etc.DNS: “Domain Name System”: protocolo que rege acomunicação com e entre servidores que transformamnomes de domínio nos chamados endereços IP. Osendereços de IP são os endereços que os computadoresentendem e usam para localizar os sites dentro da rede.Download: em inglês “load” significa carga e “down” parabaixo. Fazer um download significa baixar um arquivo deum servidor, descarregando-o para o nosso computador.Freeware: qualquer software (programa) oferecidogratuitamente na rede ou nas publicações especializadasem suportes como CD-ROM. A palavra inglesa “free”significa livre.FTP: “File Transfer Protocol” ou “Protocolo de Transferênciade Arquivos”. É uma maneira de copiar arquivos via Internet.Os arquivos são disponibilizados e localizados emservidores ou em computadores pessoais por um programaservidor de FTP. Qualquer pessoa que tenha acesso (logine senha) pode copiar arquivos contidos lá. Existe o FTPchamado “anônimo”, em que qualquer um pode ter acessoaos arquivos disponíveis.Homepage: “home” em inglês significa casa, lar, e “page”,página. Na Internet a expressão significa “página pessoal”.A palavra home, isoladamente, significa toda página inicial,a página principal de qualquer site na Internet.HTML: abreviação para “Hyper-Text Markup Language”,que quer dizer: “Linguagem de Marcação para Hiper-Texto”.Um documento HTML é um conjunto de instruções emformato ASCII, usada para criar documentos comhipertexto e que podem ser visualizados por um browser.HTTP: acrossemia de “Hyper Text Tansfer Protocol” ou“Protocolo de Transferência de Hipertexto”. É o protocoloque permite o funcionamento da interface gráfica daInternet, esta que é mais conhecida e que permite atransmissão de textos, fotos e gráficos de uma maneirasimples e rápida.Internet: rede mundial de computadores. Trata-se de umarede planetária de computadores que cooperam entre si.Essa cooperação baseia-se em protocolos decomunicação, ou seja, “convenções de códigos deconversação” entre computadores interligados em rede.JavaScript: linguagem para script que tem uma vagasemelhança com Java, e que foi idealizada pelo W3CConsortium. A Microsoft copiou essa linguagem no seu

navegador, nomeando-a de Jscript.Link: ligação, elo, vínculo. Nas páginas da web, é umendereço que aparece sublinhado, ou em uma cor diferenteda cor do restante do texto. Um link nada mais é que umareferência cruzada, um apontador de um lugar para outrona web. Assim, eles permitem um vínculo com umaimagem, um arquivo da mesma página ou de outras daweb, a partir de um clique do mouse. Por meio dos linksa navegação pelas páginas da web não é linear.PHP: “Hypertext Preprocessor” é uma linguagem de códigoaberto (open source), ou seja, de uso livre, muito utilizadae especialmente aparelhada para o desenvolvimento depáginas da web, cujo código é embutido no próprio HTML.O código PHP, assim como o ASP, é executado no servidore não no browser.Pop-ups: janela que surge separadamente quandonavegamos em um determinado site, geralmente paraapresentar um anúncio.Script: pequeno programa cujas instruções sãointerpretadas, isto é, convertidas em código de máquina eexecutadas linha a linha.Servidores: empresas que possibilitam o acesso para acomunicação e transmissão de dados na rede.Sessão do navegador: também chamada de “timeoutde sessão” é o tempo em que o navegador está emoperação. Uma sessão também pode ser definida como aconexão a um website em particular.Shareware: é um método comercial que possibilita adistribuição gratuita, por um tempo determinado, de umsoftware, para que o usuário possa testá-lo. Ao final desseperíodo de testes, o usuário é solicitado a registrar(comprar) o produto ou desinstalá-lo.Site: palavra inglesa que significa lugar. O site é o lugarem que as páginas da web podem ser encontradas.Software: aplicativos, programas de computador.Upload: o inverso de download, ou seja, significa carregarum arquivo de nosso computador para enviar para alguémdescarregar em outro computador.URL: sigla de “Uniform Resource Locator” (“LocalizaçãoUniversal de Recursos”). É o endereço na Internet. As URLssão usadas por navegadores da web para localizar recursosna Internet. Uma URL especifica o protocolo a ser usadopara acessar o recurso como HTTP.Web: teia, rede. Veja WWW.Webdesigner: Trata-se do profissional que cria, elaborapáginas para a Internet.Website: “web” significa rede e, “site”, em inglês, querdizer lugar. Ter um website significa ter um endereço comconteúdo na rede que pode ser acessado por visitantes.WWW: abreviatura de “World Wide Web”, a expressão dainterface gráfica da Internet. Uma tradução possível seria“teia de alcance mundial”. “World Wide” significa “grandecomo o mundo” e “Web” significa teia, rede.Zine: é abreviação da palavra fanzine, junção das palavrasem inglês fan (fã) e magazine (revista). Fanzine foi o nomedado às publicações amadoras que nos anos de 1970foram uma espécie de porta-voz oficial do movimento punk.

14

Page 15: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CADERNOS ELETRÔNICOS 5 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET 15

CadernosEletrônicos

Como usar egerenciar seuse-mails

CadernosEletrônicos

Editoração eprocessamentode textos

CadernosEletrônicos

Planilha eletrônica ee banco de dados

CadernosEletrônicos

Navegação epesquisa naInternet

CadernosEletrônicos

Criação epublicação depáginas na Internet

1

2

3

4

5

CadernosEletrônicos

Gerenciamentoe organização dearquivos

CadernosEletrônicos

Uso da impressorae tratamentode imagens

CadernosEletrônicos

Segurança nocomputador ena Internet

CadernosEletrônicos

Multimídia:vídeo e áudiono computador

6

7

8

9

10

CadernosEletrônicos

Comunidades virtuais -listas, chats e outros

Page 16: Criação e publicação de páginas na Internet - miniweb.com.brF4... · 4 CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5 1 Selecionando e organi-zando

CRIAÇÃO E PUBLICAÇÃO DE PÁGINAS NA INTERNET CADERNOS ELETRÔNICOS 5

Publique-se

A Internet é um meio que oferece uma grande diver-sidade de recursos. Pela rede você pode pagar contas, fazerpesquisas, enviar correspondências, fazer amigos. Comcriatividade e sem gastar nada você também pode fazer umahomepage para publicar e difundir suas idéias.

Se você gosta de escrever poesias, se adora fotografara família, a cidade, se você pinta, desenha, se não pode veruma câmara de vídeo que já produz um filme, se compõemúsicas ou adora colecionar partituras e letras de canção, sevocê sabe muita matemática, história, filosofia, marcenaria,dança, receitas etc., a Internet pode ser muito interessantepara você. Todos os seus talentos, os conhecimentos e ashabilidades podem ser mostrados e circular nesse meiodemocrático por excelência!

Neste caderno você saberá como se tornar autor de suacriação, aproveitando seus talentos e saberes e utilizando aInternet como meio para publicar sua produção, a partir dacriação de um website.

www.acessa.sp.gov.br