DesDig Aula 03

Prévia do material em texto

Design Digital aula 
03
Infraestrutura da internet
Como “as internets” 
funciona.
Rede Local
Se você quiser comunicar um 
computador que está próximo um 
do outro, você simplesmente pode 
ligar eles numa mesma rede local e 
a comunicação é alcançada.
Intermediarios
Porém, se o computador 
estiver distante, você precisa 
de um intermediário.
Telefone
É o maior o maior intermediário para 
que o computador se comunicasse 
com o mundo (ou outro computador). 
Telefone
Antes discada, agora usamos mais 
bandas largas de provedores. 
Hoje temos as parabólicas TV a 
cábo, radio, etc.
O maior problema dessas redes é que elas são analógicas e os dados são digitais.
Telefone
Um dado de computador em sua 
essência é formado por 0 e 1. 
Esse código binário funciona 
como um “liga e desliga”, logo, 
suas ondas são “quadradas”.
Ondas Senoidais
Já as ondas de rádio, telefone e cia 
são senoidais, que em miúdos 
seriam ondas “redondas”.
Ondas Senoidais
Logo, se você já brincou de lego, 
sabe que não dá pra encaixar o 
quadrado no círculo.
Ondas Senoidais
Portanto, utilizamos um aparelho 
específico - o modem - para fazer essa 
“tradução”, chamado de modulação. 
Ondas Senoidais
Ao chegar ao computador 
receptor, o modem “traduz” 
novamente (demodulação) 
para a língua original.
Ondas Senoidais
Lembra que Khan criou o 
protocolo tcp dividiu os 
dados em pacotes? 
Aula passada...
Em 73, quando muitas outras 
máquinas começaram a ser 
adicionadas, o NPC começou 
a dar “pau”, então Robert 
Khan criou um novo 
protocolo chamado TCP 
(Transfer Control Protocol). 
Aula passada...
Esse protocolo dividia os 
dados em pacotes.
Datagramas
Então… Um arquivo quando sai 
de um computador para outro, 
ele não sai “inteiro”, ele divide 
em pacotes (datagramas). 
Datagramas
Ao chegar no destinatário 
os protocolos juntam os 
pacotes, reformulando o 
arquivo novamente. 
Pense que você tem um 
arquivo muito grande e 
precisa levar até um 
computador sem internet. 
Esse arquivo não cabe em 
um pendrive apenas.
Você pega, divide ele no 
winzip, em vários pedaços e 
os coloca em pendrives 
diferentes.
Ao chegar no no computador, 
você descompacta o arquivo 
colocando os vários pendrives 
e utilizando o winzip.
Esse winzip faz esse papel do tcp, só que ao vivo e não na internet.
Mas como um pc 
acha outro na rede?
Provedor
Seu dispositivo digital (pc, cel, etc) 
se comunica com um servidor de 
acesso - o provedor - que te liga 
com as internê.
IP
Quando essa conexão é feita, seu pc 
recebe uma identificação, chamada de 
IP, formado por 4 partes de número, 
example: 111.111.111.111.
IP
Só que quando você abre um browser e tenta 
entrar em um site, (geralmente) você não 
digita o ip dele… 
você digita o nome dele, como por exemplo
www.xablau.com.br
www.xablau.com.br
PROVEDOR
INTERNERD
SERVIDOR
111.111.111.111
http://www.xablau.com.br
IP
Só que esse site está em um servidor 
na net, que também tem um ip...
www.xablau.com.br
PROVEDOR
INTERNERD
SERVIDOR
111.111.111.111
Se eu escrevo um nome mas os sites e servidores estão 
em número de IP...
Então como se acha o servidor?
Se eu escrevo um nome mas os sites e servidores estão 
em número de IP...
Então como se acha o servidor?
- Tendo um servidor DNS, ou seja, 
servidores de nomes de domínio!
DNS
Portanto, se você vai procurar um site 
brasileiro, normalmente ele acaba com 
.br no domínio. 
www.xablau.com.br
PROVEDOR
INTERNERD
SERVIDOR
111.111.111.111
DNS
DNS
Logo, você será enviado a um servidor 
DNS com endereços terminados com 
.br, ou dns Brasil.
www.xablau.com.br
PROVEDOR
INTERNERD
SERVIDOR
111.111.111.111
DNS huehue .BR
DNS
Esse servidor tem uma lista com Nome e 
IP de cada parada e faz a ligação.
Mas como eu coloco um site online?
Mas como eu coloco um site online?
Basicamente, além do site você precisa ter 
um domínio e uma hospedagem.
Domínio
É o registro de um nome, que é utilizado para 
conectar seu site à sua hospedagem através 
ou sequência de caracteres (letras e tals) 
através de um navegador de internet.
Domínio
É - portanto- o endereço do seu site. 
Fazendo uma analogia porca, é o endereço de uma casa.
Hospedagem
A hospedagem é um como um espaço 
online reservado para seu site na internet.
Hospedagem
É por meio dela que você armazena os 
arquivos que mantém seu site no ar.
Hospedagem
Continuando a analogia porca, 
seria o terreno da casa.
Teste de Navegador Cross-browser
Quando fazemos um site, muitas das vezes o 
navegador pode zoar a visualização dele.
Teste de Navegador Cross-browser
Realizar testes de cross-browser é importante, 
pois você pode visualizar perfeitamente o seu 
site na versão mais recente do Firefox e ele ter 
um visual e usabilidade incríveis. 
Teste de Navegador Cross-browser
Porém, um visitante pode entrar nesse mesmo site e 
visualizá-lo de forma completamente diferente por 
estar usando o Internet Explorer 9, por exemplo. 
Teste de Navegador Cross-browser
O fato da página não funcionar corretamente 
para esse visitante pode resultar na perda de 
visitantes (e clientes!).
Teste de Navegador Cross-browser
Imagine que você tem um site para vender 
produtos ou serviços e um potencial cliente não 
consegue finalizar a compra porque o formulário 
de cadastro apareceu cortado em sua tela ou 
sequer foi exibido em seu navegador.
Teste de Navegador Cross-browser
Testar seu site em vários navegadores deve se 
tornar um hábito. 
Teste de Navegador Cross-browser
● Verifique a sua aparência nos diferentes browsers disponíveis no mercado.
● Teste a navegação.
● Preencha e envie formulários.
Faça tudo isso para ter certeza de que tudo vai correr bem quando diferentes 
visitantes tentarem acessar sua página.
Teste de Navegador Cross-browser
Uma das formas de realizar esses testes de 
cross-browser é baixar as últimas versões dos 
principais navegadores do mercado para o seu 
computador e testar um por um. 
Teste de Navegador Cross-browser
Chrome, Firefox, Safari, Internet Explorer e Opera 
normalmente podem ser baixados e instalados sem 
grandes problemas numa mesma máquina. 
Teste de Navegador Cross-browser
Algumas ferramentas voltadas a esse tipo de teste 
estão aí para ajudar. Algumas mais conhecidas são 
pagas mas existem também ferramentas baseadas 
na web que são gratuitas. 
Trabs
➔ Procurar ferramentas de 
cross-browser.
➔ Procurar dois sites que 
funcionem de formas 
diferentes em cada 
browser.*