Monografia Web 2.0

6,377 views
6,278 views

Published on

Apresentação de monografia com o tema: Web 2.0: a migração para a Web social

Published in: Business
1 Comment
10 Likes
Statistics
Notes
  • Mais Monografia é uma empresa formada por profissionais especializados em todas as áreas de conhecimento. Nossa missão é elevar a escrita científica no Brasil oferecendo suporte, orientação e esclarecimentos para todo tipo de escrita intelectual sendo elas informativas ou científicas.
    Nossa assessoria é integral e abrange: livros, artigos científicos, monografias, TCC`s , projetos, dissertações, teses, revisão de normatização, revisão ortográfica, traduções, apresentação em slides, comunicação empresarial dentre outros, sempre mantendo os maiores padrões de ética.

    Acesse
    www.maismonografia.com.br
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total views
6,377
On SlideShare
0
From Embeds
0
Number of Embeds
69
Actions
Shares
0
Downloads
686
Comments
1
Likes
10
Embeds 0
No embeds

No notes for slide

Monografia Web 2.0

  1. 1. Web 2.0 A migração para a Web social Aluna: Crystiam Kelle Pereira e Silva Orientador: Tarcísio de Souza Lima
  2. 2. Web 2.0 Agenda  Introdução  A plataforma Web 2.0 Mudança de paradigma  Serviços Web 2.0  Web como plataforma   Estudo de caso  Características da Web 2.0  Conclusão Definição   Críticas à Web 2.0 Características   Trabalhos Futuros  Elementos da Web 2.0 Usuário  Conteúdo  Design  Publicidade e Marketing 
  3. 3. Web 2.0 Introdução  Anos 1980 Criação da Web  Interesse comercial na rede  Sites textuais, poucas imagens   Anos 1990 Applets Java, animações, cores, muitas imagens  Atualmente  Sites dinâmicos  Interatividade  Serviços simples  Participação e colaboração 
  4. 4. Web 2.0 Quebra de Paradigmas Web 1.0 Web 2.0 DoubleClick Google AdSense Ofoto Flickr Akamai BitTorrent Mp3.com Napster Enciclopédia Britânica online Wikipedia websites pessoais Blogs evite upcoming.org e EVDB especulação de domínios otimização de ferramentas de busca Visitas a páginas Custo por click screen scraping web services Publicação Participação sistema de gerenciamento de conteúdo wikis diretórios (taxonomia) tags (quot;folksonomyquot;) stickiness Syndication (disponibilização de conteúdo)
  5. 5. Web 2.0 Web como plataforma  Aplicativos que utilizam a rede como plataforma  Web oferece serviços para o desenvolvimento  Vantagens Serviços sempre disponíveis  Armazenamento de dados online  Acessíveis de qualquer dispositivo  Isentos de instalação  Atualizações automáticas  Independente do SO 
  6. 6. Web 2.0 Definição de Web 2.0 quot;Web 2.0 é a mudança para uma internet como plataforma, plataforma e um entendimento das regras para obter sucesso nesta nova plataforma. Entre outras, a regra mais importante é desenvolver aplicativos que aproveitem os efeitos de rede para se tornarem melhores quanto mais são usados pelas pessoas, aproveitando a inteligência coletiva“ pessoas coletiva (O’ REILLY, 2005).
  7. 7. Web 2.0 Características da Web 2.0  Participação  Inteligência Coletiva: Wikipedia  Comunidade: Orkut, Gazzag  Cooperação  O controle de dados não é uma prática desejável  Utilização e a melhoria de serviços já criados: Google Maps  Usabilidade  Facilitar o uso, intuitivo  Testes feitos com grande freqüência e muitos usuários
  8. 8. Web 2.0 Características da Web 2.0  Descentralização dos dados  Aplicativos em diversos dispositivos  Arquitetura P2P  Confiança no conteúdo dos usuários  “Com um número suficiente de olhos, todos os bugs tornam-se visíveis“  Usuários avaliam, corrigem, sugerem...  Informações erradas são rapidamente denunciadas
  9. 9. Web 2.0 Características da Web 2.0  Experiência rica para o usuário  Páginas mais leves, interativas e agradáveis  Formato próximo ao Desktop  Personalização  Usuário escolhe o conteúdo  Informações recebidas em diferentes dispositivos  Atualizações freqüentes  Lançar logo, lançar sempre
  10. 10. Web 2.0 Ferramentas Web 2.0 Wikis Blogs Sites sociais Bookmarking social Vídeos e fotos
  11. 11. Web 2.0 Elementos da Web 2.0  Usuário  Usuário é o principal objetivo das companhias  Cria, avalia, edita, organiza, compartilha, escolha como e o que deseja ver  Serviços devem estimular a participação do usuário  Usuário não adiciona conteúdo sem obter vantagem  Vantagem econômica - Usuário faz a manutenção do sistema
  12. 12. Web 2.0 Elementos da Web 2.0  Conteúdo A preocupação não está mais em publicar o conteúdo e sim em criar alternativas que ajudem a organizá-lo, selecioná-lo e distribuí-lo.
  13. 13. Web 2.0 Elementos da Web 2.0  Organização  Folksonomia – tags  Avaliação  Denúncia de abusos e erros  Estímulo à avaliação – DIGG  Distribuição  Bom uso em vários dispositivos  Disponibilizar o conteúdo – Youtube  Long Tail
  14. 14. Web 2.0 Elementos da Web 2.0  Design A pretensão do designer é estimular o usuário a participar da Web e permitir a ele autonomia, facilidade autonomia e essencialmente simplicidade na sua busca por informação e na colaboração no desenvolvimento desta.  Tendências Layout simples  Projete o conteúdo e não a página  Uso de espaços em branco  Textos grandes  Cores fortes e contrastantes 
  15. 15. Web 2.0 Elementos da Web 2.0  Publicidade “O marketing viral e a publicidade viral referem-se a técnicas de marketing que tentam explorar redes sociais pré- existentes para produzir aumentos exponenciais em conhecimento de marca, com processos similares a extensão de uma epidemia” (WIKIPEDIA, 2006) “Pode-se ter certeza de que, se um site ou produto depende de  publicidade para se tornar conhecido, não é Web 2.0” (O’ REILLY, 2005)
  16. 16. Web 2.0 Elementos da Web 2.0  Publicidade Empresa Consumidor Consumidor Consumidor Web 1.0 Web 2.0
  17. 17. Web 2.0 A plataforma Web 2.0
  18. 18. Web 2.0 Serviços Web 2.0 - RSS  RSS é um recurso que permite o compartilhamento de conteúdo na Web.  São gerados arquivos (feeds) com extensão .xml ou .rss ou ainda .rdf.  Busca feita por agregadores RSS  Reúne em apenas um lugar informações de vários serviços  RDF  Representar claramente informações de recursos da Web de forma que possa ser processado por máquina
  19. 19. Web 2.0 Serviços Web 2.0 - RSS RSS 1.0 RSS 2.0 RDF Site Summary Really Simple Syndication Desenvolvida por um grupo de Foi originariamente documentada desenvolvedores através da pela Netscape e aperfeiçoada pela continuação da versão RSS 0.9 Userland. Baseada na versão RSS 0.91. Utiliza namespaces XML de Utiliza namespaces XML de acordo acordo com o padrão W3C com o padrão W3C Detalhamento da especificação Simplicidade Útil para ser integrado a sistemas Fácil para codificação manual de Web Semântica
  20. 20. Web 2.0 Serviços Web 2.0 – RSS 1.0 01 <?xml version=quot;1.0quot;?> 02 <rdf:RDF xmlns:rdf=quot;http://www.w3.org/1999/02/22-rdf-syntax-ns#quot; 03 xmlns=quot;http://purl.org/rss/1.0/quot; 04 xmlns:dc=quot;http://purl.org/dc/elements/1.1/quot;> 05 <channel rdf:about=quot;http://exemplo.com/news.rssquot;> 06 <title>EXEMPLO</title> 07 <link>http://exemplo.com/ <link> 08 <description>Exemplo de RSS 1.0</description> 09 <items> 10 <rdf:Seq> 11 <rdf:li resource=quot;http://exemplo.com/2002/09/01/quot;/> 12 <rdf:li resource=quot;http://exemplo.com/2002/09/02/quot;/> 13 </rdf:Seq> 14 </items> 15 </channel> 16 <item rdf:about=quot;http://exemplo.com/2002/09/01/quot;> 17 <title></title> 18 19 <link></link> 20 <description> </description> 21 <dc:date></dc:date> 22 </item> 23 </rdf:RDF>
  21. 21. Web 2.0 Serviços Web 2.0 – RSS 2.0 01 <?xml version=quot;1.0quot;?> 02 <rss version=quot;2.0quot;> 03 <channel> 04 <title>Exemplo de RSS 2.0</title> 05 <link>http://exemplo.com/</link> 06 <description> Exemplo de RSS 2.0 - Monografia</description> 07 08 <item> 09 <title>Noticia 01</title> 10 <link>http://noticia.com</link> 11 <description>Descrição da noticia 01 </description> 12 </item> 13 </channel> 14 </rss>
  22. 22. Web 2.0 Serviços Web 2.0 – Mashups Um mashup é um website ou uma aplicação web que descontinuamente combina em seu conteúdo mais de um código (WIKIPEDIA, 2007).  Utiliza RSS e APIs  Google Maps: mostrar imagens  Google Calendar: marcar datas de festas  API  Conjunto de rotinas e padrões estabelecidos por um software para utilização de suas funcionalidades por programas aplicativos sem envolver com detalhes de implementação. (WIKIPEDIA, 2007a)
  23. 23. Web 2.0 Serviços Web 2.0 – API 01 <!DOCTYPE html PUBLIC quot;-//W3C//DTD XHTML 1.0 Strict//ENquot; 02 quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtdquot;> 03 <html xmlns=quot;http://www.w3.org/1999/xhtmlquot;> 04 <head> 05 <meta http-equiv=quot;content-typequot; content=quot;text/html; charset=utf-8quot;/> 06 <title>Google Maps JavaScript API Example</title> 07 <script src=quot;http://maps.google.com/maps?file=api&amp;v=2&amp;key= 08 ABQIAAAAkLV-dnEEwgYAx4vzE4TrTBQeaAGtUU6K5zApHkQGXCeE_3kH7RQl7_ 09 VO71PNYzHE0LAcwAsjOLpjVgquot; type=quot;text/javascriptquot;></script> 10 <script type=quot;text/javascriptquot;> 11 //<![CDATA[ 12 function load() { 13 if (GBrowserIsCompatible()) { 14 var map = new GMap2(document.getElementById(quot;mapquot;)); 15 map.setCenter(new GLatLng(37.4419, -122.1419), 13); 16 } 17 } 18 //]]> 19 </script> 20 </head> 21 <body onload=quot;load()quot; onunload=quot;GUnload()quot;> 22 <div id=quot;mapquot; style=quot;width: 500px; height: 300pxquot;></div> 23 </body> 24 </html>
  24. 24. Web 2.0 Serviços Web 2.0 - AJAX  Aplicações mais dinâmicas  Atualiza apenas a informação solicitada  Comunicação assíncrona  Menor uso de banda  Rapidez e eficiência na navegação
  25. 25. Web 2.0 Serviços Web 2.0 - AJAX  O AJAX incorpora as seguintes tecnologias:  Padrões de apresentação utilizando XHTML e CSS; CSS  Apresentações dinâmicas e interativas utilizando Document Object Model - DOM; DOM  Manipulação de elementos de uma página utilizando XML e XSLT; XSLT  Recuperação de dados assíncrona usando o método XMLHttpRequest; XMLHttpRequest  e JavaScript que junta tudo isso. (GARRET, 2005)
  26. 26. Web 2.0 Serviços Web 2.0 - AJAX
  27. 27. Web 2.0 Estudo de caso Protótipo do portal da UFJF  Objetivo: Criar um website mais interativo e permitir a distribuição Objetivo do conteúdo gerado pela UFJF, usando recursos da Web 2.0. Além disso, o protótipo foi idealizado de acordo com os padrões Web, preocupando-se com acessibilidade e usabilidade. usabilidade  Foram usados PHP e MySQL.
  28. 28. Web 2.0 Estudo de caso  Distribuição do conteúdo através de RSS 2.0
  29. 29. Web 2.0 Estudo de caso  Distribuição do conteúdo através de RSS 2.0 01 foreach($arnots as $linha){ 02 $date = $linha->getdt_publicacao(); 03 $date = date('D, d M Y H:m:s'); 04 fwrite($ponteiro,quot; 05 <item> 06 <title>quot;.htmlspecialchars($linha->gettitulo()).quot;</title> 07 <link>http://www.portal.ufjf.br/teste/ver_not.php? 08 idnoticia=quot;.$linha->getidnoticia().quot;</link> 09 <pubDate>quot;.$date.quot; -0200</pubDate> 10 <description> 11 <![CDATA[ <P>quot;.htmlspecialchars($linha->getchamada()). 12 quot;</P> ]]> 13 </description> 14 <guid>http://www.portal.ufjf.br/teste/ver_not.php? 15 idnoticia=quot;.$linha->getidnoticia().quot;</guid> 16 </item>quot;); 17 }
  30. 30. 01 <?xml version=quot;1.0quot; encoding='iso-8859-1' ?> 02 <rss version='2.0'> 03 <channel> 04 <title>Portal UFJF - Notícias</title> 05 <link>http://www.portal.ufjf.br</link> 06 <description>UFJF - A sua universidade Pública!</description> 07 <language>pt-br</language> 08 <copyright>Portal UFJF - Todos os direitos reservados.</copyright> 09 <image> 10 <title>Portal UFJF</title> 11 <url>http://www.portal.ufjf.br/teste/imagens/icones/logo_ufjf.gif 12 </url> 13 <link>http://www.portal.ufjf.br</link> 14 </image> 15 <lastBuildDate>Fri, 29 Jun 2007 18:55:54 -0300</lastBuildDate> 16 <ttl>20</ttl> 17 <item> 18 <title>Relações Internacionais cadastra famílias para receber 19 intercambistas - alterado</title> 20 <link>http://www.portal.ufjf.br/teste/ver_not.php?idnoticia=25 21 </link> 22 <pubDate>Fri, 29 Jun 2007 18:06:54 -0200</pubDate> 23 <description><![CDATA[ <P>A Coordenação de Relações Internacionais 24 (CRI) da Universidade Federal de Juiz de Fora (UFJF) inscreve 25 famílias que se interessam em hospedar alunos...</P> ]]> 26 </description> 27 <guid>http://www.portal.ufjf.br/teste/ver_not.php?idnoticia=25 28 </guid> 29 </item> 30 </channel> 31 </rss>
  31. 31. Web 2.0 Estudo de caso  Agregação do conteúdo RSS do website Tempo Agora
  32. 32. 01 function geraRSS($tabs,$endereco,$origem,$tipo='dl',$maxitens){ 02 if($tipo!='ul' && $tipo!='ol' && $tipo != 'dl'){ 0echo quot;<p class='error'>No momento são válidos apenas 'ul', 'ol' 'dl' para 005 tipo</p>quot;;} 06 $metas = array(); 07 $xml2a = new XMLToArray(); 08 $root_node = $xml2a->parse(file_get_contents($endereco)); 09 $drive = array_shift($root_node[quot;_ELEMENTSquot;]); 10 $ret = $tabs.quot;<$tipo>nquot;; 11 $i = 0; 12 13 foreach($drive[quot;_ELEMENTSquot;][0][quot;_ELEMENTSquot;] as $elem){ 14 if($elem[quot;_NAMEquot;]==quot;itemquot; && $i<$maxitens){ 15 $i++; 16 foreach($elem[quot;_ELEMENTSquot;] as $not){ 17 $$not[quot;_NAMEquot;] = $not[quot;_DATAquot;]; 18 } 19 if($tipo=='dl'){ 20 $ret .= $tabs.quot; <dt><a href='quot;.$link.quot;' target='_blank'>quot; 21 .htmlentities(utf8_decode($title)).quot;</a></dt>nquot;; 22 $ret .= $tabs.quot;<dd>quot;.htmlentities(utf8_decode($description)).quot;</dd>nquot;; 23 }else{ 24 $ret .= $tabs.quot;<li> 25 <a href='quot;.$link.quot;'target='_blank'>quot;. 26 htmlentities(utf8_decode($title)).quot; nquot;; 27 $ret .= $tabs.quot; 28 <span class='desc'> 29 quot;.htmlentities(utf8_decode($description)).quot; 30 </span> 31 </a></li>nquot;; 32 } 33 }else{ //pegando os outros meta dados 34 $metas[$elem[quot;_NAMEquot;]] = $elem[quot;_DATAquot;]; 35 } 36 } 37 $ret .= $tabs.quot;</$tipo>nquot;; 38 $ret .= $tabs.quot;<p>Fonte: <a href='quot;.$metas[quot;linkquot;].quot;' target='_blank' quot;; 39 $ret .= quot;title='quot;.htmlentities 40 (utf8_decode($metas[quot;copyrightquot;])).quot;'>quot;.$origem.quot;</a></p>nquot;; 41 //return $ret; 42
  33. 33. Web 2.0 Estudo de caso  Participação  Formulário: estimular a participação e interação entre os avaliadores, que deixavam opiniões, sugestões e podiam visualizar os comentários dos demais.  Foi utilizada a biblioteca greybox. greybox
  34. 34. Web 2.0 Estudo de caso  Avaliação  Enquete: permitir uma avaliação rápida, com opções definidas  Usada biblioteca Ajax Poller
  35. 35. 01 // Insere novo voto na base de dados 02 03 if($optionId)mysql_query(quot;insert into poller_vote(optionID,ipAddress) 04 values('quot;.$optionId.quot;','quot;.getenv(quot;REMOTE_ADDRquot;).quot;')quot;); 05 06 //Retorna resultado como um XML 07 echo '<?xml version=quot;1.0quot; ?>'; 08 09 $res = mysql_query(quot;select ID,pollerTitle from 10 poller where ID='quot;.$pollId.quot;'quot;); 11 if($inf = mysql_fetch_array($res)){ 12 echo quot;<pollerTitle>quot;.$inf[quot;pollerTitlequot;].quot;</pollerTitle>nquot;; 13 14 $resOptions = mysql_query(quot;select ID,optionText from 15 poller_option where pollerID='quot;.$inf[quot;IDquot;].quot;' 16 order by pollerOrderquot;) or die(mysql_error()); 17 while($infOptions = mysql_fetch_array($resOptions)){ 18 echo quot;<option>nquot;; 19 echo quot;t<optionText>quot;.$infOptions[quot;optionTextquot;].quot;</optionText>nquot;; 20 echo quot;t<optionId>quot;.$infOptions[quot;IDquot;].quot;</optionId>nquot;; 21 22 $resVotes = mysql_query(quot;select count(ID) from 23 poller_vote where optionID='quot;.$infOptions[quot;IDquot;].quot;'quot;); 24 if($infVotes = mysql_fetch_array($resVotes)){ 25 echo quot;t<votes>quot;.$infVotes[quot;count(ID)quot;].quot;</votes>nquot;; 26 } 27 echo quot;</option>quot;; 28 } 29 } 30 exit;
  36. 36. 01 this.createAJAX = function() { 02 try { 03 this.xmlhttp = new ActiveXObject(quot;Msxml2.XMLHTTPquot;); 04 } catch (e1) { 05 06 try { 07 this.xmlhttp = new 08ActiveXObject(quot;Microsoft.XMLHTTPquot;); 09 } catch (e2) { 10 this.xmlhttp = null; 11 } 12 } 13 if (! this.xmlhttp) { 14 if (typeof XMLHttpRequest != quot;undefinedquot;) { 15 this.xmlhttp = new XMLHttpRequest(); 16 } else { 17 this.failed = true; 18 } 19 } 20 };
  37. 37. Web 2.0 Estudo de caso  Avaliação dos resultados  Protótipo não se tornou um serviço Web 2.0;  Objetivo era usar recursos Web 2.0;  Favoreceu a avaliação e sugestões;  Navegação mais simples e rápida;  Maior velocidade no carregamento das páginas;  Distribuição de conteúdo através de RSS (validada)
  38. 38. Web 2.0 Estudo de caso Próximos passos  Disponibilizar projetos de alunos e departamentos, trabalhos de conclusão de curso;  Desenvolver maior interação entre os sites setoriais e o portal da UFJF;  Comunidade para incentivar discussões entre os alunos e professores;  Incentivar a avaliação e sugestão de eventos e atividades culturais;  Passar o conteúdo do portal todo para uma base de dados;  Desenvolver uma busca eficiente que atingisse, além do conteúdo do portal, outras instituições de ensino;  Permitir que o usuário fizesse pequenas modificações na visualização do portal - cor e disposição de elementos na página.
  39. 39. Web 2.0 Conclusão O ponto principal da Web 2.0 é o envolvimento de pessoas no processo de desenvolvimento. Ocorreu uma migração para a Web social, voltada para a colaboração, participação e descentralização. Desta forma, a Web passou de uma ferramenta para uma plataforma, que dá suporte ao desenvolvimento de inúmeros serviços e integração dos mesmos.
  40. 40. Web 2.0 Críticas à Web 2.0 Críticas Como você pode notar, as coisas que realmente dão valor a tal Web 2.0 já são valiosas há algum tempo. Já há algum tempo que isso tudo vem dando certo também. (FERREIRA, 2006) O comportamento do usuário é o mesmo??? A forma de gerar conteúdo não mudou?? A Web 2.0 não aconteceu de uma hora para a outra, logo após uma conferência, ou assim que foi escrito o artigo do O’REILLY (2005) sobre o assunto. Ela vem acontecendo, se transformando, num processo que acabou culminando na eliminação de alguns conceitos antigos e na adoção de outros conceitos que mostraram dar mais resultado quando se faz um projeto de internet. Ou seja, é óbvio que muito se não tudo que se tem dito que é Web 2.0 remete a projetos antigos de internet que deram certo. (ALVES JR, 2006)
  41. 41. Web 2.0 Trabalhos Futuros  Web 3.0 ou Web semântica  Tecnologias para suportar densidade de dados  Formas de organizar e armazenar informações  Comunicação na Web  Formas de obter lucros  A posse dos dados
  42. 42. Web 2.0 Referências Bibliográficas FERREIRA, E. Web 2.0 pé no chão. 2006. Disponível em: <http://www.imasters.com.br/artigo/4387/webstandards/web_20_pe_no_chao/>. Último acesso em: 28 jun. 2007. GARRET, J.J. Ajax: A New Approach to Web Applications. 2005. Disponível em: <http://www.adaptivepath.com/publications/essays/archives/000385.php>. Último acesso em: 15 jun. 2007. O’REILLY, T. What Is Web 2.0. 2005. Disponível em: <http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web- 20.html>. Último acesso em: 05 jul. 2007. WIKIPEDIA. API. 2007a. Disponível em: < http://pt.wikipedia.org/wiki/API>. Último acesso em: 26 jun. 2007. WIKIPEDIA. Web 2.0. 2007g. Disponível em: <http://pt.wikipedia.org/wiki/Web_2.0>. Acesso em: 26 mar. 2006.
  43. 43. Web 2.0 Perguntas? 

×