SlideShare uma empresa Scribd logo
1 de 44
Baixar para ler offline
Web Design
Era uma vez...
Web Design { o começo do começo }
1965 Dois computadores no laboratório Lincoln
do MIT conversam entre si usando a tecnologia
de troca de pacotes.
Web Design { o começo do começo }
Na verdade foi assim...
Web Design { o começo do começo }
1969 Criação da ARPANET, a primeira rede de
computadores à base de troca de pacotes ,a
percursora da Internet. Os primeiros
computadores conectados em rede entre a
Universidade da Califórnia e o Stanford
Research Institute .Estava criado a ARPANET,
primeira rede.
Web Design { o começo do começo }
O plano infalível...
Web Design { o começo do começo }
Mas na prática foi assim...
Web Design { o começo do começo }
Daí então veio:

● o email
● a primeira conexão internacional
● um novo protocolo de conexão (o TCP)
Web Design { o começo do começo }
Em 1980, o hipertexto e o que se tornaria a
World Wide Web como conhecemos.

O projeto se chamava "ENQUIRE", do físico da
CERN Tim Berners-Lee, e tinha como objetivo
tornar mais fácil a troca de informações entre
as faculdades.

* CERN - Organização Européia de Pesquisas Nucleares
Web Design { o começo do começo }
Em 1988, a UFRJ conectou-se à UCLA
(Universidade da Califórnia)
Web Design { o começo do começo }
Em 1993, nasce o primeiro browser, o Mosaic.
Web Design { o começo do começo }
E no ano seguinte, o Netscape.
Web Design { o começo do começo }
E no ano seguinte, o Netscape.



      São os mesmos criadores do Mosaic:
Marc Andreesen e Eric Bina no National Center
  for Supercomputing Applications (NCSA) da
 Universidade de Illinois (Champaign-Urbana).
Web Design { o começo do começo }
E em 1995, nasce o pioneiro na indexação de
conteúdo na Internet; o Altavista.
Web Design { o começo do começo }
Web Design { o começo do começo }
Parecido com um outro, né?
Web Design { o começo do começo }
Web Design { o começo do começo }
Web Design { o começo do começo }




  Mas esse, só nasceu em 1996. Chamado
        inicialmente de BlackRub
Web Design { o começo do começo }
Também em 1995, é iniciado pela EMBRATEL
e o Ministério das Comunicações o
movimento de implantação de uma Rede
Nacional, integrada à rede global.
Web Design { o começo do começo }
Também em 1995, nasce o Comitê Gestor
Internet, que é responsável por:
● Fomentar o desenvolvimento de serviços
  INTERNET no Brasil;
● Recomendar padrões e procedimentos técnicos
  e operacionais para a INTERNET no Brasil;
● Coordenar a atribuição de endereços
  INTERNET, o registro de nomes de domínios, e
  a interconexão de espinhas dorsais;
● Coletar, organizar e disseminar informações
  sobre os serviços INTERNET.
Web Design { o começo do começo }
Mas e o Web Design?
Web Design { o começo do começo }
Bom, durante a evolução do hipertexto...
Web Design { o começo do começo }
Podemos destacar 4 fases até os dias atuais:
Web Design { o começo do começo }
1a. Fase: Era do Texto




http://www.library.cornell.edu/okuref/research/webeval.html
Web Design { o começo do começo }
2a. Fase: Texto, e pouquinho de imagens.




http://www.hitmill.com/internet/web_history.html
Web Design { o começo do começo }
A 2a. Fase, também foi marcada:
● Inicio da utilização dos ícones
● Botões com efeitos 3D
● Imagens substituindo os títulos
● Fundo dos sites com Imagens
● Hierarquia de conteúdo através de cores
Web Design { o começo do começo }
A 2a. Fase, também foi marcada:
● Inicio da utilização dos ícones
● Botões com efeitos 3D
● Imagens substituindo os títulos
● Fundo dos sites com Imagens
● Hierarquia de conteúdo através de cores


● e gif's animados. :P
Web Design { o começo do começo }
A 2a. Fase, também foi marcada:
● Inicio da utilização dos ícones
● Botões com efeitos 3D
● Imagens substituindo os títulos
● Fundo dos sites com Imagens
● Hierarquia de conteúdo através de cores

● e gif's animados. :P

   Os sites eram construídos utilizando tabelas.
Web Design { o começo do começo }
3a. Fase:
● Inicio da Guerra dos Browsers (Microsoft x
  Netscape)
● Conteúdo dinâmico.
● Os sites tinham como alvo atrair e
  comunicar de acordo com objetivos
  específicos.
● Web Designing estava em constante
  transição por conta das inúmeras
  tecnologias e recursos lançados; e a cada
  dia, novas limitações.
Web Design { o começo do começo }
3a. Fase: e chegam os designers gráficos!
Web Design { o começo do começo }
Web Design { o começo do começo }
3a. Fase: e então a moda também era:
● fazer e-commerces,
● sites com trilha sonora
Web Design { o começo do começo }
3a. Fase: e então a moda também era:
● fazer e-commerces,
● sites com trilha sonora


e o Flash Player começa a se popularizar...
Web Design { o começo do começo }
4a. Fase:
Web Design { o começo do começo }
4a. Fase:



 Foi como uma extensão da fase anterior, muitos
 profissionais apostavam de que TODA produção digital
 seria feita de multi-media e rich-content.
Web Design { o começo do começo }
4a. Fase:
Web Design { o começo do começo }
E então...
Web Design { o começo do começo }
Surge o termo Web 2.0, que pontua a Era de
uma internet focada na interação, nas redes
sociais; sendo encarada como uma
plataforma que suporta aplicativos e
sistemas altamente integrados e
complexos.
Web Design { o começo do começo }
A internet se populariza dia-a-dia;
O Google cresce;
Os sites começam a utilizar novas técnicas de
construção: o TABLELESS, que junto com o
CSS (folha de estilos), permite desenvolver
layouts mais ricos, pois abre-se a
possibilidades de trabalhar com inúmeras
variações de elementos visuais (cor, tamanho
do texto, fonte...)
Web Design { o começo do começo }
Web Design { o começo do começo }




                           http://www.csszengarden.com/
Web Design { o começo do começo }
Nos dias atuais, estamos caminhando na
evolução da Web 2.0...
Web Design { o começo do começo }




            http://www.soleilnoir.net/believein/
Web Design { o começo do começo }




{ continua... }

Mais conteúdo relacionado

Mais procurados

UX e UI - Experiência e Interface do Usuário
UX e UI - Experiência e Interface do UsuárioUX e UI - Experiência e Interface do Usuário
UX e UI - Experiência e Interface do UsuárioRenato Melo
 
Apresentação sobre TOGAF
Apresentação sobre TOGAFApresentação sobre TOGAF
Apresentação sobre TOGAFRodrigo Ferreira
 
Introdução ao Front-end no Desenvolvimento Web
Introdução ao Front-end no Desenvolvimento WebIntrodução ao Front-end no Desenvolvimento Web
Introdução ao Front-end no Desenvolvimento WebAnderson Luís Furlan
 
Aula 1 - Minicurso sobre Design Centrado no Usuário
Aula 1 - Minicurso sobre Design Centrado no UsuárioAula 1 - Minicurso sobre Design Centrado no Usuário
Aula 1 - Minicurso sobre Design Centrado no UsuárioErico Fileno
 
Introdução ao desenvolvimento da web.pptx
Introdução ao desenvolvimento da web.pptxIntrodução ao desenvolvimento da web.pptx
Introdução ao desenvolvimento da web.pptxMarceloRosenbrock1
 
Framework de automação de teste Robotium
Framework de automação de teste RobotiumFramework de automação de teste Robotium
Framework de automação de teste RobotiumBenicio Ávila
 
Fundamentos de Engenharia de Requisitos
Fundamentos de Engenharia de RequisitosFundamentos de Engenharia de Requisitos
Fundamentos de Engenharia de RequisitosBarbara Lima
 
Aula 1 - Introdução a Engenharia de Software
Aula 1 -  Introdução a Engenharia de SoftwareAula 1 -  Introdução a Engenharia de Software
Aula 1 - Introdução a Engenharia de SoftwareLeinylson Fontinele
 
Test-Driven Development - Introdução ao método de construção de software guia...
Test-Driven Development - Introdução ao método de construção de software guia...Test-Driven Development - Introdução ao método de construção de software guia...
Test-Driven Development - Introdução ao método de construção de software guia...Thiago Faria de Andrade
 
Método Aberto: Apresentação #1
Método Aberto: Apresentação #1Método Aberto: Apresentação #1
Método Aberto: Apresentação #1Marcio Duarte
 
Gerência de redes e computadores
Gerência de redes e computadoresGerência de redes e computadores
Gerência de redes e computadoresEduardo Junior
 
Modelo V - Desenvolvimento de Software
Modelo V - Desenvolvimento de SoftwareModelo V - Desenvolvimento de Software
Modelo V - Desenvolvimento de SoftwareBruno Bitencourt Luiz
 
Aula 4 - Gestão de Projetos
Aula 4 - Gestão de ProjetosAula 4 - Gestão de Projetos
Aula 4 - Gestão de ProjetosFernando Dantas
 

Mais procurados (20)

UX e UI - Experiência e Interface do Usuário
UX e UI - Experiência e Interface do UsuárioUX e UI - Experiência e Interface do Usuário
UX e UI - Experiência e Interface do Usuário
 
Web Design > Aula 00
Web Design > Aula 00Web Design > Aula 00
Web Design > Aula 00
 
Apresentação sobre TOGAF
Apresentação sobre TOGAFApresentação sobre TOGAF
Apresentação sobre TOGAF
 
Introdução ao Front-end no Desenvolvimento Web
Introdução ao Front-end no Desenvolvimento WebIntrodução ao Front-end no Desenvolvimento Web
Introdução ao Front-end no Desenvolvimento Web
 
Apresentação desenvolvimento de Games
Apresentação desenvolvimento de GamesApresentação desenvolvimento de Games
Apresentação desenvolvimento de Games
 
Aula 1 - Minicurso sobre Design Centrado no Usuário
Aula 1 - Minicurso sobre Design Centrado no UsuárioAula 1 - Minicurso sobre Design Centrado no Usuário
Aula 1 - Minicurso sobre Design Centrado no Usuário
 
Arquitetura de Software
Arquitetura de SoftwareArquitetura de Software
Arquitetura de Software
 
Computação Gráfica
Computação GráficaComputação Gráfica
Computação Gráfica
 
Introdução ao desenvolvimento da web.pptx
Introdução ao desenvolvimento da web.pptxIntrodução ao desenvolvimento da web.pptx
Introdução ao desenvolvimento da web.pptx
 
Framework de automação de teste Robotium
Framework de automação de teste RobotiumFramework de automação de teste Robotium
Framework de automação de teste Robotium
 
Projeto de WEB Site
Projeto de WEB SiteProjeto de WEB Site
Projeto de WEB Site
 
Fundamentos de Engenharia de Requisitos
Fundamentos de Engenharia de RequisitosFundamentos de Engenharia de Requisitos
Fundamentos de Engenharia de Requisitos
 
Design de Interface - Diretrizes
Design de Interface - DiretrizesDesign de Interface - Diretrizes
Design de Interface - Diretrizes
 
Aula 1 - Introdução a Engenharia de Software
Aula 1 -  Introdução a Engenharia de SoftwareAula 1 -  Introdução a Engenharia de Software
Aula 1 - Introdução a Engenharia de Software
 
Test-Driven Development - Introdução ao método de construção de software guia...
Test-Driven Development - Introdução ao método de construção de software guia...Test-Driven Development - Introdução ao método de construção de software guia...
Test-Driven Development - Introdução ao método de construção de software guia...
 
O que é gamificação
O que é gamificaçãoO que é gamificação
O que é gamificação
 
Método Aberto: Apresentação #1
Método Aberto: Apresentação #1Método Aberto: Apresentação #1
Método Aberto: Apresentação #1
 
Gerência de redes e computadores
Gerência de redes e computadoresGerência de redes e computadores
Gerência de redes e computadores
 
Modelo V - Desenvolvimento de Software
Modelo V - Desenvolvimento de SoftwareModelo V - Desenvolvimento de Software
Modelo V - Desenvolvimento de Software
 
Aula 4 - Gestão de Projetos
Aula 4 - Gestão de ProjetosAula 4 - Gestão de Projetos
Aula 4 - Gestão de Projetos
 

Destaque

Web Design > Gestalt e suas leis
Web Design > Gestalt e suas leisWeb Design > Gestalt e suas leis
Web Design > Gestalt e suas leisFelipe Fernandes
 
Web Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à GestaltWeb Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à GestaltFelipe Fernandes
 
A 3ª Área do Design: Web Design
A 3ª Área do Design: Web DesignA 3ª Área do Design: Web Design
A 3ª Área do Design: Web DesignGustavo Zimmermann
 
Slides minicurso Web Design
Slides minicurso Web DesignSlides minicurso Web Design
Slides minicurso Web DesignAna Mendes
 
Introdução a sistemas operacionais 001
Introdução a sistemas operacionais 001Introdução a sistemas operacionais 001
Introdução a sistemas operacionais 001ewerton333
 
So2 aula00-noite-1sem2011
So2 aula00-noite-1sem2011So2 aula00-noite-1sem2011
So2 aula00-noite-1sem2011Anderson Favaro
 
So2 aula00-cic4 ma446-quarta
So2 aula00-cic4 ma446-quartaSo2 aula00-cic4 ma446-quarta
So2 aula00-cic4 ma446-quartaAnderson Favaro
 
SO-01 Introdução aos Sistemas Operacionais
SO-01 Introdução aos Sistemas OperacionaisSO-01 Introdução aos Sistemas Operacionais
SO-01 Introdução aos Sistemas OperacionaisEduardo Nicola F. Zagari
 
Sistema computacional 3
Sistema computacional 3Sistema computacional 3
Sistema computacional 3marleneca97
 
Introducao aos Sistemas Operacionais
Introducao aos Sistemas OperacionaisIntroducao aos Sistemas Operacionais
Introducao aos Sistemas OperacionaisRicardo de Moraes
 
Web design e Programação front-end
Web design e Programação front-endWeb design e Programação front-end
Web design e Programação front-endAnderson Luís Furlan
 
Design para a web - da interface ao branding
Design para a web - da interface ao brandingDesign para a web - da interface ao branding
Design para a web - da interface ao brandingJoão Alves
 
Sistemas operacionais introdução
Sistemas operacionais introduçãoSistemas operacionais introdução
Sistemas operacionais introduçãoCarlos Melo
 
Sistemas Operacionais 2 -aula00
Sistemas Operacionais 2 -aula00Sistemas Operacionais 2 -aula00
Sistemas Operacionais 2 -aula00Anderson Favaro
 
Introducao a Sistemas Operacionais
Introducao a Sistemas OperacionaisIntroducao a Sistemas Operacionais
Introducao a Sistemas OperacionaisIsaac Vieira
 

Destaque (20)

Web Design > Gestalt e suas leis
Web Design > Gestalt e suas leisWeb Design > Gestalt e suas leis
Web Design > Gestalt e suas leis
 
Web Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à GestaltWeb Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à Gestalt
 
A 3ª Área do Design: Web Design
A 3ª Área do Design: Web DesignA 3ª Área do Design: Web Design
A 3ª Área do Design: Web Design
 
Conceitos e princípios de design
Conceitos e princípios de designConceitos e princípios de design
Conceitos e princípios de design
 
Slides minicurso Web Design
Slides minicurso Web DesignSlides minicurso Web Design
Slides minicurso Web Design
 
Web Design Responsivo
Web Design ResponsivoWeb Design Responsivo
Web Design Responsivo
 
Introdução a sistemas operacionais 001
Introdução a sistemas operacionais 001Introdução a sistemas operacionais 001
Introdução a sistemas operacionais 001
 
Sistema computacional (arquitecturas y memorias)
Sistema computacional (arquitecturas y memorias)Sistema computacional (arquitecturas y memorias)
Sistema computacional (arquitecturas y memorias)
 
So2 aula00-noite-1sem2011
So2 aula00-noite-1sem2011So2 aula00-noite-1sem2011
So2 aula00-noite-1sem2011
 
So2 aula00-cic4 ma446-quarta
So2 aula00-cic4 ma446-quartaSo2 aula00-cic4 ma446-quarta
So2 aula00-cic4 ma446-quarta
 
Aula 1 Webdesign
Aula 1 WebdesignAula 1 Webdesign
Aula 1 Webdesign
 
SO-01 Introdução aos Sistemas Operacionais
SO-01 Introdução aos Sistemas OperacionaisSO-01 Introdução aos Sistemas Operacionais
SO-01 Introdução aos Sistemas Operacionais
 
Sistema computacional 3
Sistema computacional 3Sistema computacional 3
Sistema computacional 3
 
Introducao aos Sistemas Operacionais
Introducao aos Sistemas OperacionaisIntroducao aos Sistemas Operacionais
Introducao aos Sistemas Operacionais
 
Web design e Programação front-end
Web design e Programação front-endWeb design e Programação front-end
Web design e Programação front-end
 
Design para a web - da interface ao branding
Design para a web - da interface ao brandingDesign para a web - da interface ao branding
Design para a web - da interface ao branding
 
Sistemas operacionais introdução
Sistemas operacionais introduçãoSistemas operacionais introdução
Sistemas operacionais introdução
 
Sistemas Operacionais 2 -aula00
Sistemas Operacionais 2 -aula00Sistemas Operacionais 2 -aula00
Sistemas Operacionais 2 -aula00
 
Introducao a Sistemas Operacionais
Introducao a Sistemas OperacionaisIntroducao a Sistemas Operacionais
Introducao a Sistemas Operacionais
 
Aula 4 - HTML
Aula 4 - HTMLAula 4 - HTML
Aula 4 - HTML
 

Semelhante a Web Design > História e a evolução do www

Apostila de web - Curso de Programação Básica de Internet
Apostila de web - Curso de Programação Básica de InternetApostila de web - Curso de Programação Básica de Internet
Apostila de web - Curso de Programação Básica de InternetClayton de Almeida Souza
 
Perspectivas De Desenvolvimento Para Web
Perspectivas De Desenvolvimento Para WebPerspectivas De Desenvolvimento Para Web
Perspectivas De Desenvolvimento Para WebLeandro Costa
 
Conceitos históricos e evolução dos websites
Conceitos históricos e evolução dos websitesConceitos históricos e evolução dos websites
Conceitos históricos e evolução dos websitesLuciano Crecente
 
Apostila html para-iniciantes
Apostila html para-iniciantesApostila html para-iniciantes
Apostila html para-iniciantesJeferson Souza
 
Html web denise_lima
Html web denise_limaHtml web denise_lima
Html web denise_limaDenise Lima
 
Curso T&T primeira parte
Curso T&T primeira parteCurso T&T primeira parte
Curso T&T primeira parteElis Monteiro
 
Desenvolvimento de Sistemas Web - Conceitos Básicos
Desenvolvimento de Sistemas Web - Conceitos BásicosDesenvolvimento de Sistemas Web - Conceitos Básicos
Desenvolvimento de Sistemas Web - Conceitos BásicosFabio Moura Pereira
 
História da internet
História da internetHistória da internet
História da internetCarlos Araujo
 
Aula internet historico-conceitos
Aula internet historico-conceitosAula internet historico-conceitos
Aula internet historico-conceitosneilaxavier
 
Desenvolvimento Ágil com Twitter Bootstrap
Desenvolvimento Ágil com Twitter BootstrapDesenvolvimento Ágil com Twitter Bootstrap
Desenvolvimento Ágil com Twitter BootstrapFlavio Souza
 
Web Semântica Apresentação de Slides
Web Semântica Apresentação de SlidesWeb Semântica Apresentação de Slides
Web Semântica Apresentação de Slidesgestao
 
História da Internet - Webdesign 2022
História da Internet - Webdesign 2022História da Internet - Webdesign 2022
História da Internet - Webdesign 2022Renato Melo
 
A origem e evolução da Internet
A origem e evolução da InternetA origem e evolução da Internet
A origem e evolução da InternetPepe Rocker
 
Tecnologia web aula 01
Tecnologia web  aula 01Tecnologia web  aula 01
Tecnologia web aula 01Manuel Ernesto
 

Semelhante a Web Design > História e a evolução do www (20)

Apostila de web - Curso de Programação Básica de Internet
Apostila de web - Curso de Programação Básica de InternetApostila de web - Curso de Programação Básica de Internet
Apostila de web - Curso de Programação Básica de Internet
 
Perspectivas De Desenvolvimento Para Web
Perspectivas De Desenvolvimento Para WebPerspectivas De Desenvolvimento Para Web
Perspectivas De Desenvolvimento Para Web
 
Conceitos históricos e evolução dos websites
Conceitos históricos e evolução dos websitesConceitos históricos e evolução dos websites
Conceitos históricos e evolução dos websites
 
World Wide Web 1
World Wide Web 1World Wide Web 1
World Wide Web 1
 
Apostila webdesign
Apostila webdesignApostila webdesign
Apostila webdesign
 
Apostila html para-iniciantes
Apostila html para-iniciantesApostila html para-iniciantes
Apostila html para-iniciantes
 
Html web denise_lima
Html web denise_limaHtml web denise_lima
Html web denise_lima
 
Internet
InternetInternet
Internet
 
Curso T&T primeira parte
Curso T&T primeira parteCurso T&T primeira parte
Curso T&T primeira parte
 
T&T
T&TT&T
T&T
 
Desenvolvimento de Sistemas Web - Conceitos Básicos
Desenvolvimento de Sistemas Web - Conceitos BásicosDesenvolvimento de Sistemas Web - Conceitos Básicos
Desenvolvimento de Sistemas Web - Conceitos Básicos
 
Projeto para WEB
Projeto para WEBProjeto para WEB
Projeto para WEB
 
História da internet
História da internetHistória da internet
História da internet
 
Aula internet historico-conceitos
Aula internet historico-conceitosAula internet historico-conceitos
Aula internet historico-conceitos
 
Desenvolvimento Ágil com Twitter Bootstrap
Desenvolvimento Ágil com Twitter BootstrapDesenvolvimento Ágil com Twitter Bootstrap
Desenvolvimento Ágil com Twitter Bootstrap
 
Trabalho de informarica.docx
Trabalho de informarica.docxTrabalho de informarica.docx
Trabalho de informarica.docx
 
Web Semântica Apresentação de Slides
Web Semântica Apresentação de SlidesWeb Semântica Apresentação de Slides
Web Semântica Apresentação de Slides
 
História da Internet - Webdesign 2022
História da Internet - Webdesign 2022História da Internet - Webdesign 2022
História da Internet - Webdesign 2022
 
A origem e evolução da Internet
A origem e evolução da InternetA origem e evolução da Internet
A origem e evolução da Internet
 
Tecnologia web aula 01
Tecnologia web  aula 01Tecnologia web  aula 01
Tecnologia web aula 01
 

Mais de Felipe Fernandes

Code Club Brasil na Campus Party Brasil 8 #cpbr8
Code Club Brasil na Campus Party Brasil 8 #cpbr8 Code Club Brasil na Campus Party Brasil 8 #cpbr8
Code Club Brasil na Campus Party Brasil 8 #cpbr8 Felipe Fernandes
 
Code Club Apresentação 2014
Code Club Apresentação 2014Code Club Apresentação 2014
Code Club Apresentação 2014Felipe Fernandes
 
Code Club - Aprender a programar pode ser divertido?
Code Club - Aprender a programar pode ser divertido?Code Club - Aprender a programar pode ser divertido?
Code Club - Aprender a programar pode ser divertido?Felipe Fernandes
 
Web Design > Movimentos artisticos
Web Design > Movimentos artisticosWeb Design > Movimentos artisticos
Web Design > Movimentos artisticosFelipe Fernandes
 
Web Design > html (aula 2)
Web Design > html (aula 2)Web Design > html (aula 2)
Web Design > html (aula 2)Felipe Fernandes
 
Web Design > HTML (aula 1)
Web Design > HTML (aula 1)Web Design > HTML (aula 1)
Web Design > HTML (aula 1)Felipe Fernandes
 
Web Design > Formatos de arquivos para web
Web Design > Formatos de arquivos para webWeb Design > Formatos de arquivos para web
Web Design > Formatos de arquivos para webFelipe Fernandes
 
Web Design > Visão geral do Web Design
Web Design > Visão geral do Web DesignWeb Design > Visão geral do Web Design
Web Design > Visão geral do Web DesignFelipe Fernandes
 

Mais de Felipe Fernandes (13)

Code Club Brasil #2015
Code Club Brasil #2015Code Club Brasil #2015
Code Club Brasil #2015
 
Code Club Brasil na Campus Party Brasil 8 #cpbr8
Code Club Brasil na Campus Party Brasil 8 #cpbr8 Code Club Brasil na Campus Party Brasil 8 #cpbr8
Code Club Brasil na Campus Party Brasil 8 #cpbr8
 
Code Club Apresentação 2014
Code Club Apresentação 2014Code Club Apresentação 2014
Code Club Apresentação 2014
 
Code Club - Aprender a programar pode ser divertido?
Code Club - Aprender a programar pode ser divertido?Code Club - Aprender a programar pode ser divertido?
Code Club - Aprender a programar pode ser divertido?
 
CodeClub
CodeClubCodeClub
CodeClub
 
Web Design > Movimentos artisticos
Web Design > Movimentos artisticosWeb Design > Movimentos artisticos
Web Design > Movimentos artisticos
 
Web Design > html (aula 2)
Web Design > html (aula 2)Web Design > html (aula 2)
Web Design > html (aula 2)
 
Web Design > HTML (aula 1)
Web Design > HTML (aula 1)Web Design > HTML (aula 1)
Web Design > HTML (aula 1)
 
Web Design > Tipografia
Web Design > TipografiaWeb Design > Tipografia
Web Design > Tipografia
 
Web Design > Cores
Web Design > CoresWeb Design > Cores
Web Design > Cores
 
Web Design > Formatos de arquivos para web
Web Design > Formatos de arquivos para webWeb Design > Formatos de arquivos para web
Web Design > Formatos de arquivos para web
 
Web Design > Usabilidade
Web Design > UsabilidadeWeb Design > Usabilidade
Web Design > Usabilidade
 
Web Design > Visão geral do Web Design
Web Design > Visão geral do Web DesignWeb Design > Visão geral do Web Design
Web Design > Visão geral do Web Design
 

Último

QUIZ DE MATEMATICA SHOW DO MILHÃO PREPARAÇÃO ÇPARA AVALIAÇÕES EXTERNAS
QUIZ DE MATEMATICA SHOW DO MILHÃO PREPARAÇÃO ÇPARA AVALIAÇÕES EXTERNASQUIZ DE MATEMATICA SHOW DO MILHÃO PREPARAÇÃO ÇPARA AVALIAÇÕES EXTERNAS
QUIZ DE MATEMATICA SHOW DO MILHÃO PREPARAÇÃO ÇPARA AVALIAÇÕES EXTERNASEdinardo Aguiar
 
Investimentos. EDUCAÇÃO FINANCEIRA 8º ANO
Investimentos. EDUCAÇÃO FINANCEIRA 8º ANOInvestimentos. EDUCAÇÃO FINANCEIRA 8º ANO
Investimentos. EDUCAÇÃO FINANCEIRA 8º ANOMarcosViniciusLemesL
 
HORA DO CONTO3_BECRE D. CARLOS I_2023_2024
HORA DO CONTO3_BECRE D. CARLOS I_2023_2024HORA DO CONTO3_BECRE D. CARLOS I_2023_2024
HORA DO CONTO3_BECRE D. CARLOS I_2023_2024Sandra Pratas
 
Gerenciando a Aprendizagem Organizacional
Gerenciando a Aprendizagem OrganizacionalGerenciando a Aprendizagem Organizacional
Gerenciando a Aprendizagem OrganizacionalJacqueline Cerqueira
 
Mesoamérica.Astecas,inca,maias , olmecas
Mesoamérica.Astecas,inca,maias , olmecasMesoamérica.Astecas,inca,maias , olmecas
Mesoamérica.Astecas,inca,maias , olmecasRicardo Diniz campos
 
637743470-Mapa-Mental-Portugue-s-1.pdf 4 ano
637743470-Mapa-Mental-Portugue-s-1.pdf 4 ano637743470-Mapa-Mental-Portugue-s-1.pdf 4 ano
637743470-Mapa-Mental-Portugue-s-1.pdf 4 anoAdelmaTorres2
 
Slide de exemplo sobre o Sítio do Pica Pau Amarelo.pptx
Slide de exemplo sobre o Sítio do Pica Pau Amarelo.pptxSlide de exemplo sobre o Sítio do Pica Pau Amarelo.pptx
Slide de exemplo sobre o Sítio do Pica Pau Amarelo.pptxconcelhovdragons
 
Aula - 2º Ano - Cultura e Sociedade - Conceitos-chave
Aula - 2º Ano - Cultura e Sociedade - Conceitos-chaveAula - 2º Ano - Cultura e Sociedade - Conceitos-chave
Aula - 2º Ano - Cultura e Sociedade - Conceitos-chaveaulasgege
 
ÁREA DE FIGURAS PLANAS - DESCRITOR DE MATEMATICA D12 ENSINO MEDIO.pptx
ÁREA DE FIGURAS PLANAS - DESCRITOR DE MATEMATICA D12 ENSINO MEDIO.pptxÁREA DE FIGURAS PLANAS - DESCRITOR DE MATEMATICA D12 ENSINO MEDIO.pptx
ÁREA DE FIGURAS PLANAS - DESCRITOR DE MATEMATICA D12 ENSINO MEDIO.pptxDeyvidBriel
 
geografia 7 ano - relevo, altitude, topos do mundo
geografia 7 ano - relevo, altitude, topos do mundogeografia 7 ano - relevo, altitude, topos do mundo
geografia 7 ano - relevo, altitude, topos do mundonialb
 
Cultura e Sociedade - Texto de Apoio.pdf
Cultura e Sociedade - Texto de Apoio.pdfCultura e Sociedade - Texto de Apoio.pdf
Cultura e Sociedade - Texto de Apoio.pdfaulasgege
 
Bingo da potenciação e radiciação de números inteiros
Bingo da potenciação e radiciação de números inteirosBingo da potenciação e radiciação de números inteiros
Bingo da potenciação e radiciação de números inteirosAntnyoAllysson
 
Atividade com a letra da música Meu Abrigo
Atividade com a letra da música Meu AbrigoAtividade com a letra da música Meu Abrigo
Atividade com a letra da música Meu AbrigoMary Alvarenga
 
BRASIL - DOMÍNIOS MORFOCLIMÁTICOS - Fund 2.pdf
BRASIL - DOMÍNIOS MORFOCLIMÁTICOS - Fund 2.pdfBRASIL - DOMÍNIOS MORFOCLIMÁTICOS - Fund 2.pdf
BRASIL - DOMÍNIOS MORFOCLIMÁTICOS - Fund 2.pdfHenrique Pontes
 
Habilidades Motoras Básicas e Específicas
Habilidades Motoras Básicas e EspecíficasHabilidades Motoras Básicas e Específicas
Habilidades Motoras Básicas e EspecíficasCassio Meira Jr.
 
Guia completo da Previdênci a - Reforma .pdf
Guia completo da Previdênci a - Reforma .pdfGuia completo da Previdênci a - Reforma .pdf
Guia completo da Previdênci a - Reforma .pdfEyshilaKelly1
 
DIA DO INDIO - FLIPBOOK PARA IMPRIMIR.pdf
DIA DO INDIO - FLIPBOOK PARA IMPRIMIR.pdfDIA DO INDIO - FLIPBOOK PARA IMPRIMIR.pdf
DIA DO INDIO - FLIPBOOK PARA IMPRIMIR.pdfIedaGoethe
 
HORA DO CONTO4_BECRE D. CARLOS I_2023_2024
HORA DO CONTO4_BECRE D. CARLOS I_2023_2024HORA DO CONTO4_BECRE D. CARLOS I_2023_2024
HORA DO CONTO4_BECRE D. CARLOS I_2023_2024Sandra Pratas
 
Sociologia Contemporânea - Uma Abordagem dos principais autores
Sociologia Contemporânea - Uma Abordagem dos principais autoresSociologia Contemporânea - Uma Abordagem dos principais autores
Sociologia Contemporânea - Uma Abordagem dos principais autoresaulasgege
 

Último (20)

QUIZ DE MATEMATICA SHOW DO MILHÃO PREPARAÇÃO ÇPARA AVALIAÇÕES EXTERNAS
QUIZ DE MATEMATICA SHOW DO MILHÃO PREPARAÇÃO ÇPARA AVALIAÇÕES EXTERNASQUIZ DE MATEMATICA SHOW DO MILHÃO PREPARAÇÃO ÇPARA AVALIAÇÕES EXTERNAS
QUIZ DE MATEMATICA SHOW DO MILHÃO PREPARAÇÃO ÇPARA AVALIAÇÕES EXTERNAS
 
Investimentos. EDUCAÇÃO FINANCEIRA 8º ANO
Investimentos. EDUCAÇÃO FINANCEIRA 8º ANOInvestimentos. EDUCAÇÃO FINANCEIRA 8º ANO
Investimentos. EDUCAÇÃO FINANCEIRA 8º ANO
 
HORA DO CONTO3_BECRE D. CARLOS I_2023_2024
HORA DO CONTO3_BECRE D. CARLOS I_2023_2024HORA DO CONTO3_BECRE D. CARLOS I_2023_2024
HORA DO CONTO3_BECRE D. CARLOS I_2023_2024
 
Gerenciando a Aprendizagem Organizacional
Gerenciando a Aprendizagem OrganizacionalGerenciando a Aprendizagem Organizacional
Gerenciando a Aprendizagem Organizacional
 
Mesoamérica.Astecas,inca,maias , olmecas
Mesoamérica.Astecas,inca,maias , olmecasMesoamérica.Astecas,inca,maias , olmecas
Mesoamérica.Astecas,inca,maias , olmecas
 
637743470-Mapa-Mental-Portugue-s-1.pdf 4 ano
637743470-Mapa-Mental-Portugue-s-1.pdf 4 ano637743470-Mapa-Mental-Portugue-s-1.pdf 4 ano
637743470-Mapa-Mental-Portugue-s-1.pdf 4 ano
 
Slide de exemplo sobre o Sítio do Pica Pau Amarelo.pptx
Slide de exemplo sobre o Sítio do Pica Pau Amarelo.pptxSlide de exemplo sobre o Sítio do Pica Pau Amarelo.pptx
Slide de exemplo sobre o Sítio do Pica Pau Amarelo.pptx
 
Aula - 2º Ano - Cultura e Sociedade - Conceitos-chave
Aula - 2º Ano - Cultura e Sociedade - Conceitos-chaveAula - 2º Ano - Cultura e Sociedade - Conceitos-chave
Aula - 2º Ano - Cultura e Sociedade - Conceitos-chave
 
XI OLIMPÍADAS DA LÍNGUA PORTUGUESA -
XI OLIMPÍADAS DA LÍNGUA PORTUGUESA      -XI OLIMPÍADAS DA LÍNGUA PORTUGUESA      -
XI OLIMPÍADAS DA LÍNGUA PORTUGUESA -
 
ÁREA DE FIGURAS PLANAS - DESCRITOR DE MATEMATICA D12 ENSINO MEDIO.pptx
ÁREA DE FIGURAS PLANAS - DESCRITOR DE MATEMATICA D12 ENSINO MEDIO.pptxÁREA DE FIGURAS PLANAS - DESCRITOR DE MATEMATICA D12 ENSINO MEDIO.pptx
ÁREA DE FIGURAS PLANAS - DESCRITOR DE MATEMATICA D12 ENSINO MEDIO.pptx
 
geografia 7 ano - relevo, altitude, topos do mundo
geografia 7 ano - relevo, altitude, topos do mundogeografia 7 ano - relevo, altitude, topos do mundo
geografia 7 ano - relevo, altitude, topos do mundo
 
Cultura e Sociedade - Texto de Apoio.pdf
Cultura e Sociedade - Texto de Apoio.pdfCultura e Sociedade - Texto de Apoio.pdf
Cultura e Sociedade - Texto de Apoio.pdf
 
Bingo da potenciação e radiciação de números inteiros
Bingo da potenciação e radiciação de números inteirosBingo da potenciação e radiciação de números inteiros
Bingo da potenciação e radiciação de números inteiros
 
Atividade com a letra da música Meu Abrigo
Atividade com a letra da música Meu AbrigoAtividade com a letra da música Meu Abrigo
Atividade com a letra da música Meu Abrigo
 
BRASIL - DOMÍNIOS MORFOCLIMÁTICOS - Fund 2.pdf
BRASIL - DOMÍNIOS MORFOCLIMÁTICOS - Fund 2.pdfBRASIL - DOMÍNIOS MORFOCLIMÁTICOS - Fund 2.pdf
BRASIL - DOMÍNIOS MORFOCLIMÁTICOS - Fund 2.pdf
 
Habilidades Motoras Básicas e Específicas
Habilidades Motoras Básicas e EspecíficasHabilidades Motoras Básicas e Específicas
Habilidades Motoras Básicas e Específicas
 
Guia completo da Previdênci a - Reforma .pdf
Guia completo da Previdênci a - Reforma .pdfGuia completo da Previdênci a - Reforma .pdf
Guia completo da Previdênci a - Reforma .pdf
 
DIA DO INDIO - FLIPBOOK PARA IMPRIMIR.pdf
DIA DO INDIO - FLIPBOOK PARA IMPRIMIR.pdfDIA DO INDIO - FLIPBOOK PARA IMPRIMIR.pdf
DIA DO INDIO - FLIPBOOK PARA IMPRIMIR.pdf
 
HORA DO CONTO4_BECRE D. CARLOS I_2023_2024
HORA DO CONTO4_BECRE D. CARLOS I_2023_2024HORA DO CONTO4_BECRE D. CARLOS I_2023_2024
HORA DO CONTO4_BECRE D. CARLOS I_2023_2024
 
Sociologia Contemporânea - Uma Abordagem dos principais autores
Sociologia Contemporânea - Uma Abordagem dos principais autoresSociologia Contemporânea - Uma Abordagem dos principais autores
Sociologia Contemporânea - Uma Abordagem dos principais autores
 

Web Design > História e a evolução do www

  • 2. Web Design { o começo do começo } 1965 Dois computadores no laboratório Lincoln do MIT conversam entre si usando a tecnologia de troca de pacotes.
  • 3. Web Design { o começo do começo } Na verdade foi assim...
  • 4. Web Design { o começo do começo } 1969 Criação da ARPANET, a primeira rede de computadores à base de troca de pacotes ,a percursora da Internet. Os primeiros computadores conectados em rede entre a Universidade da Califórnia e o Stanford Research Institute .Estava criado a ARPANET, primeira rede.
  • 5. Web Design { o começo do começo } O plano infalível...
  • 6. Web Design { o começo do começo } Mas na prática foi assim...
  • 7. Web Design { o começo do começo } Daí então veio: ● o email ● a primeira conexão internacional ● um novo protocolo de conexão (o TCP)
  • 8. Web Design { o começo do começo } Em 1980, o hipertexto e o que se tornaria a World Wide Web como conhecemos. O projeto se chamava "ENQUIRE", do físico da CERN Tim Berners-Lee, e tinha como objetivo tornar mais fácil a troca de informações entre as faculdades. * CERN - Organização Européia de Pesquisas Nucleares
  • 9. Web Design { o começo do começo } Em 1988, a UFRJ conectou-se à UCLA (Universidade da Califórnia)
  • 10. Web Design { o começo do começo } Em 1993, nasce o primeiro browser, o Mosaic.
  • 11. Web Design { o começo do começo } E no ano seguinte, o Netscape.
  • 12. Web Design { o começo do começo } E no ano seguinte, o Netscape. São os mesmos criadores do Mosaic: Marc Andreesen e Eric Bina no National Center for Supercomputing Applications (NCSA) da Universidade de Illinois (Champaign-Urbana).
  • 13. Web Design { o começo do começo } E em 1995, nasce o pioneiro na indexação de conteúdo na Internet; o Altavista.
  • 14. Web Design { o começo do começo }
  • 15. Web Design { o começo do começo } Parecido com um outro, né?
  • 16. Web Design { o começo do começo }
  • 17. Web Design { o começo do começo }
  • 18. Web Design { o começo do começo } Mas esse, só nasceu em 1996. Chamado inicialmente de BlackRub
  • 19. Web Design { o começo do começo } Também em 1995, é iniciado pela EMBRATEL e o Ministério das Comunicações o movimento de implantação de uma Rede Nacional, integrada à rede global.
  • 20. Web Design { o começo do começo } Também em 1995, nasce o Comitê Gestor Internet, que é responsável por: ● Fomentar o desenvolvimento de serviços INTERNET no Brasil; ● Recomendar padrões e procedimentos técnicos e operacionais para a INTERNET no Brasil; ● Coordenar a atribuição de endereços INTERNET, o registro de nomes de domínios, e a interconexão de espinhas dorsais; ● Coletar, organizar e disseminar informações sobre os serviços INTERNET.
  • 21. Web Design { o começo do começo } Mas e o Web Design?
  • 22. Web Design { o começo do começo } Bom, durante a evolução do hipertexto...
  • 23. Web Design { o começo do começo } Podemos destacar 4 fases até os dias atuais:
  • 24. Web Design { o começo do começo } 1a. Fase: Era do Texto http://www.library.cornell.edu/okuref/research/webeval.html
  • 25. Web Design { o começo do começo } 2a. Fase: Texto, e pouquinho de imagens. http://www.hitmill.com/internet/web_history.html
  • 26. Web Design { o começo do começo } A 2a. Fase, também foi marcada: ● Inicio da utilização dos ícones ● Botões com efeitos 3D ● Imagens substituindo os títulos ● Fundo dos sites com Imagens ● Hierarquia de conteúdo através de cores
  • 27. Web Design { o começo do começo } A 2a. Fase, também foi marcada: ● Inicio da utilização dos ícones ● Botões com efeitos 3D ● Imagens substituindo os títulos ● Fundo dos sites com Imagens ● Hierarquia de conteúdo através de cores ● e gif's animados. :P
  • 28. Web Design { o começo do começo } A 2a. Fase, também foi marcada: ● Inicio da utilização dos ícones ● Botões com efeitos 3D ● Imagens substituindo os títulos ● Fundo dos sites com Imagens ● Hierarquia de conteúdo através de cores ● e gif's animados. :P Os sites eram construídos utilizando tabelas.
  • 29. Web Design { o começo do começo } 3a. Fase: ● Inicio da Guerra dos Browsers (Microsoft x Netscape) ● Conteúdo dinâmico. ● Os sites tinham como alvo atrair e comunicar de acordo com objetivos específicos. ● Web Designing estava em constante transição por conta das inúmeras tecnologias e recursos lançados; e a cada dia, novas limitações.
  • 30. Web Design { o começo do começo } 3a. Fase: e chegam os designers gráficos!
  • 31. Web Design { o começo do começo }
  • 32. Web Design { o começo do começo } 3a. Fase: e então a moda também era: ● fazer e-commerces, ● sites com trilha sonora
  • 33. Web Design { o começo do começo } 3a. Fase: e então a moda também era: ● fazer e-commerces, ● sites com trilha sonora e o Flash Player começa a se popularizar...
  • 34. Web Design { o começo do começo } 4a. Fase:
  • 35. Web Design { o começo do começo } 4a. Fase: Foi como uma extensão da fase anterior, muitos profissionais apostavam de que TODA produção digital seria feita de multi-media e rich-content.
  • 36. Web Design { o começo do começo } 4a. Fase:
  • 37. Web Design { o começo do começo } E então...
  • 38. Web Design { o começo do começo } Surge o termo Web 2.0, que pontua a Era de uma internet focada na interação, nas redes sociais; sendo encarada como uma plataforma que suporta aplicativos e sistemas altamente integrados e complexos.
  • 39. Web Design { o começo do começo } A internet se populariza dia-a-dia; O Google cresce; Os sites começam a utilizar novas técnicas de construção: o TABLELESS, que junto com o CSS (folha de estilos), permite desenvolver layouts mais ricos, pois abre-se a possibilidades de trabalhar com inúmeras variações de elementos visuais (cor, tamanho do texto, fonte...)
  • 40. Web Design { o começo do começo }
  • 41. Web Design { o começo do começo } http://www.csszengarden.com/
  • 42. Web Design { o começo do começo } Nos dias atuais, estamos caminhando na evolução da Web 2.0...
  • 43. Web Design { o começo do começo } http://www.soleilnoir.net/believein/
  • 44. Web Design { o começo do começo } { continua... }