DESENVOLVIMENTO E
           DESIGN DE WEBSITES 1
                                  1

                            PROFESSORES:
                       LUCIANO SBRAGI CRECENTE
                       GABRIEL PHELIPE TEIXEIRA




LUCIANO.CRECENTE@ETEC.SP.GOV.BR
O que é um site?
                                   2

 Um website, site, saite, sítio eletrônico (português
  brasileiro) ou sítio, sítio eletrónico/web/da
  internet (português europeu) é um conjunto de páginas
  web, isto é, de hipertextos acessíveis geralmente pelo
  protocolo HTTP na Internet.
 O conjunto de todos os sites públicos existentes compõe
  a World Wide Web.
 As páginas num site são organizadas a partir de
  um URL básico, ou sítio, onde fica a página principal, e
  geralmente residem no mesmo diretório de um servidor.
  (fonte: Wikipédia)

LUCIANO.CRECENTE@ETEC.SP.GOV.BR
Origem do nome
                                  3

 Quando a World Wide Web foi criada no CERN, ela
  recebeu esse nome de seu criador Tim Berners-Lee.
 Ele comparou a sua criação com uma teia, "web" em
  inglês. Cada nó dessa teia é um local (virtual) onde
  há hipertextos. Como a palavra inglesa para local
  é site (também derivada do latim situs: "lugar,
  local"), quando as pessoas queriam se referir a um
  local da teia, elas falavam, web site.
 Assim um novo nome surgiu para designar esse novo
  conceito de nó onde há um conjunto de
  hipertextos: Web site. (fonte: Wikipédia)

LUCIANO.CRECENTE@ETEC.SP.GOV.BR
Visão geral
                                       4

 Sites são escritos em, ou dinamicamente convertidos
  para HTML e acessados usando um software cliente
  chamado web browser ou navegador.
 Sites consistem de páginas HTML estáticas ou páginas
  criadas dinamicamente usando tecnologias
  como JSP, PHP ou ASP.
 Um site também requer um software conhecido
  como servidor web, como o Apache (Linux), o mais
  usado, ou o IIS (Windows).
 Frequentemente sites possuem também conteúdo
  armazenado em banco de dados (base de dados). (fonte:
  Wikipédia)

LUCIANO.CRECENTE@ETEC.SP.GOV.BR
Propósitos dos Sites
                                  5

 Institucional: muitas empresas usam seus sites como ponto
  de contato entre uma instituição e seus clientes, fornecedores,
  etc. No caso de instituições comerciais, usam-se sites também
  para comércio eletrônico, recrutamento de funcionários etc.
  Instituições sem fins lucrativos também usam seus sites para
  divulgarem seus trabalhos, informarem a respeito de eventos
  etc. Há também o caso dos sites mantidos por profissionais
  liberais, para publicarem seus trabalhos.
 Informações: veículos de comunicação como jornais,
  revistas e agências de notícias utilizam a Internet para
  veicular notícias, por meio de seus sites.
  Jornalistas freelancer e indivíduos comuns também publicam
  informações na Internet, por meio de blogs e podcasts.
LUCIANO.CRECENTE@ETEC.SP.GOV.BR
Propósitos dos Sites
                                  6

 Armazenagem de informações: alguns sites
  funcionam como bancos de dados, que catalogam
  registros e permitem efetuar buscas, podendo incluir
  áudio, vídeo, imagens,softwares, mercadorias, ou mesmo
  outros sites. Alguns exemplos são os sites de busca, os
  catálogos na Internet, e os Wikis, que aceitam tanto
  leitura quanto escrita.
 Aplicações: existem sites cujo conteúdo consiste de
  ferramentas de automatização, produtividade e
  compartilhamento, substituindo aplicações de desktop.
  Podem ser processadores de texto, planilhas eletrônicas,
  editores de imagem, softwares de correio eletrônico,
  agendas, etc. (fonte: Wikipédia)


LUCIANO.CRECENTE@ETEC.SP.GOV.BR
Propósitos dos Sites
                                  7

 Comunitário: são os sites que servem para a
  comunicação de usuários com outros usuários da
  rede. Nesta categoria se encontram os chats, fóruns
  e sites de relacionamento.
 Portais: são chamados de "portais" os sites que
  congregam conteúdos de diversos tipos entre os
  demais tipos, geralmente fornecidos por uma mesma
  empresa. Recebem esse nome por congregarem a
  grande maioria dos serviços da Internet num mesmo
  local. (fonte: Wikipédia)

LUCIANO.CRECENTE@ETEC.SP.GOV.BR
A evolução da Web
                                  8

 Pré-Web
 Passado (web 1.0)
 Presente (web 2.0)
 Futuro (web 3.0)




LUCIANO.CRECENTE@ETEC.SP.GOV.BR
Fase pré-Web
                                   9

 Tentativa de tornar a internet útil, mas ...
 os serviços de informação oferecidos eram pequenos
    espaços e...
   os usuários navegavam restritos a esses espaços
   Soluções eram proprietárias e as plataformas não-
    abertas
   CompuServe
   AOL
   Prodigy

LUCIANO.CRECENTE@ETEC.SP.GOV.BR
O passado da Web (web 1.0)
                                  10

 Hiperlinkagem em documentos
 Tim Berners Lee inventou a Web em 1989. Sua
  genialidade foi criar e juntar três simples
  tecnologias, mas muito elegantes:
 Localizador ou Identificador Uniforme de Recursos
  (URL ou URI)
  para identificar recursos (por exemplo, documentos, dados)
  na Web, e saber onde encontrá-los.
 Hypertext Markup Language (HTML)
  linguagem para representar o conteúdo em termos de
  páginas na Web e de expressá-las em links.
 Hypertext Transfer Protocol (HTTP)
  protocolo para mover dados na Web e em toda a Internet.

LUCIANO.CRECENTE@ETEC.SP.GOV.BR
O passado da Web (web 1.0)
                                  11




LUCIANO.CRECENTE@ETEC.SP.GOV.BR
O passado da Web (web 1.0)
                                  12



  ... além disso Tim Berners Lee percebeu logo cedo que
   havia um quarto componente para que a Web alcançasse
   sucesso ... Tecnologia aberta e disponibilizada
   gratuitamente para todos
  Em 1998, Google inovou com um algoritmo que trouxe
   melhora significativa no desempenho e simplicidade das
   pesquisas na Web, baseando-se no poder da linguagem
   padrão HTML.
  As pesquisas no Google trouxeram mais expectativas e
   hiperlinkagens no uso da WEB, relacionando pessoas,
   produtos, serviços. Criando novas interações e novos
   mercados.
LUCIANO.CRECENTE@ETEC.SP.GOV.BR
O presente da Web (web 2.0)
                                       13

 A Web cresceu muito e rapidamente ...
 mais de 100 milhões de sites ativos
 mais de 1 bilhão de pessoas acessam a Web de:
  Hiperlinkagem de documentos; para: Conteúdo
  dinâmico gerado pelos usuários




                            ~ 80 milhões de vídeos
                            ~ 4 milhões de usuários

LUCIANO.CRECENTE@ETEC.SP.GOV.BR
O presente da Web (web 2.0)
                                  14




LUCIANO.CRECENTE@ETEC.SP.GOV.BR
O presente da Web (web 2.0)
                                  15


  Wikipédia: + de 2.400.000 artigos




LUCIANO.CRECENTE@ETEC.SP.GOV.BR
O presente da Web (web 2.0)
                                  16

 A web 2.0 está mais próxima da visão original de
  Tim Berners Lee ... a Web como verdadeira
  colaboração, meio de interação, comunicação global
  e compartilhamento de informações.




LUCIANO.CRECENTE@ETEC.SP.GOV.BR
O futuro da Web (web 3.0)
                                  17

 A próxima evolução na Web, se não for uma revolução, será a da
   linkagem de dados e dispositivos.
 Novas formas de integração e de combinação de dados para
   conseguir informações e idéias nunca antes possível.
 novas maneiras de conectar à Internet através de uma variedade de
   dispositivos capazes de pesquisar, combinar e analisar os dados.
 o W3C busca padronizar as tecnologias emergentes que permitirão a
   Web 3,0 se tornar uma realidade
 Web Semântica (identificando o perfil do usuário)
 Vídeo na Web
 Web Móvel
 Web Ubíqua ( a onipresença da informática no cotidiano das
   pessoas, acessível de qualquer lugar e dispositivo)
(fonte: w3c.br)


LUCIANO.CRECENTE@ETEC.SP.GOV.BR

Conceitos históricos e evolução dos websites

  • 1.
    DESENVOLVIMENTO E DESIGN DE WEBSITES 1 1 PROFESSORES: LUCIANO SBRAGI CRECENTE GABRIEL PHELIPE TEIXEIRA LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 2.
    O que éum site? 2  Um website, site, saite, sítio eletrônico (português brasileiro) ou sítio, sítio eletrónico/web/da internet (português europeu) é um conjunto de páginas web, isto é, de hipertextos acessíveis geralmente pelo protocolo HTTP na Internet.  O conjunto de todos os sites públicos existentes compõe a World Wide Web.  As páginas num site são organizadas a partir de um URL básico, ou sítio, onde fica a página principal, e geralmente residem no mesmo diretório de um servidor. (fonte: Wikipédia) LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 3.
    Origem do nome 3  Quando a World Wide Web foi criada no CERN, ela recebeu esse nome de seu criador Tim Berners-Lee.  Ele comparou a sua criação com uma teia, "web" em inglês. Cada nó dessa teia é um local (virtual) onde há hipertextos. Como a palavra inglesa para local é site (também derivada do latim situs: "lugar, local"), quando as pessoas queriam se referir a um local da teia, elas falavam, web site.  Assim um novo nome surgiu para designar esse novo conceito de nó onde há um conjunto de hipertextos: Web site. (fonte: Wikipédia) LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 4.
    Visão geral 4  Sites são escritos em, ou dinamicamente convertidos para HTML e acessados usando um software cliente chamado web browser ou navegador.  Sites consistem de páginas HTML estáticas ou páginas criadas dinamicamente usando tecnologias como JSP, PHP ou ASP.  Um site também requer um software conhecido como servidor web, como o Apache (Linux), o mais usado, ou o IIS (Windows).  Frequentemente sites possuem também conteúdo armazenado em banco de dados (base de dados). (fonte: Wikipédia) LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 5.
    Propósitos dos Sites 5  Institucional: muitas empresas usam seus sites como ponto de contato entre uma instituição e seus clientes, fornecedores, etc. No caso de instituições comerciais, usam-se sites também para comércio eletrônico, recrutamento de funcionários etc. Instituições sem fins lucrativos também usam seus sites para divulgarem seus trabalhos, informarem a respeito de eventos etc. Há também o caso dos sites mantidos por profissionais liberais, para publicarem seus trabalhos.  Informações: veículos de comunicação como jornais, revistas e agências de notícias utilizam a Internet para veicular notícias, por meio de seus sites. Jornalistas freelancer e indivíduos comuns também publicam informações na Internet, por meio de blogs e podcasts. LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 6.
    Propósitos dos Sites 6  Armazenagem de informações: alguns sites funcionam como bancos de dados, que catalogam registros e permitem efetuar buscas, podendo incluir áudio, vídeo, imagens,softwares, mercadorias, ou mesmo outros sites. Alguns exemplos são os sites de busca, os catálogos na Internet, e os Wikis, que aceitam tanto leitura quanto escrita.  Aplicações: existem sites cujo conteúdo consiste de ferramentas de automatização, produtividade e compartilhamento, substituindo aplicações de desktop. Podem ser processadores de texto, planilhas eletrônicas, editores de imagem, softwares de correio eletrônico, agendas, etc. (fonte: Wikipédia) LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 7.
    Propósitos dos Sites 7  Comunitário: são os sites que servem para a comunicação de usuários com outros usuários da rede. Nesta categoria se encontram os chats, fóruns e sites de relacionamento.  Portais: são chamados de "portais" os sites que congregam conteúdos de diversos tipos entre os demais tipos, geralmente fornecidos por uma mesma empresa. Recebem esse nome por congregarem a grande maioria dos serviços da Internet num mesmo local. (fonte: Wikipédia) LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 8.
    A evolução daWeb 8  Pré-Web  Passado (web 1.0)  Presente (web 2.0)  Futuro (web 3.0) LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 9.
    Fase pré-Web 9  Tentativa de tornar a internet útil, mas ...  os serviços de informação oferecidos eram pequenos espaços e...  os usuários navegavam restritos a esses espaços  Soluções eram proprietárias e as plataformas não- abertas  CompuServe  AOL  Prodigy LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 10.
    O passado daWeb (web 1.0) 10  Hiperlinkagem em documentos  Tim Berners Lee inventou a Web em 1989. Sua genialidade foi criar e juntar três simples tecnologias, mas muito elegantes:  Localizador ou Identificador Uniforme de Recursos (URL ou URI) para identificar recursos (por exemplo, documentos, dados) na Web, e saber onde encontrá-los.  Hypertext Markup Language (HTML) linguagem para representar o conteúdo em termos de páginas na Web e de expressá-las em links.  Hypertext Transfer Protocol (HTTP) protocolo para mover dados na Web e em toda a Internet. LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 11.
    O passado daWeb (web 1.0) 11 LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 12.
    O passado daWeb (web 1.0) 12  ... além disso Tim Berners Lee percebeu logo cedo que havia um quarto componente para que a Web alcançasse sucesso ... Tecnologia aberta e disponibilizada gratuitamente para todos  Em 1998, Google inovou com um algoritmo que trouxe melhora significativa no desempenho e simplicidade das pesquisas na Web, baseando-se no poder da linguagem padrão HTML.  As pesquisas no Google trouxeram mais expectativas e hiperlinkagens no uso da WEB, relacionando pessoas, produtos, serviços. Criando novas interações e novos mercados. LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 13.
    O presente daWeb (web 2.0) 13  A Web cresceu muito e rapidamente ...  mais de 100 milhões de sites ativos  mais de 1 bilhão de pessoas acessam a Web de: Hiperlinkagem de documentos; para: Conteúdo dinâmico gerado pelos usuários ~ 80 milhões de vídeos ~ 4 milhões de usuários LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 14.
    O presente daWeb (web 2.0) 14 LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 15.
    O presente daWeb (web 2.0) 15  Wikipédia: + de 2.400.000 artigos LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 16.
    O presente daWeb (web 2.0) 16  A web 2.0 está mais próxima da visão original de Tim Berners Lee ... a Web como verdadeira colaboração, meio de interação, comunicação global e compartilhamento de informações. LUCIANO.CRECENTE@ETEC.SP.GOV.BR
  • 17.
    O futuro daWeb (web 3.0) 17  A próxima evolução na Web, se não for uma revolução, será a da linkagem de dados e dispositivos.  Novas formas de integração e de combinação de dados para conseguir informações e idéias nunca antes possível.  novas maneiras de conectar à Internet através de uma variedade de dispositivos capazes de pesquisar, combinar e analisar os dados.  o W3C busca padronizar as tecnologias emergentes que permitirão a Web 3,0 se tornar uma realidade  Web Semântica (identificando o perfil do usuário)  Vídeo na Web  Web Móvel  Web Ubíqua ( a onipresença da informática no cotidiano das pessoas, acessível de qualquer lugar e dispositivo) (fonte: w3c.br) LUCIANO.CRECENTE@ETEC.SP.GOV.BR