1) O documento discute redes sociais e como incorporar conteúdo delas em sites; 2) Exemplos de redes sociais incluem Youtube, Flickr e Facebook, e formas de incorporação incluem embutir vídeos e fotos ou usar APIs; 3) O autor instrui o leitor a criar uma página sobre a Copa América incorporando conteúdo de várias redes sociais.

1. Introdução aos Padrões Web e Tecnologias para o Ambiente Digital Aula 5 2/julho/2011 Thiago Prado de Campos

2. Conteúdo Programático Redes Sociais Exemplos Youtube, Vimeo, Slideshare, Scribd Flickr, Picasa Delicious Facebook, Google+ LinkedIn, Twitter

3. REDES SOCIAIS Introdução aos Padrões Web e Tecnologias para Ambiente Digital

4. Redes Sociais São sites onde conteúdo (textos, imagens, vídeos, arquivos) é em geral criado e mantido pelos próprios usuários. Por usuários entende-se pessoas e empresas não detentoras da autoria do próprio site. Os usuários formam redes de relacionamento através de recursos proporcionados pelo site, como grupos, comunidades, círculos, página, mural, etc.

5. Redes Sociais Existe muito mais teoria que envolve filosofia, marketing e até matemática para definir uma rede social, mas não é escopo desta disciplina. Exemplos: Orkut, Facebook, QZone, Google+, ... Picasa, Flickr, Youtube, ... http://en.wikipedia.org/wiki/List_of_social_networking_websites

6. O que as redes costumam oferecer? Conteúdo (notícias, artigos, imagens, vídeos, stream, arquivos); Comunicação (mensagens, mural, chat, e-mail, hangout) Serviços (cursos, árvore genealógica, citações, hospedagem, agregador, etc.); Diversão (jogos, etc.) Conexão entre Pessoas (comunidades, grupos, círculos, amizades, seguidores, etc.)

7. Como posso usar? Embutindo conteúdo Inserindo no seu site código HTML que remete a conteúdo existente na rede social. Embed de áudio, vídeo, imagens, etc. Acessando APIs Utilizando de javascript ou programação servidor para consultar e inserir conteúdo no seu próprio site; Exibindo quem curte uma página, quem segue alguém, etc. Ancorando ações Criando hiperlinks ou scripts que acionam recursos ou inserem conteúdos nas redes sociais. Curtir, +1, Comentários

8. EXEMPLOS

9. Youtube Vídeos, Comentários, Ratings Incorporar Embute no seu site um video do Youtube com o player básico fornecido pelo próprio site; http://code.google.com/intl/pt-BR/apis/youtube/player_parameters.html APIs Data – permite executar as principais operações de um usuário comum no site; Player – permite controlar o player de maneira customizada. http://code.google.com/intl/pt-BR/apis/youtube/getting_started.html http://code.google.com/apis/ajax/playground/?exp=youtube#simple_embed

10. Vimeo Vídeos, Galerias de Vídeos, Comentários, etc. Incorporar APIs http://vimeo.com/api

11. Picasa Fotos, Álbuns Incorporar APIs http://code.google.com/intl/pt-BR/apis/picasaweb/overview.html

12. Flickr Fotos, Álbuns Incorporar APIs http://www.flickr.com/services/api/ http://www.flickr.com/services/developer/ http://code.flickr.com/ http://www.flickr.com/services/

13. Slideshare Apresentações Incorporar APIs Consultar e fazer upload de apresentações e informaçõe sobre usuários; Controlar o player http://www.slideshare.net/developers/playerapi/demo http://www.slideshare.net/developers

14. Scribd Documentos PDF Incorporar APIs http://pt.scribd.com/developers

15. Facebook A maior rede social do mundo, com cerca de 600 milhões de usuários. https://developers.facebook.com/ https://developers.facebook.com/docs/guides/web/ Perfil x Página https://www.facebook.com/help/?faq=217671661585622 Botão “Curtir” Plugin de Comentários no Wordpress

16. Google+ Botão +1 http://www.google.com/webmasters/+1/button/ http://code.google.com/intl/pt-BR/apis/+1button/

17. LinkedIn Currículo, Rede Profissional Incorporar Currículo, Rede de Empresa Compartilhar Conteúdo APIs http://developer.linkedin.com/index.jspa

18. Twitter Micropost Seguir http://twitter.com/about/resources/followbutton Twettar http://dev.twitter.com/pages/tweet_button APIs http://dev.twitter.com/ http://twitter.com/status/user_timeline/thiagotpc.json?count=5 http://tweetauditor.in/

19. Delicious URLs Incorporar Salvar no Delicious Últimas urls Perfil http://www.delicious.com/help/tools APIs http://www.delicious.com/help/api

20. APIs de Produtos Google http://code.google.com/intl/pt-BR/more/table

21. Outras APIs na Web http://www.programmableweb.com/apis

22. Exercício Crie uma página HTML sobre a Copa América e incorpore conteúdos de redes sociais sobre o tema. Um vídeo do Youtube ou Vimeo Foto ou Album do Flickr ou Picasa Link para Curtir ou +1 na página Botão para Twettar! Envie para [email_address]