DecodeWEB

Transcrição

DecodeWEB
training
Decode web
Introdução
Nas duas ultimas décadas, todos os humanos da nossa grande nave mãe terra, fomos
direta ou indiretamente afetados pelo fenômeno internet. Não importa se você tenha
10 anos ou já esteja com mais de 60 anos, em algum momento já dependeu ou irá
depender dos serviços e mecanismos que a internet trouxe ao nosso dia-a-dia.
Por isso formulamos esse treinamento rápido que tem como objetivo apresentar os conceitos chaves e
básicos de como funciona a internet e como você pode tirar proveito dela.
O objetivo não é entrar em grandes teorias computacionais nem se aprofundar em técnicas avançadíssimas
de programação web para criar sites e blogs, nossa intenção tirar você do grande quadro de leigos, ou como
eu chamo analfabetos digitais, de hoje em dia, trazendo mais luz aos conhecimentos que com certeza você
já tem.
Bom proveito!
Como somos ligados a internet
Aqui começamos a nossa viagem, para utilizar os serviços e se aventurar, ou surfar, pela internet precisa-se
estar ligados a ela, isso acontece da seguinte forma:
Primeiro, com o avanço da computação, desde os anos 80, já foi possível ligar 2 ou mais computadores, no
que chamamos de rede. Essa ligação normalmente é feita usando-se um conjunto de placas, chamadas
placas de rede ou placa ethernet, e um cabo especial ligando esses dois computadores, dessa forma é
possível eles trocarem informações, veja a imagem abaixo:
Ligação entre 2 computadores
Quando mais de um computador é ligado em uma rede, eles precisam de um código para poder identificalos, esse código é chamado de IP (Internet protocol), composto por uma sequencia de 4 números com até 3
digitos cada, por exemplo:
Computador A, o IP poderia ser: 10.0.0.1
Computador B, o IP poderia ser: 10.0.0.2
DecodeWeb v1.0 - copyright © sensepix.com, 2011.
training
O sistema de IP´s possibilita uma conexão de diversos computadores em rede.
Segundo vamos entender como funciona 4 equipamentos importantes na infraestrutura que compõe a
grande rede;
1) Servidores: nada mais são do que computadores com grande poder de processamento e muita
capacidade de armazenamento de informações digitais, é neles que ficam depositados os
documentos, fotos, vídeos, sites pelos quais navegamos;
2) Modens: um detalhe importante, a internet só é possível graças ao sistema de telefonia que já existe
disponível no mundo todo, é por ela que se trafegam todos os dados entre os computadores que
estão ligados a rede, pois bem, quem faz essa gracinha funcionar é o MODEM, ele literalmente
“conversa” usando a sua linha telefônica, assim, o modem transforma sinal audível em sinal digital,
veja a imagem abaixo:
Esquema de conexão entre a linha telefônica o modem e o computador
Linha telefônica,
comunica-se com a
internet através de sons.
O modem faz o trabalho
de transformar o som em
sinal digital, o chamado
bit e byte, o qual o
computador entende.
Esquema de conexão da ligação do modem e distribuição do sinal de internet para vários
computadores usando-se um roteador/switch.
Fique craque no assunto de modens leia esse artigo no howstuffworks:
http://informatica.hsw.uol.com.br/modem-cabo.htm
DecodeWeb v1.0 - copyright © sensepix.com, 2011.
training
3) Roteadores: esse é um equipamento importante na infraestrutura da internet, apesar de você no
cotidiano nunca entrar em contato com ele é importante saber que existe, os roteadores contem
informações de onde se localizam os servidores com as informações que foram solicitadas, eles
guardam grandes tabelas de informações contendo “links” sobre em quais rotas de telefonia estará
um servidor com o que foi solicitado a ele.
4) Computadores clientes: esse é o seu, isso mesmo, ele é fundamental, pois é a janela para o universo
da internet, as solicitações podem partir do seu computador, passar pelos modem, ser transformado
em sinal audível, enviado a um roteador que dará uma “rota” para a sua solicitação até ele chegar a
um servidor que contenha a informação solicitada, em seguida, esses dados são enviados para o seu
computador, usando sempre os roteadores como guias e o seu modem como tradutor, e por fim, o
seu computador para exibir as informações solicitadas.
Navegadores web, a janela para a internet
Os chamados navegadores web são softwares que conseguem interpretar alguns tipos de códigos bem
específicos e que exibem informações, gráficos, imagens e toda a informação visual disponível nos
servidores conectados a internet.
Para uma informação ser visível em um navegador de web ela precisa estar formatada numa linguagem que
chamamos de HTML (HyperText Markup Language ou Linguagem de marcação de hipertexto), por ser uma
linguagem simples de se utilizar, podemos dizer que com pouca noção de lógica de programação ou
conhecimento de computação, uma pessoa consegue montar uma página web.
Os navegadores atuais também executam alguns tipos de códigos mais avançados, o que permite que
aplicativos avançados sejam criados para utilizarem esse ambiente, atualmente, os navegadores tem
tomado importância enorme na computação devido a ampliação da utilização de serviços como email,
editores de texto, aplicativos corporativos entre outros todos hospedados na internet.
Os navegadores mais utilizados atualmente são o Internet explorer da Microsoft, que lidera o uso com mais
de 50%, depois temos o Firefox seguido pelo Chrome da google, e na lanterna com menos de 5% o Safari da
apple e o Opera.
Aprendendo mais de HTML
Bem, nosso foco é entendermos a internet e criarmos algo interessante nela, portanto vamos nos concentrar
no HTML.
O HTML é codificado usando-se etiquetas, que são elementos entre parênteses angulares, os conhecidos
sinais de maior e menor ( < e > ); esses elementos são os comandos de formatação da linguagem.
<etiqueta>....</etiqueta>
Toda etiqueta aberta tem sua etiqueta de fechamento correspondente.
Vamos a um exemplo básico, vamos criar um arquivo no computador onde iremos codificar informações
HTML para serem exibidas no nosso navegador, para isso, use um editor de texto simples, por exemplo o
NOTEPAD do Windows, abra-o e vamos digitar o seguinte código:
DecodeWeb v1.0 - copyright © sensepix.com, 2011.
training
<html>
Ola mundo esse e meu primeiro código web
</html>
Salve esse documento com o nome de TESTE.HTML em alguma pasta de seu computador, em seguida use o
Windows explorer para localizar a pasta e de um duplo clique sobre ela, o seu navegador irá abrir e a
mensagem “Ola mundo esse e meu primeiro código web” deverá aparecer.
Avançando
Bem, as etiquetas contem várias codificações possíveis veja como colocar cor:
<html>
<font color=”red”>
Ola mundo esse e meu primeiro código web
</font>
</html>
Agora vamos também mostrar uma imagem existente na internet dentro desse nosso documento html:
<html>
<font color=”red”>
Ola mundo esse e meu primeiro código web
</font>
<p>
<img src="http://www.indexi.com.br/wp-content/uploads/HTML1.jpg" />
</p>
</html>
As etiquetas <p> e </p> servem para dar uma quebra de linha na hora da exibição, experimente tirar essas
etiques <p> e </p> para ver como a página se comporta.
para saber mais sobre o html estude o link a seguir: http://pt.wikipedia.org/wiki/HTML
e também para conhecer em profundidade as etiquetas e suas estruturas consulte o endereço:
http://www.htmlstaff.org/secao.php?id=11 (é necessário se cadastrar para ver algumas seções desse site)
Também o site http://www.w3schools.com/tags/default.asp contem uma lista das funções HTML, use o
botão TRANSLATE na parte superior direita da página para traduzi-la para o português.
DecodeWeb v1.0 - copyright © sensepix.com, 2011.
training
Outras linguagens usadas na web
Existem muitas linguagens de programação para computadores que são utilizadas para escrever aplicações
na web, as mais conhecidas são:
PHP – É a chamada linguagem opensource da internet, possibilita execução de códigos rápidos, e com grande
poder de processamento, a grande vantagem dela é que a mesma roda sobre servidores com o sistema
operacional Linux, o que torna as hospedagens de site mais baratas;
ASP – E uma linguagem criada pela Microsoft, exige que as páginas sejam sempre executadas em servidores
Windows Server e o IIS (Internet Information Server) que é o servidor de internet da Microsoft;
JAVA SCRIPT – Usada para dar conta de funcionalidades muito avançadas, rodando sobre o browser, por
exemplo, o Gmail e seus componentes da google são quase todos escritos em javascript, bem como o Orkut,
Google Docs entre outros;
Tem como ganhar dinheiro na internet ?
Sim, tem. Essa seria a resposta de qualquer profissional que trabalha com internet, mas tem como pessoas
comuns, como qualquer um de nós, ganhar dinheiro com ela? Bem a resposta é SIM, mas o caminho
depende de um pouco de dedicação e uma boa estratégia de uso da internet.
Quais os mecanismos que possibilita ganhar dinheiro? Depende, se você tiver produtos para vender, se
fabrica algo interessante, pode anuncia-lo em sites de leilão como o mercado livre ou o ebay.com , se você
tem alguma habilidade especial para ensinar línguas ou ministrar cursos e treinamentos, pode usar de
webminars para realizar cursos virtuais, e por fim, um dos mecanismos mais utilizados é inserir propagandas
em sites ou blog´s que você pode criar e gerar uma audiência com os assuntos que venha a ser abordados
nele, esses anúncios, quando clicados, geram receitas diretamente para sua conta. Vamos analisar cada um
desses casos;
Webminars
Ministrar uma palestra ou curso via internet atualmente é mais fácil do que se imagina. Para fazê-lo primeiro
é preciso muito planejamento, para saber exatamente o que será mostrado, que material será distribuído via
email e criarmos uma apresentação de slides bem eficiente e prática.
Uma característica importante de ser ressaltada nesse tipo de seminário é que o material gráfico deve ser de
boa qualidade, pois os expectadores vão ter contato com o material e não com a sua presença física em um
palco ou frente de sala.
Toda a dinâmica da ministração deve ser cuidadosamente planejada, nada de ficar gastando o tempo com
muitas piadas ou com pausas delongadas, quem assiste webminars normalmente está optando em
economizar tempo e dinheiro e portanto a essência desses eventos é o dinamismo na exposição das idéias.
Um serviço amplamente utilizado de webminar é o Gotowebminar, é uma ferramenta em inglês, mas é fácil
de compreendê-la, por ser um serviço, o mesmo é cobrado mensalmente ou por sessão de webminar, é
possível utilizá-lo por um período grátis de 30 dias.
http://www.gotomeeting.com/fec/webinar
DecodeWeb v1.0 - copyright © sensepix.com, 2011.
training
Patrocínio de palavras e propaganda como Google, Yahoo entre outros.
Essa talvez seja a forma mais fácil para se ganhar dinheiro com a internet. Consiste em você construir um
site ou um blog e em determinados espaços da tela possibilitar a inserção de propagandas geradas pelos
provedores mundiais como o Google ou Yahoo. Quem inventou esse sistema foi a própria google, o
programa de ganhos com propaganda deles se chama Adsense.
Como funciona:
1º) cria-se uma conta no site do adsense do google (google.com/adsense);
2º) no adsense você especifica o tipo de propaganda que deseja permitir que o google apresente no seu site
ou blog;
3º) o próprio adsense irá gerar um código html/javascript que você depois irá inserir no seu site ou blog e
que automaticamente passará a exibir as propagandas;
4º) os ganhos virão conforme os visitantes de seu site clicarem em uma das propagandas que aparecerem,
por isso é importante o conteúdo do site gerar a maior quantidade possível de visitantes pois somente os
que clicarem sobre as propagandas é que irão gerar receita para a sua conta no adsense;
Para conhecer mais sobre como montar seu site veja nosso treinamento sobre construção de blog e sites, e
para saber sobre como ganhar dinheiro na internet com maiores detalhes em breve disponibilizaremos o
treinamento ganhando dinheiro com a internet, se cadastre para receber as News do Sensepix ou siga-nos
pelo twitter que avisaremos.
Princípios básicos para construir uma página na web
Para se construir uma página na internet devemos seguir alguns procedimentos obrigatórios, com os quais
poderemos viabilizar uma forma de divulgarmos nossas ideias e conteúdo para a grande rede mundial.
Alguns esclarecimentos primeiro sobre o que é um site e o que é um blog;
Site: é uma página de web completa, com diversos níveis de visualização e várias subpáginas onde você pode
categorizar assuntos, mostrar imagens, vídeos, abrir espaços para debates e divulgar diversos assuntos como
manuais, procedimentos, analises e treinamentos.
Blog: são pequenos sites, com funcionalidades limitadas, o objetivo dele é divulgar assuntos específicos
catalogando-os por data e hora, e possibilitando que outras pessoas interajam sobre algum assunto
específico deixando suas opiniões registradas para que outros visitantes possam vê-las. O blog funciona
como uma central de noticias onde você pode abordar qualquer tipo de assunto e os mesmos ficarão de
forma sequencial por data e hora da publicação.
Ok, entendido esses dois conceitos vamos também abordar outros dois pontos importantes na estrutura da
internet, a 1ª diz respeito sobre hospedagem de conteúdo compartilhada, e a 2ª sobre hospedagem privada;
Na hospedagem compartilhada temos limitações sobre o formato de visualização, seja do layout da página
bem como do endereço que será dado para a página web, existem alguns serviços bem conhecidos para
DecodeWeb v1.0 - copyright © sensepix.com, 2011.
training
blog´s, por exemplo, como o blogger da google ou o wordpress.org da própria wordpress, a grande
vantagem desses serviços é a sua gratuidade e principalmente a facilidade para se iniciar um site visto não
ser necessário lidar com procedimentos de reserva de domínio e nem compra de espaço em hospedagens, a
desvantagem é que o endereço eletrônico ficará sempre ligado a esse serviço, por exemplo, se quisermos
criar um site chamado ECODE o endereço dele no serviço do blogger seria: http://ecode.blogger.com.
Na hospedagem privada você tem uma liberdade completa para colocar o formato e conteúdo conforme
desejar, para isso é necessário primeiro registrar o endereço que você deseja ter na internet no sistema de
reservas de domínio da internet. Para isso primeiro você consulta o nome que se deseja na entidade que
controla os endereços no país, aqui no Brasil o endereço é http://registro.br. Lá você pode consultar se o
endereço desejado está disponível bem como se cadastrar e em seguida pedir a reserva desejada e gerar o
boleto de pagamento da manutenção anual, somente após esse procedimento é que o seu endereço de web
estará disponível.
Bem, registrar apenas o endereço na “registro.br” ainda não é suficiente, é necessário também hospedar o
conteúdo do seu site em um provedor de web qualquer, para isso existem bons serviços aqui no brasil como
a locaweb, redehost, terra, uol, ig, dialhost entre outros. Alguns provedores como a locaweb já executa
também o serviço de reserva de domínio automática quando você adere ao seu serviço de provedor web.
Um fato importante de se destacar é quanto ao funcionamento do sistema de domínios da internet, um
nome de site pode não estar disponível com o final “.COM.BR” mas pode estar disponível em outros finais
como .COM ou .NET, caso você reserve um domínio com a extensão final .COM, por exemplo, o mesmo
ficará registro em alguma entidade de controle da internet nos EUA e não aqui no brasil.
Bem, entendido esses procedimentos básicos vamos agora a construção de nossa página web;
Antes de entrar nessa fase é importante você já ter desenhado uma ideia de um site/blog para se construir,
faça isso no papel mesmo, desenhe usando a técnica simples de listar quais serão as páginas, que conteúdo
gostaria de colocar nelas, que opções terá no menu de introdução e principalmente do que irá se tratar o
site, também pense em um nome para o site, isso porque você precisará testar vários nomes, pode ser que
alguém já tenha tido a mesma ideia de nome que você já registrou um site, portanto você não irá conseguir
utilizá-lo.
Usando codificação direta
Na codificação direta vamos precisar entender bem de programação em linguagens como HTML , PHP, Java
ou .NET da microsoft, pois aqui vamos construir um site a partir do ZERO.
Para criarmos uma página básica vamos utilizar um programa muito conhecido entre nós, o próprio WORD
da Microsoft, siga os passos abaixo e você vai construir um site e exibi-lo aí no seu navegador e hospedado
no seu próprio computador.
1º) Abra um novo documento no editor do Office Microsoft word;
2º) Digite um nome usando fonte arial e com tamanho 14 ou 16, depois insira uma tabela com 3 colunas e 1
linha, veja o exemplo na imagem abaixo:
DecodeWeb v1.0 - copyright © sensepix.com, 2011.
training
3º) Salve pela primeira vez o seu site, para isso, vá na opção “salvar como...”, ATENÇÃO ! na caixa TIPO DE
ARQUIVO selecione a opção “Página de Web (*.HTM,*.HTML)”, quando selecionar essa opção, o quadro de
salvar irá também apresentar um botão chamado “ALTERAR TITULO”, clique nele e de um nome para sua
página, esse nome será exibido no topo do navegador, também coloque o nome do arquivo a ser salvo
como: HOME.HTM, recomendamos que você crie uma pasta específica somente para esses documentos de
página web, veja o exemplo da tela abaixo:
4º) Depois que você salvar esse documento como sendo uma página web o word irá apresentar o conteúdo
da mesma de uma forma um pouco diferenciada, mas não se preocupe, pode trabalhar o documento como
se fosse um arquivo do word;
5º) esse documento HOME.HTM será nossa página de abertura do site, vamos agora criar outras 2 páginas
que serão acessadas através do menu da página principal, crie um novo documento do word, salve-o com o
nome de SERVICOS.HTM, lembre-se de alterar o tipo do arquivo para Página de Web. Nesse documento
coloque o título: SERVIÇOS, e descreva abaixo os seus serviços e o que será exibido para os visitantes da
página. Crie também um 2º documento e atribua o nome de CONTATO.HTM, também deve ser no tipo
Página de Web, coloque o titulo CONTATO e abaixo digite seu email, telefone, endereço e mais algo que
julgar necessário;
DecodeWeb v1.0 - copyright © sensepix.com, 2011.
training
6º) Após criado nossos 3 documentos que formarão o site, HOME.HTM, SERVICOS.HTM e CONTATO.HTM,
vamos criar os links´s que irão possibilitar clicarmos no menu e a página ser exibida;
7º) abra o documento HOME.HTM e preencha o conteúdo dele conforme o exemplo abaixo:
DICA: Na hora de selecionar um arquivo no formato HTM com o propósito de editá-lo você tem que selecionar ele com o
botão direito do mouse e pedir a opção “ABRIR COM” e depois selecionar o programa WORD.
Observe que na tabela que inserimos criamos títulos como se fosse um MENU;
8º) vamos criar o 1º link, de um duplo clique sobre a palavra SERVIÇOS até que a mesma fique totalmente
selecionada em seguida clique com o botão direito do mouse, procure no menu que irá surgir a opção
HIPERLINK, conforme a imagem abaixo:
9º) selecione a página que você criou chamada de SERVICOS.HTM;
10º) faça esse mesmo procedimento para a opção CONTATO do documento principal;
Após executada essas operações abra agora o seu Windows Explorer e vamos procurar os documentos que
criamos na pasta de documentos, de um duplo clique sobre o documento HOME.HTM conforme imagem
abaixo;
DecodeWeb v1.0 - copyright © sensepix.com, 2011.
training
Ao se clicar sobre a página HOME.HTM o seu navegador principal irá abrir e a sua primeira página web será
exibida, quando você clicar sobre a opção SERVICOS ou CONTATO você será direcionado automaticamente
para as subpáginas do seu site.
Pois bem, agora você pode usar a criatividade e expandir esse site inserindo imagens, criando formatações
diferenciadas, e também mais subpáginas.
Usando gerenciadores de conteúdo (CMS)
Construindo um blog ou site usando gerenciadores já hospedados como o blogger ou wordpress.com.
Esses dois são os mais utilizados no momento, o blogger tem a vantagem de ser totalmente integrado a sua
conta do google e usufruir com maior facilidade de programas como o analytics ou o adsense, acesse o site
http://www.blogger.com
Já o wordpress conta com uma possibilidade maior de construir blog´s que são quase sites, com diversas
funcionalidades que o blogger não consegue fazer, ou seja, se você for construir um blog simples utilize o
blogger, é mais fácil e rápido criar blog com ele, caso o seu desejo seja um blog com mais funcionalidades
mais de uma pessoa blogando no seu site, vários opções de customização de temas, então o seu caminho é
usar o site http://pt.wordpress.com
Agora é escolher um desses serviços, criar um usuário e criar o seu blog/site.
Para se aprofundar no assunto de criação de blog/sites consulte o treinamento “Criando um blog
profissional” que em breve estará disponível aqui no site do sensepix, cadastre-se na nossa News e nos
acompanhe pelo twitter.
Pronto! Chegamos ao final desse treinamento, espero que uma pequena parte desse grande universo da
internet esteja mais bem desvendada, agora é praticar e buscar maiores informações sobre os assuntos que
aqui tratamos.
Boa Sorte!!!
DecodeWeb v1.0 - copyright © sensepix.com, 2011.

Documentos relacionados