Criar site net br AGRADECIMENTOS

Transcrição

1 Criar site net br AGRADECIMENTOS A todos que no ano em que passei escrevendo me deram força e coragem para continuar por dias e noites seguidas. Escrever um livro é, antes de tudo, uma demonstração de força de vontade. Espero poder compartilhar com todos os meus leitores essa mesma força, fazendoos triunfar em cada trecho deste caminho. Agradecimentos especiais, como sempre, vão para minha querida e amada esposa, Rachel. Outras pessoas que nunca poderia deixar de citar são meus editores da Brasport, Sérgio e Rosa Maria, por sempre confiarem no meu trabalho. A todos os meus amigos e família, meu muito obrigado também. Agora e sempre. Principalmente aos meus pais Marcolino e Eunice. Aos meus leitores, que vêm me acompanhando neste e nos livros anteriores, também agradeço pela confiança em meus ensinamentos. Sempre que precisarem, podem me contatar. A missão de um escritor não termina só no livro. Vai por caminhos muito maiores que esse.

2 SOBRE O AUTOR Minha carreira iniciou-se há 13 anos. Comecei como assistente de arte, aprendendo e aperfeiçoando essa dádiva que é apreciar e saber criar um desenho ou uma pintura. Enfim, conhecer e amar a arte. Como freelancer, prestei serviço para várias empresas e editoras, como Globo, Abril, entre outras. Trabalhei com diversos personagens durante todo esse tempo, como os da Disney, e com vários personagens japoneses que ainda hoje passam na TV. Logo após, tive minha própria agência de publicidade e desenvolvi várias embalagens, anúncios e storyboards também. Investi dois anos em um sonho, que foi trabalhar para editoras americanas, e tive meu trabalho publicado em várias revistas de quadrinhos da DC Comics. Foi quando comecei a me interessar por computadores. Quando pequeno tive um microcomputador (um TK-85, para os que se lembram), mas ele era muito pobre em recursos gráficos. Depois desse computador, fui voltar a ver o enorme avanço deles somente depois de muito tempo, e percebi o tremendo potencial que os novos programas gráficos poderiam proporcionar à minha área. Fiquei interessado novamente e fui desenvolvendo esse lado artístico através do computador. Logo já estava trabalhando com vários programas para editoração eletrônica e assinando serviços de BBS. Era o que havia disponível na época. Comecei então a trocar com pessoas do mundo inteiro. O era a única ferramenta da Internet a que se podia ter acesso e já era o máximo. A World Wide Web ainda nem existia no Brasil. Em breve começaram a surgir os primeiros browsers, os primeiros provedores e fui me aprofundando no assunto e quando percebi já estava trabalhando comercialmente com o desenvolvimento de sites e imagens para a Internet. Desenvolvo freqüentemente vários sites para empresas, e uma das coisas mais legais que eu vejo é a vontade que as pessoas têm de entrar na Internet, colocar a sua cara ali, como a bandeira fincada na Lua, apenas para dizer Eu consegui. No entanto muitas esbarram em aspectos aparentemente simples. É por isso que resolvi escrever este livro. Para os que têm vontade de ter e para os que já têm seu site, mas não conseguem colocá-lo na Internet para que outros possam conhecê-lo e não aproveitam todo o potencial que lhes é oferecido.

3 Espero que este livro ajude a concretizar seus sonhos. Márcio S. Morais marciosm@usa.net

4 INTRODUÇÃO A Missão deste Livro Bem-vindo ao meu mais recente livro. Depois de escrever dois livros sobre o FrontPage da Microsoft (para quem não o conhece, é um software de edição de páginas para a Internet), recebi muitas cartas de meus leitores e várias das dúvidas deles se resumiam em como colocar as páginas que eles fizeram no ar, ou seja, na Internet. Realmente há uma grande diferença entre saber criar suas páginas e colocá-las efetivamente no ar para que o mundo todo possa vê-las. É nessa hora exata que percebemos todos os grandes erros que por enquanto não víamos, como links errados, recursos que estávamos utilizando e que acabam não funcionando direito quando vemos o site no ar, enfim, várias coisas que até então eram invisíveis aos nossos olhos. E sabe por quê? A resposta é até simples: porque existem determinados fatores que não levamos em conta ou que nem sabíamos que existiam. Esses fatores são os recursos que nos são oferecidos pelo local onde iremos deixar nosso site. Pouca gente sabe que é preciso um mínimo de estudo e conhecimento sobre onde iremos publicar nossa homepage. Há uma grande variedade de lugares na Internet, uma grande maioria gratuita, onde podemos deixar nossas páginas disponíveis para que outros as vejam. No entanto, assim como a diversidade de lugares é grande, a diversidade de recursos que cada um deles nos oferece também é gigantesca. Por isso, muitas pessoas se confundem e acabam criando sites que não funcionam corretamente quando enviados para o seu endereço na Internet. Aqui no Brasil temos provedores de acesso, como o UOL, O Site, entre vários e vários outros que cedem um espaço para seus clientes colocarem suas páginas na Internet. Cada um deles possui um procedimento de envio de arquivos e cada um deles também possui certas facilidades ou mesmo ferramentas de edição on-line de páginas. No entanto, basicamente todos eles aceitam um protocolo de transmissão

5 de arquivos chamado FTP (File T ransfer Protocol). Para utilizá-lo, temos que ter um programa compatível com esse protocolo. Um dos que eu mais utilizo é o CuteFTP. Isso porque é simples de usar e nunca me apresentou problemas. Neste livro vou analisar alguns dos maiores provedores de acesso e como eles nos permitem enviar páginas para a Internet. Também irei discutir vários aspectos que devemos levar em consideração quando criamos as páginas, ou seja, antes mesmo de enviá-las. Cabe aqui lembrar que a maior parte dos que nos fornecem espaço na Internet, seja de 5 até 50 megabytes, não nos permitem muita escolha no endereço que será usado para outras pessoas terem acesso às nossas páginas. Normalmente será algo como Muit as vezes imaginamos que iremos t er facilment e um endereço como por exemplo. Talvez até sem imaginar que tenhamos que pagar por isso. Mas, sobre isso veremos mais tarde no decorrer do livro. Espero que o aproveitem. Bom site para vocês.

6 CAPÍTULO 1 COMEÇANDO DO ZERO Por onde Iniciar Quando digo começando do zero quero dizer todas as pessoas que nunca tiveram um site na Internet nem nunca fizeram uma página. Para esses eu recomendaria que adquirissem livros que ensinassem a criar páginas para a Web. Eu mesmo escrevi dois sobre o FrontPage, um sobre a versão 98 e outro sobre a versão O FrontPage é um software como um Word da Microsoft, aliás muito parecido mesmo, onde você vai montando sua página de uma maneira bem visual e simples. Eu sempre o recomendo para iniciantes. No entanto, depende muito de cada pessoa a adaptação e a escolha dos programas que eles irão usar para criar suas páginas. Existe também o Dreamweaver, da Macromedia, que é um outro programa muito bom, com dezenas de recursos a mais que o FrontPage, não tão simples, é claro, mas ótimo para quem já tem algum conhecimento. Não dispense também livros sobre a própria linguagem HT ML, que é o código que usamos para criar nossas páginas. Hoje em dia, com a facilidade desses editores visuais (os chamamos de WYSIWYG What You See Is What You Get, ou traduzindo para o bom português O que você vê é o que você irá conseguir quando editar na Internet e eu lhes asseguro que nem sempre foi assim), acabamos nos esquecendo do código que existe por trás das páginas, e é exatamente aí que encontramos a maior dificuldade quando colocamos nossas páginas no ar. Isso porque normalmente todo mundo vai querer criar uma página que tenha um formulário do tipo: Você gostou da minha página? Escreva para mim e dê sua sugestão!. É incrível, mas todo mundo faz isso. Lógico que poderíamos colocar nosso para que nos enviem uma mensagem, mas normalmente todo mundo quer um formulário, com campos onde a pessoa pode preencher ou escolher entre várias opções (do tipo sexo: masculino ou feminino) e por aí vai.

7 Acontece que cada provedor, como já lhes falei, tem uma particularidade, um método diferente de permitir que seus usuários criem essas páginas de formulário. E podem escrever o que eu digo, ou melhor, lembrar o que eu escrevo: 90% das pessoas se confunde na hora de acertar esses códigos especiais para os formulários. Mesmo nós que trabalhamos nessa área de informática às vezes nos confundimos, pois basta faltar um parênteses ou uma vírgula e pronto, a página não funciona. Mas também sabemos revisar o código e achar o que pode estar dando errado. Por isso eu acho importante que, apesar de ter um programa visual para criar suas páginas, você também comece, nem que seja aos poucos, a aprender um pouco da linguagem de programação HTML, que não é tão complicada assim. Sabendo o básico dela você consegue trabalhar muito bem. Existem vários outros livros que recomendaria além daqueles sobre HTML, mas esse não seria bem o objetivo deste livro. No entanto atrevo-me aqui a fazer um resumo do que você precisaria ler: 1. Um bom livro sobre o FrontPage (pode ser o meu, desta mesma Editora, a Brasport) e/ou um livro sobre Dreamweaver. 2. Um bom livro sobre HTML. Depois você pode ir comprando livros sobre Javascript (não é Java, preste atenção, muitos confundem Javascript, que é mais simples, com o Java, que é bem, bem complicado) 3. Um livro sobre um editor de imagens. Pode ser o Photoshop, da Adobe, atualmente na versão 6.0 (07/2000) e/ou sobre o Fireworks, da Macromedia, também muito bom. A diferença básica entre os dois é que o Fireworks é feito somente para imagens da Internet e o Photoshop também se presta a serviços com imagens mais pesadas para impressão. Basicamente seria isso, tem muitas diferenças a mais, lógico. 4. E, com o passar do tempo, alguns livros sobre webdesign. Nada como olhar para obras de arte e saber reconhecer nelas o que têm de especial e porque são tão bonitas. Nós que trabalhamos no meio sabemos identificar boas de más imagens, um bom conceito e um bom layout de um ruim, e isso começa a pesar e muito quando seu site for constantemente visitado. Ninguém gosta de entrar em uma casa feia e mal-arrumada, não é. Bem, com isso você vê que criar páginas não é tão simples quanto se imaginava. Mas não se preocupe. Somente quando começamos alguma coisa e seguimos em frente é que conseguimos evoluir. Ninguém chega à faculdade sem ter feito a primeira série e rabiscar paredes, sujar as mãos de tinta, etc.

8 Encare sua primeira página não como uma obrigação. Nunca faça isso. Encare sim como uma brincadeira. Aí você irá sempre progredir mais e mais. Depois de um tempo brincando se pode assumir um compromisso mais sério de estudar melhor e passar de uma fase para outra, mas suas primeiras páginas devem ser experimentos. Não há como ser de outro jeito. A menos, é lógico, que seu chefe esteja lhe empurrando esse serviço e exigindo que saia tudo lindo e maravilhoso. Não é bem por aí, e se você estiver nessa situação, cuidado. Criar uma página na Internet exige atenção, criação e estudos. Principalmente se for para uma empresa. A coisa mais fácil é fazer algo que seus clientes não gostem e por isso não voltem a visitar seu endereço na Internet nunca mais. Vamos abordar isso também durante o livro. Para fechar este capítulo vimos então que, para partir do zero precisamos ter alguns conhecimentos. Mesmo sem termos os programas que citei, temos muitos provedores e sites de hospedagem na Internet que nos oferecem ferramentas de edição online de nossas páginas. É muito legal mesmo, pois temos ali, diante de nós, através do browser, a possibilidade de criar nosso site sem ter que comprar nada. Então, aqui vão alguns avisos: a) Normalmente demora muito para que as páginas contendo essas ferramentas on-line carreguem, e também para que criemos e salvemos o que fizermos nesse ambiente; b) Se demoramos muito on-line, nossa conta de telefone também aumenta proporcionalmente, então cuidado para não ter uma surpresa no final do mês; c) Não temos todas as possibilidades e recursos que um programa, mesmo de edição de páginas, nos permite, limitando nossa criação; d) Para facilitar, essas ferramentas on-line nos apresentam poucas opções de fundos (background) de páginas, por exemplo, apenas para citar um exemplo, novamente limitando nossa criação. Sendo assim, vimos que ainda que nos entreguem tudo na mão é interessante sabermos como criar nossas próprias páginas, entendendo o que se passa no código e também tendo a total liberdade de poder colocar a cor que quisermos, alinhar o texto do nosso jeito, entre outros pontos.

9 Uma Introdução sobre HTML, a Atual Linguagem da Internet A linguagem mais amplamente usada para criação de páginas para a Internet é o HTML. Como tudo no mundo e na nossa história, o HTML também se desenvolveu, se aperfeiçoou. Hoje existem variantes novas do HT ML, que até pretendem (e realmente acho que vão conseguir) substituí-lo. São o XHT ML, o XML, e várias, várias outras linguagens. No entanto, eu sempre digo a quem vai começar a criar páginas: Comece pelo básico. Aprenda o HTML, com ou sem o auxílio de programas como o FrontPage, o Dreamweaver ou qualquer outro. Não importa, mas comece do básico. Se formos ver todo o atual universo de possibilidades que a Internet nos oferece, só podemos ter duas reações. A primeira é ficarmos maravilhados com tudo isso, e então termos bastante disposição e vontade e sair devorando livros por aí para aprender tudo o que pudermos até dominarmos todos esses recursos. Sinceramente, nem nós que trabalhamos com informática diariamente sabemos lidar com todos os tipos de linguagens e programas que existem atualmente. As empresas de software lançam produtos mais rápido do que podemos aprender. Bem, a segunda reação que podemos ter é o medo. É ficarmos apavorados com o que temos para aprender e nos recusarmos a aprender. É o que acontece com muitas pessoas, principalmente as que estão na terceira idade. Acham que não vão conseguir e começam a duvidar de si mesmos. Não é sempre que isso acontece, mas é uma atitude que se repete várias vezes. Então quer saber se você precisa aprender HTML mesmo? A minha resposta é SIM, desde que você queira dominar melhor o que pode ou não colocar em sua página. E, ao mesmo tempo, NÃO, se você quer apenas colocar algumas fotos ou textos na Internet. E sabe por quê? Primeiramente porque existem programas agora tão fáceis de aprender que qualquer criança pode conseguir (a criança aprende mais rápido principalmente porque ela não tem medo, então não tenha você também). E em segundo lugar porque existem vários serviços na Internet onde você só precisa ir respondendo algumas perguntas e ele cria a página para você.

10 Essa é a razão deste livro. Ensinar-lhe como utilizar esses serviços e como colocar seu site no ar. Vamos então começar do básico. O Que é a Internet? Existem muitas pessoas que tentam definir a Internet. Uns a definem como superestrada da informação, rede mundial, entre outras formas de expressão. No entanto, como toda forma de expressão, tudo depende de um ponto de vista. Temos pessoas que só vêem o mal na Internet, porque ela é livre, até em demasia, talvez. Logicamente que há a pornografia e várias coisas escusas escondidas em alguns dos milhares de computadores que fazem parte da rede. No entanto, eu encaro a Internet como uma grande livraria, com livros dos mais diversos assuntos, com livros que tocam música ao se abrir, com contos pornográficos para quem quiser procurar por esse tipo de assunto sim, mas também com grupos de pessoas interessadas somente no bem do planeta e do ser humano, e que se não fosse a Internet não seriam capazes de difundir seus ideais por todo o globo. A rede é o que cada pessoa quiser que ela seja. Em toda a história, o homem sempre foi o responsável pelo que faz com suas criações, e não há terreno mais fértil do que a Internet por enquanto. Ela aproximou e permitiu que pessoas de todo mundo, não importa a distância entre elas, possam trocar idéias e se comunicar. As empresas pensam diferente: para elas, tudo na rede é uma fonte de futuros negócios. Indústrias sonham com o dia em que poderão vender diretamente aos consumidores, sem nenhum intermediário. Empresas de comunicação esperam o meio que vai reunir rádio e televisão em um mesmo sistema de produção, e isso já está mais próximo do que se imagina. A única coisa que atrapalha ainda um pouco é a baixa conexão, que faz com que arquivos grandes demorem muito para serem enviados de uma fonte a outra. No entanto, podemos conversar com nossos familiares distantes, separados por milhares de quilômetros com uma facilidade nunca antes vista. E pagando muito pouco. E para os que ainda não têm um computador ou conexão tão bons que permitam a conversa real pela Internet, ainda há o primeiro recurso dela, que é o . Cada usuário pode ter um ou mais s, que são como um RG, uma identificação, um endereço de comunicação. Com esse , você pode se comunicar, enviando mensagens para outras pessoas.

11 Além de tudo isso, ainda podemos colocar um site na rede, onde todos podem nos visitar. Hoje em dia todos querem colocar algum conteúdo na Internet. Todos se sentem motivados a contribuir e fazer parte dessa que é considerada a maior invenção do século e também a mais revolucionária. E você também pode participar disso tudo. Como Funciona a Web? A Web funciona basicamente através de dois tipos de computadores. São os clientes e os servidores. O cliente é você, por exemplo, de casa. Você normalmente acessa a Internet através de um programa, o navegador ou o browser (em inglês) como o Internet Explorer, o Netscape, o Ópera ou vários outros, utilizados pelos usuários para ver as páginas. Primeiramente se conecta com seu provedor, que possui vários computadores que estão 24 horas por dia conectados com a Internet. Através dessa conexão, seu computador se une à rede, e começa a requisitar informações e arquivos. Quando você entra com seu computador na Internet, normalmente vai visitando os sites que lhe agradam mais e pelos quais tem algum interesse, certo? Toda vez que utiliza seu navegador para ir a um site, ele requisita essas informações e arquivos (a página em si que você vai ver) aos servidores. Se a página ou informação estiver naquele primeiro servidor, ele já irá enviar o arquivo (ou página) para seu navegador instantaneamente. Senão ele passa sua requisição para frente, para os outros milhares de computadores da rede até que um deles possa lhe enviar a página pedida. Apesar de serem milhares de servidores, toda essa procura demora apenas alguns segundos, isso porque a velocidade entre eles é muito grande. Então, se a informação pedida realmente estiver armazenada em algum servidor da rede, o resultado do pedido será enviado de volta e mostrado na tela do navegador. Normalmente a informação armazenada na Internet está disponível na forma de páginas, que são ligadas entre si. Quando digitamos no navegador um endereço como por exemplo, estamos pedindo que a rede nos envie a homepage (a primeira página) do UOL. Então os servidores se comunicam entre si e o arquivo da primeira página é enviado para nosso computador e então exibido na nossa telinha.

12 Como eu disse, as páginas estão ligadas umas as outras. Isso é possível através de um hyperlink, ou seja, uma referência que existe dentro de uma página que, quando clicada, nos remete a outra. Por isso que, ao estarmos lendo sobre um determinado assunto, podemos ter alguns hyperlinks (ou simplesmente links) que nos enviam para uma outra página que pode conter mais informações ainda sobre o que estávamos procurando. É como estarmos lendo uma notícia sobre uma nova forma de cirurgia para miopia nos olhos, e podermos, ao clicar na palavra miopia, ter acesso a saber como ela surge, quais os tratamentos que eram utilizados antes, qual o nome do médico que descobriu essa nova forma de cirurgia, etc. O leque de informações abre-se grandiosamente. Nota: Normalmente os hyperlinks apresentam-se em negrito, ou sublinhados, ou então com cores diferentes, até mesmo formatos, como botões, etc. A variedade hoje em dia é muito grande, mas isso é apenas para dar um efeito cosmético na página, para ela ficar mais agradável. É justamente essa interação entre as páginas que fazem com que se chame a Internet de WWW (World Wide Web) teia de alcance mundial. Todas as páginas e arquivos que existem na Internet podem ser acessados através de um endereço, uma URL, que é como o endereço de uma casa. Normalmente ela se apresenta assim: Definições de Nomes na Internet é a maneira (um protocolo na verdade) pela qual ocorrerá a troca de informações e requisições entre cliente e servidor. HTTP (HyperText Transfer Protocol, ou protocolo de transferência de arquivos de hipertexto) é o método utilizado para transportar páginas Web pela rede. Há outros protocolos também, como: ftp:// (para transferir arquivos), ne ws:// (grupos de discussão) e mailto:// (para enviar correio eletrônico).

13 é o nome do servidor onde está armazenado o arquivo. Nem sempre o nome de um servidor Web inicia por WWW. Pode iniciar por ou então simplesmente sem www algum. /diretorio/ é o diretório onde está o arquivo. O arquivo, ou página requisitada, pode estar em vários níveis. Imagine o site como uma grande caixa, cheia de várias outras. Cada caixa dentro daquela maior é um diretório. Se o arquivo estiver na caixa maior, ele é mais simples de ser encontrado. A URL seria algo assim: No entanto, se estiver dentro de uma outra caixa, temos que incluir o nome dessa caixa (no caso diretório) na URL, assim: E isso indefinidamente. Caso o arquivo desejado esteja dentro de uma outra caixa dentro da segunda caixa, a URL seria assim: Se não digitarmos corretamente o endereço, a URL de um arquivo, o servidor não conseguirá encontrá-lo para nós e então enviará uma mensagem de erro, que poderemos ver no nosso navegador. arquivo.htm é o nome do arquivo. A extensão.htm (pode ser html também) indica que se trata de uma página Web. Uma URL pode indicar outras extensões. Quando o navegador recebe um arquivo com a extensão.txt, o arquivo é tratado como um texto comum. Em outros casos, como nas extensões.zip (arquivo comprimido) e.exe (um programa), o navegador abre uma janela perguntando ao usuário o que fazer com o arquivo. Você pode salvá-lo em seu computador ou tentar executá-lo. Como Criar uma Página Web em 15 Passos Apesar de termos tantas possibilidades para inserir em uma página, tais como imagens, sons, animações, hyperlinks, etc., as páginas Web não passam de documentos de texto simples. Você poderia produzi-las em um editor de texto simples, como o Notepad do Windows. A única coisa que temos que observar é que, para isso, temos que utilizar marcações especiais, que são os códigos que irão identificar os diversos elementos dentro das páginas. Alguns elementos são marcados como títulos, outros como parágrafos,

14 outros como imagens e links. Essas marcas são chamadas de TAGs e estão especificadas dentro da linguagem utilizada para criar as páginas Web: o HT ML. Normalmente uma página HTM inicia-se assim: <html> <head> <title>título do site</title> </head> <body>conteúdo do site</body> </html> Vejamos em passos simples, como montar uma página em HTML. Logicamente que aqui eu coloco apenas alguns passos básicos. Depois é recomendável um livro específico sobre essa linguagem, ok? Vamos lá: Passo 1 Abra o Bloco de Notas do Windows (notepad). Passo 2 Digite o texto a seguir no bloco de notas: <HT ML> <HEAD> <TITLE> </TITLE> </HEAD> <BODY> </BODY> </HT ML> Agora salve o seu arquivo como index.htm. Nota: Lembre-se de salvar todos os arquivos escrevendo seu nome usando apenas letras minúsculas. Isso serve para imagens e para arquivos HT ML. Normalmente a primeira página da sua Homepage tem que se chamar index.htm, mas alguns dos serviços de hospedagem, por causa da configuração dos servidores deles, pedem que a sua homepage se chame index.html ou de fault.h tm ou ainda default.html. Veremos caso a caso nos exemplos que escolhi para este livro mais à frente, certo? Passo 3 Atenção é fundamental. Já deu para perceber, que todos os comandos que você escreveu no Bloco de Notas começam e terminam. Veja os exemplos: <TITLE> e </TITLE> ou então <BODY> e </BODY>. Repare que o fechamento é sempre com o símbolo / antes do nome. Esses comandos são chamados de

15 TAGs. Entre essas TAGs é que iremos escrever tudo o que vai em nossa página. Entre as TAGs TITLE, você deve colocar o título da sua homepage. Por exemplo: <TITLE> Esta é a homepage do Fulano De Tal </TITLE> Agora que você já sabe, vá até a sua página no Bloco de Notas e coloque um título na sua página. O título de sua página é o que vai aparecer lá na barra (normalmente azul) mais alta do seu navegador. Passo 4 Também podemos acrescentar características DENTRO das TAGs, como para definir a cor ou a imagem do fundo da sua homepage. Dentro da T AG BO DY coloque o seguinte: BGCO LO R= YELLOW veja o exemplo: <BO DY BGCO LOR= YELLOW > Isso irá deixar o fundo de sua página toda amarela. Você pode mudar a cor escrevendo no lugar do YELLOW, o nome da cor que você quiser, mas sempre em inglês. O mais correto, no entanto, é utilizar um padrão de cores que chamamos de hexadecimal. Ele é composto por uma combinação de 6 números e letras que nos permitem chegar a qualquer cor. Veja um exemplo: <BO DY BGCO LOR= # > Esta combinação é a cor vermelho escura, ou vinho. Notem que precisamos colocar o símbolo do jogo da velha # antes da combinação de 6 números e letras. Infelizmente o livro não é colorido, mas aqui vão as principais cores e seus códigos para você utilizar em suas páginas. Somente os nomes de cores acompanhados de asterisco podem ser utilizados no lugar dos códigos. Nome da cor Código da cor *White #FFFFFF *Red #FF0000 *Green #00FF00 *Blue #0000FF Magenta #FF00FF Cyan #00FFFF *Yellow #FFFF00 *Black # *Aqua #70DB93 Baker's Chocolate #5C3317

16 Blue Violet #9F5F9F Brass #B5A642 Bright Gold #D9D919 Brown #A62A2A Bronze #8C7853 Bronze II #A67D3D Cadet Blue #5F9F9F Cool Copper #D98719 Copper #B87333 Coral #FF7F00 Corn Flower Blue #42426F Dark Brown #5C4033 Dark Green #2F4F2F Dark Green Copper #4A766E Dark Olive Green #4F4F2F Dark Orchid #9932CD Dark Purple #871F78 Dark Slate Blue #6B238E Dark Slate Grey #2F4F4F Dark Tan #97694F Dark Turquoise #7093DB Dark Wood #855E42 Dim Grey # Dusty Rose # Feldspar #D19275 Firebrick #8E2323 Forest Green #238E23 *Fuchsia #FF00FF Gold #CD7F32 Goldenrod #DBDB70 *Gray #C0C0C0 Green Copper #527F76 Green Yellow #93DB70 Hunter Green #215E21 Indian Red #4E2F2F

17 Khaki #9F9F5F Light Blue #C0D9D9 Light Grey #A8A8A8 Light Steel Blue #8F8FBD Light Wood #E9C2A6 *Lime #32CD32 Mandarian Orange #E47833 *Maroon #8E236B Medium Aquamarine #32CD99 Medium Blue #3232CD Medium Forest Green #6B8E23 Medium Goldenrod #EAEAAE Medium Orchid #9370DB Medium Sea Green #426F42 Medium Slate Blue #7F00FF Medium Spring Green #7FFF00 Medium T urquoise #70DBDB Medium Violet Red #DB7093 Medium Wood #A68064 Midnight Blue #2F2F4F *Navy #23238E Neon Blue #4D4DFF Neon Pink #FF6EC7 New Midnight Blue #00009C New Tan #EBC79E Old Gold #CFB53B *Olive # Orange #FF7F00 Orange Red #FF2400 Orchid #DB70DB Pale Green #8FBC8F Pink #BC8F8F Plum #EAADEA *Purple # Quartz #D9D9F3

18 Rich Blue #5959AB Salmon #6F4242 Scarlet #8C1717 Sea Green #238E68 Semi-Sweet Chocolate #6B4226 Sienna #8E6B23 *Silver #E6E8FA Sky Blue #3299CC Slate Blue #007FFF Spicy Pink #FF1CAE Spring Green #00FF7F Steel Blue #236B8E Summer Sky #38B0DE Tan #DB9370 *Teal # Thistle #D8BFD8 Turquoise #ADEAEA Very Dark Brown #5C4033 Very Light Grey #CDCDCD Violet #4F2F4F Violet Red #CC3299 Wheat #D8D8BF Yellow Green #99CC32 Veja a página e clique no link Ferramentas. Lá você encontrará um link para esta tabela de cores há outros recursos interessantes nesse site que eu recomendo. Além de podermos colocar um fundo com uma cor única em nossa página, podemos também utilizar uma imagem, que irá se repetir em todo o fundo, criando uma espécie de papel de parede. Para quem utiliza o Windows, já deve estar bem familiarizado com isso. É a mesma coisa. No HTML, a única coisa que temos que dizer é a localização do arquivo de imagem. Como sugestão, para iniciarmos, eu aconselho a deixar todas as imagens no

19 mesmo diretório, ou seja, no mesmo local onde está guardando esta página inde x.htm que estamos desenvolvendo. Fica mais fácil. Para utilizarmos um fundo com uma imagem em nossa página, basta digitarmos assim: <BO DY BACKGRO UND= image m.gif > Somente utilize imagens GIF ou JPG para esse fim. São os dois formatos que são aceitos na Internet e também os menores em tamanho, facilitando assim o recebimento via modem. Dica: Quando estabelecemos que queremos uma imagem como papel de parede para nosso site, eu recomendo que também coloquemos o fundo com uma cor branca. Vou explicar. Quando não definimos a cor de fundo de uma página, vários browsers a vêem como ci nza, e fica feio, além de ser ruim para a leitura. Acontece que, quando escolhemos usar uma imagem para fundo da página, por causa da velocidade de conexão ainda ser baixa, a imagem demora mais para ser carregada do que o texto. Então às vezes fica cinza com o texto em preto (ou a cor que você definir) enquanto não se traz toda a imagem de fundo para repetir como papel de parede. Por isso como webdesigner eu sempre digo que deve-se colocar a cor de fundo em uma página, ela tendo ou não uma imagem para papel de parede. E a cor que é convenção para nós, normalmente é o branco. Sendo assim, o código melhor para uso de imagem como fundo seria: <BO DY BGCO LOR= WHITE BACKGROUND= imagem.gif > ou, como já vimos antes na tabela de cores, o código do branco é #FFFFFF <BODY BGCOLOR= #FFFFFF BACKGROUND= imagem.gif > Passo 5 Além de você ter um título em uma página, pode querer ter um título para um parágrafo também. Com isso podemos dar maior ou menor importância para um texto. Veja a seguir um texto falso apenas para ter idéia da importância de se sobressair um título de parágrafo: Sem título: As batalhas de Napoleão Bonaparte Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

20 Com título: As batalhas de Napole ão Bonaparte Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Ficou bem mais destacado, não é? Existem duas maneiras de criarmos esse tipo de efeito. O mais simples dele é apenas aumentando o tamanho da fonte e utilizando o negrito e a outra é utilizando TAGs prontas, como o H1 a H5, dependendo do tamanho que você quiser. H1 é o que deixa o título maior e H5 é o que deixa menor. Volte ao Bloco de Notas. De acordo com a última coisa que escrevemos deve estar parecido com isto: <HTML> <HEAD> <TITLE>Esta é a home page do Fulano de Tal</TITLE> </HEAD> <BO DY BGCO LO R= YELLOW > </BO DY> </HTML> Se você escolheu uma imagem de fundo ao invés de uma cor fixa, a TAG <BODY> estará um pouco diferente como já vimos antes. Agora escreva abaixo do <BODY BGCOLOR= YELLOW > <H1>Nome da Homepage </H1> Passo 6 Para que o título da sua homepage fique no centro da página, você precisa colocá-lo entre os TAGs <CENTER> </CENTER>. Para incrementar mais seu título você pode usar as seguintes TAGs: <CENTER> </C ENTER> Coloca o texto ou o título no centro <U> </U> Sublinha o texto ou o título <B> </B> Deixa o texto ou o título em Negri to <BLINK> </BLINK> Faz o título ficar piscando (só funciona no Netscape) <I> </I> Deixa o texto ou o título em itálico <P ALIGN= RIGHT > </P> Alinha o texto à direita. Você também pode alinhar destas outras maneiras:

21 LEFT se você quiser que o texto fique alinhado à esquerda. CENTER se você quiser que o texto fique alinhado ao centro. <MARQ UEE> </MARQ UEE> Faz o título ficar correndo da direita para esquerda (só funciona no Explorer). <BR> Muda de linha. É como se fosse o ENTER quando se escreve no WORD. Passo 7 O texto deve ser inserido abaixo do título. Não é obrigatório colocar nenhuma TAG entre o texto. Basta escrevê-lo. No entanto, você pode incrementar o seu texto usando as T AGs listadas antes. Você também pode mudar o tamanho e a fonte da letra. Veja os exemplos: <FONT SIZE= 2 FACE= Arial > Escreva aqui o que quiser </FO NT> <FONT SIZE= 2 FACE= Times New Roman> Oi, tudo bem? </FO NT> Você pode também mudar a cor do seu texto, mais tome cuidado para não deixá-lo ilegível. Isso acontece bastante quando estamos no começo e achamos uma imagem de fundo muito legal. Aí quando a usamos e digitamos um texto, ninguém mais consegue ler. É como aquela piada do urso branco em uma nevasca no Alaska. Onde ele está? No entanto há várias e várias páginas assim. Cuidado para sua página não se tornar uma piada então, ok? Seja criterioso com o que vai colocar lá. Para mudar a cor de seu texto, você precisa usar as seguintes TAGs: <FO NT CO LO R= GREEN >Aqui vai um texto colorido</fo NT>. Não se esqueça de que no lugar da cor verde que colocamos (GREEN), podemos escrever o nome de outra cor qualquer em inglês, ou então o código dela. Exemplo: <FONT COLOR= # > Vejamos aqui um exemplo com várias das TAGs explicadas antes: <HT ML> <HEAD> <TITLE>Esta é a homepage do Fulano de Tal</TITLE> </HEAD> <BODY BGCOLOR= YELLOW > <FONT FACE= Arial COLOR= #0000FF > <CENT ER><H1>Bem vindo a homepage do Fulano de T al </H1></CENT ER> </FONT> <P ALIGN= LEFT >

22 <FONT SIZE= 2 FACE= Arial COLOR= # >Digite aqui o texto que você quiser. Pode ser sobre seus hobbies, suas memórias, etc. <BR> <U> Aqui vou querer um texto sublinhado </U> <BR> <B> E aqui um texto em negrito </B><BR> <BLINK> Aqui fica piscando, mas só no Netscape </BLINK><BR> <I> E aqui vai ficar tudo em itálico </I> <MARQUEE> Se estiver usando o Internet Explorer, aqui vai ficar correndo, correndo e correndo sempre... </MARQUEE><BR> </FONT> </P> </BODY> </HT ML> Veja como ficou sua homepage! Localize seu arquivo index.htm e dê dois cliques nele. Isso vai abrir o seu arquivo no navegador que possui. Se tudo deu certo, na barra superior do seu browser (ou navegador) vai estar escrito o nome da sua homepage, o fundo vai estar da cor que você colocou, ou com a imagem que você escolheu e os textos que digitamos também. Perceba que as TAGs também possuem uma certa ordem, ou seja, elas atuam de acordo com uma certa ordem. No nosso exemplo, veja que eu determinei uma cor azul forte para o título. Mas somente para ele. O resto do texto está em vermelho escuro. Para isso, tive que colocar ANTES do título as TAGs <FO NT FACE= Arial CO - LO R= #0000FF > e logo após o fechamento daquela T AG de fonte </FO NT> Para o texto abaixo, eu abri com a TAG <FONT SIZE= 2 FACE= Arial CO- LO R= # > e só lá embaixo, que é quando eu terminei o meu texto mesmo, eu fechei a TAG de fonte </FO NT> Repare também que no primeiro caso, que é o do título, eu não especifiquei o tamanho da fonte como no outro caso (SIZE= 2 ), e isso porque o tamanho do título já estava sendo especificado pelas TAGs H1. Veja a imagem para poder visualizar melhor as hierarquias entre as TAGs da página criada:

23 Com exceção da TAG <BR> neste exemplo, que é colocada isoladamente, sempre temos que fechar as TAGs, obedecendo onde queremos que tal efeito nas letras termine ou inicie, etc. Existem outras TAGs que também não precisam de finalização, uma delas é a de inclusão de imagens. Vamos ver agora. Passo 8 Como você já sabe, podemos também inserir imagens em um documento HTML. Os formatos mais usados são GIF e JPG, pelas razões que já expliquei. Para inserir uma imagem, use a TAG <IMG SRC> sem a TAG de finalização. Exemplo: < IMG SRC= imagem.gif >. Lembre-se de que a imagem deve estar na mesma pasta do arquivo index.htm, pelo menos por enquanto. T oda vez que adicionar alguma nova T AG em sua página no bloco de notas lembre-se de salvá-la também. Passo 9 Como fazer links. Links são aquelas frases ou palavras, que, quando você clica, nos levam para outra página. Vamos supor que você queira colocar um link na sua página inicial (index.htm), para uma página sobre os filmes que você mais gosta. Para isso teria que criar a TAG <A HREF= filmes.htm >Conheça aqui os filmes que mais gosto </A> Podemos criar essa página logo abaixo da TAG MARQUEE, como segue: <MARQUEE> Se estiver usando o Internet Explorer, aqui vai ficar correndo, correndo e correndo sempre... </MARQUEE><BR>

24 <A HREF= filmes.htm >Conheça aqui os filmes que mais gosto </A><BR> Depois de colocar essa T AG, salve seu arquivo. Agora você deve abrir outro Bloco de Notas do Windows e fazer outra página falando dos filmes que mais gosta. Se não quiser abrir outro bloco de notas, basta utilizar o menu Arquivo Novo (ou File Open em inglês) e uma nova página em branco surgirá no lugar do seu arquivo index.htm que acabou de salvar. Essa página poderia ser algo como segue: <HT ML> <HEAD> <TITLE>Oi. Esta página fala sobre os filmes que mais gosto</title> </HEAD> <BODY BGCOLOR= #FFFFFF > <FONT FACE= Arial COLOR= #0000FF > <CENT ER><H1>Estes são os filmes que mais gosto</h1></cent ER> </FONT> <P ALIGN= LEFT > <FONT SIZE= 2 FACE= Arial COLOR= # >Gosto muito de: <BR> Casablanca<BR> T wister<br> Matrix<BR> E o vento levou... <BR> entre outros.<br> <A HREF= index.htm >Voltar para a homepage</a> </FONT> </P> </BODY> </HT ML> Veja que na página filmes.htm (salve-a com esse nome), eu coloquei um hyperlink lá embaixo também para voltarmos à nossa homepage. T emos sempre que pensar bem antes de ficarmos incluindo links pelas páginas, se queremos que nosso visitante volte algum dia. Se não tivéssemos colocado um link para retornar à homepage, ele teria que usar o botão do próprio navegador para isso. E o melhor é sempre o nosso visitante poder ir e voltar para onde quiser em nosso site. Por isso existem sites com menus em todas as páginas. Um menu nada mais é do que vários links apontando para todas as páginas de seu site, ou pelo menos para as principais, de tal maneira que podemos navegar livremente pelo site sem nos sentirmos perdidos.

25 Você também pode fazer um link para a página de um amigo seu, ou uma página que você gostou: < A HREF= >Visite a página de meu amigo</a> ou < A HREF= >Visite a página de meu amigo</a> ou < A HREF= >Visite o Cadê</A> No caso de ser um link para uma página ou um site que não o seu, como o exemplo anterior, de seu amigo ou do Cadê, ou algo assim, eu aconselho a colocar a seguinte T AG dentro do <A HREF... : < A HREF= TARGET= _blank > Visite a página de meu amigo</a> Isso vai fazer com que uma nova janela do navegador se abra na página indicada. O importante é que o seu visitante vai ter duas janelas: uma com o seu site ainda e outra com o site que você indicou. Se colocarmos o link direto, o SEU visitante irá visitar outras páginas e talvez não volte tão cedo. Ou seja, você passou o bastão adiante e perdeu a atenção do seu visitante. Por isso é interessante manter os dois sites abertos. Existe também a possibilidade de fazer um link para seu . Assim, quando ele for clicado, o seu visitante poderá lhe enviar uma mensagem pelo programa leitor de dele. Veja como: <A HREF=mailto:username@provedor.com.br>Mande-me um </a> Essas T AGs de link associadas ao mailto: permitem que os visitantes mandem e- mail para o autor do site, ao clicar no endereço. Passo 10 Veja como podemos aproveitar melhor os recursos da TAG BODY para incrementar os links. É na TAG BODY que se define a cor ou imagem de fundo, como já foi dito. Mas é também no BODY que definimos a cor dos links antes e depois de serem clicados, e também a cor inicial do texto. Todo texto que não estiver entre as TAGs <FONT COLOR= COR ></FONT> fica da cor inicial. Veja só que interessante. Então não precisaríamos ficar digitando COLOR= COR em toda TAG FONT. Poderíamos simplesmente definir a cor inicial na TAG BO- DY e, se quisermos, podemos definir somente uma palavra ou parágrafo para mudar de cor, como o título, que deixamos em azul, lembra? O resto do texto estava em vermelho escuro. Podíamos definir a cor vermelho escuro na TAG BODY somente e mudar apenas para o título. Para isso, basta escrever assim a TAG BODY:

26 <BODY BGCOLOR= #FFFFFF TEXT= # > Viu como é fácil? Para mudar as cores dos links escreva dentro do TAG BODY: LINK= CO R Cor dos links VLINK= CO R Cor dos links já visitados ALINK= COR Cor dos links Ativos O link fica ativo quando você clica nele. Passo 11 Criando links em imagens. Além do link em textos, podemos também criar links com imagens. Sendo assim, quando seu visitante clicar numa figura, ele será direcionado para a página indicada. É o que acontece com essa enorme quantidade de sites que possuem botões ao invés de links com textos. É assim que eles fazem. Primeiramente crie um arquivo de imagem (GIF ou JPG) ou copie alguma imagem para a mesma pasta onde você está guardando os arquivos index.htm e filmes.htm. Escreva o seguinte o comando na página index.htm: <A HREF= filmes.htm ><IMG SRC= imagem.gif BORDER= 0 ></A> Você pode modificar o valor de BORDER definindo a largura da borda da imagem. Nós, profissionais da área, preferimos a borda igual a zero mesmo. No lugar do nome imagem.gif coloque o nome de sua imagem. Lembre-se de, ao criar uma imagem, não exagerar no tamanho. Normalmente, um botão não mede mais que 120 pixéis de largura por 30 de altura. Talvez até menos. Uma imagem pode ter o tamanho que você quiser, mas ao colocá-la em sua página, tenha bom gosto e veja se não exagerou um pouquinho, ok? Passo 12 Colocando uma música de fundo. Existem várias maneiras de colocar música em sua página. Veja como fazer isso para o Internet Explorer. Para tocar música em sua Home Page, inclua a TAG: <BG SOUND= arquivo.mid LO- OP=INFINITE>. Ao invés de arquivo.mid, você pode colocar também arquivo.wav. E ao invés de LOOP=INFINITE você pode colocar LOOP=(quantidade de vezes que você quer que a música toque ou que o som se repita). Lembre-se de que o arquivo MIDI ou WAVE deve estar no mesmo diretório de sua página por enquanto. Para o Ne tscape, o comando é outro: <EMBED SRC= arquivo.mid AUTOS- TART= true VOLUME= 100 WIDTH= 0 HEIGHT= 0 CON- TROLS= none >

27 Dica: Os arquivos MID são bem menores que os arquivos WAV Como você viu, os dois navegadores mais usados utilizam T AGs diferentes. Então, inclua esses dois comandos na sua homepage, pois assim, quem usa um desses dois browsers (a imensa maioria), irá escutar a música, enquanto que, se você colocar apenas um deles, estará prejudicando vários visitantes. Se você colocar esses comandos na primeira página, todos que entrarem na sua homepage ouvirão automaticamente a música. Apesar de ser um recurso que era muito interessante há um tempo atrás, ele acabou ficando muito batido e chato, porque como todos sabem, o gosto musical de cada um é muito diferente uns dos outros. Outro motivo é que cada vez mais a Internet está presente no ambiente de trabalho, e sites com música acabam chamando demasiada e desnecessária atenção. Passo 13 Incluindo gifs animados em sua página. Gifs animados são imagens em formato GIF que fazem animações. Você mesmo pode fazer os seus usando o programa Microsoft GIF Animator procurando-o no site da Microsoft ( Infelizmente, você vai ter que se virar para fazer um gif animado. O mais fácil é sair pela internet procurando gifs animados. Assim que localizar algum de seu interesse, clique com o botão direito do mouse no gif e escolha salvar figura como... na mesma pasta onde está guardando os outros arquivos. Se você quiser, pode fazer links com os gifs animados do mesmo jeito que se faz com as imagens comuns. Passo 14 Criando tabelas. As tabelas são muito úteis e muito usadas em todas as páginas. Elas são um pouco complicadas de se entender mas vou tentar passar uma noção básica. Como disse, é necessário depois um aprofundamento na linguagem HTML, além de mais exercícios. O uso de programas como o FrontPage ou o Dreamweaver também ajudam e muito na criação de página. O que eu demorava 30 minutos preparando, agora consigo em 5 ou 10 minutos apenas. Isso agiliza muito o trabalho. Os comandos básicos para criação de uma tabela são: <TABLE> </TABLE>:Para iniciar e terminar uma tabela <TR> </ TR>: Para iniciar e terminar uma linha <TD> </ TD>: Para iniciar e terminar célula Exemplo: <T ABLE BORDER= 1 > <T R> <TD>Cel. 1 Linha 1</TD>

28 <TD>Cel. 2 Linha 1</TD> </T R> <T R> <TD>Col. 1 Linha 2</TD> <TD>Col. 2 Linha 2</TD> </T R> </TABLE> Vai ficar assim: Cel. 1 Linha 1 Cel. 2 Linha 1 Cel. 1 Linha 2 Cel. 2 Linha 2 Vou explicar linha a linha: <T ABLE BORDER= 1 > aqui criamos uma tabela com borda igual a um (1) <T R> aqui estamos criando uma linha <TD>Cel. 1 Linha 1</TD> agora col ocamos uma célul a nessa 1 a linha <TD>Cel. 2 Linha 1</TD> criamos outra célula na mesma linha </T R> fe chamos a primeira linha, então ficamos com 2 células nela <T R> criamos outra linha agora <TD>Col. 1 Linha 2</TD> estamos criando uma célula na segunda linha <TD>Col. 2 Linha 2</TD> criamos agora uma 2 a célula na 2 a linha </T R> fechamos a segunda linha </TABLE> fechamos a tabela Você também pode alterar a borda e a cor da tabela. Na TAG <TABLE> você pode mudar o tamanho da borda da tabela inserindo a opção BORDER= X. X é o tamanho que você quiser para a borda da tabela. O tamanho pode variar de 0 a 99. Exemplo: <TABLE BORDER= 2 > Na T AG <T D> você pode alterar a cor da célula inserindo a opção BGCO- LOR= COR. COR é o código da cor que você quiser. Exemplo: <TD BGCO LOR= # > Você pode mudar a imagem de fundo da célula com a opção BACKGROUND= IMAGEM.GIF Exemplo: <TD BACKGRO UND= fundo.gif >

29 Passo 15 Agora que você já tem alguns elementos, pode ir criando suas páginas. Vá sempre estudando para aprimorar seus conhecimentos. Há muitos tutoriais grátis na Internet. Mas sabe qual tem que ser sempre o último passo que você deve dar antes de enviar suas páginas e imagens para a Internet? Testar e testar e testar exaustivamente suas páginas, seus links e tudo o mais dentro de seu site. Teste cada link da página, verifique se cada imagem está aparecendo direito, e se os textos estão do jeito que você quer. Se estiver tudo OK, aí sim você poderá enviar sua página para a Internet.

30 CAPÍTULO 2 APRENDENDO A IDENTIFICAR OS RECURSOS DISPONÍVEIS Como você deve se lembrar, expliquei que cada lugar onde formos colocar nossas páginas na Internet nos oferece diferentes ferramentas, possui maneiras diferentes de, por exemplo, fazer um formulário funcionar, e nos permite utilizar determinados recursos e outros não. Por que não Usar meu Computador como Servidor para meu Site? Vamos começar esclarecendo uma dúvida bem básica: Por que temos que mandar nossas páginas para outro lugar que não o meu computador? As pessoas não conseguem ver meu site de outra forma?. A resposta mais simples seria não. Isso porque as suas páginas devem estar dentro de um computador que esteja sempre ligado na Internet e possua alguns softwares específicos para permitir o acesso a essas páginas. Na verdade, para ter acesso aos seus arquivos, ou melhor, às suas páginas, a pessoa que estivesse na Internet teria que saber qual o endereço por onde ele poderia achar o seu site. É por isso que, para encontrar um site, temos que digitar por exemplo. Ou então podemos também usar um número chamado IP. Vamos aprender mais sobre ele. Toda vez que entramos na Internet, nosso provedor de acesso nos fornece um número que nos identifica naquela hora e naquela conexão, que é o que chamamos de IP Internet Protocol. Se desligarmos nosso computador do provedor e voltarmos a ligar, possivelmente teremos outro número IP. É escolhido aleatoriamente, ao acaso. O IP que estiver disponível será o que iremos usar. Somente por esse motivo não poderíamos ter nosso site em nosso computador. Porém existem hoje em dia conexões via cabo (que são extremamente mais rápidas que as via modem). No futuro próximo, somente conexões assim serão viáveis, já

31 que o limite de velocidade dos modens convencionais chegou ao máximo. Quem quiser uma conexão mais rápida terá que optar por Internet via cabo, ou via rádio ou outros meios ainda em desenvolvimento. Acontece que essas conexões via cabo têm um diferencial sobre o modo como nos conectamos hoje em dia. Como elas ficam 24 horas no ar, elas nos dão um IP fixo. Dessa forma seria até possível que um amigo nosso, ao digitar o número IP de nosso computador/conexão conseguisse ver um site que criamos e estamos hospedando em nosso computador. No entanto agora teríamos uma outra limitação: os softwares que precisariam estar instalados para que isso fosse possível. T eríamos que ter um serviço Web como o IIS da Microsoft ou outro como o Apache. Sem esses programas também não há como identificar as páginas em nosso computador. E esses softwares que eu citei, que são os melhores e os mais utilizados, não rodam em Windows 98. Precisam de um NT no caso do IIS ou então de um Unix para o Apache. Isso sem contar outros softwares como um firewall para impedir que engraçadinhos venham bisbilhotar em seu computador e até mesmo deletar algum arquivo importante. Pelo seu rosto estou vendo que a coisa complicou, certo? Pois bem, resumindo: a) Outras pessoas só conseguem ver nossos arquivos e páginas na Web se souberem nosso número IP, que é o número que nos identifica na Internet quando estamos ligados nela. b) Como normalmente nosso número IP muda a cada conexão, porque ainda utilizamos conexão via modem, isso é muito difícil. c) Mesmo utilizando um número IP fixo o que acontece com serviços de Internet rápida via cabo teríamos que ter um programa de Web em nosso computador que nos transformaria em servidores Web. d) Se desligássemos o computador alguma hora do dia, nosso site estaria fora do ar e ninguém mais poderia vê-lo até ligarmos novamente a máquina. e) Há sempre o perigo de quem for acessar nosso computador não ser um amigo, e sim um hacker querendo apenas detonar nosso micro. Talvez agora tenha ficado mais claro. Ou talvez somente com o tempo você possa entender plenamente isso que expliquei. É como um filme que, ao ser visto pela segunda vez, nos permite notar alguns trechos não percebidos anteriormente.

32 No entanto, deu para entender que não é nem mais simples nem mais conveniente mantermos um servidor em casa, ou seja, um computador ligado 24 horas por dia para manter nosso site no ar. Para isso existem os serviços de hospedagem na Internet, sejam eles gratuitos, como no caso de alguns provedores de acesso que nos oferecem alguns megas de espaço para criarmos nossas páginas ou então os serviços pagos, mais profissionais e cheios de recursos, mas ainda assim, pagos. Respondida a questão sobre o porquê de não colocarmos nosso site em nosso próprio computador, restam-nos as alternativas de sites na Internet que nos deixem pôr nosso site gratuitamente ou aqueles pelos quais temos que pagar para isso. Tanto no caso de nosso provedores de acesso, que nos oferecem algum espaço para as páginas, quanto nos outros sites que oferecem espaço gratuito bastando nos cadastrarmos, temos normalmente um pequeno inconveniente: a maioria deles coloca algum banner em nossas páginas, queiramos ou não. Salvo alguns lugares, logicamente. Não podemos generalizar. Banners são a forma os provedores arranjaram para que aquele espaço gratuito tenha algum retorno financeiro para eles, o que até acho muito justo no caso de sites gratuitos. Primeiramente porque normalmente eles nos oferecem muito mais espaço e muito mais recursos até do que aqueles oferecidos pelos nossos provedores de acesso. E em segundo lugar porque também eles têm que sobreviver. Estamos nos utilizando de um serviço gratuito e vamos aproveitar para aprender e desenvolver nosso site. Quando virmos que vale a pena, sempre poderemos desembolsar uma grana e pagar um serviço de hospedagem, onde teremos ainda mais espaço, mais recursos e não iremos precisar de banners (a não ser os nossos, lógico). Outro inconveniente dos serviços gratuitos é o endereço utilizado para acessar as nossas páginas. Não podemos ter algo como sem pagar por isso, então normalmente será algo como ou até Nada muito complicado, mas às vezes é difícil de guardar. Já que você agora sabe o porquê de aparecer banners ou janelas pop-up (aquelas pequenas janelas que abrem quando entramos em algum site), saiba que em alguns lugares teremos que colocar por nossa conta mesmo o código nas páginas (veja só que já começamos a ter que entender o HTML de que falei antes). Na maioria dos sites de hospedagem, eles já possuem um sistema automático que insere esses anúncios mesmo se não quisermos ou não tendo colocado nenhum código em nossas páginas. Esse é o sistema mais utilizado hoje em dia. Como muita gente se con-

33 fundia na hora de colocar o código em suas páginas, optaram por inventar um sistema onde os anúncios são incluídos sem precisar que nós o façamos. Para quem é radicalmente contra banners, saiba que muitos sites de hospedagem permitem que paguemos para não ter mais a aparição dos mesmos. Mas aí você coloca tudo na ponta do lápis e constata que muitas vezes não compensa. Depende muito do que você deseja para seu site e de quantas pessoas o visitam diariamente. Se o fluxo de visitantes é pequeno não se aflija. No entanto, se for grande (mais de 200 visitas diárias), já seria interessante pensar em um site sem esses banners indesejados ou essas janelas pop-up que ficam abrindo (na verdade as janelas são um novo browser menor e sem os botões, mas que diminuem a performance de seu micro, já que a cada programa ou a cada janela de programa que você utiliza, o seu sistema operacional despende uma série de recursos como memória, etc., para esse fim, deixando seu computador mais devagar). Cabe aqui salientar novamente que não sou contra banners. T odo site tem que ter seus banners para poder sobreviver. É do dinheiro arrecadado com esses anúncios on-line que vários serviços sobrevivem. É como proibir a TV de veicular anúncios ou de arrancarmos os outdoors das ruas. No entanto se os banners forem seus ou se você estiver lucrando de certa forma com isso, então aí vale a pena. Repito aqui que, no caso dos sites que lhe oferecem um espaço gratuito na Internet, é assim que eles sobrevivem: com os banners em seu site. E quando você não deseja que esses banners sejam veiculados em suas páginas, tem que pagar uma quantia para que nenhum dos dois lados perca. Isso é absolutamente normal. Acostume-se com a idéia dos banners. Quem sabe um dia você terá um site tão visitado que você mesmo irá querer fazer publicidade nele ou mesmo nos outros sites? Muita gente começou pequena na Internet e hoje em dia aparece fazendo anúncios em grandes portais. Retomando: existem os espaços gratuitos que são os hospedados em nossos provedores de acesso; existem os espaços gratuitos onde temos mais recursos mas temos que colocar banners ou pagar para não tê-los; e também temos uma terceira alternativa, que são os sites de hospedagem pagos. Normalmente variando entre 15 e 40 reais mensais nos oferecem

34 um endereço mais simples de ser lembrado, um espaço maior e vários outros recursos. Cabe a cada um decidir qual é a melhor alternativa para o momento. Podemos começar com um site em nosso provedor de acesso ou então um gratuito com exibição de banners e depois migrar para um serviço totalmente pago, que é o que recomendo para sites pessoais. Comece de baixo e vá se acostumando, aprendendo, e, aos poucos, progrida até um site onde você tenha tudo o que precisa e a comodidade de escolher se quer ou não ter anúncios em suas páginas. Lista de Recursos Disponíveis em Sites de Hospedagem Vamos agora aprender a identificar os recursos que normalmente cada um desses sites de hospedagem gratuitos nos oferecem e o que são esses recursos. Vejamos a lista dos recursos disponíveis mais ofertados: 1. Espaço que varia de 5 a 50 MB (megabytes). Para se ter uma idéia, com 5 MB é possível ter cerca de 200 páginas com 25 KB cada uma com o equivalente a umas 15 páginas de Word cada uma, por exemplo, o que é um monte de texto. Se fôssemos comparar com o Word, 5 MB daria para armazenar um documento de aproximadamente 3000 páginas. Logicamente isso sem nenhuma imagem ou sem nenhuma tabela. Mas mesmo assim, veja que 5 MB são o suficiente para muitos e muitos sites existentes. Essa é a vantagem da Internet: arquivos pequenos. 2. Páginas de registro de seus visitantes. São formulários onde os visitantes de seu site podem deixar informações sobre eles e também alguma crítica ou sugestão sobre o site. 3. Páginas de pesquisa. Caso seu site tenha muito conteúdo, é interessante fornecer uma ferramenta onde seu visitante possa buscar a informação que ele procura de uma maneira fácil e rápida. 4. Listas de mensagens, onde seus visitantes podem participar de uma discussão por exemplo. É muito útil e divertido também em várias modalidades de sites, como por exemplo, um sobre jogos. Cada visitante poderá dar sua opinião sobre um novo game que foi lançado. 5. Acesso via FTP. É um dos itens mais importantes. O File Transfer Protocol nos ajuda a enviar os arquivos de dentro de nosso computador para

35 nosso site na Internet de um modo rápido e eficiente. É tão universal que podemos até enviar arquivos utilizando a janela do DOS do Windows (desde que estejamos conectados à Internet). 6. Acesso via FrontPage 2000 ou outro software como o Trelix. É também muito útil para transferência de arquivos. 7. Ge ren ci ador de Arquivos on-line. Um sistema onde, através de seu registro com senha, poderá acessar, através do seu browser de qualquer local do mundo, os seus arquivos e modificá-los também on-line. Como disse antes, é superinteressante ter essa facilidade, mas convém lembrar que normalmente é um recurso com velocidade reduzida para grandes modificações ou grandes arquivos. 8. Sistema de Procura para que seus visitantes achem o que procuram dentro de suas páginas ou na Internet. 9. Notícias. Através de um código, os visitantes de seu site poderão ler as últimas notícias do dia, disponíveis infelizmente apenas para alguns sites como o Yahoo! GeoCities. Pode-se escolher entre vários tipos de notícias, que veremos depois. 10. Contadores de páginas, para você saber quantas vezes sua página foi vista. 11. Relógios de hora e relógios de contagem regressiva para várias finalidades, como por exemplo, dizendo quantos dias faltam para seu aniversário, para o nascimento do bebê, para o final do ano, para uma festa ou o lançamento de algum serviço ou empresa. 12. Se rvi ços de mídia streaming, ou seja, você pode utilizar streamings como RealPlayer onde os seus visitantes poderiam ouvir sua voz ou música em tempo real. 13. Comunidades on-line, com o que poderíamos chamar de bairros virtuais onde as pessoas com determinados interesses escolhem ter seus sites ali. Dessa forma acabam formando amizades com seus vizinhos virtuais e desenvolvendo novas relações, um podendo ajudar o outro em ambos os sites. Normalmente há uma espécie de prefeito ou síndico que é a pessoa mais experiente e que acaba ajudando a todos os que moram nesse bairro virtual gratuito, ótimo para você entrar em contato com seus visitantes e seus amigos.

36 15. Possibilidade de colocar mais banners e lucrar com isso. Serviço onde, através de banners (anúncios animados ou não) colocados em nosso site, ganhamos pontos ou dinheiro de acordo com a proporção em que eles são vistos ou clicados. 16. Diretórios com cli parts e imagens para você escolher e poder usar em seu site. Normalmente é bem simples, mas ajuda bastante quem está começando e não tem idéia de onde encontrar suas primeiras imagens. 17. Jogos on-line para você poder colocar em seu site, mas nada de apostas em dinheiro, pois isso é proibido. Apenas jogos bem simples para atrair visitantes ao seu site. Como vimos, temos mais do que uma dezena de recursos que identifiquei. E isso é só o começo. Existem muitos mais. T emos sites que hospedam páginas que nos dão acesso a bancos de dados, ou seja, podemos ter uma base de dados em msql (mini SQ L) ou em Access, o mais comum, onde poderemos armazenar informações e ter um site mais dinâmico; temos outros que estão surgindo onde poderemos colocar páginas para celulares, utilizando a tecnologia chamada WAP, espaços que aceitem outros tipos de arquivos como MP3, SHTML, PERL, PHP, ASP, ou seja, infinitas possibilidades que só tendem a aumentar de acordo com a procura. Há pouco tempo, as mudanças ocorriam anualmente até na rede mundial, mas agora novos programas e novas funcionabilidades nos impulsionaram cada vez mais rápido, e praticamente a cada semana há algo novo, levando mais alguns meses apenas para que sejam efetivados. E a velocidade aumenta cada vez mais. Mas não se assuste. Com o básico você irá muito longe, e depois aprenderá pelo caminho. O primeiro passo você já deu, que é a vontade de progredir e colocar seu site na Internet. Vamos então continuar nossa jornada. Vimos, portanto, que existem diversos tipos de recursos que o lugar onde vamos hospedar nossa homepage e as outras páginas pode nos oferecer. Temos que identificar os mais importantes. Entre eles, com certeza os mais relevantes são: Espaço quanto mais melhor, com certeza. Apesar dos arquivos pequenos que devemos usar na Internet, podemos, por exemplo, algum dia precisar disponibilizar um arquivo com uma apresentação para amigos ou deixar uma música para que outros a peguem depois, ou mesmo nós possamos ter acesso a esses arquivos seja no nosso trabalho, em casa ou em viagem. Páginas com formulários, seja para pesquisa ou para registro de seus visitantes. Acesso via FTP por ser um dos mais rápidos métodos de transmissão de arquivos, é de extrema importância ter esse serviço disponível.

37 Acesso via FrontPage 2000 ou outro software como o Trelix também com certeza é muito útil, pois permite não apenas enviar arquivos com também editá-los on-line. Na transferência de arquivos é mais lento que o via FTP, mas porque normalmente verifica links evitando assim alguns erros básicos também. Ge renciador de Arquivos on-line, para que, na impossibilidade de se ter por perto um computador com os programas que você utiliza para criação e envio de páginas, como o FrontPage, o Dreamweaver ou o CuteFTP, você ainda possa enviar alguns arquivos ou efetuar pequenas modificações, utilizando apenas um browser (navegador como o Internet Explorer ou o Netscape) com acesso à Internet. Contadores de páginas também são muito úteis, talvez não no início, mas com certeza para o futuro (veremos isso mais à frente). gratuito é sempre bom podermos utilizar um para recebermos sugestões, etc, principalmente quando o nosso formulário de contato falha por qualquer motivo que seja. Os melhores serviços de hospedagem de site nos dão o acesso ao gratuito via Webmail, ou seja, você pode ler, escrever e gerenciar seus s pela janela de seu navegador como o Internet Explorer ou o Netscape, desde que conectado ao seu provedor de acesso, lógico. E também é muito importante os que nos deixam ver nossos s pelo acesso POP3, que é um protocolo utilizado pelos melhores programas de leitura de , como o Outlook Express, o Eudora, entre vários outros. Isso nos permite conectar à Internet, baixar os e- mails do servidor onde eles estão guardados e podemos então nos desligar do provedor e ler sossegado as mensagens off-line, ou seja, sem que a linha de telefone esteja sendo utilizada, já que trouxemos toda nossa correspondência para nosso micro. Realmente muito prático. Temos também que saber como identificar os principais recursos de um site pago, não é? Afinal de contas, talvez você queira colocar sua empresa na Internet e não quer contar apenas com o que um serviço de hospedagem gratuito lhe oferece. E realmente é muito feio quando vemos empresas colocarem seus sites nesse tipo de serviço. Veja agora o que normalmente é oferecido em serviços pagos. Nome de domínio próprio nos sites de hospedagem profissionais você pode escolher entre ter um site de domínio próprio, que você escolhe o nome exemplo: ou ou ter um endereço como Normalmente este último tem um custo menor, além de não ser necessário o registro do nome do site na FAPESP ou na IN- TERNIC. Espaço em disco que varia de 50 MB a 300 ou 500 MB.

38 Taxa de Transferência mensal de 2 GB ou ilimitada (essa taxa é calculada mediante cada solicitação de arquivos de seu site). Se suas páginas forem muito visitadas, a taxa é maior, se forem menos, a taxa é menor. 2GB é mais do que suficiente para muitos sites profissionais. T ambém pode ser chamada de Taxa de Hits. Relatório de visitas WebTrends ótima ferramenta para visualizar e gerar relatórios de visitas de suas páginas. Esse recurso pode ter uma taxa extra ou não, dependendo do provedor. Contas PO P3 de contas de com o nome de seu site. Exemplo: jose@seusite.com.br, maria@seusite.com.br. Normalmente a quantidade de contas POP3 é baixa, entre 10 a 20. A maior vantagem das contas POP3 é a possibilidade de se utilizar softwares como o Outlook ou o Eudora para receber essas mensagens, podendo lê-las e respondê-las off-line, ou seja, desligado da Internet (depois de efetuar o download das mensagens, logicamente). Apelidos de ilimitados ou Aliases ilimitados para compensar a pouca quantidade de contas POP3 de verdade, você tem a opção de utilizar apelidos em seus s. Exemplo: as pessoas podem escrever para o mariamole@seusite.com.br, guarana@seusite.com.br, qualquer_nome@seusite.com.br e esses endereços de (que logicamente não existem dentro daqueles nomes de s conta POP3) são redirecionados para um dos s verdadeiros com conta POP3. Isso é bom quando alguém escreve o nome errado do seu . A chance de perda de mensagens é menor, mas o não é privativo. Redirecionamentos de ilimitados é a mesma coisa dos apelidos, praticamente, mas você pode configurar e criar apelidos que com certeza irão para determinado real POP3. Webmail possibilidade de ler, escrever e enviar s utilizando seu browser de qualquer lugar do mundo. Site seguro com SSL com o SSL você pode ter páginas seguras, com criptografia em seu site, para poder passar informações sigilosas. Atualização ilimitada via FTP uma das maneiras mais rápidas de enviar seus arquivos para seu site. Chat você pode ter um bate-papo dentro de seu site. ASP linguagem da Microsoft para criar páginas Active Server Pages e poder ter mais controles em sua página e acessar bancos de dados.

39 FrontPage 98/2000 extensões para você poder usar seu FrontPage para criar e atualizar seu site pela Internet, além de permitir vários outros recursos. Access 97/2000 juntamente com a linguagem ASP permite que você armazene informações em bancos de dados na Internet. ColdFusion assim como o ASP, também permite o acesso a bancos de dados pela Internet, além de permitir a criação de templates em seu site páginas-modelo que contenham um padrão gráfico mas podem ser utilizadas para mostrar conteúdos diversos, minimizando assim a criação de páginas e mais páginas diferentes para seu site. PERL / CGI linguagens de programação de scripts que lhe permitem desde a criação de contadores até o envio de formulários para s, etc. Praticamente sem fim a utilidade deles. PHP4 também uma nova linguagem que permite praticamente o mesmo controle e acesso que o ASP ou o ColdFusion. MySQ L banco de dados gratuito que utiliza o SQL básico/nativo para armazenar informações. Administracao We b do MySQL possibilida de de modificar tabelas, campos e atualização de seu banco de dados pela Internet. Te lnet padrão de comunicação utilizado atualmente principalmente para administrar caixas postais de pela Internet. Processador de formulários scripts já prontos para você ter seus formulários enviados para sua conta de e muito mais. Contador de acessos contador que pode ser invisível ou não, para que você possa saber quantas pessoas visitaram seu site. Backup diário caso aconteça algo com suas páginas, por erro operacional do provedor ou caso, por descuido, você mesmo delete suas páginas, todo dia elas são armazenadas em fita DAT em lugar seguro, para que possam ser restauradas. Normalmente há um custo (até mesmo meio elevado) para essa restauração. O backup está embutido no preço mensal. Suporte a WML/WAP você pode utilizar e armazenar páginas no formato WML para acesso por celular. Diretórios Prote gi dos oferece a possibilidade de facilmente configurar uma senha de acesso para os arquivos que ficarem dentro de determinado diretório.

40 Página de Erro Configurável quando, por algum acaso, um link em seu site estiver errado, essa página é mostrada no lugar da mensagem de erro de seu browser. Muito útil. RealAudio, RealVideo, MacroMedia Shockwave, suporte a MIDI permite a utilização de arquivos multimídia em seu site. Normalmente os serviços de hospedagem já aceitam os formatos mais comuns como o Shockwave e Flash, mas nem todos permitem o RealAudio. Agora que sabemos identificar os itens que nos levariam a escolher entre um local de hospedagem e outro, temos que fazer um levantamento entre todos os concorrentes. Existem dezenas, senão centenas de provedores de acesso à Internet em nosso país, além de outros tantos que oferecem serviços de hospedagem paga, e este livro não conseguiria enumerar todos eles, já que muitos acabam sumindo ou então sendo comprados por empresas maiores e a informação dada aqui seria desatualizada. A intenção deste livro não é indicar nenhum serviço como sendo melhor que outro. Nós mesmos temos que experimentar e verificar se o serviço oferecido atende a nossas expectativas. Estou fornecendo aqui o conhecimento técnico para você saber discernir entre o que de melhor lhe oferecerem. Também cabe a este livro ensinar como colocar seu site no ar, utilizando as ferramentas do seu serviço de hospedagem ou então softwares como o CuteFTP. T ambém entendo que a maior parte dos leitores deste livro nunca colocou uma página na Internet ou então chegou até o ponto de fazer em sua casa ou escritório algumas páginas, mas não colocou-as no ar ainda por alguma dificuldade. Por isso vou explicar aqui o básico de como proceder. Somente assim você terá certeza de que saberá se virar bem em qualquer circunstância, seja nos provedores que utilizo aqui como exemplo ou em qualquer outro, seja ele gratuito ou pago. T entei reunir aqui os maiores provedores de acesso do Brasil, que permitem que seus clientes tenham um espaço gratuito em seus servidores e possam ali armazenar suas páginas. Também reuni os sites que oferecem espaço gratuito, que eu mesmo recomendaria e enumerei o que cada um deles oferece basicamente. Desculpem-me se seu provedor não se encontra nesta lista. O importante é entender os recursos de cada um

41 para que possamos depois entender o que um outro provedor ou site de hospedagem de sites nos oferece caso a caso. Aqui estão eles: BO L TERRA UO L YAHOO! GEOCITIES Vejamos o que cada um deles tem de mais interessante atualmente. O que o BOL VilaBOL nos Oferece BO L O BOL criou recentemente a Vila BOL, onde pretende também criar uma comunidade, com bairros, etc. Vejamos o que tem a nos oferecer: 1. Um endereço mais simples de decorar. Por exemplo: em que miguel é o mesmo nome de usuário da sua conta no BOL. Alguns lugares realmente complicam o endereço do seu site; 2. Possibilidade de convidar seus amigos para conhecer seu site, bastando para isso informar o deles; 3. Gerenciador de Arquivos, que é um sistema em que você pode administrar todos os seus arquivos. Já explicado anteriormente. Por exemplo: se você quiser mandar fotos do nascimento do seu filho ou de uma viagem para seus amigos e parentes, basta você criar uma página na VilaBOL e enviar as fotos do seu computador para a VilaBOL usando o Gerenciador de Arquivos. Depois é só divulgar, para quem você quiser, o endereço de sua página; MB de espaço para suas páginas, fotos, arquivos de som, vídeo, etc.; 5. Ao fazer o cadastro de seu site na VilaBOL, um arquivo com o endereço do seu site e seu (entre outras coisas) entra automaticamente como a página inicial de seu site. Assim, seu site não fica em branco enquanto você ainda está construindo as suas páginas;

42 6. Facilidade de navegação na VilaBOL, ou seja, você pode procurar os sites hospedados no BOL de acordo com sua categoria ou subcategoria. Com a busca interna da VilaBOL, você ainda poderá fazer uma busca simples, procurando pelo nome de um amigo ou por um tema de seu interesse; 7. Se você quiser que seus arquivos não fiquem visíveis para os usuários da Internet, basta guardá-los no diretório pasta_secreta do Gerenciador de Arquivos da VilaBOL. Nesse diretório, você pode usar todas as funções do gerenciador normalmente: copiar, renomear, mover, apagar e criar novas pastas. Ao clicar sobre o nome de cada arquivo, você poderá transferi-lo para o seu computador; uma tela se abrirá e nela você escolherá se quer salvar o arquivo ou somente abri-lo; 8. Você pode consultar o Manual de HTML da VilaBOL e aprender tudo sobre construção de sites, e tirar suas dúvidas na ajuda geral e no glossário sobre termos comuns na Internet; 9. Se seu site for bastante popular, poderá entrar no ranking dos dez sites mais acessados da VilaBOL e pode ser escolhido pela equipe da VilaBOL para ser o Destaque do Dia ; 10. Ao se tornar usuário da VilaBOL, você também ganha: uma conta de gratuito (com acesso via POP3 e via Webmail); poderá utilizar o Multidiscador BOL para achar uma linha desocupada nas Internets grátis; um Buscador Miner personalizado, para fazer pesquisas na Internet; clipping de notícias personalizado; boletins por . O Que o TERRA Planeta Terra nos Oferece TERRA O Planeta Terra é um serviço gratuito de hospedagem de páginas. 1. Seu site ficará com o endereço geralmente parecido com

43 2. O Planeta oferece ainda uma ferramenta de busca e catalogação das páginas que o compõem; 3. O serviço aceita também a criação de diretórios e subdiretórios para que você possa organizar melhor o conteúdo do seu site. Por exemplo, você pode criar um diretório para manter todas as imagens da sua página juntas; 4. O espaço que você terá para seu site depende de alguns fatores: usuários do provedor Terra recebem 50 MB de espaço em disco, usuários do Terra Livre recebem 10 MB, e usuários que não possuem conta na Terra recebem apenas 5 MB; 5. Caso se cadastre no Terra Livre, poderá ter ainda um para se comunicar com outras pessoas pela Internet, e ainda aumentar seu espaço para o site como vimos no item anterior; 6. Caso queira, você pode ter seu site hospedado na Terra com domínio próprio (ex: Dentro da empresa Terra Networks do Brasil, há um departamento especializado em hospedagens comerciais; 7. Você poderá atualizar seu site via FTP; 8. Também para atualização, você poderá contar com um gerenciador de páginas bastando para isso acessar a homepage do Planeta T erra, digitar seu login e senha e então enviar suas páginas para seu site. Até a edição deste livro ainda não era permitido mexer diretamente no código das páginas online. Você teria que trazê-las para seu computador, alterar o que é preciso e depois enviar de volta; 9. Contador de acessos; 10. Formulário de . O Que o UOL nos Oferece UO L O UOL deve ser possivelmente o maior dos provedores de acesso de Internet do Brasil, e por isso foi escolhido também por mim para aparecer neste livro. No entanto ele não oferece muitos recursos para seus assinantes que desejam ter um site hospedado nele. Vejamos quais as principais vantagens: MB de espaço em disco para seu site;

44 2. Seu site com endereço 3. Contador de acessos; 4. Últimas notícias; 5. Busca pelo Radar UOL diretamente pelo seu site. O Que o Yahoo! GeoCities nos Oferece Yahoo! GeoCities 1. Ferramentas on-line para construção de suas páginas; MB de espaço total para seu site; 3. Templates (modelos) de páginas para você já utilizar, com cores, fontes, imagens; 4. Acessórios já prontos para você inserir em suas páginas e ir utilizando. Entre eles: busca na Web manchetes das últimas notícias contador de acessos formulários detector de presença do Yahoo! Messenger; 5. Acesso via FTP; 6. Gerenciador de arquivos on-line, onde você poderá criar, editar, enviar arquivos, deletar e gerenciar todos os seus arquivos no seu diretório e nos subdiretórios; 7. Comunidade Virtual para você ter seu site perto de outros que tenham os mesmos interesses na Internet; 8. mensal com todas as novidades e implementações que o Yahoo! GeoCities vêm realizando;

45 9. Ajuda on-line com tutoriais, códigos, etc.; 10. Através do seu cadastro você recebe também um no Yahoo! e poderá usar os mesmos nome de usuário e senha para entrar em chats, utilizar o programa de mensagens instantâneas deles, chamado Messenger (como o ICQ para quem conhece). Poderá também participar de jogos on-line, ter seu calendário para eventos, dar lances em leilões do Yahoo!, etc, etc.; 11. Por último poder participar de programas de fidelidade, por assim dizer, onde você poderá colocar seu banner para rodar no sistema do Yahoo!, podendo assim ganhar pontos ou dinheiro. Bem, finalizamos esta lição com todas as principais diferenças e vantagens (ou desvantagens) que os principais fornecedores de espaço gratuito na Internet nos oferecem. Como vimos e você pôde perceber, temos muito o que saber para poder escolher o ou os melhores serviços, certo? Cabe agora a você decidir qual é o mais adequado ao seu site. Vamos agora ver como podemos nos cadastrar em cada um deles, pois esse também é um capítulo à parte. São tantas perguntas que muitos se perdem pelo caminho. Mas calma que são todas fáceis de responder. Vamos a elas.

46 CAPÍTULO 3 RESERVE SEU ESPAÇO NA INTERNET CRIANDO SEU SITE Neste capítulo você aprenderá a criar e a configurar seu site nos diversos lugares que oferecem espaço gratuito na Web. Vamos passo-a-passo ensinando como proceder em cada caso. Vou manter a mesma ordem dos serviços apresentados no capítulo anterior e vamos um a um. VilaBOL Passo 1 Conect e-se à Int ernet e digit e o endereço ou então visite o site do BOL ( e clique no link do VilaBOL. Logo você verá uma tela como a da Figura 3.1. Essa tela é a mesma que você usará quando já estiver cadastrado no sistema. Caso você já possua um no BOL, seu cadastro para o VilaBOL será mais simples, mas aqui vamos explicar passo a passo como se você nunca tivesse se cadastrado antes, como se fosse a primeira vez. Como primeiro passo, clique onde a seta está indicando: Inscreva-se Já.

47 Figura 3.1 Passo 2 A tela que veremos agora será a do contrato. Aqui teremos todas as cláusulas do que o BOL nos oferece e do que não podemos fazer, como hospedar sites de conteúdo proibido, como pedofilia, sexo, entre outras coisas. Basicamente todos os serviços onde formos efetuar o nosso cadastro irá nos propor contratos semelhantes. Caso nunca tenha lido um, é interessante fazê-lo para você ter conhecimento do conteúdo do mesmo. Lembre-se de que, ao clicar no botão Aceito os te rmos de compromi sso estará concordando com tudo o que estiver ali escrito. Se clicar no botão Não aceito... nem terá a chance de seguir em frente.

48 Figura 3.2 Depois de ler o que está escrito lá, clique no botão Aceito os termos de compromisso e siga em frente.

49 Passo 3 Somos apresentados agora ao cadastro que iremos ter que preencher para podermos utilizar os serviços do BOL. Precisamos fornecer nosso nome, sobrenome e escolher um nome de usuário. O nome de usuário será aquele pelo qual o BOL irá nos reconhecer. Como pode ser um nome bem curto, fica bem mais simples do que ter que escrever nosso nome e sobrenome toda vez que nos conectarmos no serviço. Esse mesmo nome de usuário será o utilizado para criar o seu no BOL. Na verdade se você reparar, o cadastro no VilaBOL não é independente do , ou seja, você precisa se filiar ao BOL como usuário de também, não podendo ficar sem essa opção. O contrário já é possível, ou seja, você pode ter uma caixa postal de sem ter configurado seu endereço no VilaBOL. Porém se você tiver um já no BOL, seu endereço no VilaBOL fica segurado. Ninguém poderá usar um nome de usuário que já exista no sistema do BOL. Digite agora uma senha. Ela garantirá que irá garantir que ninguém venha ao seu site e detone com ele, por exemplo. É através de sua senha que se obtém a garantia de que somente você pode editar seu site e também ver as mensagens do serviço de correio eletrônico. O número mínimo de caracteres (que podem ser letras, números ou alguns caracteres especiais, como traço (-) e sublinhado (_) é seis. Ou seja, tem que criar uma senha com 6 letras, 6 números ou uma combinação de letras e números, com no mínimo 6 posições. Pode ter mais caracteres também. Isso aumenta sua segurança. Não tente nada muito simples de outros adivinharem como sua data de nascimento ou algo assim. É o que recomenda todo serviço eletrônico. Desde bancos até a Internet, senhas são algo muito valioso. Não bobeie mesmo e tente sempre mudar sua senha de 3 em 3 meses. No mínimo de 6 em 6 meses. Também não vá inventar nada que depois se esqueça facilmente, ok? Eu já trabalhei com administradores de rede que esqueceram a senha de um projeto e tiveram que começar tudo de novo. No BOL esse problema já é mais difícil de acontecer por causa da próxima pergunta: Dica de senha. Através dela poderemos ter uma idéia do que era nossa senha caso a esqueçamos. Digamos que você colocou como senha a chapa do seu carro mais o número do seu apartamento. Então você poderia colocar como dica carro+apto.

50 Figura 3.3 Nota: Temos que digitar duas vezes a senha, por segurança apenas. Clique em Avançar. Passo 4 Pode acontecer de algum dado apresentar algum erro na hora de enviar o formulário. Normalmente o erro mais comum a acontecer será a existência de alguém com o mesmo nome de usuário que você gostaria de utilizar. Nomes própri-

51 os, sozinhos, como Marcio, Joao, Claudia e tantos outros com certeza já estão sendo utilizados por outras pessoas que chegaram na nossa frente. A Internet é isso aí mesmo. Por isso temos que já pensar em alternativas, como utilizar seu nome com as letras do seu sobrenome ou algo assim. Não adianta chorar. Chegou primeiro, pegou o nome. Figura 3.4 Então, esteja sempre pronto e já pense em algum nome de usuário que seja simples de você se lembrar e também que não seja um amontoado de letras que nada tenham a ver com você. Assim que consertar o dado que estava dando algum problema o próprio sistema irá lhe avisar o que aconteceu clique em Avançar novamente. Passo 5 Continuando com o cadastro, precisaremos fornecer mais alguns dados, como sexo, CEP de onde moramos ou então de nosso trabalho, estado civil, escolaridade, ocupação (basta clicar na seta ao lado do campo e ele irá nos mostrar as opções disponíveis). Selecione uma das ocupações. Também nos pedem a renda familiar mensal (como isso é um dado muito pessoal, eu nunca colocaria ali o valor real). Escolha apenas o valor mais baixo. Por último, temos a pergunta sobre se já fizemos algum compra via Internet. É muito pouca a porcentagem de pessoas que já o fizeram. Selecione a opção que melhor que convier e clique depois no botão Avançar. Passo 6 Lembre-se de que informamos o CEP na tela anterior, certo? Com essa informação foi possível para o BOL localizar a rua correspondente ao CEP. Nesta tela é pedido o número de nossa residência ou escritório e o complemento caso haja algum (apartamento número tal, bloco, fundos, etc.). Também precisamos informar um número telefônico para contato. Não que eles vão nos ligar para nada, mas de toda forma o cadastro pede esses dados.

52 Figura 3.5 Caso você já possua de outro local, informe aqui caso queira. Esse dado é opcional. Clique em Avançar para continuar novamente.

53 Figura 3.6 Passo 7 Com todos esses dados, o BOL irá apresentar a página de confirmação de que você já está cadastrado nos serviços de gratuito e também no Vila- BOL, serviço gratuito de hospedagem de sites, que é o que mais nos interessa. O deles também é um bom serviço, com acesso a POP3 (você pode enviar e receber suas mensagens pelo Outlook ou por outro software de s como o Eudora ou mesmo o Netscape) e Webmail para acesso via Web de qualquer computador no mundo que tenha conexão com a Internet.

54 Figura 3.7 Passo 8 Vamos agora configurar o nosso VilaBOL. Se você pensava que já havia acabado de preencher todas as perguntas, calma. Ainda tem mais pela frente, mas são todas simples. Clique no link VilaBOL da página da Figura 3.7. Caso você tenha saído da página ou então queira responder às próximas perguntas depois, não tem problema. Seu cadastro já foi efetuado e seu endereço no VilaBOL já foi assegurado também. No caso de querer preencher depois, basta voltar ao BOL ( e clicar no link VilaBOL que existe na página. Ou então ir direto para o Você verá a seguinte tela: Figura 3.8

55 É a mesma que já vimos no início, lembra-se? Mas daquela vez, como não estávamos cadastrados, clicamos em Inscre va-se já!. Agora que já temos nossos dados no sistema, basta preenchermos os campos e senha. No campo , preencha com o nome de seu usuário. Agora embaixo digite sua senha. Você verá apenas asteriscos * pois é um campo secreto. Isso impede que outros vejam sua senha enquanto a digita. Clique no botão En trar. Passo 10 Agora precisamos fornecer alguns dados para que o VilaBOL possa nos criar um site. Antes de dar este passo, é interessante que já tenhamos bem definido (ou pelo menos parcialmente definido) do que vai se tratar nosso site. Se ele será um site pessoal sobre música, sobre nossa carreira, sobre nossos hobbies, um site de fotografias, sobre cultura, T V, cinema, teatro, enfim, o que vamos querer mostrar aos que chegarem a visitar nosso espacinho na Internet. Lógico que podemos começar com algo bem simples e ir desenvolvendo ou modificando com o tempo. Podemos sempre voltar e modificar os dados que vamos digitar nesta etapa da criação do site. Vou dar alguns instantes para você pensar sobre o que gostaria de tratar ou mostrar em seu site... Pronto? Puxa, isso foi rápido. Parabéns. Vamos então prosseguir. Veja que nessa tela temos várias perguntas que teremos que responder. Vamos verificar uma a uma: 1 Qual será o título do seu site? Esta primeira pergunta é opcional, ou seja, você pode ou não respondê-la. Aqui basta colocar uma breve descrição do site. Se for um site pessoal pode ser algo como Site do fulano de tal ou se for sobre um artista algo como Tributo ao artista tal ou Fanzine do artista tal. Tem que ser curto e claro. 2 Qual será o tema do site? Aqui sim é obrigatório responder, e é aqui que você poderá dar mais detalhes sobre o seu site. Não muito extensa, lógico, mas uma melhor explicação. Veja que para cada pergunta o próprio VilaBOL lhe dá um exemplo em seguida para facilitar o entendimento.

56 Figura 3.9

57 3 Digite algumas palavras-chave. Apesar de dizerem que o campo é opcional, não deixe de preenchê-lo com palavras que resumam o seu site. Você já deve conhecer os sistemas de busca da Internet, não? Bem, é através deles que os navegantes da web encontram os sites que procuram. Eles digitam uma ou mais palavras sobre o que querem e esses sistemas trazem todos os sites cadastrados que têm aquele tipo de descrição. Sendo assim, você, ao definir algumas palavras-chave para seu site, também estará ajudando aos surfistas da Internet a encontrar o seu endereço, além de atrair exatamente o público que você queria. Por isso é tão importante definir de 2 a 6 palavras que resumam seu site e digitá-las nesse campo, separadas por vírgula e espaço, a menos que queira um site escondido, só para você, não planejando que outras pessoas o encontrem, a não ser que você forneça o endereço para essas pessoas escolhidas. 4 Você deseja que essas informações apareçam para usuários do BO L? Escolha se quer ou não que outras pessoas vejam as informações que você está passando nesta página. Aqui é uma pergunta exclusiva para os usuários do BOL, porque quem é cadastrado tem um sistema de pesquisa próprio, fechado para os que têm sites no VilaBOL (campo obrigatório). 5 Escolha apenas uma categoria na qual seu site poderia ser classificado. T ambém um campo obrigatório e que irá definir onde seu site ficará, dentro da comunidade do VilaBOL. Com a informação aqui escolhida o sistema irá deixá-lo mais próximo a outros sites com os mesmos interesses. Escolha um dos temas e clique na caixa de seleção para ter mais opções a respeito daquele tema. Apenas uma das caixas de seleção pode ser selecionada, e conseqüentemente apenas um tema escolhido. Do lado esquerdo da página você vê seis motivos para se filiar ao VilaBOL. Cada um deles possui um link que irá redirecioná-lo para mais detalhes sobre aquele determinado assunto. Não é preciso sair dessa página de cadastro pois todos esses motivos eu já coloquei neste livro e você já teve a chance de ler. Bem, para finalizar basta apenas clicar no botão Cadastrar agora! no final da página e esperar a tela de confirmação. Nela teremos o endereço de nosso site anote-o em algum lugar para não se esquecer e também já podemos começar a construir as páginas que vão fazer parte dele. Repare que o menu lateral esquerdo mudou também. Agora você tem à sua disposição ferramentas para poder criar, editar e enviar os arquivos do seu site para seu novo endereço.

58 Figura 3.10 Pronto, agora já temos nosso próprio endereço de e também nosso espaço para o site. Veremos na próxima lição como enviar nossos arquivos utilizando os recursos do próprio site e como gerenciar, criar e editar os arquivos já existentes tudo on-line. Podemos enviar arquivos zipados para o site e então você pode dezipá-los todos de uma vez em seu diretório. A vantagem disso é que agora podemos comprimir todos os nossos arquivos (o que reduz o tempo de envio) e enviar apenas um arquivo.zip contendo todas as páginas e imagens que queremos enviar. Não é preciso enviar cinco arquivos de cada vez, o que dificultava e muito o trabalho. T ambém foram incluídos novos modelos de homepages, todas para crianças. Caso você queira montar um site para seu filho, aqui está sua oportunidade. Vejamos a seguir como é o esquema básico de criação de sites infantis pelo sistema Passo-a-passo do VilaBOL.

59 Veja que temos, ao clicarmos no menu Construa sua página, as opções de construir uma página pelo Editor Passo-a-passo normal, ou pelo Editor Passo-apasso para Crianças ou, para quem já tem mais experiência com HTML, pelo Editor básico. Figura 3.11 Os editores Passo-a-passo lhe permitem criar uma página de cada vez, e você pode escolher entre seis modelos diferentes de páginas. Quatro modelos para o Editor Passo-a-passo normal e mais dois para o de crianças. Nota: Na criação de um site de crianças é aconselhável o acompanhamento de um adulto, pois são várias as perguntas e algumas podem ser difíceis para uma criança responder, além de que o próprio VilaBOL avisa: nunca coloque seu endereço ou alguma informação mais pessoal nas páginas.

60 Em ambos os casos de Passo-a-passo, tudo o que você tem a fazer é responder a algumas perguntas, que chegam a até 17, às vezes, e também fornecer algumas fotos, como no caso de um site pessoal ou sobre bebês ou mesmo sobre nosso cãozinho. Temos que ter uma foto já digitalizada de nós mesmos ou de quem iremos fazer o site. Para isso, uma sugestão é de que a foto não tenha mais do que 170x170 pixeis, preferencialmente com 150x150. A área que temos não é muito maior que isso. Acho que o essencial aqui é explicar o processo de cada um deles (o Passo-a-passo normal e o para crianças) e com isso certamente você será capaz de concluir qualquer uma das outras opções. É realmente muito simples. Vamos começar por criar uma página pelo Passo-a-passo básico. Clique no link Editor Passo-a-passo como mostra a Figura 3.12: Logo após clicar no link, verá outra tela. Figura 3.12 Figura 3.13 Aqui é apenas uma página explicativa dizendo que temos que responder a algumas perguntas, etc, etc. Clique logo em C ome ce a criar o seu si te Veremos em seguida a próxima tela já com a primeira pergunta:

61 Aqui teremos que dar um título para a página que irá aparecer na barrinha azul (normalmente é azul a menos que você tenha modificado as configurações originais de cores de seu computador) lá em cima no navegador. Basta digitar e clicar no botão Próximo. Figura 3.14 Em seguida temos que escolher um visual para o site. Vamos encontrar em vários dos modelos de Passo-a-passo uma tela como essa, onde iremos escolher entre três ou quatro tipos diferentes de combinação de cores para nossa página. Basta escolher clicando nos círculos de seleção ao lado de cada figura e depois clicando no botão Próximo. Figura 3.15

62 Nota: Caso você tenha alguma dúvida sobre o que colocou nas páginas anteriores, utilize o botão Anterior para voltar. Antes de prosseguirmos, um dado importante: Não fique muito tempo parado em uma página quando estiver utilizando o Passo-apasso. O sistema do VilaBOL tem um tempo de alguns minutos para criação da página. Se você esquecer a página aberta para fazer alguma outra coisa, não poderá mais utilizar o processo, tendo que voltar desde o início e começar tudo de novo. Isso é feito para proteger você, já que você entrou no sistema com nome e senha. É como o sistema de internet banking se você já utilizou alguma vez. Esse tempo que você tem para efetuar uma operação em uma página ou então para escrever ou ler o que está contido nela até o momento em que clicar o botão é chamado de timeout. É o tempo que se julga necessário normalmente para que seja concretizado o que existe na página até a passagem para outra. Por isso este livro ajudará você, pois já terá a chance de saber os passos que irá seguir e se preparar, já escrevendo em algum lugar o que será necessário e preparando as fotos que precisar. Com isso em mente, vamos retomar os procedimentos Passo-a-passo. Assim que terminar de escolher a opção de cores que mais lhe agradar, clique no botão para continuarmos. Passo 3 Repare que, agora, o gráfico do lado esquerdo, embaixo do desenho do VilaBOL, nos apresenta uma representação com números. A pergunta número 3 é sobre o nosso nome. Esse nome irá aparecer exatamente onde o gráfico nos mostra, na barra em cima. Figura 3.16 O passo 4 agora nos possibilita colocar uma foto nossa na página que estamos criando. Veja onde a imagem irá ficar pela representação que aparece à esquerda.

63 Para localizar a sua foto (que já foi digitalizada e está dentro dos tamanhos que já lhes passei antes), clique no botão Browse. Isso irá abrir uma janela onde você verá seu computador. Procure a foto onde a guardou e clique no botão Abrir ou O pen daquela janela. Automaticamente o nome e a localização do seu arquivo de foto (que deve ser obrigatoriamente um.jpg ou um.gif, os formatos de imagem mais aceitos na Internet) irão preencher o campo ao lado do botão Browse. Caso a imagem que você deseja esteja em um site da Internet, por exemplo, digite o endereço dela no campo logo abaixo ao invés de utilizar o botão Browse. Assim que terminar clique no botão Próximo. Figura 3.17 O passo 5 já vem automaticamente preenchido com seu do BOL. Caso deseje, basta modificá-lo redigitando-o no campo em que ele aparece. Clique no botão Próximo para irmos adiante. Figura 3.18

64 Neste passo 6 temos dois itens. O primeiro é um título que iremos colocar referente a um texto falando sobre você ou sobre a pessoa que está fazendo esta página. Veja na representação gráfica onde ficarão esse título e texto. O título ficará em negrito na página final e o texto ficará em letras normais logo abaixo. Pense sobre um título que melhor se encaixe no que quer dizer e então escreva-o no primeiro campo, e logo no próximo campo, um texto que fale sobre você. Figura 3.19 O próximo passo é sobre seus interesses, como hobbies, diversão, etc. Ou seja, tudo o que você gosta (e talvez também o que não gosta) de fazer e curtir. Pense sobre isso e então digite no primeiro campo um título para esse texto, como Meus interesses ou Meus hobbies ou ainda O que gosto de fazer e então abaixo escreva sobre isso. Assim que terminar clique em Próximo. Acompanhe sempre pelo desenho ao lado para onde irão essas informações. Figura 3.20

65 O passo 8 nos permite colocar os sites de que mais gostamos. Por definição, o sistema já coloca o BOL como um dos sites, mas você pode apagar o que tem lá escrito e digitar outro endereço da Internet. Figura 3.21 No passo 9 temos que colocar um texto sobre nossa família e um título referente a esse texto. Cabe aqui um comentário: na realidade, você não precisa preencher todos os passos para criação de sua página. O que acontece se você não preencher ou não enviar as fotos como pedido, é que no lugar onde iriam ficar tais elementos, aparecerá um espaço vazio ou simplesmente o passo posterior irá ocupar o espaço vazio deixado. Este passo sobre a família é algo que pode ser simples para alguns e com certeza muito pessoais para outros e talvez você não queira preencher esses campos. Também nada impede que você modifique completamente o assunto. O espaço que está ocupando este passo sobre a sua família poderia ser revertido para algo como os filmes que você mais gosta ou então sobre os lugares que já visitou em alguma viagem. Nada impede que você coloque o título que quiser e escreva o assunto desejado.

66 Figura 3.22 Desde que não seja algo obsceno e que venha a lhe trazer problemas com a direção do VilaBOL, nada lhe impede de trocar o assunto. Assim que tiver terminado, vamos para o próximo passo. Neste passo 10 iremos informar os links favoritos de sua família. Como disse antes, você pode modificar o assunto da pergunta anterior. Nesse caso, se tiver escolhido algo sobre os lugares que conheceu em viagens, poderia colocar então os sites de turismo ou de países que tenham algo a ver com o passo anterior. Ou então também pode deixar vazios os campos e nada irá aparecer no local indicado do gráfico à esquerda. Figura 3.23

67 Assim que tiver decidido e preenchido (ou não) os campos, clique no botão Próximo. Passo 11 Temos agora uma parte especial para seus amigos. Aqui poderá escrever algo para eles (ou sobre eles) e um título também que represente este texto. Figura 3.24 O passo 12 é também para links. Talvez alguns deles tenham site no VilaBOL ou em outro lugar na Internet e você poderá colocar aqui o nome deles e em seguida o endereço da Internet onde estão seus sites (URLs). Figura 3.25 O passo 13 nos permite enviar uma foto da família ou dos amigos. O processo de procura e envio é o mesmo já explicado anteriormente.

68 Figura 3.26 Talvez esta seja sua primeira página no VilaBOL, mas também pode ser que já tenha criado outras. Sendo assim, o passo 14 nos oferece a possibilidade de colocar links para essas outras páginas. Quando eu prossegui no preenchimento destas páginas para poder mostrá-las a você neste livro, eu já possuía uma homepage e outras páginas também. Então, simplesmente digitei o nome da página (homepage, fotos, amigos) e depois o nome do arquivo (index.html, fotos.html, amigos.html, etc.) Figura 3.27 Existe uma diferença aqui entre o nome e a URL. O nome é apenas um título, não o nome e a localização física do arquivo no site. A URL sim é o nome do arquivo ou

69 sua localização no site, caso ela esteja dentro de alguma outra pasta, por exemplo. Portanto, cuidado com o que escreve aqui. Se errar pode, depois, abrir a página no Editor Básico e modificar o endereço da página diretamente no código. O passo 15 nos permite inserir um contador de visitas somente para esta página. Eu já falei antes que acho que o mais importante é ter um contador apenas na página de entrada, a homepage, mas nada impede de ter também um contador independente em cada página. Escolha entre não ter um contador ou então em ter um dos exemplos que nos apresentam e então clique no botão Próximo. Figura 3.28 Passo 16 Já estamos quase no fim do processo. Se você quiser, pode inserir um livro de visitas para esta página. Aqui também eu recomendo (ainda mais veemente) que tenhamos esse link para o livro de visitas somente na homepage. Se esta for sua homepage então tudo bem. Para ter sua lista de visitas, selecione Sim e para não ter, selecione a outra opção. Neste livro explico em detalhes como configurar seu livro de visitas, então não vou explicar novamente aqui. Vamos seguir para o próximo e último passo. Figura 3.29 O passo 17 é de vital importância. Aqui vamos dizer ao sistema qual será o nome desta página que estamos acabando de criar. Se quisermos que ela seja nossa homepage no VilaBOL, ela terá que se chamar index.html. Senão, podemos dar o

70 nome que quisermos. Eles sugerem, como é uma página pessoal, que poderia ser pessoal.html. É uma sugestão apenas. Escolha o nome que mais lhe agradar, mas tente não utilizar acentos ou espaços no nome, como também já expliquei anteriormente. Figura 3.30 Ao clicar no botão Finalizar, pode acontecer de já haver uma página com o mesmo nome no nosso site. Ao criarmos o site no VilaBOL, por exemplo, acabamos criando uma homepage, certo? No entanto, se quisermos que ESTA página que estamos criando seja a homepage, ela deverá substituir a que já está em nosso site. Não podemos ter dois arquivos com o mesmo nome, index.html, que é a nossa homepage. Para evitarmos isso, o correto seria ter ido antes ao gerenciador de arquivos e renomeado a página que será substituída com outro nome. Assim não perdemos nem uma nem outra. Caso contrário, o sistema irá nos apresentar uma tela muito parecida com a da Figura 3.31, onde teremos os dois arquivos com suas respectivas informações, como tamanho, última alteração, etc., para nos ajudar a decidir se queremos ou não a substituição. Figura 3.31

71 Nota: Para evitar confusão e talvez perder tudo o que já digitou nestes 17 passos, saiba de antemão qual será o nome do arquivo e se já existe outro com o mesmo nome. Assim você poderá renomear o antigo e mudá-lo para uma outra pasta. E, finalmente, após tanto escrever e escolher, o VilaBOL nos dá os parabéns por termos conseguido criar uma nova página. O endereço dela aparece logo em seguida. E podemos clicar nele para que vejamos o resultado. Figura 3.32 Vejamos agora como é o Passo-a-passo para crianças. Resumidamente, é sempre o mesmo processo. Você terá que ir respondendo a uma série de perguntas, escolher uma combinação de cores para sua página, enviar fotos ou imagens, e seguir com calma cada passo. No final teremos o resultado que é a criação das páginas. Vejamos então como iniciar o processo. Primeiramente, temos que clicar no botão Construa no menu esquerdo. Logo verá as opções de editores. Escolha o Edi tor Passo-a-passo Crianças, clicando no link Clique aqui para utilizar este editor. Figura 3.33

72 Agora irá visualizar a próxima tela, onde terá que escolher entre fazer uma página para meninas ou para meninos. Como gentileza nunca é demais, sejamos cavalheiros e deixemos as damas primeiro. Vamos mostrar como é o processo de criação de uma página para meninas. O mesmo processo é aplicado para uma página para meninos. A única diferença são as cores e também as imagens que podemos escolher. Vejamos ent ão. Figura 3.34 Basta clicar sobre uma das figuras para efetuar sua escolha. O VilaBOL explica aqui nesta página que basta responder algumas perguntas e coloca também uma idade de aproximadamente 7 anos para as crianças entenderem como se cria uma página para elas. Clique então em um dos modelos para seguir adiante. Como demonstração, como já falei, iremos percorrer o caminho de uma página de meninas. A próxima tela apenas serve como um alerta.

73 Figura 3.35 Nunca coloque seu telefone, endereço ou algo muito pessoal, como o nome de sua escola, , etc. Para adultos, já sabemos que, ao informar um podemos (e normalmente recebemos) um monte de mensagens com sexo, piadas sujas, ofertas de produtos e outras coisas que não são muito recomendáveis para crianças. Fotos também não são recomendáveis. Por isso falei que é bom que se tenha um adulto por perto na hora da criação da página. Outra razão é que a criança pode demorar um pouco mais para digitar o que lhe é pedido nas páginas e aí podemos ter o problema do timeout, ou seja, o processo pode ser interrompido e a criança pode perder tudo o que já escreveu. Depois de sabermos dos perigos, vamos continuar. Clique no link Comece a criar o seu site. O primeiro passo é dar um título para a página. O título será o que irá aparecer lá em cima no seu navegador, na primeira barra. Normalmente lá já está escrito algo como Internet Explorer ou Netscape Navigator. O que você escrever nesta página irá para lá. Figura 3.36

74 Assim que terminar, clique no botão Próximo. Em todo este processo, se não souber o que digitar, tiver dúvidas ou não quiser escrever sobre algo que lhe perguntam, não precisa escrever nada. Basta ir clicando no botão Próximo toda vez que isso ocorrer. Lógico que sua página irá ficar mais vazia a cada vez que um item é pulado, mas não se preocupe. Você pode repetir o processo várias vezes depois, criando novas páginas melhores, mais bonitas e diferentes. O segundo passo é escolher qual o visual da sua página. Apesar do VilaBOL falar aqui para Escolher um visual para seu site, lembre-se de que apenas uma página será criada de cada vez. Se quiser que ela seja sua homepage, no final terá que dar o nome dela de index.html. Figura 3.37 Veja que você pode escolher entre três cores diferentes. Repare que cada uma das opções tem uma figura diferente, um ursinho, uma boneca e um rosto. Isso você vai escolher depois. T udo isto que estou falando aqui vale também para a página de meninos. O processo, como já disse, é sempre o mesmo.

75 Vejamos agora o terceiro passo. Aqui diz para escrever seu nome. Não escreva ele completo. Coloque apenas seu primeiro nome, para sua segurança. Seu nome vai aparecer em cima. Veja aonde pelo desenho da página que está do lado esquerdo da pergunta. Veja onde está o número 3. Por esse desenho você saberá onde irá ficar cada coisa que for perguntada, ok? Clique em Próximo. Figura 3.38 No qu arto passo vamos escolher qual a figura que vai aparecer na nossa página. Veja aonde vai ficar a figura escolhida pelo número 4 na imagem da página ao lado. Escolha o que quiser. Veja que algumas são animadas. Elas vão se movimentar em sua página também. Figura 3.39

76 Basta clicar com o mouse sobre o círculo ao lado do nome da figura para selecionálo. Depois clique no botão para irmos para a próxima página. Estamos agora no quin to passo. Escreva aqui o que mais gosta de fazer na escola. Brincar, estudar, comer lanche, conversar com os amigos e as amigas, etc. Assim que terminar, vamos novamente clicar no botão Próximo. Figura 3.40 Passo 6 Agora o VilaBOL quer saber o que você mais gosta de fazer quando não está na escola. Pode ser praticar esportes, ficar em casa, brincar de boneca no quarto, assistir televisão. T udo, enfim. Figura 3.41 Passo 7 Agora é a vez da sétima pergunta. Sempre acompanhe ao lado onde cada item irá ficar quando sua página estiver pronta. Aqui a pergunta é para saber com o é o bichinho de estimação dos seus sonhos.

77 No caso de uma página para meninos, aqui a pergunta seria: Para que time de fute bol você torce? Só depois viria a página sobre seu bicho de estimação. Figura 3.42 No passo 8 temos outra pergunta: Para que lugares você já viajou, e para onde gostaria de viajar? Figura 3.43 Responda e clique no botão Próximo. No passo 9 o VilaBOL quer saber o que queremos ser quando crescer. Escreva tudo sobre o que você quer ser, como médica(o), professor(a), jogador de futebol, ou jogadora de vôlei, basquete, etc.

78 Figura 3.44 Passo 10 Agora vamos escrever tudo o que mais gostamos de ver na TV: novela, desenhos (quais?), séries de ação, entrevistas, etc. Todos os seus programas prediletos. Figura 3.45 No passo 11 vamos escolher quais são os sites da Internet que mais gostamos de visitar. Primeiro escrevemos o nome dele e depois o endereço dele na Internet. Se você não souber, não precisa digitar nada, basta clicar novamente no botão Próximo.

79 Figura 3.46 Passo 12 Agora é a vez de dizermos ao VilaBOL se já temos alguma outra página em nosso site. Como eu disse antes, podemos criar quantas páginas quisermos. A homepage tem que se chamar index.html, mas as outras podem ter qualquer nome, como fotos.html, etc. Sempre um nome, seguido de ponto e html depois. Assim: nomedoarquivo.html Entendeu? Então, se tivermos outras páginas, vamos colocar um nome para elas do lado esquerdo e, logo ao lado, a localização delas, ou seja, onde elas estão em nosso site. Normalmente só precisamos escrever o nome do arquivo mesmo. Figura 3.47

80 Vamos usar como exemplo uma página com fotos. No campo nome vamos escrever apenas minhas fotos e no campo URL, vamos escrever fotos.html. Passo 13 Agora vamos escolher um contador para nossa página. As cores dos contadores da página dos meninos é diferente, com tons azuis e verdes. Escolha qual quer em sua página (se não quiser nenhum, selecione Não ) e clique no botão Próximo. Figura 3.48 Passo 14 Agora é a vez de dizer ao VilaBOL se queremos ou não um livro de visitas para esta página. Se quisermos, escolha Sim e, caso contrário, escolha Não. Procure neste livro como configurar seu livro de visitas, ok? Figura 3.49 Passo 15 Agora é o último passo. Escolha um nome para sua página. Quer que ela seja sua homepage? Escreva index.html. Quer colocar outro nome? Basta escrevê-lo, sempre terminando com ponto html (.html) no final e tudo bem. Exemplo: minhapagina.html

81 Figura 3.50 Pode ser ponto htm também, sem o l (ele) no final. Exemplo: pagina.htm. Clique em Finalizar. Figura 3.51 No final, o VilaBOL manda os parabéns e nos diz que a página foi criada com sucesso. Tem um link para nossa página, para que possamos na hora ver como ficou. Clique onde você ler: e ela logo aparecerá.

82 Figura 3.52 Na Figura 3.52 podemos ver como ficou a página que foi criada enquanto eu escrevia este livro. Ficou bonita, não é meninas? Planeta Terra Passo 1 Conect e-se à Int ernet e digit e o endereço Isso irá levá-lo à página de cadastro do Planeta Terra. Nesta primeira página temos a entrada para o sistema de hospedagem de páginas gratuito da T erra.

83 Figura 3.53 Como dito antes, há diferenciações para quem é assinante da Terra, do Terra Livre (serviço de Internet grátis da T erra) e para os não assinantes de nenhum serviço. É interessante que você se cadastre no Terra Livre, porque você poderá se conectar gratuitamente na Internet quando preciso e também terá mais espaço para suas páginas. Não que 5 MB seja pouco, pois a maior parte dos sites que eu desenvolvi e que conheço não chegam a utilizar 2 MB no início. A menos, é lógico, que você queira ficar guardando suas músicas em seu site (o que, já adianto, é proibido em muitos casos, por causa da pirataria) ou então arquivos gigantescos. Bem, nessa primeira tela, mesmo se você tiver ou não cadastro no provedor Terra, no Terra Livre ou ainda não sendo assinante, terá que clicar no link clique aqui e faça o seu cadastro agora. Já localizou?

84 Clicando lá iremos para a página de cadastro onde, aí sim, poderemos nos identificar como assinantes do serviço pago ou gratuito da T erra. Passo 2 Caso você seja um assinante Terra ou Terra Livre, digite nos campos username e senha os mesmos dados que você já utiliza para acessar o provedor. No caso de não assinante, preencha o campo username (primeiro e segundo campos) com um que você já utiliza, seja de onde for (exemplo: seunome@seuprovedor.com.br) e crie uma senha cuidado para não esquecê-la. Figura 3.54 Passo 3 Rolando a página para baixo, veremos que temos mais campos a serem preenchidos.

85 Figura 3.55 Temos então que preencher os próximos campos que são: Nome do diretório crie um nome interessante para seu site. Algo como site_legal ou minha_vida ou gamesquegosto, algo assim. Isso será utilizado como uma parte do endereço de seu site. Depois que você escolher a área onde quer seu site, ficará com um endereço parecido com Não é uma coisa muito interessante, eu acho. Prefiro os outros lugares onde o seu username ou nome de usuário é utilizado como parte do endereço. É mais fácil de guardar e também você não tem que ficar esquentando a cabeça pensando em um nome de diretório. De toda forma é esta a razão deste livro, explicar as diferenças entre cada um dos principais serviços de hospedagem na Internet. Agora escolha a Áre a onde seu site mais se encaixa, podendo ser algo ligado a viagens e turismo ou então informática e internet, etc. Basta clicar na setinha ao lado do campo e escolher com o mouse uma das opções disponíveis. O próximo campo é para os que já eram antigos usuários de um serviço chamado Personal Page s dos antigos clientes do T erra. Com isso, as páginas que estavam

86 armazenadas nesse lugar podem ser recuperadas para o novo sistema do Planeta Terra. Preencha então a URL, o endereço dessa antigas páginas. Seguindo adiante, escolha um Tí tul o para seu site. Ele vai ser utilizado para o sistema de buscas do T erra. Para o título coloque algo parecido com o que você colocou como nome do diretório, o primeiro campo que preenchemos. É como uma descrição, mas bem mais simples. O descritivo do site detalhado iremos colocar em último lugar. Em Palavras-chave, digite algumas palavras que tenham a ver com seu site. Se for um site sobre música, pode ser algo como música, MP3, canções, ritmos. Se for algo como um site sobre informática e programação de Internet, pode ser algo como html, javascript, códigos, dicas, etc. Você pode colocar uma ou mais palavras que serão utilizadas para identificar e localizar seu site entre tantos outros. Assim, os visitantes de seu site irão achá-lo mais facilmente e também você saberá que quem o visitar veio exatamente por causa das descrições e palavras-chave que você indicou. Para colocar mais do que uma palavra-chave, basta separá-las por vírgula, como nos exemplos citados. Escolha abaixo o idioma principal do seu site. Normalmente seria português, mas nada impede que, você sendo descendente de estrangeiros ou mesmo sendo estrangeiro, possa fazer um site dedicado à sua língua preferida. Vamos agora fazer uma nova descri ção do si te podendo ser mais detalhado. Passo 4 Depois de tudo preenchido, vamos agora às próximas perguntas que somente precisam ser respondidas por quem não é usuário Terra ou Terra Livre. Aqui temos que preencher o nosso nome, sobrenome, data de nascimento, sexo, CEP, escolaridade, estado civil, número de filhos e dizer se aceita receber informações sobre o serviço Terra ou de seus parceiros via . Nesse último caso eu sempre escolho não, pois infelizmente se escolhermos o contrário veremos nossa caixa postal na Internet cheia de anúncios e mensagens publicitárias. Logo abaixo temos o contrato dos serviços prestados pelo T erra e também algumas cláusulas dizendo o que podemos e não podemos fazer enquanto usuários do sistema deles. Normalmente inclui detalhes como não poder colocar material pornográfico, de pedofilia, de pirataria, etc. É o normal dentro de todos os sites que nos proporcionam espaço gratuito. Também por serem gratuitos eles normalmente nos explicam que, caso ocorra algum defeito técnico ou falta de luz ou invasão do sistema por algum hacker, eles não podem se responsabilizar por manter seu site incólume e 24 horas no ar sempre. Isso é algo perfeitamente compreensível.

87 Já em sistemas de hospedagem pagos, normalmente temos garantia de que há sempre um backup de nossas páginas (cópia de segurança) e também que há um gerador de energia para quando há falhas na eletricidade que alimenta os computadores onde estão armazenados os sites. Mas isso já vimos na parte dos recursos oferecidos pelos serviços de hospedagem pagos (Capítulo 2). Depois de ler e concordar com o que o contrato diz, basta clicar no botão Aceito as condições e quero me cadastrar para que o sistema crie o seu endereço e o espaço para seu site. Figura 3.56 Passo 5 Clicando no botão iremos para o gerenciador on-line de nosso site, através do qual podemos transferir os arquivos das páginas e imagens do site que estão em nosso computador para os servidores da Terra. Podemos criar diretórios e outras coisas mais, mas isso já é assunto para o próximo capítulo.

88 Criado o site, anote o endereço do mesmo juntamente com os dados do seu usuário e senha utilizados para a sua criação. Figura 3.57 Para sair dessa tela, a que iremos voltar mais tarde, basta clicar no botão Sair que se encontra logo à direita acima do endereço do site. UOL Antes de iniciarmos os passos para inscrição no serviço de hospedagem do UOL, tenho que avisar que este é uma exceção dentro do livro, pois enquanto o VilaBol, o Terra Planeta e o Yahoo! GeoCities são gratuitos, isso já não ocorre com o UOL. Para poder criar suas páginas utilizando o serviço deles, é necessário que você seja um assinante, ou que um assinante tenha lhe criado um endereço de atrelado ao dele. Podemos fazer uma analogia com um cartão de crédito adicional, onde existe um responsável por você. Se seu marido ou esposa, irmão ou pai tiverem uma conta no UOL, peça para eles criarem um para você.

89 T enho que explicar aqui a razão por ter incluído o serviço de hospedagem do UOL neste livro, e é muito simples, pois embora não seja um sistema gratuito para todos, o número de assinantes dele é tão grande que eu não poderia negar essa informação a tanta gente. Fique ciente então que, para utilizar os passos que explico a seguir, você precisa ser um assinante do serviço deles. Outro detalhe é que nele temos que ir um pouco mais adiante do que com os outros, para demonstrar o uso de modelos de criação. Bem, primeiramente vamos entrar no site. Podemos ir pela página principal e clicar em Web Sites Pessoais do lado esquerdo, no menu lateral, lá embaixo, ou então simplesmente digitar Seremos levados à página de entrada. Por ela poderíamos visitar outros sites hospedados no UOL ou fazer uma busca por algum site de um amigo, por exemplo, bastando para isso digitar nos campos o dele. Do lado esquerdo você verá as divisões dos sites por temas. Cada site é identificado por um tema Cidades e Regiões, Corpo e Saúde, Crianças, Diversão e Arte, etc, etc. Caso você já tenha um site pela UOL, é por esta página que poderá atualizar suas páginas e/ou recadastrá-lo, mudando algumas características que digitou quando o criou. No entanto, estamos supondo que você irá criar seu site do nada, certo? Figura 3.58

90 Então vamos lá. Clique no botão Faça. A próxima tela que irá ver será esta. Figura 3.59 Iremos escolher a forma fácil de criar o site por agora. Depois voltaremos para o modo avançado. Clique no link Monte seu site pelo método Fácil. Você verá esta tela. Figura 3.60 Como já havia dito, somente os assinantes do UOL podem ter sites hospedados lá. Digite o seu nome de usuário e depois sua senha.

91 Nota: O UOL permite que você tenha quantos s quiser, para seu irmão usar, seu pai, sua mãe, etc. Sendo assim, todos podem ter um site também. Bem, digite então os dados pedidos e clique em Entrar. A próxima tela são as regras do serviço. Figura 3.61 Para continuarmos, temos que aceitá-las, então clique em Aceito as regras abaixo e assumo total responsabilidade pelo We b Site que criar. Já expliquei antes o básico do conteúdo desses contratos ou regras de utilização. A próxima tela será onde iremos utilizar o assistente de criação do UOL. Figura 3.62

92 Vamos agora explorar os modelos que o UOL nos oferece. Tenho que ser bem sincero com você. São muito simples e alguns são até poluídos demais. De toda forma estamos aqui para aprender a criar os sites e publicá-los, e não aprender agora como ter páginas com um design bonito. Isso se aprende com o tempo em alguns casos, nem com o tempo, infelizmente, pois algumas pessoas não tem bom gosto, não há como negar. Mas não é porque não somos um Leonardo da Vinci ou um Van Gogh ou um Rembrant que não podemos dar umas arriscadas na área artística. Em meus outros livros eu sempre digo que, para aprender a ter bom gosto, primeiramente temos que observar muito, mas muito bem tudo o que temos ao nosso redor, e principalmente, no caso da web, temos que ver sites que tenham um bom gosto para design. Um deles que sempre recorro quando estou com pouca inspiração é o Ele tem os sites mais interessantes em matéria de design, até mesmo vanguardista, mas é interessante para ver e relaxar. Não precisamos fazer exatamente o que vemos ali, basta apenas entender que ali temos as tendências e precisamos vivenciar isso para podermos olhar para nosso site e dizer sinceramente: puxa, ficou muito legal, ou então, puxa, está bom, mas ainda vou melhorá-lo. Vamos ver então o que o UOL nos oferece para esta primeira entrada no mundo da Web. Depois, aos poucos, vamos aprendendo a melhorar e atualizar as páginas com novas versões. Para ter uma amostra dos modelos, clique no link veja exemplos que há embaixo de cada item (exceto currículos, quando deve-se clicar no próprio nome).

93 Figura 3.63 Se você clicar em Página padrão ou Personalidades ou Esportes, verá outros modelos diferentes. Figura 3.64

94 Há ainda modelos para currículos, os quais mostro a seguir. Você pode clicar nas imagens para ter uma melhor visão do modelo. Para editar sua página, escolha um dos modelos que mais lhe agradar e depois clique no link escrito clique aqui para fazer sua página.... No caso de currículos, você pode criar seu próprio modelo também. Caso tenha visto um modelo que lhe agrada, clique no link dele e um formulário específico para cada modelo irá surgir, com mais ou menos perguntas e também mais ou menos imagens para você escolher. No entanto, vamos supor que você tenha escolhido o mais simples, que seria através do link Página Padrão. É o que contém a maior parte das perguntas dos outros modelos, sendo o melhor teste para criação. Depois de clicar no link como falei, o sistema do UOL pedirá algumas informações para criação de sua página. Na primeira tela você terá que escolher uma cor ou uma imagem para ser o fundo de sua página. Você só poderá escolher ou uma cor ou uma imagem. Figura 3.65 Escolha algum item (exceto por enquanto o desisto ) e clique no botão de visualização lá embaixo para poder ver o resultado.

95 Figura 3.66 Se você quer uma opinião pessoal, por enquanto, escolha branco mesmo, sem imagens nem nada. Fica bem mais fácil de ver o conteúdo de sua página e é mais rápido o carregamento da página no navegador. Depois, com o tempo, você o modifica. Vamos continuar a lição. Ao clicar em visualizar, você voltará para a página inicial do formulário e ela se apresentará já com a cor do fundo (ou background, como preferir) que você escolheu. Veja na figura a seguir. Figura 3.67

96 A segunda questão é para você digitar um título para sua página. Clique no link Clique aqui e digite o que deseja para ser o título da sua homepage. O terceiro item é para que você escolha uma figura, ou de dentro da UOL mesmo ou então de seu computador para que ela fique em sua página. Figura 3.68 No quarto item, digite no campo em branco o texto que pretende colocar em sua homepage, como uma mensagem de boas-vindas, ou então esta é a página de Fulano de Tal, etc, etc... e escolha logo abaixo o tipo de alinhamento que quer no texto que vai aparecer na sua página, ou seja, se quer que o texto que digitou acima fique no canto esquerdo da página, ao centro ou à direita. O quinto item é a escolha de uma barra horizontal para separar seu texto de imagens e do título. Clique no link e escolha uma das imagens que aparecer, ou então não escolha nenhuma, selecionando o item Não quero barra. Temos barras muito vibrantes ali. O sexto item do formulário nos possibilita colocar nossos links favoritos na página. Caso não queiramos nenhum, basta apagar o que está já escrito nos campos. Temos que escrever um título para nosso link, que será o nome do site e logo em seguida o endereço do site para qual aquele link está direcionado. Note que o UOL colocou endereços deles mesmos. Você não é obrigado a ter nenhum deles caso deseje outros.

97 Figura 3.69 Se quiser que um ícone pequena imagem fique associada com esse link, clique ao lado e escolha na janela correspondente uma das imagens que quiser, ou nenhuma. Figura 3.70 Já para o sétimo item temos a opção de termos uma caixa de notícias para que nossos visitantes possam ler ou as últimas notícias gerais ou de esportes. Basta escolher.

98 A próxima escolha é a de querermos ou não ferramentas de busca em nossas páginas. É sempre bom. Na opção de , digite um texto qualquer chamando a atenção de seus visitantes, pedindo para que eles cliquem ali para enviar uma mensagem para você, por exemplo, e digite no campo abaixo o seu do UOL ou outro qualquer. O sistema irá criar o link para você. Para o item 10, você poderá escolher qual o texto que irá seguir seu contador (basta preencher os campos antes e depois do contador que aparece ali) e também escolher qual será o tipo dele. Para escolher, clique no link Clique aqui. Figura 3.71 T ambém se você não quiser um contador, deverá entrar nesse link para desabilitálo, selecionando o primeiro item. Assim que tiver escolhido, clique no botão de visualizar para voltarmos. Agora vamos ao penúltimo item dessa nossa jornada para criar uma página no UOL: vamos visualizá-la. Clique no link para ver como sua página ficou. Eu criei uma com alguns elementos do formulário e fundo branco para você poder ver como ficou. Está bem simples, ok? É como disse: neste capítulo estamos aprendendo apenas a criar nosso primeiro site.

99 Figura 3.72 No entanto, com a ajuda do formulário que preenchemos, pudemos colocar alguns recursos interessantes como as notícias, um campo de busca pela Internet e um contador de páginas. Reparem que há uma janela acima e à direita onde temos o logotipo do UOL e também Denúncia. Essa janela de controle é para que você possa denunciar um site, caso veja que ele contenha material ilícito ou proibido pelas normas do UOL, como pornografia ou pirataria. É apenas uma medida de segurança do sistema. Bem, veja agora se tem algo que gostaria de acrescentar ou retirar de sua página e clique no botão Voltar para que possa modificá-la. Caso esteja tudo certo com sua página, também clique no botão Voltar dessa página de visualização e vamos seguir para o passo 12, concretizando a criação da homepage de nosso site. Para concluir a criação e publicação do nosso site, precisaremos dizer em qual categoria ele se enquadra. Quando clicamos no item Finalização, a próxima tela que nos é apresentada é muito extensa. Precisamos primeiramente definir qual o clu-

100 be ao qual nosso site pertence. O que o UOL chama de clube seria a categoria. Veja na próxima tela: Figura 3.73 Escolha um dos itens que têm mais a ver com seu site. Depois disso, utilize a barra de rolagem para localizar o item que você selecionou acima, ou seja, caso tenha escolhido que seu site tem mais a ver com a categoria Mundo Digital, selecione. Depois desça através da barra de rolagem lateral direita até encontrar o mesmo Mundo Digital, como na Figura Figura 3.74 Pode ser qualquer outro item, mas o importante é que primeiramente escolha o clube ao qual quer se identificar e depois encontre o mesmo item na lista que se seguiu abaixo. Você deve localizar esse item para escolher até 5 subitens que têm a ver mais ainda com seu site. Digamos que você queira criar um site sobre informática, porque gosta disso. Aí você escolheu antes o clube Mundo Digital. Depois rolou pela página até encontrar o quadro da Figura 3.74, e percebeu que no seu site apenas os itens Internet e Softwares têm a ver com ele. Você não vai dar cursos, nem quer apresentar nada sobre hardware e nem oferecer seus serviços pelo seu site. Então, selecione apenas os dois subitens que mais se aproximaram do que pretende passar como conteúdo do seu site. Feito isso, descemos mais ainda até o final da tela, onde teremos que colocar o nosso número do ComVC, que é um programa de comunicação do UOL, muito pare-

101 cido com o ICQ ou o Yahoo! Messenger. Se você já tiver o programa e souber o número, pode informá-lo (se quiser que outros saibam seu número também, é lógico, e queira que se comuniquem com você). Figura 3.75 Logo depois, temos que descrever nosso site, dizer do que ele se trata. Uma breve frase é o suficiente, como já explicamos antes no livro. Depois é a vez das palavras-chave, utilizadas para que outras pessoas possam localizar sua homepage por meio delas. T ambém já expliquei aqui o porquê das palavras-chave e sua importância. Se quiser colocar mais do que uma, basta digitar uma a uma e separá-las por meio de vírgulas ou espaços. Após tudo isso, estamos prontos para a publicação de sua homepage. Clique em Cadastrar para a tela de confirmação. Figura 3.76

102 Aqui você saberá qual é o endereço de seu site e poderá ainda acrescentar outra característica, que é colocá-lo na roda. Isso significa incluir uma janela de controle nas suas páginas onde poderá ver outros sites que tenham algum conteúdo similar ao seu. Basta selecionar se quer ou não e depois clicar em En viar para concluir o processo todo. Agora recebemos uma mensagem de congratulações e sabemos que o site está pronto. Figura 3.77 No decorrer do livro veremos como proceder para atualizar esse site. Agora, lembram-se de que havia duas maneiras de se efetuar a criação do site? A mais simples e fácil, que foi a que mostramos, e a avançada, para os que já sabiam HTML. Figura 3.78

103 Pois eu falei que iria explicar também como criar seu site por esse outro método. Na realidade, ele é mais simples mesmo, desde que você já possua um site feito. Basta clicar no link para montar seu site pelo método avançado. Agora você verá o contrato dizendo o que eles permitem ou não nos sites. Clique em aceito as regras... para ir ao próximo passo. Lá você irá ver o endereço de seu site, que sempre será e poderá enviar os arquivos do seu site bastando clicar no botão Browse e procurando-os no local onde os guardou. Apenas um de cada vez pode ser enviado. Após localizá-lo na janela que aparece, confirme clicando no botão Open ou Abrir e verá o nome dele no campo antes vazio. Basta agora clicar no botão Enviar e seu arquivo irá para o site UOL. Lembre-se de que a sua homepage deverá se chamar index.htm ou index.html, senão seu site não poderá ser visto. Através dos botões ao lado, que iremos explicar mais à frente em outro capítulo, você poderá criar diretórios, compactar os já existentes (quando você os compacta, eles não irão mais funcionar, estarão apenas guardados para uso futuro) e também poderá criar novas páginas, onde uma nova tela poderá ser utilizada para criar seu próprio código. Figura 3.79

104 Assim que você já tiver algum arquivo dentro de seu site, poderá ver os nomes deles e também poderá editá-los on-line. As outras opções são para visualizar o mapa de seu site e cadastrá-lo no serviço de busca do UOL. É mais simples, mas é necessário logicamente conhecer um pouco mais o sistema e também um pouco de vivência em criação de sites. Veja na Figura 3.80 como a tela ficaria com um arquivo já dentro do site. Figura 3.80 Concluímos aqui como criar um site no UOL. Veremos agora o último exemplo, desta vez com o sistema do Yahoo! GeoCities. Yahoo! GeoCities Conecte-se à Internet e acesse o site Você verá a homepage do Yahoo! Brasil. Clique no link Yahoo! GeoCities, sua home page grátis. Figura 3.81

105 A próxima tela que verá será esta: Figura 3.82 O sistema do Yahoo! é bem similar ao do BOL, que já estudamos aqui. Como ambos possuem mais serviços além da hospedagem de páginas, como o serviço de e- mail gratuito, por exemplo, eles resumem o acesso a todos eles através de um único login e senha, ou seja, um único nome de usuário e senha. Caso já possua um e- mail no Yahoo!, estará automaticamente com a entrada garantida para o serviço de hospedagem de sites deles. Basta digitar nos campos ID Yahoo! e Senha, o seu nome de usuário e sua senha respectivamente. Como imagino que talvez os leitores ainda não possuam nem uma coisa nem outra, então vamos partir do início, que será a criação de nosso ID, que vem do inglês Identification identificação. Será através dela que seremos conhecidos no sistema do Yahoo!. Clique no link Cadastre-me!. Logo verá a tela dos termos do serviço Yahoo!. Coloquei apenas o início e o fim dessa página, já que ela tem 25 itens.

106 Figura 3.83 Verifique se concorda com os termos e então clique no botão Eu aceito para continuarmos. A próxima tela será a de cadastramento, onde irá escolher um nome de usuário (ou um ID, como é chamado no Yahoo!) e outras informações importantes para o sistema.

107 Figura 3.84 Digite o nome de usuário (ID) que preferir. Cabe aqui um aviso: o número de pessoas que se cadastram no Yahoo! é muito, mas muito grande mesmo, então possivelmente você terá que tentar várias vezes até encontrar um nome que não exista ainda no sistema. Praticamente com certeza isso irá acontecer, mas não desanime, pois vale a pena. Tente variações com underline/sublinhado e suas letras dos nomes do meio ou do sobrenome, como joao_rib_neto. O importante é que seja também fácil para você se lembrar. Digite logo abaixo sua senha. Atenção: o Yahoo! difere letras maiúsculas de minúsculas no campo senha, então se sua senha for algo como nuvem, se você escre-

108 ver Nuvem ou NUVEM, o sistema não irá reconhecer sua senha, pois você usou letras diferentes em maiúsculo e minúsculo. Agora o próximo passo é para lhe garantir um sistema que, caso se esqueça de sua senha, possa ter um jeito de fazê-lo lembrar-se novamente. Para isso há o sistema de perguntas e respostas. Escolha uma pergunta qualquer e escreva no campo abaixo uma resposta não a sua senha mas uma que o faça lembrar-se de sua senha. Caso você se esqueça, perto do campo do login há um link que diz que, se você está tendo dificuldades em lembrar seu ID ou sua senha, pode clicar ali. O sistema irá lhe perguntar alguns dados, como sua data de nascimento e talvez também se utilizará de sua pergunta e resposta para enviar-lhe sua senha, seu ID ou fornecer-lhe uma nova senha temporária. Eu disse talvez ele se utilize da pergunta e resposta porque já aconteceu comigo de esquecer-me e o sistema não me perguntou nada, apenas minha data de nascimento e outra vez se utilizou da pergunta. Na realidade, o sistema de checagem de segurança pode ser modificado ou pode ser aleatório e nós temos que ficar atentos a isso tudo. Logo abaixo temos que informar nossa data de nascimento. Como já falei, ela também pode ser utilizada para nossos esquecimentos momentâneos. E para que a informação nos seja enviada corretamente, devemos digitar no outro campo nosso endereço de . Assim, após responder uma pergunta ou então nosso aniversário, o sistema poderá nos dizer quem somos ou o que esquecemos. Bem, então vocês já sabem que esses itens do formulário servem para serem utilizados quando esquecermos nosso ID e/ou senha. Vamos para o próximo passo, onde o que nos pedem é simplesmente nosso país, bastando para isso selecioná-lo das opções disponíveis e também o CEP de nossa residência ou serviço, como preferir. Ocupação e ramo de atividade também são campos de seleção. Caso queira receber s do Yahoo! ou de seus parceiros, selecione o quadro abaixo ou deixe-o em branco. É só clicar com o mouse nele. Às vezes pode aparecer no final do formulário para você escolher uma ou mais áreas de interesse, mas é apenas informativo. Depois de tudo preenchido, vem a hora da verdade. Clique no botão Enviar este formulário e aguarde para saber se o ID que você escolheu já existe, ou não, no sistema.

109 Se tiver sorte, iremos para a próxima tela, senão você deverá retornar e digitar outro nome de usuário / ID e seguir em frente. Caso tudo dê certo, você verá uma tela onde receberá os parabéns, já aparecendo seu nome de usuário / ID. O sistema já lhe terá enviado um de confirmação, bem explicativo sobre como montar seu site no Yahoo! GeoCities. Logo abaixo teremos mais algumas informações como sua ID, o seu endereço de e- mail fornecido e para onde foi a mensagem explicativa e o endereço de seu novo site. Nota: Sua senha nunca aparece. Somente você irá saber qual é a senha digitada no formulário. Caso você já queira construir sua página nesse momento, clique no link Construa sua página agora. No entanto, vamos deixar isso para o próximo capítulo. Figura 3.85 Clique apenas em no link Sair lá em cima e veremos depois os detalhes de como criar páginas no Yahoo! GeoCities ou como enviar suas páginas que já estão prontas. Finalizamos aqui então esta lição. Não foi tão complicado assim, não é mesmo? Vamos agora para a parte onde iremos criar páginas, utilizando os modelos existentes e também enviar nossas próprias páginas.

110 CAPÍTULO 4 COMO CRIAR E ENVIAR PÁGINAS UTILIZANDO OS RECURSOS EXISTENTES NO SITE DE HOSPEDAGEM Vamos seguir o mesmo caminho que trilhamos no capítulo anterior. Começaremos pelos serviços do BOL (VilaBOL), em seguida iremos para o T ERRA, depois o UOL e por fim o YAHOO! GEOCITIES. VilaBOL Novamente conecte-se à Internet e digite o endereço Como agora estamos cadastrados no serviço, fica bem mais simples entrarmos no sistema. A mesma tela onde iniciamos nosso cadastro servirá para nossa entrada. Figura 4.1 Lembre-se de que no BOL seu nome de usuário permite tanto o uso do VilaBOL quanto o uso vitalício de um . Então, lá em cima, digite seu nome de usuário e logo abaixo digite sua senha. Depois clique no botão Entrar. A próxima página que iremos ver será a da Figura 4.2. Vamos analisar o que cada uma das opções significa.

111 Figura 4.2 Logo abaixo do logotipo do VilaBOL, a imagem da casinha, vemos um campo de busca dentro do próprio sistema. Isso é para que possamos procurar, entre os assinantes do BOL, alguma coisa de nosso interesse, como, por exemplo, sites que tenham em suas páginas algo sobre futebol. Então basta digitar futebol naquele campo e clicar no botão Buscar. Caso queira procurar sites de uma determinada categoria, como a do seu site, por exemplo, basta clicar em um dos itens que existem abaixo do campo de busca. Também é uma outra forma de busca, sem dúvida. Ao lado iremos ver os itens: 1 Construa sua página 2 Ge ren ciador de Arquivos 3 Complementos 4 Ajuda 5 Atualize seu Cadastro

112 !" ### Debaixo de cada um deles temos: Construa sua página Editor Básico: O que é ele? Vamos explicá-lo aqui em detalhes, mas antes seria interessante podermos visualizá-lo, certo? Então clique sobre o link Editor Básico e pularemos para a próxima tela. Figura 4.3 Aqui vemos uma introdução do que é o editor básico e temos dois links de ajuda, um falando sobre o editor básico mesmo, que será o que veremos nas próximas páginas e outro para o manual de HTML, para você tirar dúvidas sobre o código HTML. Clique em Abrir o Editor Básico para ver como ele é na verdade e poder visualizar melhor a explicação a seguir.

113 Figura 4.4 O editor básico do BOL é um editor para quem já conhece HTML. Há uma caixa de texto onde você precisa colocar todo o código HTML necessário para criar cada página. Sendo assim, se você já é um expert em HTML e gosta de mexer no código, este é o melhor lugar para se começar. Qualquer dúvida sobre a linguagem HTML, basta utilizar o Manual de HTML da VilaBOL. Lá você encontra todo o código básico para construir uma página na Internet. Alguns elementos mais avançados, como inserção de arquivos de animação em flash, precisam de um aprofundamento e conhecimento maior de sua parte, mas tudo isso também é facilmente encontrado em outros livros mais específicos ou na Internet gratuitamente. A descrição detalhada de como utilizar o menu de botões existentes no editor básico, veremos mais à frente, mas vamos verificar aqui algumas funções. Como você poderá criar uma página no Editor Básico da VilaBOL? Você pode escrever o código diretamente na caixa de texto ou simplesmente copiar e colar o que tiver preparado em outro editor de texto ou HTML.

114 !" ### O que fazer para publicar essa página em seu site? Basta clicar no botão Salvar ou em Salvar Como veja adiante as diferenças para salvar a página diretamente no seu diretório da VilaBOL. Se você quiser que a página seja a abertura do site, ou seja, sua homepage, salve como index.htm ou inde x.html. E para criar uma nova página no editor básico? Clique no botão Nova Página, na barra superior do editor. Comece a criar sua nova página copiando e colando um código que você já tinha pronto ou então digitando-o na hora. Quando for salvar, não se esqueça de dar um nome a essa página. Veja as regras a seguir. Como posso abrir uma página que eu já criei? Clique no botão Abrir na barra superior do editor. Escolha o diretório onde se encontra a página que você procura, selecione o arquivo que você deseja abrir e confirme. Como faço para salvar uma página? Se a página que você criou é nova, clique em Salvar como. Digite o nome do arquivo, o diretório onde você deseja salvá-lo e confirme. Se você estiver fazendo modificações em uma página já existente anteriormente, para salvar essas mudanças, clique em Salvar. Como faço para visualizar a minha página? Basta ir ao Gerenciador de Arquivos da VilaBOL (que veremos mais adiante) e clicar sobre o nome do arquivo que você deseja visualizar. E na hora de salvar, posso colocar qualquer nome ou tenho alguma limitação? Seus arquivos podem ter, no máximo, 32 caracteres. Não é possível nomear arquivos com um número superior a 32 caracteres. Além disso, evite escrever nomes misturando maiúsculas e minúsculas e nunca deixe espaço entre nome. Utilize o sublinhado para separá-los, como no exemplo: minha_pagina_de_natal.htm. Também não coloque acentos ou cedilhas nos nomes. Essas re gras se rvem para todos os se rviços de hospe dagem de sites e para toda a Internet.

115 Gerenciador de Arquivos Administre seu Site Clique nesse link. Veremos inicialmente uma tela introdutória sobre o gerenciador. Através dele você poderá criar e enviar arquivos para seu site, e verificar todos os pormenores dele, como espaço utilizado, etc. Figura 4.5 Repare que, para cada item que detalhamos, os outros ficam a um simples clique do mouse, no menu lateral esquerdo. Com isso podemos ir de um para outro item sem muita dificuldade. Clique no link Abrir o gerenciador de arquivos.

116 !" ### Figura 4.6 Nessa tela, você tem um menu de botões, que se repete em cima e abaixo. Dependendo da quantidade de arquivos e diretórios que você tiver em seu site, é muito útil ter o menu duplicado assim. Você verá que logo abaixo do menu de cima, seu nome de usuário está escrito, que é o mesmo de seu e também uma parte do nome de seu site. Ao lado verá também a quantidade de espaço que está utilizando no servidor e a quantidade de arquivos. Na verdade, o sistema conta como arquivos também os diretórios. Na Figura 4.6 há um diretório e um arquivo, mas o VilaBOL interpreta como dois arquivos. Para cada arquivo ou pasta, há um quadrado do lado esquerdo do nome dele. É uma caixa de seleção. Clicando sobre ele, irá selecionar o arquivo ou desselecioná-lo. Isso é muito importante para utilizarmos os botões dos menus existentes em cima e embaixo. Você pode editar um arquivo simplesmente clicando sobre o ícone (pequeno desenho) ao lado dele, ou abrir um diretório (ou pasta, como preferir) para

117 ver o que há lá dentro, do mesmo modo. No caso específico de um diretório, clicando no nome dele, o resultado é o mesmo de clicar no ícone da pasta. No entanto, se clicarmos no link que existe no próprio nome do arquivo, iremos visualizar aquele arquivo em outra janela, que irá se abrir. Sendo assim, para editar uma página há duas maneiras: selecione-a pela caixinha de seleção e clique no botão Edi tar página no menu superior ou inferior ou então clique diretamente no ícone ao lado do nome dela. Se clicar no nome do arquivo, uma nova janela do seu navegador irá se abrir e poderá vê-lo exatamente como seus visitantes o fariam. Você não pode editar mais do que uma página de cada vez. No entanto poderá copiar, mover, apagar ou renomear quantos arquivos quiser de uma só vez. Basta que antes os selecione como expliquei e clique no botão correspondente. Perceba também que, acima de cada coluna, há um nome descrevendo o conteúdo delas. É aquela barra roxa que vemos. Lá temos as seguintes colunas: nome, tipo, tamanho e data. Cada um desses títulos de colunas também é um link que irá se prestar a reorganizar o conteúdo abaixo. O sistema sempre irá apresentar antes os diretórios e depois os nomes de arquivos em separado. No entanto se clicarmos no link nome da coluna, veja que os diretórios são rearranjados para serem mostrados em ordem alfabética, o mesmo acontecendo com o nome dos arquivos, que vêm logo a seguir, mas também na ordem alfabética. Arquivos que começam com a letra A vêm antes dos que começam com a letra B, C e assim por diante. No entanto se clicarmos de novo no link nome, veremos que agora a ordem foi invertida de tal forma que arquivos com a letra C vêm antes dos que começam com a letra B e por fim os com letra A no início do nome. O mesmo acontece com os outros títulos das outras colunas. Ao clicar sobre eles, reorientam o conteúdo abaixo para se apresentar como determinamos. Ao clicarmos no link da coluna tipo, os arquivos se reorganizarão por tipos de arquivos, no caso do tamanho, arquivos menores virão antes dos maiores (em KB) e para a data, arquivos criados antes aparecerão no topo da lista. E, como no link do nome, ao clicá-los novamente irão refazer a ordem ao contrário. Isso facilita na hora de localizar um arquivo que saibamos que seja muito grande ou muito pequeno, procurarmos um tipo específico de arquivo, como imagens.gif ou.jpeg, ou um arquivo que criamos ontem e queremos modificá-lo hoje. Vejamos o que nos aparece ao clicar no botão nova pasta.

118 !" ### Figura 4.7 Podemos criar quantas pastas ou diretórios quisermos. Eles servem para organizar o conteúdo de nosso site. Normalmente, quem tem vivência em criação de sites costuma criar diretórios para que os arquivos não se misturem muito. No VilaBOL podemos fazer subdiretórios, ou seja, diretórios dentro de diretórios. Lá podemos criar quantos diretórios quisermos também, mas não um dentro de outro, escondendo-os assim. Vejamos agora como funciona a outra função do menu: copiar. Primeiramente é preciso selecionar um ou mais arquivos que serão copiados. Logo após, clique no botão. Você verá a tela onde teremos o nome do(s) arquivo(s) a ser(em) copiado(s) e logo após o destino para onde irão essas cópias. Só podemos selecionar um destino de cada vez. Repare que os destinos são sempre as pastas. Ou a pasta principal de nosso site ou as de dentro. Figura 4.8 Caso estejamos copiando arquivos para um local onde já existam outros arquivos com o mesmo nome, o sistema irá nos alertar para isso. Se quisermos, ele irá copiar o novo arquivo por cima do anterior, apagando-o.

119 Nesse caso a tela de substituição aparecerá mostrando o nome dos arquivos que têm homônimos naquele diretório de destino. Figura 4.9 Ele irá lhe fornecer dados como a localização, tamanho e a última alteração que para mim é o mais importante, pois você poderá saber se o arquivo é mais novo do que aquele que pretende substituir ou não. De toda forma, basta selecionar e confirmar. Ou então cancelar toda a operação. Lembre-se de que um arquivo somente irá substituir o outro se você antes o selecionar. Vejamos agora outra função, a de renomear. Antes de selecionar qual ou quais arquivos quer renomear, lembre-se de que, se houver um link para a página a ser renomeada você deverá atualizar manualmente esse link. Ou seja, digamos que da sua homepage você criou um link, um texto ou botão que, ao serem clicados, chamam a página sobre seus filmes preferidos. A homepage você já sabe, tem que se chamar index.htm ou index.html e digamos que a página de filmes chame-se filmes.htm. No entanto se você decidiu renomear essa página para meus_filmes.htm, você deverá depois editar a página index.htm (ou index.html) para que o link seja redirecionado corretamente. No código seria algo assim: <a href = filmes.htm target = _self > Meus filmes preferidos </a> Depois de renomear o arquivo filmes.htm para meus_filmes.htm o código ficaria assim:

120 !" ### <a href = meus_filmes.htm target = _self > Meus filmes preferidos </a> O sistema não irá fazer a atualização para você. No caso de se estar preparando essas páginas em casa, ou no trabalho, com o auxílio de programas como FrontPage da Microsoft ou o Dreamweaver da Macromedia entre outros, o próprio programa irá fazer isso para você. No entanto, ao enviar os arquivos para seu site no VilaBOL veremos como fazer isso em breve você terá que enviar todos os arquivos que tinham link com o filmes.htm. Como no exemplo que dei, você teria que enviar para o VilaBOL tanto o novo arquivo meus_filmes.htm quanto o index.htm. E de quebra ainda terá que apagar o antigo filmes.htm, pois não há razão para ele ficar lá. Este é um detalhe que não podemos nos permitir esquecer com o perigo de termos páginas com links quebrados em nosso site e também de ficarmos mantendo páginas soltas, que seriam algo como uma espécie de lixo sem uso, apenas ocupando espaço. Então muito cuidado se estiver renomeando pelo VilaBOL, então edite os arquivos que têm ligação com aquele outro manualmente. Se estiver modificando os nomes por algum software, não se esqueça de mandar para o VilaBOL os outros arquivos que também têm ligação com o modificado. Figura 4.10 Veja que você tem o nome original do(s) arquivo(s) que pretende renomear e ao lado um campo para cada um, onde irá escrever o novo nome. Não se esqueça de colocar a extensão do arquivo. Ou seja, se for uma página de Internet, será.htm ou.html e se for um arquivo do Word tem que ser um.doc ou então um arquivo de animação flash que seria um.swf. Todo tipo de arquivo tem uma terminação diferente, que devemos sempre colocar depois do nome para identificá-lo. Se não quiser renomear um dos arquivos nessa tela, basta deixar em branco o campo ao lado do nome e nada acontecerá com ele. Basta clicar no botão Confirmar agora para que o sistema modifique os nomes dos arquivos ali descritos.

121 Veremos agora como utilizar outra função do menu do gerenciador de arquivos: como editar sua página. Primeiramente selecione uma de suas páginas apenas uma é permitida por vez e clique no botão editar página. O arquivo será carregado numa tela assim: Figura 4.11 Veja que o menu superior mudou para atender agora às necessidades de edição de página. Temos agora os botões nova página, abrir, salvar, salvar como, gerenciador de arquivos, sair do editor e ajuda HTML. Logo abaixo veremos uma caixa de edição onde o código de nossa página está todo aberto para que modifiquemos o que precisemos. Nessa hora, devemos ter conhecimento de HMTL para edição do código. Para que tenhamos alguma ajuda, basta clicar no botão ajuda HTML para ver um pequeno tutorial sobre essa linguagem. Assim que você tiver terminado a edição do conteúdo da página, deve clicar no botão salvar para salvá-lo com o mesmo nome. Ao salvar o arquivo, a tela permanecerá a mesma. A única diferença é que você salvou seu arquivo até aquela hora e todas as modificações feitas já estão armazenadas.

122 !" ### Figura 4.12 Se você quiser, pode continuar a editar o arquivo com novas modificações, mas lembre-se de salvá-lo para não perder o que já fez. Como estamos na Internet, online, pode acontecer de tudo, desde uma falha no computador, até a ligação com o provedor cair, ou o próprio sistema do VilaBOL dar algum problema. A Internet, querendo ou não, é instável. Quem trabalha com ela sabe que é assim mesmo. É como nossos serviços básicos, como luz ou telefone. Às vezes acontecem problemas, podendo ser culpa ou não das empresas fornecedoras, mas de toda forma o problema ocorreu. Então previna-se e salve periodicamente seu trabalho de edição. Depois de tudo pronto e salvo, para retornar basta clicar no botão Ge renciador de arquivos e pronto. Pode ser, no entanto, que você queira colocar outro nome para sua página ao invés do nome original. Então clique no botão salvar como e escolha um novo nome para o arquivo. Também você pode escolher um novo destino ou seja, se o arquivo vai para a pasta principal (que eu costumo chamar de raiz ou root, que são os nomes mais utilizados em nosso meio) ou se o arquivo irá para outra pasta. Depois basta clicar em Confirmar. Os outros botões do menu que vêm depois do salvar como são bem simples. O botão ge ren ci ador de arquivos irá levá-lo (adivinhem!) de volta para o Gerenciador de arquivos. O botão sair do editor irá levá-lo de volta para a tela da Figura 4.13, fora inclusive do Gerenciador de arquivos.

123 Figura 4.13 E o botão ajuda HTML é exatamente para o que ele diz ser, um tutorial sobre a linguagem. Vejamos agora os primeiros botões. O nova página irá lhe criar uma... página nova, exatamente. Ele irá criar um nome temporário e lhe exibir a tela de edição completamente em branco para você colocar seu código. Veja na tela que mostramos aqui que o nome temporário é sem_nome.html. Figura 4.14

124 !" ### Quando você tiver colocado seu código, clique no botão salvar como para escolher um outro nome para sua nova página. Se você clicar em salvar apenas, o arquivo irá para seu site com esse nome temporário. O botão abrir tem como função possibilitá-lo a abrir um arquivo já existente em seu site sem ter que voltar ao gerenciador de arquivos, etc. Daí mesmo, da tela de edição de código, você clica e aparece esta outra página onde poderá selecionar o arquivo que deseja editar agora. Figura 4.15 Basta escolher o arquivo desejado (se ele estiver dentro de alguma pasta, clique primeiro nela para abri-la e localizar sua página) e selecionar através do círculo ao lado de cada nome. Note que no Gerenciador de arquivos temos quadradinhos de seleção. Esses quadrados nos permitem selecionar mais do que um arquivo de cada vez. Vários. No caso do gerenciador, onde podemos copiar, mover ou apagar mais do que um arquivo, isso é necessário. A única exceção é com relação a editar a página, que já lhes falei que só pode ser feita uma de cada vez, e se você selecionar duas páginas, o sistema irá lhe alertar sobre isso. No entanto, aqui estamos querendo editar uma página, e somente uma, já que o sistema não permite de outra maneira. Então se utiliza o círculo de seleção. Ele só permite uma seleção apenas. Se você clicar em outro arquivo, o anterior se apaga, certo? Nesta tela não precisamos apagar, nem copiar nem utilizar outra função que possa ser necessária à seleção de mais do que um arquivo. Então também não é necessária a utilização do quadradinho de seleção múltipla. Bem, selecione o arquivo que quer editar e clique no botão Confirmar. Isso irá trazer a página para o editor.

125 Nota: Se você estiver já com uma página aberta e não a salvou antes de apertar o botão abrir, o sistema irá lhe avisar se quer ou não salvar a página que estava aberta ou se quer cancelar a operação de abrir uma outra, continuando com aquela aberta. Bem, acho que já é hora de voltarmos ao Gerenciador de arquivos. Ao editar uma página já vimos todos os comandos e situações que podem acontecer, então clique no botão geren ci ador de arquivos e vejamos os outros itens. Já vimos então como criar uma nova pasta, como copiar arquivos, renomear e também editar páginas. Estão faltando agora os botões apagar, mover, enviar arquivo(s) e o nosso sempre amigo ajuda. Figura 4.16 Para apagar um ou mais arquivos, ou mesmo diretórios, basta selecioná-los pela caixinha de seleção e então clicar no botão correspondente. Figura 4.17

126 !" ### O sistema irá lhe apresentar uma tela perguntando se quer mesmo concretizar essa ação e então você poderá escolher entre continuar ou cancelá-la. Realmente é simples assim. Vejamos agora o próximo item, que é move r arquivos. Novamente aviso aqui que, caso você mova, renomeie ou mesmo apague arquivos, como vimos, deve tomar cuidado para que não ocorra quebra de links. Saiba qual página chama a outra, e não deixe furos na sua navegação. A coisa mais chata é seu visitante clicar em um link e o sistema avisar que não tem nenhuma página ali com aquele nome. Ou porque você escreveu errado o nome da página no código ou porque você apagou a página ou então mudou o nome da página e não consertou o link. Ao mover arquivos, podemos escolher qual o destino deles, ou a pasta principal ou alguns dos diferentes diretórios que criamos em nosso site para organizar nossos arquivos. E veja só que eu ainda não lhes havia explicado um detalhe muito interessante no site do VilaBOL. Você tem uma pasta secreta em seu site, que só pode ser vista por você quando estiver editando seu site no gerenciados de arquivos. Esse diretório é feito para você guardar páginas ou imagens que não quer que outras pessoas vejam, a não ser você. Isso é muito interessante. Então, quando quiser esconder algum arquivo, mova-o para a pasta secreta. Quando quiser que outras pessoas o vejam, tire-o de lá. Voltando à função mover, o sistema do VilaBOL irá lhe dizer quais arquivos está prestes a mover e logo abaixo mostrará os diretórios para onde pode enviá-los. Selecione uma das pastas/diretórios e clique em um dos botões para confirmar ou cancelar a operação. Figura 4.18

127 T emos agora a função de enviar arquivos, com certeza a que vocês mais utilizarão, pois mais da metade das pessoas cria seu site sossegado em casa ou no escritório, com softwares mais apropriados, como já citei antes. Depois testa-os para ver se têm algum problema de navegação e somente depois envia os arquivos para o servidor Web onde eles ficarão disponíveis para os visitantes de seu site. Infelizmente o VilaBOL não permite que enviemos os arquivos via FTP, o que iria apressar sobremaneira todo o processo. Isso porque via FTP você pode enviar quantos arquivos quiser de uma vez, deixando-os em fila para serem processados e colocados em seu site. O VilaBOL nos oferece a possibilidade de envio de 5 arquivos de cada vez, no entanto agora podemos mandar arquivos zipados e abri-los dentro do site. Veja na Figura 4.19 a tela de envio de arquivos. Figura 4.19 Primeiramente temos que localizar cada arquivo em nosso computador (ou que esteja na rede ou em disquete). Para isso, clique no botão Procurar ou Browse. Dependendo de cada computador vai aparecer um dos dois nomes, dependendo da versão em português ou em inglês. Clique no botão e verá uma janela aparecer mostrando os arquivos em seu computador.

128 !" ### Figura 4.20 Procure seu primeiro arquivo a ser enviado para o site e selecione-o com o mouse, depois clique no botão Abrir ou O pen. Você verá que o nome e a localização dele será agora dentro do campo editável do lado do botão Browse em que tínhamos clicado. Agora o mesmo processo se repete para o segundo arquivo, terceiro, quarto e o quinto. Clique no próximo botão Browse, encontre seu arquivo na janela que aparece, clique em Abrir/O pen e veja o nome dele aparecer no campo editável antes vazio. Depois de ter escolhido os seus arquivos você não precisa enviar sempre 5 arquivos de cada vez, pode mandar 1, 2, até o máximo de 5, escolha a seguir o destino para onde quer enviar esse(s) arquivo(s) selecionando o diretório na lista que aparece abaixo e clique no botão Confirmar. Ou Cancelar caso tenha desistido. Nota: Caso sem querer você tenha escolhido o arquivo errado para envio ou então escolheu duas vezes o mesmo, é só clicar no botão Browse/Procurar ao lado do arquivo errado e fazer o mesmo esquema, escolhendo outro. Se não quiser enviar um deles e não tiver outro para mandar, basta apagar o que está escrito naquele campo editável. Simples, não? Agora, lembra-se de que falei sobre enviar arquivos zipados? Pois bem, esta é uma nova característica de envio do VilaBOL. Praticamente quando eu estava completando este livro é que surgiu esta boa novidade. Por isso sempre lhes falo que nada na Internet é eterno. As modificações sempre acontecem, sempre tentando facilitar e melhorar a sua vida. Vejamos então qual a facilidade que temos em enviar um arquivo zipado. Primeiramente vamos explicar o que é um ZIP.

129 ZIP é um formato de arquivo onde podemos comprimir vários outros arquivos dentro dele. Imagine o zip como uma bolsa onde podemos colocar várias e várias coisas. Só que essa bolsa tem uma mágica, que é tornar tudo o que colocamos dentro dela menor. E quando tiramos, tudo retorna ao tamanho normal. O arquivo ZIP é isso. Dentro dele podemos colocar vários e vários arquivos, e, graças a uma mágica, ele deixa os arquivos menores, bem comprimidos, sem perder nada. Quando tiramos os arquivos que estão comprimidos dentro do zip, eles voltam ao tamanho normal. Existem vários programas compactadores que criam arquivos zip. O mais famoso deles é o WinZip. Ele é pago, mas você pode testá-lo por 30 dias gratuitamente. Para pegá-lo na Internet, tem que ir ao site dele, que é o Existem outros programas, que, como falei, também criam arquivos ZIP, e alguns deles são gratuitos. Para procurar um que seja gratuito, indico o site Superdownloads, um site nacional. Utilize o endereço: br/programas/index.cfm Clique em Utilitários e logo a seguir na próxima página, clique em Compressão de arquivos. Do lado esquerdo verá os nomes de programas e do lado esquerdo se ele é grátis (freeware) ou se tem algum tempo de uso antes de ter que efetivamente comprá-lo (shareware). Também verá informações sobre para quais tipos de computador ele serve (Win95, Win98 e WinNT) e o tamanho dele para efetuar o download, ou seja, baixá-lo da Internet para seu computador. Um dos que vi que achei interessante é o Freezip. Mas escolha o que mais lhe agradar. Você pode tentar vários, até encontrar aquele com que você mais se dê bem. De toda forma, agora você já sabe o que é um arquivo zip. Não vou poder explicar aqui como funciona cada um dos programas que zipam arquivos. Isso você terá que aprender utilizando o programa que você escolheu. Você poderá zipar todo o seu site em um único arquivo zip e depois mandá-lo para o VilaBOL pelo sistema de envio de arquivos que já vimos agora há pouco. A grande vantagem é poder enviar tudo de uma vez só. Se você tiver arquivos em vários diretórios/pastas, tudo bem também. Normalmente utilizamos as pastas para organizar melhor o conteúdo do site. Em uma pasta colocamos as imagens, em outra as páginas sobre amigos, ou sobre um projeto nosso, etc. Quando formos gerar o arquivo zip, temos que dizer a ele que queremos que o conteúdo das pastas também esteja dentro desse arquivo. Depois, tudo o que temos que fazer é enviar o arquivo para o VilaBOL. Assim que estiver lá, eis o que temos que fazer para abrir o arquivo do nosso site e liberar todos os outros arquivos e pastas que temos lá dentro:

130 !" ### Figura 4.21 Primeiramente temos que localizar o arquivo zip. No exemplo que estou mostrando o nome do arquivo é imagens.zip. Eu seleciono o nome do arquivo clicando no quadrado de seleção ao lado do nome dele. Depois eu clico no botão descom pactar lá em cima. A próxima tela a aparecer seria parecida com esta: Figura 4.22

131 O VilaBOL já abriu o meu arquivo ZIP e está me mostrando o que eu tenho dentro dele. Ele também me diz quanto eu vou precisar de espaço livre para descompactar todos estes arquivos. Se você não quiser algum dos arquivos, então basta tirar a seleção do quadrado ao lado do nome dele. Se quiser todos os arquivos, então deixe-os selecionados como aparecem. Um segundo item é escolher se queremos que o VilaBOL apague o arquivo ZIP depois de descompactar tudo o que tem dentro dele. Esta é uma sábia decisão, já que você não vai mais precisar desse arquivo zip depois de concluída a operação de retirada dos arquivos compactados. Ele só iria ficar no seu site ocupando espaço, certo? No entanto se ainda quiser ficar com ele, tudo bem. Basta tirar a seleção ao lado. Depois pode utilizar o gerenciador de arquivos para apagar o arquivo ZIP se assim o desejar. A terceira opção é se você quer manter a estrutura original de diretórios/pastas. Esta opção eu recomendo sempre deixá-la selecionada. Senão vai ser a maior confusão. Imagine que você tem dois arquivos com o mesmo nome, mas que estão em diretórios separados. Isso não tem problema, certo? Mas, se na hora que você for descompactar o seu arquivo ZIP esta opção não estiver selecionada, os dois arquivos de mesmo nome não vão mais estar separados em diretórios, então um deles vai apagar o outro e somente um vai ficar. Isso é ruim, não? Outro problema é com relação a links. Talvez você acabe perdendo os links de uma página para outra se não deixar essa opção selecionada, porque uma página vai procurar a outra dentro de pastas que não existem mais. Isso também é ruim. Bem, depois de tudo certo, basta clicar no botão Confirmar para que o sistema do VilaBOL descomprima seus arquivos corretamente em seu site. Você também pode comprimir os arquivos que não utiliza mais em seu site. É praticamente o mesmo processo. Primeiramente selecione os arquivos pelo gerenciador de arquivos, selecionando-os. Depois clique no botão Compactar. A próxima tela é muito parecida com a da Fig

132 !" ### Figura 4.23 Aqui o sistema nos mostra quais arquivos escolhemos. Depois nos pergunta qual vai ser o nome do arquivo ZIP para onde esses arquivos escolhidos serão compactados. Escreva algo como imagens.zip, ou arquivos.zip ou o nome que quiser, desde que não exista já um outro arquivo zip com o mesmo nome. Depois há a opção de apagar os arquivos originais após a compactação e criação do arquivo ZIP. Se você estiver compactando arquivos que não usa mais, esta é uma boa decisão, porque de toda forma você pode descompactar qualquer um dos arquivos depois, simplesmente selecionando o arquivo ZIP criado e clicando no botão Descompactar como já ensinei. Simples, não é? Se tiver alguma dúvida, e este livro não conseguiu esclarecer, tente ver no botão Ajuda, que lhe mostrará os detalhes sobre cada função do VilaBOL.

133 Figura 4.24 Se ainda assim não conseguiu entender algo, há um para orientação do próprio suporte do VilaBOL. Concluímos aqui o sistema de gerenciamento de seu site, tanto com o editor básico quanto com o modo mais avançado. No entanto o BOL ainda nos permite incluir alguns complementos às nossas páginas que irão deixá-las mais interessantes. Vamos ver agora quais são eles. Como todo bom hospedeiro de páginas, há sempre algo a mais que nos é oferecido. Em alguns são os contadores de páginas, em outros são tipos de formulários e em outros ainda temos previsão de tempo, etc. No VilaBOL temos, por enquanto, um livro de visitas e um contador de páginas. Veja na Figura 4.25 a tela que aparece ao clicarmos em complementos no menu lateral esquerdo. Aliás, o menu esquerdo é um tipo de companheiro que sempre irá lhe ajudar a se orientar no VilaBOL. É através dele que podemos automaticamente ir para o Editor Básico (clicando em construa), ou então para o Gerenciador de Arquivos (clicando em gerencie) e no caso do livro de visitas e dos contadores, é só clicar em complementos.

134 !" ### Figura 4.25 Voltando à tela de complementos, para instalar um livro de visitas em seu site, clique no link Crie seu livro de visitas!. Veremos nova tela com um formulário. Primeiramente devemos responder qual será o título de nosso Livro de Visitas. Escreva algo, como Livro de Visitas do Fulano de Tal (seu nome no caso). Seja bem simples. A próxima pergunta é para escolhermos as cores dos componentes de nosso livro de visitas. É estranho escolher as cores sem vermos como elas irão ficar, não é mesmo? Já que estamos iniciando, seria legal vermos pelo menos o esquema básico da página do livro de visitas.

135 Figura 4.26 Por isso coloquei na próxima figura a página concluída; para então você ver se as cores estão ou não de acordo. E assim você poderá mudar ao seu gosto.

136 !" ### Figura 4.27 Depois vem a cor do título. Deixei na cor vermelho escuro (vinho), exatamente como veio no formulário. O texto em preto e os links, tanto os não clicados quanto os visitados, em azul escuro. Os links, para quem não sabe, podem mudar de cor depois que os clicarmos. Esse é um recurso que era muito usado para podermos saber onde já clicamos apenas reconhecendo a cor. Normalmente os links eram azul claro ou escuro e, depois de clicados, mudavam sua cor para cinza, ou vermelho, etc. Isso era muito usado antes porque a Internet, no seu começo, não tinha botões, nem recursos como os de hoje, onde vemos menus e botões inteligentes. A navegação era só com texto. Quase sem figuras. Por isso era necessária uma maneira de visualizar por onde já tínhamos passado. Então, se quiser, pode mudar as cores dos links de tal maneira que eles, antes de serem clicados com o mouse tenham uma cor e após terem sido usados (clicados) mudem a cor. Finalmente temos agora a cor da linha que irá separar os textos entre si dentro da página. Escreva agora no terceiro item do formulário uma introdução. Uma pequena frase que será colocada abaixo do título e que incentive o visitante a se cadastrar. Pode ser qualquer coisa, como Bem-vindos ao meu livro de visitas. Por favor deixem seus nomes e comentários abaixo. Em quarto lugar iremos decidir o que queremos que o visitante preencha. Podemos pedir apenas o nome, ou então agregarmos o do visitante e talvez o site dele, se o tiver. Se quisermos saber mais ainda, podemos colocar nos espaços que aparecem abaixo, quais outros campos gostaríamos que aparecessem para serem preenchidos pelo visitante. Pode ser interesse, time de futebol, data de nascimento, etc, etc. Podemos escolher até 4 campos extras para incluir em nosso livro de visitas. Depois iremos dizer ao VilaBOL se queremos que as mensagens, antes de serem publicadas, sejam aprovadas por nós. Se deixarmos o quadradinho de seleção vazio, isso significa que não queremos aprovar as mensagens publicadas. A vantagem é que realmente é chato você ter que entrar em uma página especial ( para escolher quais são as

137 mensagens que devem ou não ser publicadas. A desvantagem é que algum visitante engraçadinho pode escrever palavrões, xingamentos, etc. Agora você decide o que prefere: ou perder algum tempo escolhendo as mensagens a serem publicadas ou arriscar algum comentário engraçadinho. Por último iremos clicar no botão Visualizar para termos uma leve idéia do que será nosso livro de visitas. Clique e... voilá! Este é o resultado que temos na visualização com o exemplo que apresentei. Figura 4.28 Não é lá grandes coisas, certo? Mas o importante é que funcione. Eu gostaria que pudéssemos modificar o design da página ou as letras, mas não podemos. Somente podemos mudar as cores depois de publicado. Para isso, basta visitarmos outra página especial ( livro_de_visitas.html) e lá encontraremos este mesmo formulário que estamos preenchendo para a criação, mas desta vez servirá para modificação. Se tentarmos modificar as cores e o texto da nossa lista de visitas por este mesmo processo que agora estamos fazendo, corremos o risco de apagarmos todas as mensagens que porventura já existam gravadas. Isso acontece porque aí estaremos criando uma nova lista de visitas. Repetindo: para criar pela primeira vez uma lista de visitas, devemos seguir como estamos agora. No entanto, depois de criada, querendo modificá-la, somente poderemos utilizar o link antes citado. Voltemos à nossa tela de visualização. (Figura 4.28).

138 !" ### Repare que embaixo temos dois botões: um para voltar à página de edição talvez não tenhamos gostado das cores ou dos texto, e então ainda poderemos modificálos antes de salvar a lista, que é exatamente a função do outro botão. Digamos que esteja tudo ok e que já queiramos publicar essa página da lista. Clique em Salvar e então o sistema irá criá-la. Logo após verá a tela da Figura 4.29, onde irá receber os parabéns por ter criado com sucesso sua lista de visitas. Figura 4.29 Lá você encontrará as instruções de como deve proceder para seus visitantes acessarem sua página. É necessário agora fazermos tudo na mão, ou seja, devemos abrir a página onde iremos colocar um link, um atalho, para essa outra página contendo a lista de visitas. Sendo assim, devemos abrir o gerenciador de arquivos clicando no botão amarelo gerencie que existe no meu lateral esquerdo nessa mesma tela.

139 Isso nos leva a outra tela. Figura 4.30 Clique em Abrir o gerenciador de arquivos. Figura 4.31 Agora sim estamos no gerenciador. Vamos dizer que queira colocar o link para a sua lista de visitas na sua homepage. Selecione o quadrado ao lado do arquivo de nome index.htm (ou index.html). Clique agora no botão e ditar página. Aquela página agora irá se abrir no editor html. Lá veremos o código da página para que possamos inserir a chamadinha de nossa lista recém-criada. Agora, a parte

140 !" ### mais difícil é saber onde você deve inserir esse código de tal maneira que fique legal quando aparecer no navegador do seu visitante. Eu o coloquei bem simples: criei a primeira página seguindo exatamente as instruções que temos aqui no livro. Sendo assim, imagino que vocês terão uma página mais ou menos parecida. Procure no final do código algo como: hre f= ><li>ge rencie sua página<br></a> e escreva logo abaixo: <a href= ><li>ler meu livro de visitas<br></a> <a href= ><li>assinar meu livro de visitas<br></a> clique em Salvar e espere um pouco para o sistema salvar sua página e retorne ao gerenciador clicando no botão referente. No código, vai ficar algo mais ou menos assim a partir daquela parte que pedi para procurarem: <a hre f= ><li>ge rencie sua página<br></a> <a href= ><li>ler meu livro de visitas<br></a> <a href= ><li>assinar meu livro de visitas<br></a> </menu></span> visualizar o código pelo editor do VilaBOL realmente não é uma tarefa fácil. Programas de edição acabam fazendo o que chamamos de indentação, que seria deixar o código mais visível, mais ou menos assim: <a href= > <li >Gerencie sua página <br> </a> <a href= >

141 <li >Ler meu livro de visitas <br> </a> <a href= > <li >Assinar meu livro de visitas <br> </a> </menu> </span> Isso facilita nossa vida na hora de botarmos a mão na massa, digo, no código. A separação por linhas, o uso de espaços ou tabulação para melhorar a visão dos elementos principais do código e, em muitos editores, o uso de cores para separar elementos de html do resto da página, como textos, etc., realmente é algo prioritário para um bom desenvolvedor de páginas na Internet. Bem, de todo modo, vimos então como criar nosso livro de visitas. Vimos que temos que, primeiramente, criá-la e depois inserir o código dentro de uma de nossas outras páginas (ou dentro de todas) para criarmos o link, o atalho para esse nosso livro de visitas. Após inserirmos o código, temos apenas que salvar a página e voltar ao gerenciador de arquivos. No livro poderemos ver os comentários de todos os visitantes que o assinaram preenchendo o formulário que criamos. O visitante pode também ter um atalho direto para assinar o livro de visitas. Assim ele poderá preencher o formulário rapidamente e colocar seu comentário sobre o site. Vimos também que, para liberarmos os comentários deixados se foi assim que decidimos fazer naquela página de criação do livro de visitas devemos regularmente visitar a página livro_de_visitas.html e se quisermos modificar algum item do nosso livro, basta irmos até a página livro_de_visitas.html. Pode acontecer do sistema lhe pedir seu nome de usuário e senha, caso tente acessar essas páginas de outro computador por exemplo, mas isso não é mais empecilho, certo?

142 !" ### Ainda não vimos como ficaria a página com os links que acabamos de colocar para o livro de visitas. Vejamos então como ela era antes: repare que havia apenas os links Edite sua página e Gerencie sua página logo acima da casinha símbolo do VilaBOL. Figura 4.32 Agora veja como ficou depois da inserção daquele código. Figuras 4.33 Contador de Páginas Vamos nos aprofundar agora em como inserir um contador de páginas em seu site. Normalmente o contador é sempre colocado na primeira página do site, ou seja, na homepage. Com raras exceções seria interessante colocarmos internamente.

143 Como o processo é o mesmo, vamos partir do princípio básico de que o marcador apenas será mostrado quando o visitante entrar na homepage de nosso site. Voltando àquela página dos complementos (ver Figura 4.34), iremos encontrar um link para uma outra tela nos explicando como se instala o contador. Figura 4.34 É muito simples na realidade, e você nem precisa visitar essa página, mas de toda forma vou mostrá-la aqui. Tudo o que você precisa fazer, na realidade, é incluir um outro código em sua página, exatamente como o fizemos com o livro de visitas. O código a ser colocado desta vez é assim: <img src= > Figura 4.35

144 !" ### Repare que escrevemos aqui vila PONTO bol. Apesar do site de hospedagem se chamar vilabol, tudo junto, nos dois casos de complementos o endereço deve ser vila PONTO bol PONTO com PONTO br, ok? Essa é uma dica para os desatentos, porque quando vemos que não funciona o contador ou o livro de visitas logo ficamos achando que é defeito do sistema deles e muitas vezes nós é que escrevemos errado. E vocês já sabe: código errado em HTML acaba gerando algum tipo de erro. O esquema é exatamente o mesmo do livro de visitas. Abra o gerenciador de arquivos, procure o arquivo index.html e clique no quadrado ao lado do nome dele, selecionando-o. Depois clique no botão e di tar págin a para vermos o código. Agora será mais simples de acharmos onde devemos inseri-lo. Vá até o final do código utilizando a barra de rolagem do quadro onde se encontra o html. Você irá ver algo assim: </table > </body> </html> Agora edite o html de tal maneira que fique assim: </table> <p align= center ><img src= ></p> </body> </html> Veja que eu acrescentei alguns elementos ao código original do contador. Eu acrescentei o <p align= center > e no final um </p> Isso irá fazer com que o contador fique espaçado da tabela de cima, então separamos melhor os elementos e também ele ficará alinhado ao centro. Dessa forma ele vai ficar mais legal na página. Salve a página e clique no botão do gerenciador. Vamos ver como a página ficou. Assim que a tela com o gerenciador de arquivos aparecer, clique diretamente sobre o nome do arquivo. Isso irá abrir uma nova janela do seu navegador e mostrará o arquivo nela, ou seja, mostrará a homepage. Repare embaixo que o contador já co-

145 meça a funcionar, mostrando a quantidade de vezes que se entrou naquela página desde o momento em que inserimos o código e a salvamos. Existem outros tipos de contadores no VilaBOL também, mas você terá que, antes, passar por todo esse processo de colocar o contador básico, salvar a página e visualizá-la. Somente depois de ver sua página no navegador e ele começar a marcar do em diante é que poderá mudar o tipo do contador. E para isso é muito simples, basta entrar novamente na página onde se explica como colocar o contador. Veja a figura a seguir: Figura 4.36 Ao entrar no VilaBOL, você pode clicar diretamente no link Serviços para o seu site, em complementos. Figura 4.37

146 !" ### Ou então, já logado no sistema, pode clicar no menu lateral esquerdo, também em complementos e em seguida clicar no link Coloque um contador em seu site. A partir daí, verá a tela de apresentação dos contadores. Figura 4.38 Repare que temos um segundo item chamado Outros contadores do BOL. Seguindo o texto, há um link clique aqui para escolher outros tipos. Clique com o mouse sobre ele. Caso você tenha feito tudo certo anteriormente, ou seja, já incluído um contador como expliquei, e depois visualizado sua página funcionando e marcando cada entrada no seu site, deverá ver esta tela a seguir. Caso contrário, o sistema irá lhe trazer para a mesma página onde estava. Supondo que tudo tenha seguido corretamente, verá a tela da Figura 4.40 onde poderá incluir um novo contador em outra página (na verdade o link irá apenas redirecioná-lo para a página anterior e terá que fazer tudo na mão como antes). Poderá também modificar o contador que tem cadastrado e já funcionando e também apagá-lo caso deseje. O tipo de contador escolhido aparece abaixo e a localização do mesmo também aparece embaixo. Digamos que queira modificar o desenho do seu contador porque não gostou muito dele, ou simplesmente pela curiosidade de ver o que o VilaBOL tem a lhe oferecer em matéria de outros contadores. Clique no botão modificar.

147 Figura 4.39 Veja a quantidade de contadores que você vai ter disponível. Basta selecionar um deles clicando no círculo de seleção ao lado do modelo escolhido. Logo abaixo você tem também como controlar a partir de qual número seu contador irá iniciar. Ao invés de começar do número 1, você poderia colocar o contador para iniciar a contagem a partir do número Então quem entrasse em sua página iria achar que ela já foi visitada mais de 1500 vezes. Convenhamos, isso é uma grande mentira. A única razão para usar este recurso é para o caso de você acidentalmente ter perdido o conteúdo de sua página ou apagado o seu contador, e agora querer o seu novo contador mostrando a partir de quando ele foi apagado. Aí tudo bem. Você tem também uma terceira opção que é a quantidade de dígitos. Se você escolher 3 dígitos, por exemplo, quando chegar a 999 visitas, o próximo visitante irá ver 000, que seria o 1000, mas como não há espaço para o número 1000, então ele zera o contador. Sempre deixe no mínimo 5. Se você perceber que terá mais visitas do que , então coloque mais dígitos depois. A seguir basta clicar no botão Alterar para salvar suas modificações.

148 !" ### Figura 4.40 O VilaBOL então nos apresenta uma página dizendo qual foi a página cujo contador foi modificado. Figura 4.41

149 Lembrem-se de que temos a opção de alterar um contador, mas também temos a opção de apagá-lo. Se clicarmos no botão Apagar, veremos esta tela aparecer por cima. Figura 4.42 Se quisermos realmente apagar o contador da página em questão, clique Sim, caso contrário, clique Não e a janela se fechará sem efetuar nenhuma operação. Se, no entanto, você decidiu apagar, o VilaBOL irá apresentar a seguinte mensagem de que o contador da página tal foi removido. Figura 4.43 Aqui encerramos todas as funcionalidades atuais do VilaBOL que eu poderia explicar. Com certeza novas facilidades irão surgir. Essa é a evolução natural da Internet e da vida. Vamos ao próximo serviço de hospedagem. Planeta Terra Conecte-se à Internet e entre no site do Planeta Terra:

150 !" ### Figura 4.44 Já vimos antes como se registrar no site, então você provavelmente já seguiu todas as instruções e tem sua conta no Planeta Terra. Sendo assim, preencha seu username e senha nos campos solicitados e clique no foguetinho do OK. Est a é a t ela que veremos para gerenciar nosso sit e. A cont a do Planet a T erra foi apenas aberta. Na primeira vez que entramos no site, não há qualquer arquivo. Figura 4.45 No Planeta Terra não temos como editar um arquivo. Temos que fazê-lo em casa ou no escritório, enfim, em um computador e só depois enviá-lo para o site na Internet.

151 Os comandos que temos no gerenciador de arquivos do Planeta T erra (ou Administração do Site, como é chamado aqui), são: En vi ar Clique aqui para enviar algum arquivo (seja de página htm ou de imagem ou outro qualquer) para o seu site. Através deste comando você irá colocar o conteúdo no seu site. Baixar Selecione um arquivo que aparece no gerenciador de arquivo. Clique em baixar e você poderá salvá-lo em seu computador. Nova Pasta Clique aqui para criar uma nova pasta/diretório em seu site. Renomear Selecione um arquivo ou diretório e clique aqui para trocar o nome dele por outro. Apagar Selecione um arquivo ou diretório e clique aqui para apagá-lo de seu site. Procurar Se você quiser saber onde está algum arquivo seu e não consegue encontrá-lo, utilize este botão para que o T erra possa localizá-lo mais facilmente. Recortar Selecione um arquivo ou diretório. Clique neste botão para fazer o arquivo ou diretório sumir de onde estava e ir para a memória do sistema. Utilize depois o botão Colar. Copiar Selecione um arquivo ou diretório e clique em Copiar para copiá-lo para a memória do sistema. Escolha um diretório para colá-lo e clique no botão Colar. Colar Utilize-o depois de usar o Recortar ou Copiar. Ele vai pegar o arquivo ou o diretório que estiver na memória do sistema e colá-lo no local que você escolheu. Se já houver arquivo ou diretório com o mesmo nome, o sistema cria outro para você. Ajuda Esse item nem precisa de explicação, não é? É a ajuda do sistema. Vejamos como é que utilizamos o botão En vi ar.

152 !" ### Ao clicá-lo veremos a seguinte tela, onde iremos clicar no botão Browse para localizar em nosso computador o arquivo que queremos enviar para o site. Figura 4.46 O sistema é o mesmo do VilaBOL, e será o mesmo para vários outros sites de hospedagem, por isso não acho que precisemos novamente da explicação. A maior diferenciação é que já podemos escolher daqui qual o diretório onde queremos que esses arquivos sejam copiados. Se seu site já tiver vários diretórios, eles estarão listados no combo ao lado de Destino. Clique na seta e selecione qual o diretório/pasta desejado e pronto. Se quiser que eles fiquem logo no começo do site, que chamamos de raiz ou root, deixe selecionado na barra /. Basta clicar agora no botão En via. Lembre-se de que, ao selecionar o diretório, TODOS os arquivos acima serão enviados para lá. Não dá para dizer que quer apenas um ou dois arquivos para o diretório escolhido. Assim que os arquivos tiverem sido enviados, receberemos uma mensagem de confirmação. Basta clicar em O K para voltarmos ao gerenciador. Figura 4.47

153 Agora veremos o segundo comando, que é Baixar. Este é bem simples. Basta selecionar o arquivo que quer trazer para seu computador e clicar no botão. O sistema irá mostrar uma tela parecida com a da Figura Figura 4.48 Você não pode baixar mais do que um arquivo de vez ou um diretório inteiro, esteja ele vazio ou não. Apenas um arquivo por vez, ok? Verifique se a seleção está em Save this file to disk ou Salvar este arquivo para o disco e clique no botão Ok. Logo aparecerá outra janela. Nessa tela escolha onde quer guardar o arquivo escolhido que está sendo trazido de seu site na Internet. Figura 4.49

154 !" ### Você pode escolher outro nome para ele também, mas tenha cuidado para sempre deixar o arquivo com a terminação correta. Se for um arquivo htm, então não esqueça do ponto htm, se for um arquivo zip, não se esqueça do ponto zip, se for uma imagem gif, não se esqueça do ponto gif, ok? A partir daí, clique em Save ou Salvar e o arquivo será baixado para seu computador. Qual o próximo comando agora? Sim, é o Nova Pasta. É muito simples o que ele faz. Apenas cria uma nova pasta (ou diretório, como preferir) onde quiser. Ao clicar nesse botão, o sistema irá mostrar a seguinte tela: Figura 4.50 Você só deve escrever o nome da nova pasta e o destino dela, ou seja, se vai ficar na raiz de seu site (então escolha a barra /) ou dentro de algum outro diretório (escolha o destino clicando na setinha e selecionando o diretório dentro do qual essa nova pasta vai ser criada). A partir daí, clique em Cria e pronto. Simples mesmo. O comando Renome ar serve exatamente para o que ele se propõe: renomear algum arquivo ou diretório/pasta com outro nome. Simplesmente selecione o arquivo ou pasta cujo nome deseja trocar no gerenciador de arquivos e clique no botão. Uma tela irá surgir onde você poderá escrever o novo nome do arquivo selecionado. Depois basta clicar em Renomei a e pronto.

155 Figura 4.51 Para utilizar o comando Apagar, selecione o(s) arquivo(s) e/ou diretório(s) e clique no botão. O sistema irá mostrar uma tela com o nome dos arquivos e diretórios selecionados. Dê uma checada para ver se são esses mesmos que você quer apagar de seu site e clique no botão Exclui. Figura 4.52 O comando Procurar é para aquelas situações em que você sabe o nome de um determinado arquivo, mas não sabe onde ele está. Isso muitas vezes acontece quando temos um site muito grande, e o organizamos em várias pastas, até mesmo subpastas, ficando às vezes difícil achar um arquivo, principalmente uma imagem. Clique no comando Procurar e então preencha a tela seguinte com o nome do arquivo procurado.

156 !" ### Figura 4.53 Clique no botão Procurar e espere o resultado. Se o arquivo estiver lá no seu site e você escreveu direito o nome dele, o sistema o encontrará e trará um resultado. O Planeta Terra então nos mostra quais foram os arquivos encontrados com aquele nome e qual a pasta onde ele se encontra. Sempre que você estiver em outra tela que não a de administração de seu site, o gerenciador de arquivos, verá que no final há um ícone onde verá escrito volta para a lista. Clicando ali você sempre volta para o gerenciador. Nessa tela veja também que você já pode baixar o arquivo encontrado, renomeá-lo, apagá-lo, recortá-lo, copiá-lo, colá-lo ou enviá-lo por para algum endereço eletrônico, UFA!!! Quanta coisa dá pra fazer, hein? Figura 4.54 O comando Recortar faz exatamente o que ele faria em um Word, por exemplo. Primeiramente você seleciona o que quer recortar. Pode ser um diretório ou um arquivo. Depois clica em Recortar. O sistema irá primeiramente remover o que você selecionou para a memória do sistema. Isso quer dizer que você não vai ver

157 no gerenciador de arquivos o que removeu. Mas quando apertar o comando Colar, tudo o que você removeu e acabou copiando para a memória do sistema, será colado no seu site. Por exemplo: digamos que você selecione um arquivo chamado fotos.htm. Aí você usa o comando Recortar. O arquivo vai sumir. Mas quando você aperta Colar, ele reaparece. E se clicar Colar de novo, o sistema vai colocar uma cópia desse arquivo (que o sistema não mostra, mas que está na memória dele) dentro do seu site, mas com outro nome, como fotos.hmt_1. Mas cuidado. Se você selecionar outro arquivo e utilizar também o comando Recortar, o primeiro arquivo vai sumir de vez, tanto do seu site quanto da memória do sistema do Planeta Terra. E quando você sair ou desligar o seu navegador, o sistema também se esquece daquele arquivo e aí você vai perdê-lo para sempre. O comando Copiar irá copiar tudo o que você selecionou na memória do sistema para depois você colar em seu site utilizando o comando Colar. É realmente muito simples. Selecione o arquivo ou pasta desejada e clique no comando Copiar. Depois use o comando Colar para colocar tudo o que copiou onde você desejar no seu site. Acho que o comando Colar já foi bem explicado aqui com o uso do Recortar e do Copiar, correto? E o comando Ajuda nos leva para outra página onde teremos disponíveis todas as informações sobre como funciona o sistema do Planeta T erra. Figura 4.55 Com já disse antes, em várias páginas internas, você verá o ícone para voltar para a lista, que é o gerenciador de arquivos. Caso você acabe clicando em algum link que o leve para fora da área de segurança do site, terá que voltar ao e se logar no sistema novamente. Isso com certeza vai

158 !" ### acontecer se você clicar naquele link lá embaixo da página de administração do site, onde está escrito: Para saber mais sobre HTML e criação de sites, consulte o nosso site de informática Na ajuda você verá também como incluir contadores de visitantes em suas páginas e como escolher entre alguns deles, como criar formulários para envio de e também aprender como enviar seus arquivos via FTP, o que veremos no próximo capítulo. Vamos ver agora sobre contadores e formulários. Infelizmente, tudo o que você terá que fazer daqui em diante será trabalhar diretamente no código HT ML de suas páginas. Não há qualquer outro sistema que o ajude a criar, sem esse sofrimento, a sua página. Para colocar um contador em sua página, primeiramente deve conhecer HTML. Depois localize onde, em sua página, deseja que o contador seja instalado. Abra o código HT ML e localize esse local dentro dele e insira o código do seu contador no local que escolheu. O código do contador é algo como: <img src= /tools/count.cgi?df=page1&ft=0 > Se você clicar em Ajuda e escolher o item Contadores de visitantes, verá vários tipos de contadores lá, e os códigos que têm que ser utilizados para que esses contadores apareçam. Para os mais experientes, há uma seção intitulada Técnicas Avançadas dos Contadores / Exemplos que traz mais detalhes ainda sobre cada contador. Eu sinceramente aconselho apenas a primeira parte. A parte de técnicas avançadas é realmente muito avançada e complicada e não traz grandes benefícios a mais. Entre os tipos de contadores oferecidos há até mesmo alguns que mostram a hora e o dia atuais. Vejam aqui alguns exemplos deles. Como o código pode ser alterado pelo Planeta Terra, eu prefiro que vocês consultem os tipos de contadores e seus respectivos códigos diretamente no site, já que eu poderia correr o risco de lhes informar um código errado, ou mesmo de não mostrar todas as possibilidades. Pode ser que novos modelos sejam criados. Como já disse, a Internet está sempre em evolução.

159 E o formulário de ? Como eu configuro uma página para que os visitantes de meu site possam me enviar uma mensagem? O formulário de é uma ferramenta que permite aos visitantes do seu site mandar mensagens diretamente para o que você escolher. Basta acrescentar uma linha de texto de HT ML na página em que desejar, preenchendo corretamente os parâmetros. Você deve preencher o parâmetro to e acrescentar o texto que quiser como referência: <a href= /tools/ to.cgi? to=seu_ > te xto de re ferência </a> É realmente muito simples. Você coloca esse link com o código (não se esqueça de colocar seu no código) em qualquer página. Exemplo: <a href= /tools/ to.cgi? to=fulano_de_tal@terra.com.br > Me mande um </a>

160 !" ### Quando clicarem no link, o sistema irá trazer outra página com o formulário pronto para ser preenchido pelo seu visitante. O visitante preenche os espaços com o dele, o assunto e a mensagem que quer lhe enviar. Depois clica em En vi a e a mensagem vai para o que está na frente do Destinatário. Este é bem simples. Figura 4.56 Infelizmente a página de formulário não é configurável e pode ficar com uma cara muito simples. Com isto encerramos todos os recursos do Terra. Veremos o próximo agora. UOL Conecte-se à Internet e entre no site do UOL: Podemos ir pela página principal e clicar em Web Sites Pessoais do lado esquerdo, no menu lateral, lá embaixo, ou então simplesmente digitar T ambém funciona. Veremos a tela de login.

161 Figura 4.57 T emos duas maneiras de criar páginas no UOL e mantê-las. Veja que temos dois botões principais, o Faça e o Atualize. O Faça é para quando você deseja utilizar os modelos já existentes para ajudá-lo na criação de uma página. Já vimos como funciona esse processo. Agora vamos verificar como poderemos manter nosso site, editá-lo on-line e enviar possíveis arquivos de imagem ou htm para o site, sem utilizar os modelos de criação. Clique então em Atualize. Basicamente sempre iremos para as mesmas telas. Figura 4.58

162 !" ### Clique em Avançado. O outro método, o Fácil, é o que utiliza assistentes de criação e modelos já prontos. Veremos agora outra tela, a de login, que é a mais importante destas iniciais. Figura 4.59 Digite seu nome de usuário e sua senha. Lembre-se de que você tem que ser assinante do UOL para ter acesso e possuir um site hospedado nele. Depois de preencher seu nome e senha, clique no botão En trar. Já veremos a tela de onde poderemos gerenciar nossos arquivos. Figura 4.60

163 Os recursos do UOL são muito simples. Repare que temos na mesma tela a condição de: a) criar um diretório b) criar uma nova página c) visualizar um mapa do nosso site para nos localizar d) cadastrar nosso site no sistema de busca da UOL, o RadarUOL e) enviar arquivos (um de cada vez) para seu site. Vejamos primeiramente como enviar um arquivo para seu site no UOL. Perceba que o princípio é o mesmo de todos os outros provedores que já vimos. Basta clicar no botão Browse ou Procurar e, através da janela que se abre mostrando o seu computador, localizar o arquivo que pretende enviar. Assim que localizar o seu arquivo, você pode dar dois cliques nele ou então apenas selecioná-lo e apertar o botão Open ou Abrir. Figura 4.61 O nome e a localização do arquivo irá aparecer no campo que estava ao lado do botão Browse. Clique agora em En viar! para que o sistema do UOL carregue o arquivo escolhido para seu site.

164 !" ### Figura 4.62 Infelizmente você só consegue enviar um arquivo de cada vez e também não pode escolher se quer que seu arquivo vá para um outro diretório, por exemplo. Ele irá para a raiz de seu site e depois você terá que movê-lo para onde quiser. Assim que seu arquivo estiver em seu site, você o verá nessa mesma página. No exemplo que mostrei eu enviei um arquivo chamado index.htm. O nome do arquivo e seu tamanho e data da última alteração aparecem logo abaixo do campo que usamos para enviar esse arquivo. Repare que, ao lado do nome, vemos dois links: Edi - tar e Opções. Se clicarmos em Edi tar, o sistema irá abrir uma página onde iremos ver o código dessa página. Assim poderemos editar on-line o conteúdo de nossa página. Lógico que iremos precisar conhecer HTML para isso. Figura 4.63

165 Nessa tela, onde nosso arquivo está pronto para ser editado, temos as seguintes funções: a) Gravar arquivo b) Visualizar c) Sair sem alt erar d) Sem quebra de linha Ao pressionarmos Gravar arquivo iremos salvar o que modificamos e retornamos à tela inicial. Visualizar nos permite ver como está ficando nossa página. Uma nova janela irá se abrir e poderemos vê-la. Sair sem alterar apenas nos leva à tela inicial sem salvar nada do que tenhamos porventura mexido no código. O botão Sem que bra de linh a nos permite ver o código sem as quebras de linha normais. Isso é muito útil normalmente para pessoas com mais experiência em código e que utilizam linhas sem quebra, com indentação. Em qualquer código temos linhas que dizem ao programa o que fazer. Veja esta linha de código: <img src= minhafoto.jpg > Aqui estou dizendo ao navegador, que, nessa linha, quero que apareça uma imagem e que ela se chama minhafoto.jpg. Só que eu posso colocar mais detalhes ainda. Veja só: <img src= minhafoto.jpg widht= 550 height= 250 alt= Oi. Para quem não sabe, este aqui na foto sou eu. > Viu como a linha ficou quebrada em duas simplesmente porque tem mais detalhes no código? Quando escrevemos o código em HTML de uma página, às vezes é melhor vermos isso em uma linha só. Para nos localizar. É para isso que serve esse botão Sem que bra de linh a. Você, ao invés de ver apenas uma barra de rolagem, irá ver duas, só que uma vertical, para ver o código para baixo ou para cima, e outra horizontal, para visualizar o resto do código para os lados. Normalmente não iremos precisar desse recurso, mas é bom vocês saberem.

166 !" ### Bem, já vimos a opção Edi tar. Vamos ver agora para o que serve o Opções. Ao clicarmos em Opções, ao lado do nome do arquivo ou do diretório, iremos ver outra tela. Figura 4.64 Nesta tela, poderemos efetuar algumas ações com relação ao arquivo ou diretório escolhido. Temos como Renome ar seu arquivo ou diretório, bastando trocar o nome dele por outro. Se for um arquivo, não esqueça de colocar a mesma terminação. Você pode mudar o nome de um arquivo chamado fotos.htm para recordacoes.htm, memorias.htm, imagens.htm, etc., mas nunca para fotos.doc, por exemplo. Isso porque você estaria mudando as características do arquivo. Isso também serve para imagens. Não podemos mudar um arquivo.gif para um.jpg apenas mudando o final do nome. Isso não é possível. No caso de renomear diretórios, não coloque nomes com espaços. Um diretório chamado imagens pode ser renomeado para fotos ou fotos_minhas, por exemplo, mas nunca para fotos minhas. Se quiser dois nomes, una-os com o sublinhado ou underline (_). Também temos a opção de Transfe ri r. Podemos através desse botão, Mover um arquivo ou diretório para outra parte de nosso site, como para dentro de outro diretório, por exemplo. Se movermos um diretório para dentro de outro, todos os arquivos que estavam dentro daquela pasta irão acompanhá-lo.

167 Também podemos Copiar um arquivo ou diretório, não precisando assim movê-lo de lugar. Para cada uma dessas alternativas, temos apenas que escolher, logo abaixo do botão Transfe ri r, se queremos mover ou copiar o arquivo/diretório selecionado e escolher para onde queremos que essa ação seja efetuada. É só escolher, na lista que aparece abaixo, o nome do diretório-destino. Por último temos a opção de Apagar o arquivo ou o diretório selecionados. Primeiro temos que selecionar o quadrado ao lado da palavra Confirma e ent ão apertamos o botão Apagar. Nesse caso uma segunda tela de confi rmação irá ser mostrada, já que é um passo sem volta. Ao apagarmos o arquivo nunca mais poderemos tê-lo de volta, a não ser que você tenha uma cópia de segurança em seu computador pessoal (e é sempre bom ter). No caso de apagar um diretório, tudo o que estiver dentro dele será apagado também. Figura 4.65 Clicando em Sair sem alterar, voltaremos à tela inicial. Veremos agora a opção de Criar um diretório. Clique nele para visualizarmos a próxima tela. Esta operação também é bastante fácil. Basta digitar o nome do diretório no campo em branco e clicar no botão C ri ar di retório. Automaticamente seu diretório será criado. Se você quiser escolher onde o seu novo diretório aparecerá, basta que primeiramente, você esteja no local certo. Digamos que, por exemplo, você tenha um site cujo endereço (ou URL) seja assim: Você quer criar um diretório lá dentro onde irá guardar imagens. Ao entrar no gerenciador de arquivos do UOL, você sempre vai estar na raiz de seu site, ou seja, na parte mais aparente dele. Sendo assim, quando você clicar no botão Criar Dire-

168 !" ### tório e escrever imagens, o UOL criará essa nova pasta nessa parte mais superficial de seu site e o diretório ficará neste endereço: s.uol.com.br/seunome/imagens Agora digamos que você tenha várias fotos de casamento e outras de formatura dentro desse novo diretório que criou, e essas fotos estão todas ali, misturadas. Num acesso de ânimo, você se propõe a separar essas fotos, ou seja, esses arquivos e colocá-los em pastas separadas. Assim fica mais organizado, não é mesmo? Então, naquela sua tela inicial do gerenciador de arquivos do UOL, clique no diretório imagens. Isso irá levá-lo para dentro dessa pasta, correto? Agora sim, poderemos clicar no botão para criarmos um novo diretório, DENTRO do diretório imagens. Veja as telas que fiz para esclarecer melhor o processo. Aqui estou no início de meu site. Na raiz dele, onde tenho minha homepage chamada index.htm e tenho também um diretório chamado imagens. Figura 4.66 Clicando no link do nome do diretório imagens, fui para dentro do diretório. Como eu quero criar uma nova pasta (diretório) dentro do diretório imagens, eu tive que entrar nele primeiramente. Figura 4.67 Clique agora no botão C riar di re tóri o. Veremos a tela de criação de diretórios que já estudamos antes. Basta agora escrevermos o nome do diretório que queremos ali dentro. No exemplo que dei eu queria um diretório formatura (e posteriormente um outro chamado casamento) dentro de imagens.

169 Figura 4.68 Após escrever o nome e clicar no botão para criação, vemos na próxima tela que o diretório já se encontra em nosso site, na posição que queríamos. Figura 4.69 Agora basta organizar as fotos movendo-as para esses novos diretórios (e não se esquecendo de atualizar as páginas HTM onde elas eram mostradas, lógico, pois o sistema de sites do UOL não atualiza os links automaticamente). Para voltarmos à raiz do site, temos que clicar no link di re tóri o ante rior. Vamos ver agora como compactar um dire tório. Esse processo de compactação só é necessário quando não estamos mais utilizando o conteúdo dessa pasta, mas também não queremos apagá-lo. Então, para não ocupar muito espaço, o UOL nos oferece a possibilidade de compactação do diretório e de todo o seu conteúdo em alguns formatos. Primeiramente temos que escolher um ponto de partida para a compactação. Se ela for feita a partir da raiz do seu site, o arquivo compactado irá conter todos os arquivos ali encontrados (como sua homepage) e também todos os diretórios abaixo dele. Se você quiser compactar apenas o conteúdo de seu diretório imagens, por exemplo, ou de outro qualquer, deve primeiramente entrar nele para depois acionar o botão de compactação.

170 !" ### Figura 4.70 Veja que há no texto uma referência a em qual diretório você está....para comprimir todos os arquivos e diretórios a partir deste diretório (/ra/seunome/dire torio_escolhido)... Escolha o arquivo.zip se você utilizar computadores com o sistema operacional Windows. Se você estiver utilizando Maci ntosh, pode escolher os padrões TAR ou o TAR GZ. Para cada computador, um tipo de arquivo de compressão é indicado. Depois do arquivo compactado ter sido criado, você escolhe se quer apagar o diretório e os arquivos que já estão salvos dentro dele. Só tenha o cuidado de não deletar os dois, o seu novo arquivo compactado e também os arquivos e diretórios escolhidos. Vejamos agora como criar uma nova página. Primeiramente escolhemos onde queremos criá-la. Se for na raiz de seu site ou dentro de algum diretório. Se assim o for, primeiramente se localize em seu site clicando e entrando em seus diretórios e só depois clique no botão Criar nova página. Nessa tela você verá o nome do diretório onde está e onde a página será criada. Logo abaixo há um campo onde deverá escrever o nome do novo arquivo. Escreva o nome seguido do ponto htm ou ponto html (ex.: fotos.htm).

171 Figura 4.71 Há três botões nessa tela: a) gravar arquivo b) visualizar c) sair sem alterar O primeiro botão cria o arquivo e salva as alterações contidas no campo de edição abaixo deles. O segundo botão abre uma nova janela para vermos o resultado de nosso código.

172 !" ### O terceiro retorna à primeira tela do gerenciador de arquivos do UOL sem nada salvar, nem criar arquivo algum. No campo de edição (logo abaixo do texto Entre com o conteúdo da página: ), você pode digitar o seu código ou colar algum de outra página que já tenha pronta. Basta abrir a página já pronta em um editor de texto como o notepad, clicar com o mouse em qualquer parte dele e utilizar o comando de copiar teclas Ctrl+C e depois clicar com o mouse sobre o campo de edição da página da UOL e usar o comando Ctrl+V para colar o seu código pronto. Antes, lembre-se de apagar o conteúdo desse campo de edição para não haver confusão. Após colocar o código no campo de edição, basta gravar o arquivo e pronto, a nova página foi criada com o nome que você estipulou. Todas as páginas dos Web Sites Pessoais devem ter a barra de navegação do Universo on-line. Para incluí-la, você deve incluir o trecho de HTML a seguir logo após o comando <body>. <a href= ><img src= border= 0 width= 598 height= 14 alt= Universo on-line ismap></a><br><a href= ><img src= width= 100 height= 11 border= 0 alt= Web Sites Pessoais ></a><br> Ficaria mais ou menos assim em seu código: <html> <he ad> <title >Aqui vai o título da página</title > </he ad> <body> e aqui vai o trecho da barra do UO L Termine sempre a página com os comandos: </body> </html> Voltando para a tela inicial, temos ainda o recurso de visualizar o Mapa do Site para ter uma visão geral dos seus diretórios e arquivos.

173 Figura 4.72 Veja que primeiramente temos a URL, ou seja, o endereço de nosso site. Possivelmente terá o formato Logo abaixo teremos o número total de Kbytes que ele ocupa. Esse tamanho é relativo a todos os arquivos e diretórios que existam dentro de seu site. A seguir, temos todos os diretórios que existem em nosso site. Para vermos o conteúdo de um deles, basta clicar no link do nome. Para comprimir o conteúdo desse diretório escolhido, há um link clique aqui para isso. Comprimir diretórios é algo que já vimos antes e é bem simples. É só isso o que essa tela faz: mostrar a você e não aos seus visitantes como está a navegação e o conteúdo distribuído dentro do site. Por último, temos a opção de Cadastrar o seu sit e. É exat ament e como quando estávamos criando o site (uma página inicial, na verdade) pelo Método Fácil da UOL, com a utilização de assistentes de criação. Temos que escolher entre as categorias (ou clube s) que mais tenham a ver com o conteúdo de nosso site. Figura 4.73

174 !" ### Com isso fechamos esta parte sobre como utilizar o UOL para manter nosso site. Ele realmente tem poucos recursos, mas como é bem simples de ser utilizado e há milhares de assinantes, nada melhor do que saber como ele funciona, certo? Yahoo! GeoCities Conecte-se à Internet e entre no site nacional do Yahoo!: Localize entre os diversos serviços do menu, o item GeoCities e clique nele. Figura 4.74 Logo você verá a tela de reconhecimento, também chamada de tela de login. É por lá que iremos entrar em nosso site. Se você ainda não criou seu ID Yahoo! e senha, veja no capítulo anterior como proceder para isso. Figura 4.75

175 Digite seu ID e senha e clique no botão En trar. Somente selecione o quadrado escrito Lembrar minha ID e Senha se ninguém mais usar seu computador. Selecionando-o, irá gravar seus dados em seu computador e não irá precisar digitar o ID e senha nunca mais. Apesar da comodidade, acho desnecessário e perigoso. Assim que terminar de clicar no botão, o sistema irá identificá-lo e você poderá trabalhar com seu site. Repare que ele já diz Olá, fulano de tal (Figura 4.76). Logo ao lado temos um link Mudar. Se por acaso você quiser utilizar outro ID (pode ser que você tenha mais do que um, nada impede), clique ali para entrar com seu outro ID e senha. Figura 4.76 Também pode ser que outra pessoa tenha deixado aquele quadradinho selecionado e agora toda vez o Yahoo! pense que você é aquela pessoa. Então, para não dar

176 !" ### uma de engraçadinho e xereta, clique ali e digite seu verdadeiro ID e senha para editar seu site. Na mesma linha de onde existe esse link, você verá o endereço de seu site. Em cima de tudo, do lado do logotipo do Yahoo! GeoCities, acima do banner com anúncios publicitários, você verá quatro discretos links: Yahoo!, para voltar à homepage deles; Inf.Conta, para você editar as suas informações pessoais; Ajuda e Sair nem preciso explicar, não é? Embaixo temos outras opções que veremos seguindo o livro. Vamos clicar no link Gerenciador de Arquivos. Depois iremos retornar para o Assistente, que nada mais é do que um conjunto de modelos de páginas já prontas e que, respondidas as questões, lhe cria automaticamente a página escolhida. É como vimos no UOL e no BOL, apenas com perguntas diferentes. Por isso não quero começar por ele agora. Depois voltaremos e darei uma passada de leve para você ver que não tem nada de novo. E isso é bom, porque quanto mais simples melhor, certo? Esta é a tela que veremos em seguida ao link em que clicamos. Figura 4.77

177 Aqui temos uma leve introdução do que é o gerenciador de arquivos do Yahoo! GeoCities e também podemos configurar algumas particularidades de elementos que queremos ver ao entrar realmente no gerenciador. Podemos escolher exibir: 1. html somente arquivos em html, então não iremos ver imagens, etc. 2. gif somente arquivos gif, jpg e html ficam de fora. 3. jpg idem ao gif, mas somente veremos imagens jpg. 4. outro permite a visualização de todos os outros tipos de arquivo, fora html, gif e jpg. Eu sempre deixo assim como está, ou seja, tudo selecionado. Eu quero ver todos os arquivos em meu gerenciador. No entanto, se for um iniciante, talvez você prefira só ver determinado tipo de arquivo para não se confundir, por enquanto, mas com certeza logo mais você nem se importará com isso. O mesmo acontece com o outro selecionador: Listar arquivos que começam com a letra:, onde pode escolher os arquivos que começam com determinada letra. A outra opção, de Entrar manualmente os nomes dos arquivos, irá fazer aparecer um campo na tela do gerenciador de arquivos onde você poderá digitar qual arquivo deseja editar. Todos os outros não serão mostrados. Logo mais abaixo, há o link Abri r o Ge renciador de Arqui vos. Clique nele. Vamos analisar essa página. Temos, primeiramente, lá em cima à direita, os links para o site do Yahoo!, para edição de suas informações cadastrais, para ajuda e para sair. Logo abaixo, uma saudação do sistema com seu ID, e um link Iní cio, que tem a mesma função daquele localizado embaixo de Gerenciador de arquivos Início > Ge ren ciador de Arqu i vos. No caso desta tela que eu capturei, vemos uma chamada do lado direito para as estatísticas do seu site, um novo serviço que entrou e que lhe permite saber detalhes sobre os seus visitantes.

178 !" ### Figura 4.78 T emos, então, o endereço do seu site e, seguindo a mesma linha, um campo de seleção como em seguida: Através dele você escolhe qual será o tipo de editor de HT ML. O avançado é o que eu recomendo, pois apesar do nome, é bem simples de ser usado, e o Editor básico só funciona com páginas que foram criadas utilizando-o primeiro. Você não pode pegar uma página qualquer e editá-la no modo básico. Em breve veremos como criar uma página nesse padrão.

179 Figura 4.79 Continuando com nossa análise da página do Gerenciador de arquivos, vemos uma série de botões: Figura 4.80 a) Novo Use-o para criar um novo arquivo htm, ou seja, uma nova página. b) Edi tar Use-o para editar uma página já existente. Selecione-a primeiro. c) Copiar Use-o para fazer uma cópia de arquivos. Selecione-os primeiro. d) Renomear Use-o para renomear arquivos. Selecione-os primeiro. e) Mover Use-o para mover arquivos para outro subdiretório. Selecione-os primeiro. f) Apagar Use-o para apagar completamente arquivos de seu site. Selecione-os primeiro. Abaixo da primeira fileira desses botões (há duas que têm a mesma função uma da outra porque a quantidade de arquivos em seu site pode ser tão grande que você precisaria ficar rolando a tela muitas vezes para usar os botões), vemos a descri ção dos arquivos e di re tóri os que existem em seu site. Temos um nome, a última modificação e o tamanho em bytes. Os subdiretórios, ou diretórios ou pastas, como desejar chamá-los, são facilmente identificáveis porque têm a imagem característica de pasta que o próprio Windows utiliza em seu sistema. Para ver o que cada um possui dentro dele, basta clicar sobre o mesmo. Os arquivos html possuem, na mesma linha, também um link para exibir, ou seja, para visualizá-los em outra janela, como qualquer visitante de seu site o veria, e também um link para que você possa criar um contador específico para aquela página, ou, já tendo-o criado, para editar suas características. Embaixo dessa lista, vemos dois outros links:

180 !" ### a) Selecionar todos ao clicar nele, você deixará selecionadas todas as caixinhas de seleção de todos os arquivos de seu site, (acho difícil precisar dessa opção, mas de toda forma, ela existe) b) Limpar todos essa opção desseleciona as caixinhas que estiverem marcadas. Faz o contrário do link anterior. Em seguida, temos uma parte onde só iremos mexer com os diretórios (ou subdiretórios, como é chamado no Yahoo! GeoCities). Figura 4.81 Através desses botões nos será possível criar, renomear e apagar subdiretórios. Também podemos copiar vários arquivos de uma vez só para outra pasta/subdiretório. Basta que primeiro selecionemos os arquivos e então cliquemos no botão Copiar arquivos. Nota: Esse botão de copiar é diferente do que vimos agora há pouco que faz parte do outro menu. Aquele faz uma cópia de um ou mais arquivos e você digita o novo nome de cada arquivo. Por aquele primeiro botão eu posso copiar um arquivo chamado foto.htm criando uma réplica chamada foto_copia_seguranca.htm. Os dois arquivos serão idênticos, mas com nomes diferentes. Neste caso do botão Copiar arquivos, eu não posso mudar os nomes dos arquivos que serão copiados, apenas dizer para qual pasta eles deverão ser copiados. Veremos todos os passos com mais detalhes logo em seguida. À frente desse menu específico para subdiretórios, temos o Carregamento fácil, que é aquele sistema de envio de arquivos pela página, onde utilizaremos o botão Browse para localizar e enviar nossas páginas e imagens ao site. Como você vê, todos usam esse tipo de solução e é bem simples. Pelo Yahoo! podemos enviar até 20 arquivos de uma única vez, bastando selecionar a quantidade. Lembre-se que no Yahoo! GeoCities, você pode optar por enviar seus arquivos via FTP, que será o tema do nosso próximo capítulo. T erminando, encontramos agora o quanto temos de Espaço livre em disco. Primeiramente temos o quanto estamos utilizando, em seguida o total livre e abaixo o quanto temos no total, que são atualmente 15 MB para cada site. A tendência é sempre aumentar com o tempo e você ter ainda mais espaço. Meu primei-

181 ro site no GeoCities, que ainda não tinha sido vendido pro Yahoo!, tinha apenas 1 MB. Logo foi aumentando, aumentando e agora já são 15 MB. Ao lado você verá uma cópia daquela primeira tela introdutória antes de entrarmos no Gerenciador de Arquivos. Por aqui também poderemos escolher que tipos de arquivos queremos visualizar no nosso gerenciador. Basta escolher os tipos e clicar no botão Atualiz ar di re tóri o. Por último temos uma seção de Links rápi dos, onde podemos ver os procedimentos para instalação de acessórios, verificar e configurar as estatísticas do seu site, configurar sua homepage e obter ajuda para tudo isso que vimos no gerenciador de arquivos. Temos também as instruções de como proceder para enviar e trabalhar com seus arquivos via FTP. Ufa! Finalmente terminamos de verificar cada item dessa página, embora superficialmente, pois somente ao experimentarmos mesmo cada comando é que iremos nos familiarizar com todos. Vamos ver passo a passo para o que serve cada item que estudamos? Bem, primeiramente selecione no campo de seleção Editar usando: a opção Editor Básico de HTML Figura 4.82 Depois iremos ver como é o avançado. Agora clique no botão Novo, da barra pertencente aos arquivos. Figura 4.83 Iremos ver uma nova tela, onde teremos várias opções, bem simples de serem configuradas, e que irão definir como será essa nossa nova página que estamos começando a criar. Nota: Não é possível criar arquivos de imagem, apenas páginas htm.

182 !" ### Figura 4.84 O primeiro item que veremos é um campo para digitarmos o nome do novo arquivo. Temos que escolher um nome para ele. Como não sei sobre o que será sua página, vamos supor que estejamos apenas aprendendo a lidar com tudo isso e vamos fazer um teste. Chame sua página nova de teste.html. No Yahoo! GeoCities, tanto faz suas páginas serem chamadas de htm ou html no final, embora eu recomende o.html. Veja que temos também uma série de botões logo abaixo desse campo. Figura 4.85 Escolha Novo para abrir um novo arquivo mas antes salve o arquivo atual. Clique em Visualizar para ver como está seu arquivo. Para voltar a editá-lo utilize o botão Back/Voltar de seu navegador. Escolha Salvar para gravar as alterações e retornar ao gerenciador de arquivos.

183 Escolha Salvar e continuar editando para gravar as alterações e continuar editando este arquivo. Selecione Reiniciar para apagar as alterações que você fez desde que carregou a t ela. Nota: se você estiver reeditando um arquivo que já foi criado antes no editor básico, este botão não vai apagar tudo do seu arquivo inicial, ele vai retorná-lo ao código inicial já pronto antes de qualquer alteração que você tenha feito. É como se você apertasse cancelar para não salvar nada do que fez com aquele arquivo e, voltando ao gerenciador, resolvesse editar novamente a mesma página. Complicado? Depois que criarmos nossa página teste.html, vamos fazer esse teste, carregando-a novamente no editor básico e inserindo um texto qualquer ou modificando uma cor. Ao apertar o botão reiniciar o arquivo volta ao estado inicial. T ente depois para ver. Selecione Cancelar para sair sem salvar as alterações e retornar para a tela principal do gerenciador de arquivos. Temos agora que escolher (Figura. 4.86): 1. a cor do fundo de nossa página (escolha branco); 2. a cor do texto que irá aparecer (escolha preto); 3. a cor do link que n ão foi vi sitado, ou seja, que não foi clicado pelo mouse (escolha azul); 4. a cor do link visitado, ou seja, depois de clicado com o mouse, para qual cor você quer ele mude (escolha vermelho). Figura 4.86 T emos, em seguida, um campo para digitarmos o código do ícone. O ícone é uma pequena imagem que irá aparecer na parte de cima da página. Se quiser escolher algum, clique no link Escolha uma dessas imagens e então digite o número desejado. Eu, particularmente não encontrei nenhuma que me interessasse então deixei o campo em branco mesmo.

184 !" ### Figura 8.47 Tí tul o da págin a: Digite algo como Esta é a minha página de teste. Esse título vai aparecer lá em cima no seu navegador, na barra superior dele. Linha do título: Será a primeira frase que aparecerá em cima na sua página. Também pode escrever Esta é a minha página de teste. Ao lado temos um campo de seleção para escolhermos o tamanho da letra que será utilizada para esse título. Escolha a que quiser. Pode ser a normal ou grande. Com o tempo você saberá quais são os melhores tamanhos para determinados tipos de texto. Segundo título: É a linha que vem logo abaixo do título. Algo como um subtítulo. Digite algo como Gostaram da minha página? Eu também., e escolha, no campo de seleção de tamanho de fonte ao lado, um tamanho menor do que o que escolheu para o título. Separador: É uma imagem representando uma linha de separação entre os itens em sua página. Clique no link Escolha um destes Separadores e escolha o seu. Corpo do texto: Aqui você pode escrever o que quiser na página. Se você quiser, pode usar também código em HTML que ele aceita. Exemplo: você pode escrever algo como Esta é minh a página de teste, blá, blá, bl á, bl á, bl á, blá, blá, blá, bl á, bl á, bl á, blá, bl á, blá, blá, blá, bl á, bl á, bl á, blá, blá, blá, bl á, bl á, bl á, blá, blá. ou pode colocar código também:

185 <p> <font face= Arial size= 2 color= #FF0000 >Esta é minha <b> página de teste </b>, blá, blá, bl á, bl á, bl á, blá, blá, blá, bl á, bl á, bl á, blá, blá, bl á, bl á, blá, blá, blá, blá, blá, blá, blá, blá, blá, blá, blá, blá, blá. </font></p> No exemplo de código, as letras vão ser fonte Arial, com corpo 2 e cor vermelha, sendo que na parte página de teste vai ficar em negrito (bold). Depois vem o separador novamente. Escolha o que preferir. Agora podemos incluir até 6 links para outras páginas ou outros sites. Figura 4.88 Se for para uma página sua mesmo, que está em seu site, digite o endereço completo dela. Exemplo: br.geocities.com/seu_id/sua_pagina.htm. Não precisa escrever o porque ele já está lá. Na frente de cada link coloque uma pequena descrição sobre ele, que será o que vai aparecer na sua página. Exemplo: um link para sua homepage escreva apenas home ou homepage. Um link para um arquivo chamado fotos.html apenas coloque fotos ou fotos de minha viagem. Escolha agora um se parador, e em seguida escreva um texto para ficar no final da página. Aqui também se aceita código em HTML. Se você quiser que seu endereço de (fornecido pelo Yahoo!) apareça em sua página, selecione essa opção. Por último, você pode (ou não) escolher um outro separador para sua página.

186 !" ### Fechando a página, temos todos os botões que já vimos e que já foram todos explicados, mas vale a pena relembrar se você está seguindo o passo a passo: Escolha Novo para abrir um novo arquivo mas antes salve o arquivo atual. Clique em Visualizar para ver como está seu arquivo. Para voltar a editá-lo, utilize o botão Back/Voltar de seu navegador. Escolha Salvar para gravar as alterações e retornar ao gerenciador de arquivos. Escolha Salvar e continuar editando para gravar as alterações e continuar editando este arquivo. Selecione Reiniciar para apagar as alterações que você fez desde que carregou a tela. Se você já terminou com certeza sua página, clique no botão Salvar para gravar o arquivo e retornar ao Gerenciador de arquivos. Nota: Para que você não perca todo o seu trabalho por uma pane qualquer (seu navegador pode dar algum defeito, sua conexão com a Internet pode cair, etc.) vá salvando sua página de vez em quando, usando o botão Salvar e continuar editando. Depois de tudo finalizado, basta clicar em Salvar para fechar o arquivo. Ao retornar para o Gerenciador de arquivos, você já sabe que o seu arquivo recémcriado teste.html foi editado com o Editor Básico de HTML, correto? Se você fizer a seleção do tipo de editor e colocar novamente em básico (o padrão dele é o avançado) e clicar em Edi tar, o sistema irá permitir essa ação. O arquivo irá abrir normalmente no modo básico, mostrando todas as opções que você já havia determinado. Se você alterar algo, como a cor do link para preto, por exemplo, e clicar no botão Reiniciar, o arquivo vai voltar ao estado que estava quando você o abriu para edição, ou seja, o link vai voltar para a cor azul. Se você, dentro do gerenciador, tentar abrir um outro arquivo htm pelo editor básico e que não tenha sido criado com ele, o sistema irá avisá-lo de que essa ação não será possível. Vamos ver agora como seria editar um novo arquivo no modo avançado? Verifique se a caixa de seleção está no modo editor avançado e clique no botão Novo. Vejam como ele é bem mais simples e difícil ao mesmo tempo, pois aqui temos em comum com o editor básico apenas a entrada do nome do novo arquivo e os mesmos botões para salvar, visualizar, etc.

187 Figura 4.89 Só possuímos uma caixa de texto onde temos um esqueleto básico de uma página HTML. Coloque o título de sua página onde está escrito Sem nome e então coloque o conteúdo de sua página entre as TAGs BODY. Aqui não tem jeito. Tem mesmo que conhecer a linguagem HTML. Nessa página temos um aviso sobre o que já falei para vocês, para ir salvando sua página através do botão Salvar e continuar editando para manter seu trabalho até o final, quando você clicar em Salvar. Voltemos ao gerenciador de arquivos. Veremos o que se segue tela a tela quando clicamos nos outros botões. Selecione um dos seus arquivos e clique em Copiar. Como disse antes, este comando não é para você copiar arquivos mantendo o mesmo nome, de um diretório para outro. Nesse caso você tem que utilizar o botão correspondente na barra de subdiretórios. O botão Copiar irá somente lhe permitir

188 !" ### gerar uma cópia do(s) arquivo(s) selecionado(s), no mesmo diretório onde está o original, mas com outro nome, que você deverá digitar no campo ao lado do nome atual. Figura 4.90 Para concluir, clique no botão Copiar arquivos. O sistema irá gerar suas cópias e retornar ao gerenciador, mostrando-lhe uma mensagem da operação sucedida. Vamos ver agora o botão Renomear. Primeiramente selecione um ou mais arquivos. Clique no botão e veremos a próxima tela na qual você irá trocar o nome de seu(s) arquivo(s) por outro nome. Figura 4.91 Se quiser pode até colocar o mesmo nome, embora não haja razão para isso. Escreva o novo nome no campo ao lado do nome atual e clique no botão Renomear arquivos e pronto. O sistema modifica os nomes dos arquivos selecionados e volta ao gerenciador, mostrando uma mensagem se a operação foi ou não bem sucedida. Lembre-se de que, ao modificar os nomes de seus arquivos, você pode estar criando erros nos links, quebrando-os. Se sua homepage tiver um link, ou seja, uma chamada para a página fotos.htm e você muda o nome da página para fotos_da_viagem.htm, o sistema não irá mudar automaticamente esse link para você.

189 Então você irá precisar editar o arquivo de sua homepage para corrigir esse erro. Muito cuidado então com as mudanças de nomes e de diretórios também. Vejamos agora o que acontece quando clicamos no botão Move r. Novamente o procedimento é o mesmo. Primeiro selecione o(s) arquivo(s) que pretende mover para outra parte de seu site e clique no botão. A próxima tela ilustra o que irá ver. (Figura 4.92). Figura 4.92 Terá o nome de todos os arquivos que escolheu, com uma caixinha de seleção ao lado do nome. Isso é para você selecionar ou desselecionar os arquivos que quer mesmo enviar. Por padrão, vêm todos marcados. No entanto, se tiver dúvidas de algum, basta clicar com o mouse sobre a seleção para que esse arquivo não seja mais movido. Logo abaixo, você terá um menu de seleção onde pode escolher para qual diretório quer mover os arquivos marcados. Se você quer mover seus arquivos, é lógico supor que também você tenha um destino para eles, ou seja, possua mais do que um subdiretório em seu site. Senão não tem para onde movê-los, certo? Selecione ali então o subdiretório, ou seja, a pasta para onde quer que seus arquivos se movam. Depois basta clicar no botão Mover arquivos e pronto. O sistema os move e retorna ao gerenciador, mostrando uma mensagem do sucesso ou não da operação. T emos, por último, o botão de Apagar. Selecione os arquivos que deseja eliminar de seu site e clique nesse botão. Você verá esta tela de confirmação contendo o nome dos arquivos selecionados:

190 !" ### Figura 4.93 Também neste caso temos as caixinhas de seleção ao lado dos nomes para o caso de você resolver nessa tela não deletar algum dos arquivos escolhidos. Se tudo estiver ok, basta clicar no botão Apagar arquivos e pronto. O sistema irá voltar ao gerenciador e mostrar se a operação foi bem sucedida. Bem, ao lado de cada nome de arquivo html temos dois links, como já vimos: 1. exibir, para visualizar como a página está ficando e 2. contador, para incluir ou configurar um contador para aquela página. O primeiro, exibir, é simples de entender, certo? Você clica, vê como aquela página aparece no navegador (ele abre outra janela) e pronto. O segundo link, contador, já é mais complicado (não tanto assim, mas comparado com o anterior, com certeza) então vamos ver como ele funciona. No Passo 1 Selecione um arquivo e clique em contador. Você verá um tela cheia de tipos diferentes de contadores. Tudo o que tem que fazer é escolher um dos tipos clicando em cima dele. Você verá que irá aparecer o seu tipo escolhido no passo 4. No Passo 2 escolha a cor dos números. Pode ser invisível também. Isso quer dizer que você, pelo novo sistema de estatística de site que o Yahoo! lhe proporciona, poderá ver quantas pessoas visitaram aquela página. No Passo 3 pode-se escolher a cor do fundo também. No Passo 4, escolha o tamanho dos números e também a quantidade de dígitos. O normal é 5 mesmo.

191 Figura 4.94 No Passo 5, escolha o seu fuso horário. O do Brasil é o de Brasília. Como opção, você pode ou não permitir que o GeoCities utilize-se de cookies para poder obter mais informações sobre seus visitantes. Cookies são arquivos em texto bem pequenos que o servidor manda para o computador de seus visitantes e que coletam preciosas informações so bre eles. Os seus visitantes po-

192 !" ### dem configurar os navegadores deles para que não permitam o envio de cookies, já que isso atualmente está em controvérsia se é ou não uma invasão de privacidade. De toda forma, deixe selecionado apenas para que você possa testar por enquanto as capacidades dos seus visitantes. Se depois quiser, pode retirar essa opção. Também como outra opção você pode determinar por qual número quer que seu contador comece a contagem. O valor correto seria A partir daí marcaria 00002, 00003, 00004, etc. Mas algumas pessoas utilizam mal seus contadores para dar impressão de muitas visitas, como já disse anteriormente. Feito tudo isso, basta clicar no botão Enviar. O sistema irá, primeiramente, criar um código para que você o coloque manualmente em sua página. As instruções virão em uma tela separada. O texto dessa tela é semelhante a este: Seu contador está pronto! Siga as etapas seguintes para copiar e colar o código em sua página. Etapa 1. Selecione e copie o código HTML que está no campo a seguir: <IMG SRC= r.gif> Etapa 2. Marque a caixa de seleção para a página teste.html e clique Editar para abri-lo no Editor Avançado de HT ML. Etapa 3. Cole o código do contador no seu HT ML. Etapa 4. Clique Salvar e está pronto. Nota: Se você está atualizando um contador já instalado, não será necessário mexer no código da sua página. A nova configuração do contador deve aparecer automaticamente na próxima vez que você vir a sua página. Resumindo, você terá que abrir sua página de novo e colocar o código do contador dentro dela e salvá-la. Depois disso, basta visualizar sua página para ver se está tudo ok com o contador. Fácil, não? Vamos ver agora como lidar com os subdiretórios de seu site? Já vimos que para eles há um conjunto específico de botões, certo? Então vamos clicar no botão Novo para criarmos uma nova pasta (subdiretório).

193 Figura 4.95 T udo o que temos que fazer é digitar o nome do novo subdiretório e clicar no botão Criar subdiretório e pronto. O sistema automaticamente cria a nova pasta, retorna ao gerenciador e nos mostra a mensagem de confirmação da operação. No exemplo eu criei uma pasta chamada jogos. Figura 4.96 Vamos agora ver como funciona o botão Copiar arquivos. Primeiramente selecione os arquivos html ou de imagens ou de outro tipo que pretende copiar para outro subdiretório. Clique no botão e veja a tela a seguir. Lá veremos os arquivos selecionados e a caixa de seleção ao lado do nome deles para o caso de querermos desistir de copiar um deles. Para isso basta clicar com o mouse para tirar a seleção e excluí-lo da cópia. Figura Agora escolha no menu logo embaixo o subdiretório para onde quer efetuar a cópia dos arquivos escolhidos e então basta clicar no botão Copiar arquivos e pronto. Realmente o sistema é bem simples.

194 !" ### Renomear clique neste botão para ver a próxima tela. No menu à esquerda selecione o subdiretório cujo nome quer mudar, e no campo à direita escreva o novo nome dele. Depois basta clicar no botão Renomear subdire tório e pronto. Nota: Lembre-se de que você pode estar quebrando algum link como já expliquei antes, ok? Figura 4.98 Apagar clique neste botão para remover um subdiretório de seu site. Lembre-se de que, fazendo isso, irá também apagar todos os arquivos que possam existir dentro dele também. Figura 4.99 Basta selecionar o subdiretório que deseja apagar no menu de seleção e clicar no botão Remover subdiretório. Carregamento fácil clique aqui para enviar seus arquivos para o seu site no Yahoo! GeoCities. Você pode enviar até 20 arquivos de uma vez só (basta selecionar no menu em frente ao texto Número de arquivos a carregar e clicar em Exi bir para ver os

195 campos aparecerem). Não pode, entretanto, enviar mais de 5 MB de uma vez só, ou seja, todos os seus arquivos juntos não podem ultrapassar esse tamanho. Figura O sistema é o mesmo dos outros que já vimos. Clique no botão Browse, localize o arquivo em seu computador, clique em Abrir ou Open e o nome e a localização do arquivo virá para o campo em frente ao botão clicado. Depois é só ir clicando de um em um, até preencher os campos que precisa. Por último clique no botão Carregar arquivos e o sistema irá pegar seus arquivos e enviá-los ao seu site. O processo pode ser um pouco demorado dependendo de sua conexão e da quantidade e tamanho dos arquivos escolhidos para o envio. Embaixo, há duas opções que podem ser usadas também. O sistema pode automaticamente converter os nomes de todos os arquivos enviados para minúsculas, que é o mais sensato na Internet. Por exemplo, um arquivo chamado Fotos.htm iria se transformar em fotos.htm. A outra opção é para mudar a extensão de todos os arquivos.htm para.html. Isso você escolhe. Lembre-se de que o sistema pode mudar os nomes dos arquivos, mas não pode modificar esses mesmos nomes no código, então pode acontecer de termos links quebrados por causa disso. Um dos seus arquivos poderia estar direcionado para Fotos.htm e poderia então não mais reconhecer o mesmo arquivo que agora se

196 !" ### chama fotos.htm com o F em minúsculo. O mesmo acontece para as extensões modificadas. Então, muito cuidado nessas seleções. Esta tela, ao contrário das outras, não retorna automaticamente para o gerenciador de arquivos. Ela mesma exibe quais arquivos foram enviados com sucesso, e se quisermos retornar, há um link para o gerenciador logo em seguida. Figura No final da página do gerenciador, temos, ao meio, os mesmos recursos de seleção de visualização que tínhamos naquela página de apresentação inicial, lembra-se? É o Exibir arquivos e é bem simples de selecionar bastando clicar no botão atualizar diretório para você ver o que muda quando seleciona um ou outro item. Experimente. Figura Vamos ver agora quais são os acessórios que poderemos utilizar em nosso site?

197 Clique, dentro da tabela Links rápidos, em Acessórios. Veremos a seguinte tela de apresentação. Figura Podemos incluir, em nosso site: 1. Formulários, 2. Marcador de presença on-line para o Yahoo! Messenger, 3. Contadores (que já vimos), 4. Notícias (isso é muito legal ter), 5. Previsão do tempo (também), 6. Cam po de busca do Yahoo! Brasil, 7. Contagem regressiva (para datas como aniversários, etc.) e 8. Quadro de pu bli ci dade. Vamos ver o que é e como configurar cada um desses acessórios.

198 !" ### Iniciemos pelos formulários. Os formulários são as partes mais chatas de todos os sites, isso porque são difíceis de serem criados, muita gente se confunde e até desiste dessa fantástica ferramenta de pesquisa. Veja no Capítulo 6 uma referência sobre formulários que não funcionam, principalmente para os usuários do FrontPage. No Yahoo! GeoCities é bem simples o uso de um formulário. Basta você criá-lo em qualquer software ou então na mão mesmo, mas tome o cuidado de colocar estas duas linhas: <form method=post action= > e também <input type=hidden name= login value= SEU ID > Troque o SEU ID pelo seu ID Yahoo!. Não se esqueça disso. Lembra-se que vimos como é o esqueleto de uma página HT ML? Pois bem, o esqueleto de uma página HTML com formulários, no Yahoo! GeoCities seria algo assim: <html> <head> <title>título do site ou da sua página</title> </head> <body bgcolor= #FFFFFF text= # > <form me thod=post action= ocitie s.yahoo.com/forms > <input type =hidden name = login value = SEU ID > </form> </body> </html> No entanto, o Yahoo! nos oferece já dois códigos prontos para formulários. E são muito, mas muito fáceis de fazer. Eu testei e em poucos segundos já tinha recebido a resposta do meu formulário pelo que eu forneci quando me cadastrei no Yahoo! Se você quiser ver qual é o que será utilizado, clique no link lá em cima Inf. Conta e verifique em Informações pessoais Alternate 1 ( alternativo 1) e veja qual é o primário (primary) ali escrito. Se quiser mudar, basta clicar no botão Edi tar em frente ao título Informações pessoais e modificar o formulário que se segue, salvando em seguida. Bem, os códigos dos formulários estão prontos e você pode copiá-los facilmente. Clique no link Formulário de Exemplo 1 ou no Formulário de Exemplo 2

199 para ver o código e copiá-lo primeiramente para um editor de texto básico, como o Notepad, e depois para a sua página. Veja a seguir o código fornecido e o formulário correspondente. Formulário 1: Figura <form method=post action=' <FONT FACE= ARIAL, HELVETICA > <B>Seu primeiro nome:</b><br> <INPUT TYPE= text NAME= nome SIZE= 27 > <P><B>Sua URL:</B><BR> <INPUT TYPE= text NAME= URL SIZE= 27 ><P> <B>Com que freqüência você visita meu site?</b><br> <INPUT TYPE= radio NAME= Visita VALUE= Todo dia >Todo dia<br> <INPUT TYPE= radio NAME= Visita VALUE= Uma vez por semana >Uma vez por semana<br> <INPUT TYPE= radio NAME= Visita VALUE= Uma vez por mês >Uma vez por mês<br>

200 !" ### <INPUT TYPE= radio NAME= Visita VALUE= Uma vez por ano >Uma vez por ano<br> <P><B>Por favor faça seus comentários abaixo:</font><br> <TEXTAREA COLS= 40 ROWS= 10 NAME= comentários ></TEXTAREA> <P><BR> <INPUT T YPE= submit VALUE= Enviar > <INPUT TYPE= reset VALUE= Cancelar > <INPUT TYPE= hidden NAME= login VALUE= SEU_ID > <INPUT T YPE= hidden NAME= subject VALUE= Resultados da Pesquisa > <INPUT TYPE= hidden NAME= next_url VALUE= > <INPUT T YPE= hidden NAME= required_fields VALUE= nome,url > </form> Nota: LEMBRE-SE DE TROCAR O NDE ESTÁ MARCADO SEU_ID PELO SEU ID YAHOO!, a menos que copie diretamente do site. Para copiar de lá basta ir em Links rápidos > acessórios > formulários > exemplo de formulário 1 ou exemplo de formulário 2. Formulário 2: Figura 4.105

201 <form method=post action=' <TABLE WIDTH= 600 BORDER= 0 CELLSPACING= 10 CELLPAD- DING= 0 > <T R> <T D VALIGN= T OP ALIGN= RIGHT > <FONT FACE= ARIAL, HELVETICA SIZE= -1 > <B>Seu primeiro nome:</b></font ><BR> <INPUT TYPE= text NAME= nome SIZE= 25 ></TD> <TD VALIGN= TOP ALIGN= LEFT > <FONT FACE= ARIAL, HELVETICA SIZE= -1 > <B>Sua URL:</ B></FONT ><BR> <INPUT TYPE= text NAME= URL SIZE= 25 ></TD> </T R> <T R> <T D> </T D> <T D> </T D> </T R> <T R> <T D VALIGN= T OP ALIGN= RIGHT > <FONT FACE= ARIAL, HELVETICA SIZE= -1 > <B>Você voltaria ao meu site?</b><br> Sim<INPUT TYPE= radio NAME= visit VALUE= Sim > Não<INPUT TYPE= radio NAME= visit VALUE= Não > </T D> <TD VALIGN= TOP ALIGN= LEFT > <FONT FACE= ARIAL, HELVETICA B SIZE= -1 > <B>Como você soube do meu site?</b><br> <INPUT T YPE= radio NAME= Como você ficou sabendo do meu site? VA- LUE= Busca do Yahoo! GeoCities >Busca do Yahoo! GeoCities<BR> <INPUT T YPE= radio NAME= Como você ficou sabendo do meu site? VA- LUE= Um serviço de busca popular >Um serviço de busca popular<br> <INPUT T YPE= radio NAME= Como você ficou sabendo do meu site? VA- LUE= Um link a partir de outro site >Um link a partir de outro site<br> <INPUT T YPE= radio NAME= Como você ficou sabendo do meu site? VA- LUE= Um amigo me contou >Um amigo me contou</td> </T R> <T R> <T D> </T D> <T D> </T D> </T R> <T R>

202 !" ### <TD COLSPAN= 2 VALIGN= TOP ALIGN= CENTER > <FONT FACE= ARIAL, HELVETICA SIZE= -1 > <B>Se você tem algum comentário ou sugestão para o meu site,<br> por favor faça-o abaixo:</b></font><br> <TEXTAREA NAME= comentário COLS=40 ROWS=10></TEXTAREA> <P> <INPUT T YPE= submit VALUE= Enviar > <INPUT TYPE= reset VALUE= Cancelar ></TD> <T D> </T D> </T R> </TABLE> <INPUT TYPE= hidden NAME= login VALUE= SEU_ID > <INPUT T YPE= hidden NAME= subject VALUE= Resultados da Pesquisa > <INPUT TYPE= hidden NAME= next_url VALUE= > <INPUT T YPE= hidden NAME= required_fields VALUE= nome,url > </FORM> Para colocar esse código em uma página de formulário em seu site, entre no gerenciador de arquivos e clique no botão Novo. Escreva o nome de seu novo arquivo. Pode ser formulário.htm ou outro que prefira. Coloque o código exatamente entre as duas TAGs BODY, como mostra a Figura Figura Troque o título de sua página por algum que lhe agrade. Se você for pegar o código direto do site do Yahoo! pela Internet, então onde aqui está escrito SEU_ID, estará já corretamente trocado pelo seu ID do Yahoo! GeoCities. Então basta copiar e colar na página e clicar no botão Salvar. Para testar, quando voltar ao gerenciador, clique no link Exibir e veja como fica sua página. Digite alguma coisa no formulário e clique no botão Enviar. Depois de um tempo verifique se o com os resultados do formulário chegou corretamente em sua caixa postal.

203 O seu vai ficar parecido com este: nome = marcio URL = oi Visita = Uma vez por semana comentários = Olá. Gostei muito do seu site. login = seu_id subject = Resultados da Pesquisa REMOTE_HOST: Nota: O item remote_host é o IP da pessoa que enviou o seu formulário. Se você receber algo muito estranho, pode utilizar esse número para reclamar e identificar a pessoa, mas isso é em casos extremos. No caso do formulário 2, repare que ele possui muito mais campos e também opções que ficam escondidas em linhas que possuam hidden em seu código. Essas opções podem ser modificadas de acordo com o texto a seguir: O pção 1: ao mudar o campo VALUE (Resultados da Pesquisa), você poderá especificar o assunto do formulário. Isso aparecerá como o assunto do que você receberá. Por enquanto, ele aparecerá como Resultados da Pesquisa. O pção 2: aqui é onde você pode especificar a página que é exibida após o usuário clicar no botão enviar. Neste exemplo, está sendo usada a página de índice index.html. Se você não especificar uma página, o usuário receberá uma mensagem padrão mostrando o conteúdo final do . O pção 3: mudando-se o campo VALUE (nome, URL) você poderá especificar os campos que necessariamente devem ser preenchidos para se enviar o formulário. Neste exemplo, os campos nome' e URL devem ser preenchidos. Para remover este recurso, apenas omita a linha toda. Resumindo: os formulários do Yahoo! GeoCities são bem simples. Basta praticamente copiar e colar e salvar e pronto, já estão funcionando. Crie uma página e tente. Você comprovará o que eu disse. Vamos agora analisar como inserir um marcador de presença on-line. Primeiramente você tem que estar cadastrado no serviço do Yahoo! Messenger. Verifique no site do Yahoo! se está tudo ok com relação a isso. De acordo com o Yahoo!, o detector de presença on-line permite que outras pessoas vejam se você está on-line usando o Yahoo! Messenger em determinado momento. Ao clicar na imagem de presença on-line do Yahoo!, as pessoas poderão

204 !" ### enviar uma mensagem para você na hora em que estiverem visitando sua página! (...) Com o Yahoo! Messenger, você pode se comunicar instantaneamente com todos os seus amigos, assim como receber notícias, avisos de e muito mais. Realmente parece bem legal. Você tem a possibilidade de colocar dois tamanhos do marcador de presença: o grande e o pequeno. Tudo o que você tem a fazer é copiar o código que lhe é apresentado no site e colá-lo em suas páginas, de preferência em sua homepage. Vou colocar aqui o código utilizado também para vocês verem. Como você já sabe, para colocar esse código em uma página, é preciso selecioná-la em primeiro lugar no gerenciador de arquivos e clicar no botão Editar. Para o modelo grande, digite o código HT ML a seguir em sua página web: <a href= > <img border=0 src= ></a> Já para o modelo pe quen o, digite este outro código em sua página: <a href= > <img border=0 src= ></a> Veja que a única parte que muda no código é onde temos g&t=1 para o modelo grande e g&t=0 para o modelo pequeno. Outro acessório para suas páginas é o contador de páginas, mas isso já vimos como inserir, certo? Vamos para o próximo, que é o quadro de notícias. De acordo com o Yahoo!, você pode adicionar à sua página notícias da Reuters, Agência JB e Gazeta Esportiva, entre outros. Uma vez instaladas, os visitantes de seu site receberão notícias atualizadas em tempo real 24 horas por dia durante os 7 dias da semana. Tudo fornecido pelo Yahoo! Notícias. Para instalar as últimas notícias em sua página, você precisa antes configurar as fontes de informação que quer oferecer.

205 Figura Vamos ver então como configurar essas informações? Primeiramente, é necessário entrarmos na página de acessórios. No gerenciador de arquivos, clique no link Acessórios em Links rápidos. Depois clique em Notí cias. Veremos a seguinte tela: Figura Clique no link Configure e instale as Últimas Notícias. Escolha uma das opções de manchete para a sua página. Basta clicar.

206 !" ### Figura Para cada uma das opções, a tela a seguir irá mudar, pois cada tipo de manchete irá trazer diferentes alternativas. Veja só alguns exemplos: Primeira Página: Figura Te cnologia: Figura 4.111

207 Últimas notícias: Figuras Uma das que possui mais opções é a de Entretenimento: Figura Nessa parte tudo o que você tem a fazer é selecionar as notícias que você quer em seu site. Em seguida clique no botão Próxima. Nessa tela irão aparecer as notícias que você selecionou anteriormente e agora só falta escolher qual o estilo (cores) e o número de manchetes desejado. Para saber qual estilo é o melhor, veja logo a seguir os estilos 1, 2 e 3.

208 !" ### Figura Basta clicar com o mouse na bolinha de seleção e pronto. É só clicar no botão Ge - rar código. Agora você verá todo o código pronto para ser colocado em uma página de seu site. Pode ser na homepage ou em outra página qualquer. Até mesmo uma página só para notícias, não é mesmo? Por que não? Bem, siga as etapas da página da Figura

209 Figura Etapa 1: selecione o código e copie (Ctrl + C). Na Etapa 2 é só clicar no bot ão Ge ren ci ador de arquivos. O gerenciador irá abrir em outra janela, deixando a janela em que estamos trabalhando e que contém o código ainda aberta. Enquanto está no gerenciador, selecione o arquivo html em que deseja inserir o quadro de notícias e edite-o. Cole (Ctrl + V) o código gerado pelo sistema em sua página e salve-a. Pode fechar a janela do gerenciador ou não. O que é importante agora é retornar à página de acessórios e ir para a Etapa 3 para clicar no botão Ativar manchetes. Somente agora é que as notícias serão ativadas realmente. Como estamos vendo, a maioria dos acessórios do Yahoo! GeoCities é assim: você escolhe qual acessório deseja e vai seguindo as instruções para o sistema gerar o código certinho e depois você colá-lo na sua página. Vamos ver outro acessório? Veremos como inserir a Previsão do Tempo.

210 !" ### Figura Podemos colocar em nossas páginas o tempo de praticamente todo o mundo. E é bem detalhado, como iremos acompanhar. Clique no link Configure e instale a previsão do tempo. Escolha a seguir de qual região do mundo deseja ter a previsão do tempo. Figura Por exemplo, para o Brasil, selecione América do Sul, que está em Amé rica Latina. Figura 4.118

211 É tão grande a lista de países e cidades que você verá nessa página que nem eu consegui colocar todas aqui. Procure lá no finalzinho da página, do lado esquerdo, o Brasil e selecione as cidades das quais quer a previsão do tempo. Depois clique no botão Próxima. Como exemplo de cidades, eu selecionei apenas Rio de Janeiro e São Paulo. Aqui temos o mesmo tipo de tela de quando configuramos as notícias. É só escolher qual o estilo desejado para o quadro de previsão do tempo e a unidade de me di ção de tem pe ratu ra, que no Brasil é o Celsius. Figura Depois clique no botão Ge rar códi go. A próxima tela é também parecida com a de notícias, dividida em três etapas.

212 !" ### Figura Na primeira, você irá copiar o código gerado pelo sistema. Na segunda, deve clicar no botão Geren ci ador de arqu i vos para escolher o arquivo onde irá editar e colocar o quadro de previsão do tempo. É só editar e colar o código que copiou na etapa 1 e salvar a página, é lógico. Depois volte a esta tela para a Etapa 3: clique no botão de ativação para que o serviço de previsão comece a funcionar na página onde foi inserido o código. Temos agora os últimos três acessórios que o Yahoo! GeoCities nos oferece para colocarmos em nossas páginas. São eles: Campo de busca do Yahoo!, Contagem regressiva e Quadro de publicidade. Estes são os mais simples de serem incorporados, pois praticamente não possuem telas de configuração. Vamos ver o Cam po de busca. Através dele, seus visitantes podem realizar pesquisas/ buscas em milhares de sites no Brasil, utilizando o sistema de busca do Yahoo!.

213 Figura Basta copiar o código existente nessa tela e colá-lo em alguma página do seu site. Depois é só salvar e visualizar a página para ver se está tudo funcionando corretamente. Superfácil, não? Contagem Regressiva: você quer colocar em seu site um contador dizendo que faltam tantos dias e tantas horas para o seu aniversário? Ou então para o nascimento do seu filho? Basta vir nesta página, escrever o nome do evento e a data em que ele se realizará e depois copiar o código, que será gerado ali na hora mesmo, para a página desejada. Se quiser já tem até o botão do Ge ren ci ador de arquivos pronto para editar sua página.

214 !" ### Figura Por último temos a configuração do qu adro de pu bli ci dade. E o que é o quadro de publicidade? Como o Yahoo! GeoCities é um serviço gratuito, ele lucra vendendo banners, e esse quadro é o local onde essa propaganda é veiculada.

215 Figura No entanto, para não ficar muito chato, o Yahoo! permite que esse espaço seja útil a você também. Se você possui o Yahoo! Messenger, poderá configurá-lo para que seus visitantes mandem uma mensagem on-line para seu programa de comunicação instantânea. Também pode permitir que seus visitantes leiam o seu perfil, o que eu não recomendo, a menos que este site seja de sua empresa, por exemplo. Mesmo assim é bom não se abrir muito na Internet. Para ter tudo isso em seu quadro de publicidade, basta escolher Sim ou Não e clicar no botão Enviar. Realmente é muito fácil instalar e configurar os acessórios do Yahoo! GeoCities. Como prometi a vocês, vamos dar uma olhada no Assistente de Criação de Páginas? O primeiro passo é estar já logado no sistema. Basta ir no site do Yahoo!, clicar no link do GeoCities como já expliquei e colocar seu ID e senha do Yahoo! nos campos certos.

216 !" ### Figura Assim que estiver dentro do sistema, clique no Assistente de Criação de Páginas, que existe embaixo de Construa seu Site. Figura Você verá a tela de apresentação do assistente, e logo abaixo alguns modelos de páginas para você escolher.

217 Figura Cada modelo irá lhe perguntar coisas diferentes. Um modelo vai possuir mais fotos, outro menos, etc. Toda vez que você cria uma página no assistente de páginas, o melhor seria que você o utilizasse de novo para atualizar ou efetuar modificações nessa página. Se você usar o gerenciador de arquivos e o editor avançado, irá perder a facilidade que o assistente lhe proporciona. Cada nova página que você cria é adicionada a um menu que fica disponível no mesmo assistente que você utilizou. Vamos exemplificar para ficar mais fácil. Vamos dizer que você tenha criado uma página de convite de aniversário utilizando o assistente. Esse aniversário era seu. Então a sua página ficou disponível no ar para todos verem. Depois de uns três meses que o seu aniversário passou, seu filho também vai fazer aniversário. Você logo se lembra daquela página que fez com o assistente e decide então usar a mesma página, mas mudando a cor e o que estava escrito lá, como a data da festinha, etc. Então você vai até o assistente, escolhe o modelo que corresponde ao convite de aniversário (que foi o mesmo que você usou da primeira vez) e então você verá esse menu. Veja na Figura Ele já identificou que existia uma página para festa de aniversário criada com ele, e então lhe pergunta se você quer criar uma nova página de festa de aniversário, ou alterar a página já existente. Basta escolher a segunda opção e clicar no botão Avançar. Simples, não?

218 !" ### Figura Mas vamos voltar ao básico, pois nem criamos nossa primeira página. Nos modelos que havia para escolher, decidi construir uma página pessoal. Cliquei no link Página Pessoal e então apareceu esta outra tela. Figura Aqui tanto faz eu escolher uma das cores disponíveis para minha página ou clicar no link Abra o Yahoo! Assistente.

219 O sistema irá abrir uma janela menor onde iremos colocar as nossas preferências e responder a algumas perguntas. Clique e vamos ver o processo passo a passo. Figura O processo todo leva de 5 a 10 minutos, e é todo identificado por números. Do lado esquerdo você vê a representação gráfica da localização onde vai ficar, em sua página, aquilo que estão perguntando. Clique em Iniciar. Figura 4.130

220 !" ### Aqui iremos escolher a cor da nossa página. Escolha a que você preferir e clique em Avançar. Figura Digite agora seu nome. Veja onde vai aparecer essa informação (Passo 1) na imagem ao lado. Vai ficar bem à esquerda em cima. Simples de visualizar, não? Assim que terminar, clique no botão Avançar. Agora temos que selecionar uma figura. Pode ser uma foto sua ou algo assim. Ela vai ficar exatamente onde está o homenzinho desenhado. (Passo 2) Basta clicar no botão Browse (é o mesmo sistema de envio de arquivos, só que desta vez você tem que enviar somente imagens em formato.jpg ou.gif). Figura 4.132

221 Repare que, para cada tela, há vários links explicando alguns termos que, de repente, podem gerar confusão para quem não está muito acostumado a criar páginas ou mesmo navegar na Internet. Assim que selecionar sua imagem e o nome e o caminho dela estiverem no campo ao lado do botão Browse, clique em Avançar. No Passo 3, é a vez de digitar o nosso ende re ço de . Pode ser do Yahoo! ou de outro qualquer. Figura Clique depois em Avançar. Passo 4 Agora temos que escrever uma descrição sobre nós. Escreva algo e clique em Avançar. Veja sempre onde vai tal informação pela ilustração do lado esquerdo.

222 !" ### Figura No Passo 5, vamos escrever sobre o que gostamos, ou seja, sobre nossos hobbies e interesses. Depois clique em Avançar. Figura No passo 6, temos espaço para incluirmos 3 links. Ele já vem preenchido com algumas páginas do Yahoo!, mas para mudar é simples. Clique com o mouse no campo e apague o que tem dentro dele, substituindo pelos links que desejar. Do

223 lado esquerdo coloque o nome do link, ou uma descrição, e logo ao lado, na direita, digite o endereço do site. Assim que terminar, clique em Avançar. Figura No Passo 7 podemos inserir um texto descrevendo nossa família. Lembre-se de que, em todos os assistentes, se deixar o campo vazio, ele irá pular aquele item. Isso é interessante principalmente nestas partes em que descrever a sua família não seja algo que você deseje. Se for este o caso, bastaria deixar o campo de edição vazio e clicar em Avançar. Figura 4.137

224 !" ### Se sua família tiver um site, você pode colocar o endereço das páginas de cada pessoa aqui, no Passo 8. Figura No Passo 9 é a vez dos amigos. Escreva algo sobre eles e depois clique em Avançar. Figura 4.139

225 No Passo 10, digite os links dos sites de seus amigos, se eles tiverem. Senão, basta deixar tudo em branco e Avançar novamente. Figura Na Figura você decide se esta será a sua página inicial. Se quiser que seja, escolha Sim. Do contrário escolha Não. Lembre-se de que, se você já tiver uma homepage e escolher sim aqui, pode correr o risco de apagar a existente. Figura 4.141

226 !" ### Por último, temos uma tela de parabéns, pois nossa página foi construída com êxito. Ali também aparece um link para podermos visualizar o que fizemos. Figura Para este teste, vejam só a página que criei. Figura 4.143

227 Não ficou bonita? E com isso terminamos este capítulo no qual ensinamos a utilizar tudo o que os sites de hospedagem gratuita nos oferecem. Há vários outros ainda, como o recémlançado HPG, também muito interessante. Pena que eu já estava terminando o livro quando ele foi ao ar. Mas os sistemas deles, como disse durante todas as páginas, são muito parecidos, principalmente porque o importante é facilitar a vida dos internautas iniciantes. Você também vai encontrar assistentes, todos eles com perguntas fáceis, com muito texto explicativo e também oferecendo a você várias opções de envio de arquivos, seja via navegador ou via FTP, que é o que veremos a seguir. É realmente muito simples aparecer na Web. A gente se vê lá então.

228 CAPÍTULO 5 COMO ENVIAR SEUS ARQUIVOS UTILIZANDO FTP O Que é FTP Primeiramente, vamos descobrir o que significa FTP: FTP é a sigla de File Transfer Protocol (protocolo de transferência de arquivos). É uma forma de enviar arquivos pela Internet. Vimos anteriormente que a maior parte dos serviços grátis de hospedagem de páginas possui um formulário que, através de um botão Browse nos permite localizar um arquivo e enviá-lo para nosso site. Obviamente o processo é meio lento. Mesmo para aqueles que possuem vários campos e botões de localização de arquivos para ajudar a enviar mais do que um de cada vez, ainda assim é mais devagar, pois todo o conteúdo acaba trafegando pela rede da Internet utilizando o protocolo HTTP que é mais devagar que o FTP. Também vimos que outros serviços nos permitem agora enviar nosso site todo compactado em formato.zip e depois descompactá-lo dentro de nosso espaço gratuito. Isso já é um passo enorme e com certeza um facilitador. No entanto, há sites que nos oferecem a possibilida de de envio dos arquivos via FTP. Além de ser mais rápido, é muito fácil; você verá que, com o auxílio de programas simples, é como copiar um arquivo de um diretório e jogá-lo em outro pelo sistema Windows. O famoso arrastar e soltar. Realmente muito fácil. Outra razão para aprendermos como utilizar esse sistema de FTP é que a maioria dos serviços de hospedagem PAGA, onde temos muito mais espaço para nosso site ou o site de nossa empresa, e temos muito mais recursos também, praticamente só trabalha com esse sistema de atualização e envio de arquivos.

229 Existe, logicamente, a possibilidade de você ter um site com as famosas extensões FrontPage, que permitem o envio, diretamente do software de edição da Microsoft, seus arquivos para seu site. Eu mesmo já tive a oportunidade de testar os dois. O FTP é imensamente mais rápido. O bom das extensões FrontPage é que você pode se conectar ao seu site na Internet, remotamente mesmo, mudar o nome de um arquivo, e todos os links que apontavam para aquele arquivo são automaticamente modificados para o novo nome criado. Isso diminui drasticamente a possibilida de de links errados ou quebrados. O sistema do FTP não faz isso, apenas envia e recebe arquivos. Não atualiza o código de nenhum deles para evitar links quebrados. Mas até ai, o sistema de envio que já vimos pelo botão Browse também não faz nada disso que o FrontPage faz. Além do que, muitos sites que prezam pela segurança acabam preferindo sites sem essas extensões desse programa porque dizem que os deixam mais vulneráveis a ataques de hacker. Isso é verdade também. Como também é verdade que, mesmo com todas essas defesas, o número de ataques de hackers não fica intimidado porque seu site tem ou não extensões do FrontPage. Eles sempre acabam arrumando um jeitinho de entrar em seu site. Por isso aconselho sempre a não deixar nada de confidencial na Internet. E se for necessário, contrate uma empresa idônea que saiba como proteger seus dados. Mas vamos voltar ao que interessa. T emos então como enviar arquivos pelo protocolo HTTP que é o que utilizamos com aqueles formulários dos serviços gratuitos que já vimos. T ambém temos como enviar arquivos pelo sistema de extensões do FrontPage e por final, temos como enviar e receber arquivos via FTP. Existem outros programas de edição de páginas que lhe permitem o envio de páginas diretamente também, mas eles se utilizam do FTP para enviá-los. Podemos utilizar o FTP de duas formas: a) usando um programa específico para isso, que temos às centenas, ou b) usando o DOS do Windows para enviar arquivos. Esse processo é mais complicado e não tão simples, já que tem que ser feito arquivo a arquivo, mas é bom saber para casos de emergência.

230 $ Como Efetuar o Download e Instalar Um Programa de FTP Gratuito Como é um programa gratuito e possui uma versão para português, eu recomendo a você que efetue o download e a instalação do FREEFTP, que você pode encontrar no site Este é um software só para usuários de Windows. Infelizmente não saberia recomendar um bom para usuários de Mac ou Linux. De toda forma, ao entrar nessa página, você verá a tela da Figura 5.1. Figura 5.1 Sei que está tudo em inglês, mas é bom se acostumar, pois a maior parte dos serviços que existem na Internet está em inglês. Assim, utilize a barra de rolagem para descer um pouco mais nessa página. Verá um link para download do programa, que agora está na versão 3.2 (pelo menos até a impressão deste livro). Clique e faça o download do arquivo, escolhendo onde quer salvá-lo. O nome do arquivo será FREEFTP.ZIP, portanto, você irá precisar do WinZip ou outro programa que trabalhe com esse formato de arquivo compactado já vimos isso anteriormente também. Assim que o processo de download tiver sido completado, utilize o programa de ZIP para descompactar o conteúdo do arquivo em algum outro lugar de seu computador.

231 Veja só como eu fiz. Primeiramente escolhi para que o arquivo FREEFTP.ZIP fosse salvo no meu diretório TEMP (se você não tiver um, é uma boa idéia criar, pois é muito útil). Figura 5.2 Depois dei dois cliques em cima do arquivo FREEFTP.ZIP. Isso me abriu o programa associado a arquivos ZIP, o WinZip. Figura 5.3 Veja que ele já me mostra todos os arquivos existentes dentro do arquivo compactado zip. No caso do WinZip, existe uma opção legal, que é o In stall. Através dele podemos instalar um programa (no caso o freeftp é um programa, e o WinZip sabe disso porque um dos arquivos compactados se chama setup.exe, que é um arquivo de instalação), sem ter que descompactar tudo em outro diretório. Mas isso é algo que o WinZip tem. Vamos trabalhar como se você tivesse outro programa e não pudesse ter essa opção.

232 $ Vamos extrair todos os arquivos para algum diretório de onde iremos instalar o programa. Vamos então criar um diretório FTP pelo Windows Explorer. Feito isso, utilizamos a opção de Extract do programa que trabalha com ZIP, o que irá abrir outra janela onde iremos localizar onde os arquivos serão extraídos e descompactados. Verifique se o diretório que criamos já está selecionado. Senão localize-o por essa janela. Figura 5.4 Agora sim ele está ok para extrair os arquivo para o diretório C:\Temp\ftp Clique no botão Extract. A operação é bastante rápida. Assim que terminar, ele voltará para a tela inicial do WinZip (ou de seu outro programa) e, no caso do WinZip, você verá lá embaixo que a luz verde está acessa, o que quer dizer que já foi cumprida sua missão. Feche o WinZip ou seu outro programa. Não iremos mais precisar dele. Agora vamos para o diretório C:\Temp\ftp Veremos lá os arquivos já prontos para instalação do programa.

233 Dê dois cliques no arquivo Setup.e xe. Figura 5.5 Você verá uma tela azul com um aviso. Basicamente o que ele diz é para você fechar outros programas que estejam abertos para facilitar a instalação do FreeFTP. Ao terminar de fechar outros programas que possam estar abertos, clique em OK. Figura 5.6 Continuando a instalação, veremos na próxima tela um botão bem grande com um computador nele. Para continuar a instalação do programa, clique nesse botão com o computador. Se quiser, você pode mudar o diretório onde o programa vai ser instalado. Eu não recomendo. Clique direto no botão de instalação que falei. Figura 5.7

234 $ A instalação vai prosseguir e instalar todos os arquivos necessários em seu computador. No final você verá uma mensagem de confirmação de que tudo terminou com sucesso. Clique em OK para fechar essa janela. Figura 5.8 O FreeFTP precisa que seu computador seja reiniciado para completar definitivamente a instalação. Ele irá mostrar uma tela com essa mensagem também. Figura 5.9 Lá você terá que escolher se quer reiniciar seu computador agora (o que é recomendável, se você já fechou todos os seus programas e está tudo salvo) ou se quer reiniciar seu computador mais tarde. Nesse caso você terá que sair do Windows pedindo para o computador reiniciar (restart). Assim que voltar dessa operação, seu programa está pronto para ser usado. Vamos iniciar o programa para configurá-lo da primeira vez para o nosso idioma, português. Escolha o que possui a bandeira respectiva, pois há o português do Brasil e o português de Portugal. Atenção.

235 Figura 5.10 Se você quiser modificar a linguagem do software depois, basta utilizar o menu Língua para ver a mesma tela e fazer outra escolha. A aparência do FreeFTP é bem simples. Vou explicar o básico do funcionamento do software. Acompanhe pelas figuras o que cada área do programa faz e então veremos como utilizá-lo para enviar e receber arquivos via FTP. Figura 5.11

236 $ Vejamos para o que serve cada parte de seu programa de FTP. Figura 5.12 Figura 5.13

237 Figura 5.14 Figura 5.15

238 $ Agora você já sabe como utilizar a maior parte deste software. Vejamos então como iremos utilizá-lo para nos conectar a todos os serviços de hospedagem que permitam o seu uso. Primeiramente temos que procurar informações se o serviço utiliza FTP. Se sim, o que temos que saber é: a) qual o endereço do servidor de FTP que devemos utilizar. b) se a porta de acesso é a 21 realmente. Como disse, esta é a porta normal de acesso e somente em raros casos temos que mudar essa configuração. Se na ajuda do seu serviço de hospedagem não encontrar resposta, tente com 21 mesmo. c) verifique se o seu nome de usuário e sua senha do serviço são os mesmos para o serviço de FTP. Algumas vezes, por razões de segurança, são diferentes. Isso também, no entanto, é raro. Nos serviços que avaliamos aqui, somente o Planeta Terra e o Yahoo! GeoCities aceitam o uso do FTP. Para você enviar páginas html ou imagens ou outros tipos de arquivo para seu site, primeiramente localize o diretório de seu computador onde elas se encontram, na janela Suas Pastas. Você irá ver agora os arquivos de seu computador na janela Seus Arquivos. Figura 5.16 Como você notou, agora toda a ação vai praticamente ser na parte esquerda de seu software, pois em cima você vê os arquivos que estão em seu site, e logo abaixo, você vê os arquivos que estão em seu computador.

239 Digamos agora que você queira enviar arquivos (ou diretórios também) do seu computador para o seu site. Primeiro selecione o que deseja enviar na janela de baixo, usando as teclas Shift ou Ctrl. Depois clique na seta preta ao lado do comando Send. Ou então você poderia utilizar o recurso do Windows de segurar os arquivos selecionados com o botão direito do mouse e arrastá-los para a janela de cima, soltando-os em cima de seu site. Viu como é fácil conseguir lidar com esse tipo de programa? Basicamente todos eles são da mesma forma no Windows. Você pode selecionar os arquivos e segurá-los com o botão direito do mouse e arrastar todos de uma vez para a janela mostrando o seu site. A mesma coisa acontece quando você precisa trazer algum arquivo de seu site para o seu computador. Você seleciona o que quer trazer e usa o recurso de segurar, arrastar e soltar com o seu mouse ou então apenas clica na seta preta onde vemos escrito Re cei ve. Para renomear um arquivo ou diretório, selecione-o e utilize a tecla correspondente a esse serviço, que estudamos nas figuras relativas à tela do programa FreeFTP. É tudo bem simples. Para cada tecla de opções, como apagar, criar, ver tamanho, visualizar, ler, renomear, etc, você tem que ter um arquivo ou diretório selecionados. No caso de apagar, você pode ter até mais do que um arquivo ou diretório para apagar de uma vez. T ente acessar um dos serviços que permitem o uso de FTP e em pouco tempo você vai estar se perguntando porque perdia tanto tempo mandando seus arquivos por uma página com aqueles botões Browse. Vamos ver como você pode se conectar com dois dos serviços de hospedagem grátis que nos permitem fazer esse teste. Se você ainda não tem um site neles, é bom pensar em ter, já que você pode ir no mínimo treinando FTP, certo? Como Utilizar FTP no Yahoo! GeoCities Primeiramente temos que entrar com a URL do serviço de FTP que queremos acessar. No caso do Yahoo! GeoCities, defina seu programa de FTP para que se conecte com o host: ftp.br.geocities.com.

240 $ Defina sua ID de usuário como sua ID de usuário do Yahoo! GeoCities. Defina seu código de acesso como sua senha do Yahoo! GeoCities. Certifique-se de que todas as informações que digitar nos campos estejam em letra minúscula. Veja a Figura 5.17 para não se confundir. Figura 5.17 Nota: Na maioria dos serviços, você só vai precisar disso: o nome do servidor FTP, seu nome de usuário e sua senha. Isso irá levá-lo automaticamente ao diretório-raiz. Basta agora estar conectado na Internet e clicar no botão Conecta e pronto. Logo, logo, você irá ver o seu site via FTP. Mas lembre-se de trocar a ID e a senha pelas suas mesmo. O outro serviço que nos disponibiliza também o acesso via FTP é o do Planeta Terra. Vejamos então as configurações para ele. Como Utilizar FTP no Planeta Terra A URL de acesso do servidor de FTP do Terra é: ftp.planeta.terra.com.br A porta de acesso é a 21. No campo ID do usuário, coloque seu nome de usuário do sistema do Planeta mesmo, e para seu código de acesso, a sua senha. Para tipo de acesso, deixe em default ou padrão. Basta agora você estar conectado na Internet e clicar no botão Conecta do seu programa de FTP. Ele vai automaticamente procurar seu site e vai mostrar o conteúdo dele na janela Arquivos do Site FTP.

241 Figura 5.18 Agora você já sabe como se conectar via FTP para outros servidores de Web, certo? Mas, e se você precisar desesperadamente enviar um arquivo ou receber um arquivo de um servidor FTP e não possui nenhum software especial para isso? Vai ficar sem mandar a última atualização do seu site? Não!!! Isso é, não se você se lembrar de algumas dicas e comandos e tiver um computador com o Windows e acesso à Internet. Veja só, basta você acessar o seu prompt do DOS. Como transferir seus arquivos por FTP via DOS Para fazer isso, siga essas etapas: No menu Iniciar, selecione Programas > Prompt do MS-DOS. Vamos usar aqui como exemplo, o serviço do Yahoo! GeoCities. Digite ftp ftp.br.geocities.com (aparecerá um prompt). Figura 5.19 Digite seu nome de membro do Yahoo! GeoCities e dê En te r.

242 $ Digite sua senha do Yahoo! GeoCities. Figura 5.20 Figura 5.21 Agora basta você usar comandos padrão de FTP para gerenciar os arquivos em sua página principal. Figura 5.22

243 Aqui eu usei o dir, para ver todos os arquivos que eu tenho em meu site. Figura 5.23 Quando eu usei o comando dir para ver meus arquivos, note que aparecem algumas siglas em cada começo de linha: - rw r r - - rw rw - drwxr x - Toda vez que aparecer a letra d no início da linha, se trata de um Di retório. Os outros são arquivos. No final de cada linha você verá o tamanho em Kb de cada arquivo, sua data de criação, e a hora em que foi criado ou modificado e o nome. Comandos Básicos do FTP bin: altera o modo de transferência para binário (usado para transferência de elementos gráficos, arquivos ZIP etc.). Se o arquivo que você deseja carregar contiver somente texto, como um arquivo HT ML ou de texto, você pode usar o modo AS- CII ou o modo bin ário. Se você quiser carregar um arquivo gráfico ou arquivos de outras mídias, use sempre o modo binário.