Web Design
Aula 11: Site na Web
Professora: Priscilla Suene
[email protected]
Motivação
• Criar o site em HTML é interessante
• Do que adianta se até agora só eu posso vê-lo?
• Hora de publicar o site na Web para que os
outros possam acessá-lo
• Hora também de entender melhor o
funcionamento de uma página WEB
Roteiro
•
•
•
•
•
•
•
Introdução
Hospedagem
Domínio
Envio de Arquivos
FTP
HTTP
Servidor WEB
• Cadastrando uma conta
• Acessando uma conta
• Enviando Arquivos via
web
• Enviando arquivos via
FTP
Introdução
• Passos essenciais para colocar meu site na web
1. Encontre uma empresa de hospedagem
2. Escolha um nome para seu site
3. Encontre uma forma de enviar seus arquivos
4. Divulgue seu site
Hospedagem
• Para colocar seu site na web você precisa de um
servidor que “more na web” o tempo todo
• Você mesmo poderia criar um servidor em seu
computador, mas o mais comum é utilizarmos um
servidor já disponível para hospedagem de sites
Hospedagem
• Hospedagem de sites é um serviço que possibilita
pessoas ou empresas sites ou sistemas on-line
guardar informações, imagens, vídeo ou qualquer
conteúdo acessível por web
• Provedor de hospedagem são empresas que
fornecem espaços em seus servidores e conexão à
internet a estes dados aos seus clientes
- Uma máquina que fica ligada 24h na internet com
endereço disponível para ser acessada
Hospedagem
• Encontrar uma empresa de hospedagem que
ofereça esse serviço não é complicado
• Quando você paga por esse serviço, ele pode
fornecer mais recursos para seu site
Hospedagem
• Critérios importantes para escolha da empresa de
hospedagem
-
Suporte Técnico
Transferência de Dados
Armazenamento em disco
Backup
Nomes de Domínio
Confiabilidade
Linguagens e outros recursos suportados
Hospedagem
• Exemplos de servidores gratuitos
- http:// www.xpg.com.br
- http://www.000webhost.com/
Importante!!!
A sua página incial deverá ter o nome de
index.html, pois o servidor web
procurará por ela para abrir em primeiro
lugar!
Domínio
• Você pode não saber o que significa um domínio,
mas provavelmente já utilizou diversas vezes
• Domínio é um nome único utilizado para
localizar um site
• Ex:
www.google.com.br
nome de um
servidor específico
domínio
final de domínio: Varia de acordo
com a finalidade desejada
Domínio
• Se você quiser um domínio único para seu site,
você provavelmente vai precisar pagar por ele
• O domínio é controlado por uma unidade
centralizada (ICANN)
Domínio
• Ela visa garantir que só uma pessoa possa usar
um domínio de cada vez
• O pagamento é uma taxa anual para que você se
mantenha dono daquele nome
Domínio
• Muitas vezes a empresa de hospedagem,
oferecerá o pagamento referente ao registro de
um domínio pra você
Domínio
• Quer descobrir se um domínio brasileiro está
disponível?
• Acesse:
https://registro.br/
Envio de Arquivos
• Depois que você encontrou sua empresa de
hospedagem e acessou o seu cadastro
• Você precisará descobrir onde fica a pasta raiz e
copiar suas páginas para essa essa pasta
• Alguns servidos de hospedagem oferecem
ferramentas para envio de arquivos, mas um dos
métodos de transferência mais tradicionalmente
utilizados é utilizar o protocolo FTP
FTP
• FTP (File Transfer Protocol): Nada mais é do que um
protocolo de transferência de arquivos
• Mas o que é um protocolo?
• Protocolo é uma convenção ou padrão que controla e
possibilita uma conexão, comunicação, transferência de
dados entre dois sistemas computacionais. De maneira
simples, um protocolo pode ser definido como "as regras
que governam" a sintaxe, semântica e sincronização da
comunicação. FTP
• Existem diversos aplicativos que implementam o
protocolo FTP
Pasta raiz do
servidor
- Os arquivos estão no seu
Computador
-Você precisa transferir
-para o servidor
FTP
• Você vai se conectar ao servidor usando FTP
• Para isso, você precisará de um nome de usuário
e uma senha fornecidos pela empresa de
hospedagem
• Depois de conectado ao servidor FTP, você
deverá indicar a pasta de origem no seu
computador e a pasta de destino no servidor
• Só depois disso, você vai transferir cópias de seus
arquivos
FTP
• SFTP (Secure File Transfer Protocol): É o
protocolo de transferência segura de arquivos
• Funciona quase da mesma forma que o FTP,
porém é uma versão mais segura
HTTP
• É aquele http que aparece nos links, o que é?
http://www.google.com
• Ele é um protocolo, assim como FTP
• HTTP é utilizado para permitir ou browser
recuperar informações na WEB ou vice-versa
Servidor Web
• Aguardam as requisições enviadas pelos browsers
web como por exemplo: páginas, imagens,
vídeos, sons, etc
• Ao receber a solicitação, o servidor tenta localizar
o recurso e, caso encontre, envia-o para o
browser
Servidor WEB
• Procure chamar sua página
index.html ou index.htm
-Resposta HTTP-O servidor diz:
-Encontrei o arquivo,
-Aqui está!
principal
-Solicitação HTTP-O computador diz:
-Será que você pode
me dar um arquivo?
de
HTTP
Cadastrando uma conta
• Acesso o site: http://www.000webhost.com/
Cadastrando uma conta
• Cadastre-se no site:
Cadastrando uma conta
• Preencha as informações:
Acessando uma conta
• Você receberá um e-mail para ativar seu site
• Acesse seu e-mail e click no link para ativação
• Depois volte no site e acesso a sua conta
Acessando uma conta
Acessando uma conta
• Selecione o Go to CPanel
Enviando Arquivos via Web
• Ao mover a barra de rolagem, selecione a opção:
Enviando Arquivos via Web
• Você deverá enviar suas páginas para o diretório
public_html
Enviando Arquivos
• Para enviar seus arquivos selecione o botão
upload
Enviando Arquivos via Web
• Selecione o arquivo que deseja enviar
Enviando Arquivos via Web
• Após selecionar o arquivo desejado, você
precisará confirmar a ação para ser concluída
Enviando Arquivos via Web
• Então, a inclusão do seu arquivo será confirmada
Enviando Arquivos via FTP
• Se você enviar arquivos utilizando uma
ferramenta web disponibilizada pela provedor de
hospedagem, toda vez que você mudar de
provedor, é possível que precise aprender a
utilizar ferramentas diferentes
• Você pode enviar arquivos via ferramenta FTP
• Exs: Putty, FileZilla
Enviando Arquivos via FTP
• Vamos aprender a enviar arquivos usando
FileZilla
• Faça o download do FileZilla em:
http://filezilla-project.org/download.php
• Depois instale o FileZilla em seu computador
Enviando Arquivos via FTP
Enviando Arquivos via Web
• Usando filezilla, você pode se conectar ao
servidor onde ficarão armazenados seus arquivos
Enviando Arquivos via Web
• Você precisará preencher algumas informações
Enviando Arquivos via FTP
• O “000webhost” disponibiliza essas informações
pra você
• Volte na tela do CPanel da sua conta no
“000webhost”
Enviando Arquivos via FTP
• Selecione a opção View FTP Details
Enviando Arquivos via FTP
• Aqui você terá as informações que precisa
Enviando Arquivos via FTP
• Espere um momento!
• Nessa tela, eu tenho nome do host, nome do
usuário, senha********
• Bem, a senha eu sei que será a mesma que eu
cadastrei quando criei minha conta
• Mas e a porta?
- Você pode utilizar a porta 21, essa porta diz que
estou usando o protocolo ftp para essa conexão
Enviando Arquivos via FTP
Enviando Arquivos via FTP
• Depois de realizada a conexão, a sua pasta raiz
no servidor 000webhost será exibida
Enviando Arquivos via FTP
• No lado esquerdo, você vizualiza os diretórios e
arquivos no seu computador
Enviando Arquivos via FTP
• Enquanto no lado direito, você vizualiza os
diretórios e arquivos no servidor 000webhost
Enviando Arquivos via FTP
• Para enviar os arquivos, basta selecionar a pasta
onde estão os arquivos que você dseja enviar
Enviando Arquivos via FTP
• Ao selecionar essa pasta, os arquivos aparecerão
logo abaixo
Enviando Arquivos via FTP
• No lado direito, onde estão os diretórios e
arquivos no servidor, selecione public_html
Enviando Arquivos via FTP
• Selecione o arquivo desejado e click com o botão
direito para realizar o upload
Enviando Arquivos via FTP
• Ao clicar no botão upload, seu arquivo será
enviado para o servidor
Enviando Arquivos via FTP
• Se você quiser enviar mais de um arquivo, segure
ctrl ou shift e selecione os arquivos desejados
Enviando Arquivos via FTP
• Depois de enviar os arquivos, é só colocar o
endereço do seu site no navegador e conferir o
resultado do seu trabalho publicado na web
• Lembre-se que para isso você deverá estar
conectado a internet porque seu site agora está
lá!
• Obs: No caso do 000webhost, o diretório de
destindo deverá ser public_html, se você enviar
seus arquivos para /, não vai funcionar