Click here to load reader

Aula Digitalks de Producão Web -

  • View
    2.835

  • Download
    2

Embed Size (px)

DESCRIPTION

Aula Digitalks de Producão Web

Text of Aula Digitalks de Producão Web -

  • 1. Produo paraWEBRafael S. Soares

2. Rafael S. Soares Bacharel em Design de Interfaces Digitais. Especialista em projetos digitais voltados performance. Como gerente de Produo da Media Factory foiresponsvel por projetos de presena digital deempresas como ClickOn, Cardif, Onodera, Sotreq,Planeta Futebol, entre outros. 3. Agenda1. Produo Online X Offline2. Objetivos3. Estratgias4. Banners5. Email Marketing6. Redes Sociais7. Landing Page8. Site Otimizado (SEO) 4. Online X Offiline Mensurveis Dinmicas Testes A/B Call to action Opt In Behavioral Targeting 5. Definio de Objetivos Vendas Cadastros Fidelizao Branding Reputao / Proteo Adquirir novos clientes ObjetivosEstratgias Mensurao 6. Estratgias Qual a ao esperada? Call to Action Longo, mdio e curto prazo Presena Digital Testes so fundamentais 7. Banners Definio do objetivo Call to action Referncias Esttico X Animado Criao da arte Programao 8. Banners 9. Banners Programao Ficar atento ao Mdia Kit 10. Banners Dimenso 11. Banners Peso 12. Banners Formatos: JPG (esttico) / GIF / SWF (flash) Frame Rate 13. Banners Verso do Flash Player Verso do Action Script Publish Settings: 14. Banners Click Tagon(release) { getURL(_root.url, "_blank");} 15. Email Marketing Objetivos Informativo, Vendas, Cadastros, etc. Criao da arte Programao Definio do Assunto Ferramenta de envio 16. Email Marketing Balancear texto e imagem, texto em HTML 17. Email Marketing 18. Email MarketingCall to Action 19. Email Marketing Programao: HTML bsico No utilizar Scripts No utilizar CSS Hospedar imagens -> Demanda 20. Email Marketing Definio do assunto: a primeira informao a ser lida Deve convencer 21. Email Marketing Ferramenta de envio: Optar por ferramentas que permitam mensuraes:Taxas de Abertura, Cliques, etc. Sigam leis de envio: Link para descadastro, baseopt in 22. Redes Sociais Objetivos Quais redes estar? Twitter, Facebook, Orkut, etc. Criao de layout Implementao 23. Redes Sociais Twitter: Avatar Fundo Cores 24. Redes Sociais Twitter - Avatar 25. Redes Sociais Twitter - Background 26. Redes Sociais Twitter - Background 27. Redes Sociais Twitter - Background 28. Redes Sociais Twitter - Cores 29. Redes Sociais Facebook Avatar Fanpage/Tab 30. Redes Sociais Facebook Avatar 31. Redes Sociais Facebook Fanpage/Tab 32. Redes Sociais Facebook Fanpage - Programao HTML, Flash, etc. Aplicativo Static HTML: iframe tabs Permite iframe 33. Redes Sociais Outras: Definio de cores Identidade da marca Fundo (Background) Tomar cuidado comvariaes de acordo com resolues de tela 34. Landing Page Criao De onde a visita vem? Qual meu objetivo? Ao esperada Possibilidade de saber mais Reduzir possibilidade de aes Guiar visitante Evitar Scroll Tomar cuidado com tempo de carregamento Etapas Testes A/B 35. Landing Page Criao Guiar Usurio 36. Landing Page Criao Identidade/Continuidade 37. Landing Page Criao Captao de Opt In 38. Landing Page Criao - Inscries 39. Landing Page Programao Permite qualquer linguagem para WEB No esquecer de implementar ferramenta demtrica Hospedar no domnio de seu site -> credibilidade 40. HTML Estrutura 41. HTML Contedo Textual Titulo

Paragrafo

42. HTML Imagens 43. HTML Link Contedo Linkado 44. HTML Links Relativo: images/foto.jpg Absoluto: http://www.site.com/images/foto.jpg 45. HTML Tabela 46. HTML Formatao do texto 47. Site Otimizado SEO Mtodos que facilitam a leitura de contedo dosite pelos sistemas de busca (Google, Bing, Yahoo,etc.) No basta ter contedo relevante se ele no indexado Grande parte das visitas so provenientes dosbuscadores Site em Flash = Site em branco 48. Site Otimizado Site no otimizado: Site otimizado: 49. Site Otimizado Meta Tags () 50. Site Otimizado Imagens: Nome otimizado .jpg Alt e Tittle Tamanho do arquivo 51. Site Otimizado Links Meusite.com/?336 Meusite.com/meu+produto+em+promocao 52. Site Otimizado Contedo Textual Titulo

Paragrafo

53. Site Otimizado CMS Content Management System Gerenciamento de conteudo Estrutura preparada fcil atualizao 54. Site Otimizado Wordpress Gratuito Cdigo Aberto Plugins Temas PHP + MySQL 55. Site Otimizado Passo a Passo Preparao do servidor Instalao do Wordpress Configurao do Wordpress Instalao de Plugin Plugins Importantes Configurar Plugin SEO Configurar Plugin Site Map Instalando e editando um tema Inserindo posts Inserindo pginas Criao de menus Edio de Widgets Implementao de Analytics Implementao de Google Webmaster Tools Mantendo Atualizado 56. Site Otimizado Instalao do Wordpress: Instaladores 57. Site Otimizado Instalao Manual Baixar ultima verso em: http://wordpress.org/ Criar um banco de dados MySQL Editar o arquivo wp-config-sample.php com asinformaes do banco de dados, salvar como wp-config.php Subir arquivos para o servidor Abrir, pelo navegador, seusite.com/wp-admin/install.php 58. Site Otimizado 59. Site Otimizado Configurando o Wordpress 60. Site Otimizado Configurando o Wordpress 61. Site Otimizado Configurando o Wordpress 62. Site Otimizado Instalando Plugin 63. Site Otimizado Instalando Plugin 64. Site Otimizado Instalando Plugin 65. Site Otimizado Instalando Plugin FTP > Subir arquivos para: /wordpress/wp-content/plugins 66. Site Otimizado Plugins importantes: SEO Ultimate Google XML Sitemaps Facebook Twitter Google +1 Youtube Integrao Flickr Integrao 67. Site Otimizado Configurando o plugin SEO Ultimate 68. Site Otimizado Configurando o plugin SEO Ultimate 69. Site Otimizado Configurando o plugin SEO Ultimate 70. Site Otimizado Configurando o plugin SEO Ultimate 71. Site Otimizado Configurando o plugin SEO Ultimate 72. Site Otimizado Plugin permite inserir descrio por pgina/post 73. Site Otimizado Instalando um tema 74. Site Otimizado Instalando um tema 75. Site Otimizado Instalando um tema Subir manualmente em: /wordpress/wp-content/themes Cada tema possibilita configuraes prprias 76. Site Otimizado Estrutura padro dos temas: header.php Cabealho, presente em todas as pginas footer.php Rodap presente em todas as pginas index.php Home do site single.php Post page.php Pgina archive.php Arquivo de posts comments.php Estrutura de comentrios do post search.php Pgina onde aparece resultados das pesquisar sidebar.php Barra lateral do site (onde ficam os widgets) style.css Definio de cores e posies images Pasta que contem todas imagens do tema Outros arquivos ou pastas podem aparecer de acordo com otema instalado, complementando a estrutura padro. 77. Site Otimizado Estrutura de arquivosheader.php index.phppage.php sidebar.php single.phpfooter.php 78. Site Otimizado Inserindo posts 79. Site Otimizado Inserindo posts 80. Site Otimizado Adicionar pgina 81. Site Otimizado Criao de Menus 82. Site Otimizado Adicionando Widgets 83. Site Otimizado Implementao do analytics: Criar conta em analytics.google.com Gerar cdigo Utilizar plugin de SEO 84. Site Otimizado Criar conta no Google Webmaster Tools www.google.com/webmasters/tools 85. Site Otimizado 86. Site Otimizado Manter site sempre atualizado fundamental Manter no site uma rea que possibiliteatualizaes constantes Publicar e linkar contedos com redes sociais eoutros sites Utilizar plugins de redes sociais constantemente Link Building 87. Obrigado! Rafael [email protected]