DINARA PEREIRA LIMA. ESTÁGIO CURRICULAR I e II DESENVOLVIMENTO DE WEBSITE COM ADMINISTRADOR DE CONTEÚDO PARA DOCES MÔNICA SCHULZ E PROGRAMA FABÍOLA

Tamanho: px
Começar a partir da página:

Download "DINARA PEREIRA LIMA. ESTÁGIO CURRICULAR I e II DESENVOLVIMENTO DE WEBSITE COM ADMINISTRADOR DE CONTEÚDO PARA DOCES MÔNICA SCHULZ E PROGRAMA FABÍOLA"

Transcrição

1 DINARA PEREIRA LIMA ESTÁGIO CURRICULAR I e II DESENVOLVIMENTO DE WEBSITE COM ADMINISTRADOR DE CONTEÚDO PARA DOCES MÔNICA SCHULZ E PROGRAMA FABÍOLA BERNARDES EMPRESA: YOGH SOLUÇÕES PARA INTERNET LTDA SETOR: DESENVOLVIMENTO WEB SUPERVISOR: LUCAS SIMÕES DE CARVALHO ORIENTADOR: PROFº DRº CLAUDIOMIR SELNER CURSO DE TECNOLOGIA EM SISTEMAS DE INFORMAÇÃO CENTRO DE CIÊNCIAS TECNOLÓGICAS - CCT UNIVERSIDADE DO ESTADO DE SANTA CATARINA UDESC JOINVILLE SANTA CATARINA - BRASIL OUTUBRO 2010

2 APROVADO EM.../.../... Claudiomir Selner Doutor em Engenharia de Produção e Sistemas Professor Orientador Avanilde Kemczinski Doutora em Engenharia de Produção Supervisora Acadêmica Cinara Terezinha Menegazzo Mestre em Ciências da Computação Lucas Simões de Carvalho Supervisor da Empresa Concedente Vilson Vieira da Silva Jr Graduado em Ciência da Computação Luciana Rita Guedes Ghisleri Mestre em Engenharia Elétrica em Automação

3 Carimbo da Empresa UNIDADE CONCEDENTE Razão Social: YOGH SOLUÇÕES PARA INTERNET LTDA CGC/MF: / Endereço: Rua Desembargador Nelson Nunes Guimarães, 1283 Bairro: Atiradores CEP: Cidade: Joinville UF: SC Fone: (47) Atividade Principal : Analista de Usabilidade Supervisor: Lucas Simões de Carvalho Cargo: Analista de Soluções Web ESTAGIÁRIO Nome: Dinara Pereira Lima Matrícula: Endereço: Rua Aracajú, nº 594, Bairro Saguaçú CEP: Cidade: Joinville UF: SC Fone: (47) Curso de: Tecnologia em Sistemas de Informação Título do Estágio: Desenvolvimento de Website com administrador de conteúdo para "Doces Mônica Schulz" e "Programa Fabíola Bernardes" Período: 02/09/ /10/2010 Carga horária: 240h AVALIAÇÃO FINAL DO ESTÁGIO PELO CENTRO DE CIÊNCIAS TECNOLÓGICAS Representada pelo Professor Orientador: Claudiomir Selner Estes campos serão preenchidos pelo professor da Disciplina, devido a avaliação ser do Processo e não somente do Relatório CONCEITO FINAL NOTA (Avaliação do Processo (Σ Processo) de Estágio) Excelente (9,1 a 10) Muito Bom (8,1 a 9,0) Bom (7,1 a 8,0) Regular (5,0 a 7,0) Reprovado (0,0 a 4,9) Rubrica do Professor da Disciplina Joinville / /

4 Nome do Estagiário: Dinara Pereira Lima QUADRO I AVALIAÇÃO NOS ASPECTOS PROFISSIONAIS QUALIDADE DO TRABALHO: Considerando o possível. ENGENHOSIDADE: Capacidade de sugerir, projetar, executar modificações ou inovações. CONHECIMENTO: Demonstrado no desenvolvimento das atividades programadas. CUMPRIMENTO DAS TAREFAS: Considerar o volume de atividades dentro do padrão razoável. ESPÍRITO INQUISITIVO: Disposição demonstrada para aprender. INICIATIVA: No desenvolvimento das atividades. SOMA Pontos QUADRO II AVALIAÇÃO DOS ASPECTOS HUMANOS ASSIDUIDADE: Cumprimento do horário e ausência de faltas. DISCIPLINA: Observância das normas internas da Empresa. SOCIABILIDADE: Facilidade de se integrar com os outros no ambiente de trabalho. COOPERAÇÃO: Disposição para cooperar com os demais para atender as atividades. SENSO DE RESPONSABILIDADE: Zelo pelo material, equipamentos e bens da empresa. SOMA Pontos PONTUAÇÃO PARA O QUADRO I E II Sofrível - 1 ponto, Regular - 2 pontos, Bom - 3 pontos, Muito Bom - 4 pontos, Excelente - 5 pontos LIMITES PARA CONCEITUAÇÃO AVALIAÇÃO FINAL Pontos De 57 a SOFRÍVEL SOMA do Quadro I multiplicada por 7 De 102 a REGULAR SOMA do Quadro II multiplicada por 3 De 148 a 194 BOM SOMA TOTAL De 195 a MUITO BOM De 241 a EXCELENTE Nome da Empresa: Yogh Soluções para Internet Ltda. Representada pelo Supervisor: Lucas Simões de Carvalho CONCEITO CONFORME SOMA TOTAL Rubrica do Supervisor da Empresa Lucas Simões de Carvalho Local: Joinville Data: / / Carimbo da Empresa

5 V UNIVERSIDADE DO ESTADO DE SANTA CATARINA - UDESC CENTRO DE CIÊNCIAS TECNOLÓGICAS - CCT PLANO DE ESTÁGIO I e II CURRICULAR OBRIGATÓRIO ESTAGIÁRIO Nome: DinaraPereira Lima Matrícula: Endereço: Rua Aracajú, 594 Bairro: Saguaçú CEP: Cidade: Joinville UF: SC Fone: (47) Endereço (Local estágio): Rua Desembargador Nelson Nunes Guimarães, 1283 Bairro: Atiradores CEP: Cidade: Joinville UF: SC Fone: (47) Regularmente matriculado no semestre: 2010/02 Curso: Tec. Sistemas de Informação Formatura (prevista) Semestre/Ano: 2011/01 UNIDADE CONCEDENTE Razão Social: YOGH SOLUÇÕES PARA INTERNET LTDA CGC/MF: / Endereço: Rua Desembargador Nelson Nunes Guimarães, 1283 Bairro: Atiradores CEP: Cidade: Joinville UF: SC Fone: (47) Atividade Principal: Analista de Usabilidade Supervisor: Lucas Simões de Carvalho Cargo: Analista de Soluções Web DADOS DO ESTÁGIO Área de atuação: Desenvolvimento de Interfaces Departamento de atuação: Desenvolvimento Web Fone: Ramal: Horário do estágio: 08:00-12:00 / 14:00-16:00 Total de horas do Estágio: 240 Período: 02/09/2010 a 29/10/2010 Total de horas semanais: 30 Nome do Professor Orientador: Claudiomir Selner Departamento: DCC - Departamento de Ciência da Computação Disciplina(s) simultânea(s) com o estágio Quantas: 5 Quais: SQL GERENCIA DE PROJETOS PESQUISA OPERACIONAL JAVA AVANÇADO II

6 OBJETIVO GERAL Cooperar na melhoria da imagem e da visibilidade dos clientes Doces Mônica Schulz e Programa Fabíola Bernardes na Internet ATIVIDADES OBJETIVO ESPECÍFICO HORAS Analisar as necessidades do Obter os objetivos e necessidades do cliente 10 cliente Protipar a página Obter a estrutura da página, visando atender aos 10 objetivos definidos pelo cliente Definir a Identidade e Ter padrão da página web que reflita a identidade 40 Padrões da página da empresa solicitante, além de oferecer uma página agradável e atrativa para os usuários Fazer o desenvolvimento Obter páginas atrativas e de fácil uso para os 50 visual das Páginas usuários Implementar a interface no Obter a interface funcional do site 40 wordpress Customizar as ferramentas Obter os plugins do wordpress customizados para 20 adicionais para o site atender necessidades específicas do cliente Otimizar as páginas (SEO), Ter as páginas do Website otimizadas para os 20 com análise de concorrentes e definição de palavraschave relevantes ao site mecanismos de busca, como: Google, Yahoo e Bing Identificar se o site atende Obter página que atenda os requisitos mínimos de 20 os requisitos mínimos de usabilidade (conformidade com a maioria dos browsers, acessibilidade etc) compatibilidade e acessibilidade na Internet Executar a publicação e Ter a página disponível na Internet 10 configuração da página online Desenvolver o manual de Obter material necessário para a utilização do site 20 uso e guia do site pelo cliente TOTAL GERAL DE HORAS 240 VI Rubrica do Professor Orientador Aprovação do Membro do Comitê de Estágio Rubrica do Coordenador de Estágio Rubrica do Supervisor da Empresa Rubrica do Supervisor Acadêmico Data: Prof Claudiomir Selner Data: Data: Prof César Malutta Data: Lucas Simões de Carvalho Data: Profa Avanilde Kemczinski Carimbo da Empresa

7 VII CRONOGRAMA FÍSICO E REAL Atividades P X Analisar as necessidades do cliente R X P X Protipar a página R X P X X X X Definir a Identidade e Padrões da página R X X X X X Fazer o desenvolvimento visual das Páginas Implementar a interface no wordpress P X X X X R X X X X X X Customizar as ferramentas adicionais para o site P X X R X X Otimizar as páginas (SEO), com análise de P X X concorrentes e definição de palavras-chave R X X relevantes ao site Identificar se o site atende os requisitos mínimos P X X de usabilidade (conformidade com a maioria dos R browsers, acessibilidade etc) Executar a publicação e configuração da página P X online R X Desenvolver o manual de uso e guia do site P X X R P X X X X X R X X X X X X Legenda P Previsto R Realizado P Previsto R - Realizado Período de 10 Horas

8 VII I À Equipe da agência Yogh, pela orientação e acompanhamento na execução das atividades. À minha família e amigos pelo apoio.

9 IX SUMÁRIO CRONOGRAMA FÍSICO E REAL... VII LISTA DE FIGURAS... X LISTA DE QUADROS... XI RESUMO... XII INTRODUÇÃO OBJETIVOS Geral Específicos Justificativa ORGANIZAÇÃO DO ESTUDO A EMPRESA HISTÓRICO PRINCIPAIS SERVIÇOS WEB DESIGN E DESENVOLVIMENTO WEB MARKETING OTIMIZAÇÃO SEO APLICAÇÕES WEB PERSONALIZADAS LOCALIZAÇÃO DA EMPRESA DESENVOLVIMENTO ANÁLISE DAS NECESSIDADES DO CLIENTE NECESSIDADES DA CLIENTE MÔNICA SCHULZ NECESSIDADES DA CLIENTE FABÍOLA BERNARDES PROTOTIPAÇÃO DA PÁGINA O PROCESSO DE PROTOTIPAÇÃO DEFINIR IDENTIDADE E PADRÕES REGRAS DE DESENVOLVIMENTO DESENVOLVIMENTO DAS PÁGINAS DESENVOLVIMENTO DAS ÁREAS INTERNAS DAS PÁGINAS PÁGINA HOME DA CLIENTE MÔNICA SCHULZ PÁGINA DE DOCES E CANAPÉS DO SITE MÔNICA SCHULZ PÁGINA DE CONTATO DO SITE MÔNICA SCHULZ PÁGINA HOME DO SITE PROGRAMA FABÍOLA BERNARDES IMPLEMENTAÇÃO DO SITE MÔNICA SCHULZ NO WORDPRESS CRIAÇÃO DOS TEMPLATES NO WORDPRESS CUSTOMIZAÇÃO DE FERRAMENTAS ADICIONAIS PARA O SITE CRIAÇÃO DE PÁGINAS E INSERÇÃO DE CONTEÚDO ANÁLISE DO SITE ATUAL ANÁLISE DE CONCORRENTES OTIMIZAÇÃO SEO ONPAGE EXECUTAR A PUBLICAÇÃO E CONFIGURAÇÃO DA PÁGINA ONLINE CONSIDERAÇÕES FINAIS GLOSSÁRIO REFERÊNCIAS BIBLIOGRÁFICAS... 46

10 X LISTA DE FIGURAS Figura 1: Interface da ferramenta Balsamiq Mockups... 7 Figura 2: Protótipo da página Home para a cliente Fabíola Bernardes... 8 Figura 3: Tela do software de criação Photoshop com o template base do 960 Grid System, com 16 colunas Figura 4: Cores e texturas utilizadas na página Mônica Schulz Figura 5: Cabeçalho do site Doces Mônica Schulz Figura 6: Esqueleto e Identidade visual do site Mônica Schulz Figura 7: Cores que representam feminilidade de acordo com o livro Color Harmony, a guide to creative color combinations Figura 8: Exemplo de site brilhante usado como referência para o design da do site Programa Fabíola Bernardes Figura 9: Cores e texturas utilizadas na página Fabíola Bernardes Figura 10: Cabeçalho do site Fabíola Bernardes Figura 11: Esqueleto e Identidade visual do site Fabíola Bernardes Figura 12: Visão geral da página home do site Mônica Schulz Figura 13: Áreas em destaque na home do site Mônica Schulz Figura 14: Área explicativa sobre a empresa na home do site Mônica Schulz Figura 15: Galeria de imagens nas páginas de doces e canapés do site Mônica Schulz Figura 16: Apresentação das opções de doces e salgados diferentes nas páginas de doces e canapés do site Mônica Schulz Figura 17: Página de Doces no site Mônica Schulz Figura 18: Página de Canapés no site Mônica Schulz Figura 19: Página de Contato no site Mônica Schulz Figura 20: Página home do site Programa Fabíola Bernardes Figura 21: Forma comum de leitura de um website de acordo com o livro Don t make me think Figura 22: Estrutura de pastas e arquivos do CMS Wordpress Figura 23: porcentagem de uso do browser Internet Explorer comparado aos demais em 2010 pelo site w3schools.com Figura 24: porcentagem de uso do browser Internet Explorer 6 comparado as demais versões em Figura 25: Resultado da implementação do cabeçalho do site Mônica Schulz Figura 26: Fonte KennedyDB renderizada na página web sem necessidade do usuário possuíla na máquina Figura 27: Interface de administrador de conteúdo no Wordpress Figura 28: Criação de uma nova página no wordpress Figura 29: Criação de um elemento interno, no exemplo, um elemento do menu interno na home Figura 30: Criação de conteúdo para a página Home Figura 31: Inserção de campos personalizados Figura 32: Configuração do mapa da google na página de contato Figura 33: Acessos ao site atual da Mônica Schulz entre Agosto e Outubro... 39

11 XI LISTA DE QUADROS Quadro 1: Relatório das atividades realizadas de 02/09/2010 a 03/09/ Quadro 2: Relatório das atividades realizadas de 03/09/2010 a 08/09/ Quadro 3: Relatório das atividades realizadas de 08/09/2010 a 17/09/ Quadro 4: Relatório das atividades realizadas de 20/09/2010 a 05/10/ Quadro 5: Relatório das atividades realizadas de 05/10/2010 a 25/10/ Quadro 6: Relatório das atividades realizadas de 26/10/2010 a 28/10/ Quadro 7: Relatório das atividades realizadas em 29/10/

12 XII RESUMO São reportadas nesse relatório as atividades executadas no período de estágio obrigatório do acadêmico, na empresa Yogh Soluções para Internet. As atividades foram executadas durante o período de 240 horas no setor de desenvolvimento Web. Nesse período foi desenvolvido o site da cliente Mônica Schulz e desenvolvido parte do do site da cliente Fabíola Bernardes. A criação do site envolve a análise de necessidades, planejamento, desenvolvimento gráfico, implementação e otimização, utilizando conceitos de disciplinas do curso de Tecnologia em Sistemas de Informação, como Análise de Sistemas, Engenharia de Software, Banco de dados e SQL avançado, além conhecimentos novos aprendidos durante o estágio. As atividades de entrega do site e criação do manual ficaram pendentes, além do desenvolvimento das páginas internas, implementação e otimização do site Programa Fabíola Bernardes. Apesar das pendências, grande parte dos resultados já podem ser vistos e a execução das atividades conseguiu atingir grande parte dos objetivos traçados no plano.

13 1 INTRODUÇÃO No presente relatório são descritas as atividades executadas durante o período de estágio supervisionado na empresa Yogh Soluções para Internet, no setor de desenvolvimento web. O projeto consiste na criação de website com administração de conteúdo para os clientes Doces Mônica Schulz e Programa Fábiola Bernardes, para o êxito dos projetos foram desenvolvidos no período de estágio diversas atividades que envolvem desde a coleta de informações até a implementação e entrega do website. A seguir são descritos os objetivos propostos para a execução no período de estágio, justificativas para o desenvolvimento, organização do estudo e um breve descritivo sobre a empresa onde o estágio ocorreu OBJETIVOS Geral O objetivo do projeto é cooperar na melhoria da imagem e da visibilidade dos clientes Doces Mônica Schulz e Programa Fabíola Bernardes na Internet através da criação de website com administração de conteúdo, que traga mais atratividade para a empresa, além da facilidade de busca e uso do site. A execução desse projeto envolvendo a empresa Yogh e a instituição de ensino Udesc tem o objetivo de aprimorar e aplicar os conceitos absorvidos no curso de Sistemas de Informação, para constribuir com o desenvolvimento profissional e acadêmico Específicos 1. Levantar os objetivos e necessidades dos clientes 2. Traçar a estrutura do website, visando atender aos objetivos definidos pelo cliente 3. Obter padrão da página web que reflita a identidade da empresa solicitante, além de oferecer um website agradável e atrativa para os usuários 4. Fornecer páginas atrativas e de fácil uso para os usuários

14 2 5. Ter a interface funcional do site 6. Obter os plugins do gerenciador de conteúdo wordpress customizados para atender necessidades específicas do cliente 7. Ter as páginas do Website otimizadas para os mecanismos de busca, como: Google, Yahoo e Bing 8. Fornecer página que atenda os requisitos mínimos de compatibilidade e acessibilidade na Internet 9. Ter o website disponível na Internet 10. Fornecer material necessário para a utilização do site pelo cliente Justificativa O sites atuais dos clientes Mônica Schulz e Fabíola Bernardes foram desenvolvidos com tecnologias e design que não estão mais de acordo com os padrões web do período em que esse relatório foi escrito. Em consequência disso os sites não apresentam visual atrativo, não atendem padrões de usabilidade, demoram muito tempo para carregar e não podem ser visualizados por todos os computadores, além de não serem facilmente encontrados pelos sites de busca. O aprimoramento das tecnologias atuais não seriam suficientes para proporcionar um site fácil de atualizar e com visual atrativo ORGANIZAÇÃO DO ESTUDO O relatório aqui apresentado é dividido em três capítulos assim descritos: Primeiro Capítulo: Mostra o objetivo geral, objetivos específicos, justificativa e a organização do estudo deste relatório. Segundo Capítulo: Mostra informações referente a empresa em que foi feita o estágio, informações de seus produtos e localização. Terceiro Capítulo: Mostra o conteúdo desenvolvido pelo acadêmico, durante as 240 horas de estágio.

15 3 2. A EMPRESA 2.1. HISTÓRICO A Yogh Soluções para a Internet é uma agência Web em seu primeiro ano de atividade na cidade de Joinville que conta com profissionais na área de design, tecnologia, marketing e negócios. A empresa oferece aos clientes soluções personalizadas para atender necessidades específicas do negócio, utilizando as últimas tecnologias e processos de trabalho para trazer resultados mensuráveis que atendam o objetivo proposto PRINCIPAIS SERVIÇOS A Yogh é focada no desenvolvimento de tecnologia web, especializada em criar soluções para empresas, conciliando estratégia, criatividade e as tecnologias corretas. A Yogh visa melhor enteder seu cliente e desenvolver soluções criativas e eficientes através de projetos exclusivos, garantindo a apresentação da imagem corporativa com criatividade e profissionalismo WEB DESIGN E DESENVOLVIMENTO WEB Um dos serviços oferecidos pela empresa é a criação gráfica e implementação de páginas na internet personalizadas, focadas na facilidade de uso, na fácil manutenção e na otimização para sites de busca. Entre os produtos são destacados a criação de portais, sites corporativos, blogs e hot sites. O trabalho da Yogh envolve desde a criação das interfaces intuitivas baseados em conceitos de usabilidade juntamente com design seguindo tendências da web até a construção de sites administráveis baseados em plataformas open-source como Joomla, Wordpress, Drupal e Magento.

16 MARKETING 4 Outro serviço é o desenvolvimento do planejamento, design e execução de campanhas de com relatório de visualizações e cliques por campanha para analisar a efetividade no público atingido. O foco nesta área é garantir a boa comunicação do produto/serviço da empresa, aliado a construção de HTMLs válidos para as diferentes clientes de e webmail disponíveis no mercado OTIMIZAÇÃO SEO O serviço de SEO (Search Engine Optimization) inclui a avaliação, consultoria e manutenção em sites e páginas da Internet com o objetivo de alavancar a quantidade e qualidade dos visitantes dos mesmos. Baseado em estratégias alinhadas com as ferramentas de busca como Google, Yahoo e Bing, a empresa trabalha com análise e manutenção em cada caso especificamente para obter melhores resultados garantindo um melhor retorno na Internet para as empresas APLICAÇÕES WEB PERSONALIZADAS A Yogh trabalha com projetos web personalizados que podem ser integrados com sistemas CRM (Customer Relationship Management), sistemas de atendimento (chat, fóruns e FAQ). Criamos ainda áreas restritas, hotsites para divulgação de novos produtos e soluções para comércio eletrônico. As aplicações web personalizadas incluem sistemas específicos para cada negócio ou ainda personalizado para cada cliente LOCALIZAÇÃO DA EMPRESA A Yogh possui uma sede, que está localizada na Rua Desembargador Nelson Nunes Guimarães, número 1283, Bairro Atiradores, em Joinville, no estado de Santa Catarina.

17 5 3. DESENVOLVIMENTO 3.1. ANÁLISE DAS NECESSIDADES DO CLIENTE O objetivo dessa atividade é obter o maior número de detalhes sobre as necessidades do cliente, segundo Daniel Aisenberg (2004) no artigo "A importância do briefing em sites de empresas" a coleta de informações é um passo muito importante no projeto de desenvolvimento web porque mostra o rumo certo desde o início do projeto, mostrando claramente grande parte dos detalhes envolvidos. Com a coleta de dados documentada, a perda de informações é menor e a chance do projeto apresentar desvios quando comparados à visão do cliente também são consideravelmente menores. A identificação de necessidades essenciais do cliente é um documento que apresenta de forma estruturada as necessidades específicas do projeto para o desenvolvimento do site. Através de um modelo criado pela empresa é feita uma entrevista com o cliente para coletar informações, a estrutura desse documento apresenta primeiramente os dados básicos da empresa e formas de contato. Na sessão "O projeto" são listados os recursos e objetivos principais do projeto, descrição do público-alvo, concorrentes, sites de referência, valor do investimento e prazo de execução, já em "Informações sobre a empresa" são dadas informações que definam a empresa, como produtos e serviços que oferecem, pontos fortes e imagem que deseja transmitir, em "Público alvo da Empresa" é descrito o perfil do público-alvo do cliente, localização, renda, faixa etária, entre outros. Na definição do projeto são listados os responsáveis na empresa do cliente na comunicação e tomada de decisões sobre o projeto, além de detalhes específicos do projetos, como público-alvo pretendido e detalhes sobre a estrutura visual, recursos adicionais, detalhes sobre administração de domínio e hospedagem e contas de NECESSIDADES DA CLIENTE MÔNICA SCHULZ Através do documento de necessidades do cliente foi constatado que o site Mônica Schulz deve ser atualizado, pois já não atende o esperado atualmente pelo público alvo

18 6 quanto a atratividade, tecnologia e usabilidade. A empresa deseja manter a cor atual, mas deseja um site com tons mais vivos, as fotos devem ser o foco da apresentação visual. O público-alvo são pessoas que irão fazer eventos como aniversário e casamento, e os clientes geralmente são da região. Como conteúdo do site, a empresa deseja as páginas Home, Doces, Canapés e Contato, já quanto a recursos adicionais, foi solicitado o mapa do Google na página de contatos, otimização SEO básica e relatório de acesso NECESSIDADES DA CLIENTE FABÍOLA BERNARDES Através do documento de necessidades foi constatado que o site Programa Fabíola Bernardes deve ser atualizado, pois o site atual não possui a identidade atual do programa e não recebe mais otimizações. A cliente deseja uma nova identidade visual para seu site e recursos adicionais, como nova área de matérias, dicas, galeria de fotos, área de banners para parceiros, recurso de busca e chamada para cadastro. Atividades desenvolvidas: Analisar as necessidades do cliente. Dificuldades encontradas: Dificuldade em recolher todas as informações necessárias para o preenchimento do documento de necessidades. Formas utilizadas para vencer as dificuldades: Além de entrevistas com os clientes foram feitas pesquisas do conteúdo já existente nos seus sites atuais: e Novos aprendizados adquiridos: - Como recolher informações para o projeto Atividade Analisar as necessidades do cliente RESUMO DO ESTÁGIO - 2. A EMPRESA, 3. DESENVOLVIMENTO Data de % de Tempo realização e Fonte dos dados conclusão gasto horários (acumulado) 02/09/ :00 as 12:00 14:00 as 16:00 03/09/2010, 08:00 as 12:00 10:00 - Entrevista com cliente. - Site com.br Quadro 1: Relatório das atividades realizadas de 02/09/2010 a 03/09/ horas 4 % Índice de conclusão da atividade 10 de 10 horas (100%) 3.2 PROTOTIPAÇÃO DA PÁGINA O objetivo da prototipação é obter as necessidades do cliente em forma de estrutura básica do website, ainda sem preocupação com visual e tecnologia.

19 7 Segundo Lyndon Cerejo (2010) no artigo Design Better And Faster With Rapid Prototyping (Design melhor e mais rápido com prototipação rápida) a prototipação facilita o entendimento da equipe de desenvolvimento e do próprio cliente sobre o visual e comportamento do website. O protótipo pode ser rapidamente validado com grandes equipes, já que detalhes visuais e tecnológicos não são discutidos nesse ponto. Essa etapa do projeto acelera a criação da ideia e evita que trabalho seja refeito nas etapas de design e desenvolvimento, já que o retorno é dado imediatamente e no ponto inicial do projeto. O processo de prototipação também permite que novas necessidades sejam encontradas e soluções sejam dadas no início do projeto O PROCESSO DE PROTOTIPAÇÃO Para o desenvolvimento dos protótipos foi utilizada a ferramenta Balsamiq Mockups, uma ferramenta proprietária de baixo custo, destinada a desenvolver protótipos de baixa fidelidade, ou seja, que representam somente a organização das informações e não o conceito final do projeto: Figura 1: Interface da ferramenta Balsamiq Mockups

20 8 Para o desenvolvimento do protótipo é utilizado um template que possui as medidas adotadas como padrão para a criação posterior da página web. Para cada página é utilizado o método iterativo, inicialmente são colocados todos os componentes necessários de forma básica e através de discussão com o demais membros da equipe é feito um novo refinamento. Além dos objetivos já descritos pelo cliente, é feita uma análise sobre tendências da web na mesma área de atuação, para entender que tipo de informação o cliente final espera. O resultado final são telas que demonstram de forma simples os detalhes que precisam estar no web site: Figura 2: Protótipo da página Home para a cliente Fabíola Bernardes

21 9 Atividades desenvolvidas: Prototipar a página Dificuldades encontradas: Transformar as necessidades reais do cliente em modelo de página web completa e atrativa. Formas utilizadas para vencer as dificuldades: Discussão e aprimoramento do protótipo com outros membros da equipe e clientes, além de análise de empresas semelhantes. Novos aprendizados adquiridos: - Como organizar as informações de um projeto para desenvolvimento visual de forma rápida Atividade Prototipar a página RESUMO DO ESTÁGIO - 2. A EMPRESA, 3. DESENVOLVIMENTO Data de % de Tempo realização e Fonte dos dados conclusão gasto horários (acumulado) 03/09/ :00 as 16:00 06/09/2010, 08:00 as 12:00 14:00 as 16:00 08/09/ :00 as 10:00 10:00 - Entrevista com cliente. - Site magazine.com Quadro 2: Relatório das atividades realizadas de 03/09/2010 a 08/09/ horas 8 % Índice de conclusão da atividade 10 de 10 horas (100%) 3.3 DEFINIR IDENTIDADE E PADRÕES O objetivo dessa atividade é obter a identidade visual das páginas, baseado nas necessidades e características do cliente. Conhecendo as necessidades, objetivos e com o protótipo do website o desafio é desenvolver os elementos visuais para a página web, que simultaneamente demonstram a identidade da empresa e atinjam as necessidades especificadas pelo cliente. De acordo com Dmitry Fadeyev (2008) no artigo Strategic Design: 6 Steps for building successful websites (Design Estratégico: 6 passos para a criação de Websites de sucesso) a criação do web design é um processo que envolve diferentes fatores, envolvendo desde o estudo da identidade da marca e personalidade da empresa até a escolha de padrões e guias que facilitem a utilização do usuário e os leva a executar as ações que estão dentro dos objetivos da empresa REGRAS DE DESENVOLVIMENTO Para desenvolver o design de uma página web existem regras básicas que devem ser seguidas, como padrões de dimensões e boas práticas para facilitar a implementação.

22 Padrão 960 grid system 10 De acordo com o 960.gs (2010) o 960 Grid System é um processo de trabalho que delimita as dimensões da página e define grids onde o conteúdo será distribuído. O objetivo desse padrão é manter o design da página em conformidade com o padrão atual de resolução dos monitores e oferecer um guia que facilita o desenvolvimento de elementos para a página, tornando esses elementos alinhados e com dimensões harmoniosas. O 960 Grid System conta com um template de 960 pixels de largura, tendo em cada lateral 10 pixels de folga. Além disso o template é dividido em grids de 12, 16 ou 24 colunas. O padrão utilizado para o desenvolvimento das páginas nesse projeto foi de 16 colunas: Figura 3: Tela do software de criação Photoshop com o template base do 960 Grid System, com 16 colunas DESENVOLVIMENTO DAS PÁGINAS Com o protótipo da página e as regras básicas definidas a tarefa é definir a personalidade da página que simultaneamente reflita a empresa e atenda seus objetivos específicos.

23 11 O design das páginas foi desenvolvido utilizando o programa de criação gráfica Photoshop, o software foi utilizado pois apresenta um conjunto de ferramentas gráficas poderosas para ser possível desenvolver um design realmente atrativo Criação da Identidade visual da página Mônica Schulz Para atender o enfoque principal de Mônica Schulz, que é chocolates, foi desenvolvido o design da página pensando na cor marron com textura romântica, além de um forte contraste em azul com textura de papel, para remeter a aparência de um doce decorado. Esse padrão de cores foi escolhido baseado na análise de sites feita pelo Editorial da Smashing Magazine (2010): Showcase of Sweet Chocolate Websites (Caso de Websites de Chocolate), segundo o artigo esses sites apresentam comumente a predominância de marron para despertar o apetite, que pode ser combinada com uma infinidade de cores. A cor azul turquesa foi utilizada por representar bem a embalagem clássica de trufas, e além disso é um tom que quebra o tom escuro do marron predominante. Basicamente, as cores e texturas que se repetem pela página são as seguintes: Figura 4: Cores e texturas utilizadas na página Mônica Schulz Para a navegação e reconhecimento rápido do usuário pela página o cabeçalho da página conta com a logomarca da empresa em destaque com o menu:

24 12 Figura 5: Cabeçalho do site Doces Mônica Schulz Segundo Vitaly Friedman (2008), no artigo Navigation Menu: Trends and Examples (Menu de navegação: Tendências e exemplos) o menu de navegação é um ítem crucial em um Website, que permite o usuário acessar rapidamente as áreas do site. Tendo como base os elementos essenciais o esqueleto com identidade visual da página está desenvolvido: Figura 6: Esqueleto e Identidade visual do site Mônica Schulz Criação da Identidade visual da página Fabíola Bernardes O objetivo principal do site é receber a audiência que a apresentadora já possui na televisão, passando o visual de glamour, feminilidade e elegância conhecido, e além disso dar

25 13 acesso rápido a todas as informações essenciais que envolvem o programa, como acesso as mídias sociais e canais e revistas que a apresentadora está presente. Para atender as necessidades, foram utilizadas texturas que representam cores femininas, o roxo e bege, seguindo as definições de Hideaki Chijiiwa (1992) no livro Color Harmony, a guide to creative color combinations (Harmonia de Cor: um guia prático para a combinação de cores criativas). Figura 7: Cores que representam feminilidade de acordo com o livro Color Harmony, a guide to creative color combinations Para texturizar a página foram utilizados losangos, representando elegância, comumente encontrados em sites de vinhos e champagnes, essa relação foi feita com base na análise de sites que representam a personalidade elegante e brilhante requerida pela cliente. Figura 8: Exemplo de site brilhante usado como referência para o design da do site Programa Fabíola Bernardes As texturas e cores utilizadas foram as seguintes: Figura 9: Cores e texturas utilizadas na página Fabíola Bernardes

26 14 Para acesso rápido as funções principais do site o cabeçalho contém além de uma imagem da apresentadora link para mídias sociais e informações sobre revistas e canais de televisão onde ela está presente, além de um campo de busca rápida ao conteúdo do site. O resultado foi o seguinte: Figura 10: Cabeçalho do site Fabíola Bernardes A estrutura básica da página conta com o cabeçalho, uma área central de atenção, com os ítens mais importantes e mais um área, reservada para informações adicionais: Figura 11: Esqueleto e Identidade visual do site Fabíola Bernardes

27 15 Atividades desenvolvidas: Desenvolver a identidade visual dos sites Dificuldades encontradas: Transmitir a identidade da empresa e criar uma interface atrativa e acessível para os usuários Formas utilizadas para vencer as dificuldades: Análise de padrões de cores e empresas do mesmo ramo Novos aprendizados adquiridos: - Combinação de cores e aplicação em estrutura de página web Atividade Definir identidade e padrões de página RESUMO DO ESTÁGIO - 2. A EMPRESA, 3. DESENVOLVIMENTO Data de % de Tempo realização e Fonte dos dados conclusão gasto horários (acumulado) 08/09/ :00 as 12:00 14:00 as 16:00 09/09/2010, 10/09/2010, 11/09/2010, 12/09/2010, 13/09/2010, 14/09/2010, 15/09/2010, 16/09/ :00 as 12:00 Das 14:00 as 16:00 17/09/2010das 08:00 as 12:00 50:00 - Entrevista com cliente. - Site magazine.com - Livro Color Harmony, a guide to creative color combinations Quadro 3: Relatório das atividades realizadas de 08/09/2010 a 17/09/ horas 29 % Índice de conclusão da atividade 50 de 40 horas (125%) 3.4 DESENVOLVIMENTO DAS ÁREAS INTERNAS DAS PÁGINAS O desenvolvimento das páginas internas é feito utilizando as mesmas regras aplicadas na criação da identidade da página, para o desenvolvimento dos componentes são utilizadas como base as divisões de 16 colunas do 960 grid system. Para a criação dos componentes internos foram utilizadas como base definições básicas para interfaces com usuários, segundo o livro Smashing Book (2009) uma boa interface com o usuário não depende somente de um arranjo de menus e botões, e sim da facilidade de interação de um grande grupo de usuários com a aplicação, no desenvolvimento da interface com o usuários algumas características devem ser observadas, a interface deve basicamente ser simples e clara para o usuário não se perder no conteúdo, além disso os elementos da página, principalmente os que terão interação, devem ser familiares para facilitar o reconhecimento rápido do usuário.

28 Baseado nos conceitos básicos de usabilidade para web foram desenvolvidas as seguintes páginas: PÁGINA HOME DA CLIENTE MÔNICA SCHULZ Segundo Derek Powasek (2008) no artigo Home Page Goals (Objetivos da página home) a primeira página do site deve responder rapidamente ao usuário coisas básicas como o que é aquele site e para que ele serve, além de mostrar o caminho rápido às áreas que ele pretende entrar. Para atender a essas especificações foi desenvolvida uma página com uma área de destaque para apresentar a empresa e uma área de ação para direcionar às páginas mais importantes do site. A visão geral do resultado é a seguinte: Figura 12: Visão geral da página home do site Mônica Schulz Chamadas em destaque Baseado nas necessidades principais da cliente foi criada na página home uma área de destaque, com uma descrição rápida e chamada comercial, para que o usuário entenda rapidamente do que se trata o site. Visando o acesso rápido às áreas mais importantes do site, doces e canapés, foi criada uma chamada destacada para essas áreas com botões. De acordo com Steve Krug (2000) no livro Don t make me think (Não me faça pensar) os botões call to action (chamada para

29 17 ação) devem ser de rápido conhecimento pelo usuário, para que isso aconteça ele recomenda que se deixe claro a área clicável e que os textos sejam pequenos, assim facilmente o usuário entenderá e executará a ação. Figura 13: Áreas em destaque na home do site Mônica Schulz Área explicativa Para complementar o entendimento do site e da empresa sobre a página foi criada logo abaixo da área de destaques campos com informações importantes sobre a empresa.para esse conteúdo ser totalmente lido o usuário terá que utilizar a navegação da página no browser, no caso do monitor ser muito pequeno, mas esse problema não se apresentou relevante porque apesar de importante, essa área tem menos prioridade que a área de destaque para leitura. Figura 14: Área explicativa sobre a empresa na home do site Mônica Schulz PÁGINA DE DOCES E CANAPÉS DO SITE MÔNICA SCHULZ As páginas de doces e canapés possuem o mesmo layout, que atendem o mesmo objetivo básico, que é mostrar fotos dos doces e canapés em geral e apresentar as variades disponíveis em texto.

30 Para isso foi criada uma galeria de imagens em destaque para mostrar as fotos em tamanho grande: 18 Figura 15: Galeria de imagens nas páginas de doces e canapés do site Mônica Schulz Para apresentar os doces e canapés disponíveis em texto foi criada uma área de menu que organiza os sabores/modelos disponíveis em categorias: Figura 16: Apresentação das opções de doces e salgados diferentes nas páginas de doces e canapés do site Mônica Schulz O resultados das páginas de doces e canapés são os seguintes:

31 19 Figura 17: Página de Doces no site Mônica Schulz Figura 18: Página de Canapés no site Mônica Schulz

32 3.4.3 PÁGINA DE CONTATO DO SITE MÔNICA SCHULZ 20 Para a página de contato foi desenvolvido um formulário com as solicitações da cliente, além dos dados de contato, como telefone e . A localização da empresa foi destacada com um mapa que poderá ser ampliado. Figura 19: Página de Contato no site Mônica Schulz PÁGINA HOME DO SITE PROGRAMA FABÍOLA BERNARDES A página home do site Programa Fabíola Bernardes conta com vários recursos para atender as necessidades atuais da empresa. Na área de destaque foram inseridos os elementos mais importantes da página: chamada para mídias sociais (1), campo de busca (2), horários de veiculação do programa (3), Banners de parceiros (4) e chamada para as matérias em destaque (5). Na área inferior foram colocados os elementos que também são importantes, porém menos prioritários: campo para newsletter (6) e área de últimos eventos (7).

33 21 Figura 20: Página home do site Programa Fabíola Bernardes O posicionamento dos elementos foi decidido baseado em um estudo apresentado por Steve Krug (2000), no livro Don t make me think (Não me faça pensar). Segundo o autor a forma mais comum de busca por informações em um site é primeiramente procurar por algo interessante ou que o usuário esteja buscando, em seguida ele procura por elemento clicáveis, e se obtiver a motivação necessária, continua buscando mais informações no site.

34 22 Figura 21: Forma comum de leitura de um website de acordo com o livro Don t make me think Atividades desenvolvidas: Fazer o desenvolvimento visual das páginas Dificuldades encontradas: Encontrar os melhores posicionamentos e destaques para elementos importantes na página Formas utilizadas para vencer as dificuldades: Análise de padrões da web de posicionamento de informações Novos aprendizados adquiridos: - Combinação de cores e aplicação em estrutura de página web Atividade RESUMO DO ESTÁGIO - 2. A EMPRESA, 3. DESENVOLVIMENTO Data de realização e horários Tempo gasto Fonte dos dados % de conclusão (acumulado) Índice de conclusão da atividade Fazer o desenvolv imento visual das páginas 20/09/ :00 as 16:00 21/09/2010, 22/09/2010, 23/09/2010, 24/09/2010, 27/09/2010, 28/09/2010, 29/09/2010, 01/10/2010, 04/10/ :00 as 12:00 das 14:00 as 16:00 05/10/2010 Das 08:00 as 12:00 60:00 - Site art.com/ - Livro Don t make me thing 130 horas 54 % 60 de 50 horas (120%) Quadro 4: Relatório das atividades realizadas de 20/09/2010 a 05/10/2010.

35 3.5 IMPLEMENTAÇÃO DO SITE MÔNICA SCHULZ NO WORDPRESS 23 Para facilitar a criação da página e a futura manutenção e gerenciamento de conteúdo o site foi desenvolvido em Wordpress, um CMS (sistema administrador de conteúdo). Segundo James Robertson no artigo So, what is a CMS? (Então, o que é CMS?), Content Management System (Sistema gerenciador de conteúdo) é um sistema que suporta criação, gerenciamento, distribuição e publicação de informações na web, um sistema gerenciador de conteúdo como o Wordpress facilita desde a criação de páginas até a criação e manutenção de conteúdos, através de ferramentas simples. Além disso é extremamente rápido agregar novas funcionalidades no site através de extensões disponibilizadas na comunidade wordpress.org. A linguagem utilizada para o desenvolvimento no wordpress é php, com base de dados mysql, para os estilos e construção visual é utilizado html e css, além de instruções prédefinidas pelo Wordpress e jquery e Java Script. O PHP, de acordo com o site da comunidade, é uma linguagem de programação projetada para a Web, que pode ser integrado ao HTML, que por sua vez é uma linguagem de marcação que é interpretada por browsers. O PHP no momento da criação desse relatório está na versão 5. O MySQL, de acordo com a empresa desenvolvedora é um sistema gerenciador de banco de dados projetado para a web de alta performance. No desenvolvimento será utilizado o Wordpress 3, que possui licensa de uso GNU GENERAL PUBLIC LICENSE (JUNHO 2007). Para utilização do wordpress basta baixar o código com as funções e templates básicos na comunidade e utilizar um servidor com apache e mysql instalado. A estrutura do CMS possui várias pastas com arquivos php referentes a configuração, templates, plugins e outros. Para criação do site no wordpress são criados templates para as páginas, utilizando o design já definido.

36 24 Figura 22: Estrutura de pastas e arquivos do CMS Wordpress CRIAÇÃO DOS TEMPLATES NO WORDPRESS Por padrão, qualquer projeto do Wordpress possui templates básicos que são customizados com o design especificado, os arquivos ficam armazenados em wpcontent\themes\default e são os seguintes: header.php e footer.php. Além dos templates básicos, foram criados templates adicionais para as páginas internas: homed.php, doces_canapes.php, contact.php, contact-map.php e sidebar-doces_canapes.php Definição de estilos Todas as definições de imagens e estilos são feitas no arquivo style.css para manter a organização do template. De acordo com o W3schools (2008), CSS são folhas de estilo em cascata que servem para definir padrões de estilos para elementos em uma página web.

37 A definição básica do css define o estilo do background, títulos e a largura da página, definida, os estilos definidos no design agora são aplicados ao template. 25 Um detalhe importante na implementação do estilo básico é a utilização de padrões pequenos com repetição para manter o site rápido, a imagem que forma o fundo da página, por exemplo, é um padrão de 138 x 89 pixels com apenas 2.26 KB que se repetem pela página.

38 Customização do template header 26 Nesse template foi adicionado uma chamada para a logo e o menu, da seguinte forma: As definições de imagens e estilos ficam armazenadas no arquivo style.css: Para o menu é necessário se definir estilos para quando ele está sem ação, quando o usuário passa o mouse (hover) e para quando o elemento está selecionado (active). Por padrão o browser Internet Explorer 6 não suporta essa característica do menu, no desenvolvimento de páginas ainda é importante que haja suporte a esse browser, pois ainda há uma grande quantidade de usuários, apesar da quantidade cair a cada ano. De acordo com a pesquisa do site w3schools.com (2010), em 2010, o Internet Explorer representa 31.1% entre os browsers utilizados no mercado. Figura 23: porcentagem de uso do browser Internet Explorer comparado aos demais em 2010 pelo site w3schools.com

39 Dentro dessa porcentagem o Internet Explorer 6 representa 5.6% do mercado 27 Figura 24: porcentagem de uso do browser Internet Explorer 6 comparado as demais versões em 2010 Por esse motivo foi necessário desenvolver uma solução compatível com o Internet Explorer 6. Para solucionar este problema Karl Swedberg (2007) recomenda o uso do plugin jquery através do artigo Quick Tip: Set Hover Class for Anything (Dica rápida: definindo a classe hover para qualquer coisa). Pela definição da comunidade jquery.org, este plugin é uma biblioteca em JavaScript que simplifica criação de eventos, animação e efeitos. Baseado nas dicas do artigo foi desenvolvido o seguinte script para adicionar o efeito jquery de hover e remover o hover padrão, que não é compatível com o browser Internet Explorer 6: Este recurso foi aproveitado em menus internos da página, por este motivo já são chamados os estilos #sidebar_doces_canapes_menu li e #home_doces_canapes, que não fazem parte do cabeçalho. Os estilos para o menu foram definidos no documento de estilos:

40 28 O resultado da header é o seguinte: Figura 25: Resultado da implementação do cabeçalho do site Mônica Schulz Customização do template footer empresa: A implementação do rodapé é simples, sendo aplicado somente o texto de direitos da

41 29 Os estilos criados para o rodapé definem fontes, estilo dos direitos e chamada para imagem do selo da empresa desenvolvedora Customização do template home Na definição básica do novo template são inseridas definições do wordpress no arquivo homed.php que chamam o cabeçalho: <?get_header();?> e o rodapé: <? get_footer();?> Para a definição da área superior da página, com conteúdo e links para as principais páginas foram inseridos os seguintes blocos:

42 30 A partir dessas definições os conteúdos que serão escritos posteriormente no gerenciador de conteúdo aparecerão na página, além disso foram inseridas as chamadas para as páginas mais importantes do site, os estilos foram definidos na página de estilos. Um detalhe importante dos estilos é a definição de mudança da transparência ao se passar o mouse sobre os botões utilizando-se o filtro alpha.

43 Na parte inferior da página home foram definidas três área de descrição que foram implementadas de forma a buscar o conteúdo escrito no gerenciador de conteúdo. 31 O estilo da área inferior apresenta um fundo com textura turquesa, além da definição de imagens, títulos e conteúdo Customização do template doces e canapés As páginas de doces e canapés possui o mesmo layout, dessa forma é necessário criar somente um template.

44 32 Antes do desenvolvimento do template dessa página foi criado o componente sidebar, que irá mostrar os tipos disponíveis de doces e canapés, além de um componente com mensagem comercial na direita. O sidebar foi desenvolvido da mesma maneira que os demais componentes, e assim que precisar ser utilizado é invocado na página. Os efeitos e arredondamentos presentes no componente foram criados no template header. Após a criação do sidebar a base do template de doces e canapés é criado, buscando o conteúdo que será inserido na página e invocando o template sidebar: Para a finalização do template de doces e canapés e criação do template de contato será necessária a instalação de plugins adicionais no wordpress CUSTOMIZAÇÃO DE FERRAMENTAS ADICIONAIS PARA O SITE Para atender algumas necessidades específicas do site foram importadas e customizadas extensões do Wordpress para a galeria, formulário de contato, mapa e inserção de fontes que não são padrão do sistema. Por padrão, todas as extensões do wordpress são automaticamente instaladas quando colocadas na pasta plugins Extensão slideshow gallery Segundo a empresa desenvolvedora Tribulant (2010), o Slideshow Gallery é uma extensão compatível com a versão 3 do wordpress que utiliza jquery para animação e possui fácil integração. Para customizar o plugin as imagens dos botões Ir e Voltar foram trocados e os estilos no documento css. Após a customização basta invocar a galeria no template de doces e canapés:

45 Extensão contact form De acordo com o desenvolvedor, o Contact Form 7 (2010) é uma extensão utilizada para gerenciar com facilidade formulários de contato para envio de informações por . Esta extensão foi utilizada na página de contato, e foi invocada da seguinte maneira: Extensão google maps for wordpress Este plugin permite a inserção de mapas do google no site, permitindo a navegação pelo usuário. Na página de contato o mapa navegável é mostrado em um componente no chamado FancyBox, segundo o site do desenvolvedor, essa ferramenta mostra conteúdo, como imagens, multimídia e outros em sobre uma caixa escura que cobre o restante do site.

46 Extensão wp cufon 34 Segundo Erik Olson (2009) no artigo Cufón Font Replacement The good and the bad (Substituição de fontes Cufón o bom e o ruim) cufón é uma técnica de substituição de fontes que utiliza JavaScript para importar uma fonte do servidor, transformar o texto em imagem, e manter o conteúdo textual. Para a customização do plugin é necessário criar uma pasta em plugins chamada fonts e inserir a fonte, nesse caso a KennedyDB Normal.otf. Dessa forma quando essa fonte for definida nos estilos a extensão criará uma imagem do texto. Figura 26: Fonte KennedyDB renderizada na página web sem necessidade do usuário possuí-la na máquina CRIAÇÃO DE PÁGINAS E INSERÇÃO DE CONTEÚDO Após a criação e configuração dos templates no Wordpress é necessário criar as páginas e inserir conteúdo. A criação das páginas e conteúdo é feita através do painel de administração do Wordpress: Figura 27: Interface de administrador de conteúdo no Wordpress.

47 Criação das páginas 35 Para criar as páginas do site é necessário clicar em Páginas > Adicionar nova. Em seguida, é definido um título para a página e, em atributos da página é escolhido o template criado para a página. Figura 28: Criação de uma nova página no wordpress Em casos específico, como no menu que mostra tipos de doces e canapés disponíveis e os elementos inferiores da página home, para cada elementos novo é criado uma nova página, e em atributos da página é escolhido como Mãe a página principal, como Doces, Salgados ou Home. Figura 29: Criação de um elemento interno, no exemplo, um elemento do menu interno na home

48 Inserção e configuração de conteúdo 36 Com todas as páginas criadas é necessário inserir o conteúdo e configurar dados de alguns plugins através do painel de administração. Para inserir conteúdo nas páginas é necessário digitar o conteúdo no editor de texto do administrador e definir os estilos já criados no nos estilos css. Por exemplo, na página home o título foi definido no editor como Cabeçalho 1, pois foi o elemento H1 foi definido com estilos diferenciado no css. Figura 30: Criação de conteúdo para a página Home Para a criação dos dados de contato foi necessária a criação de campos personalizados para definir dados como endereço, telefone e . Figura 31: Inserção de campos personalizados

49 Para buscar esses dados, o template da página de contato chama os ítens da seguinte forma: 37 $contact_info = get_post_custom($post->id); O plugin do mapa deve ser configurado na administração para adicionar a API key do google, este que referencia o mapa da empresa. Segundo a página da Google a API permite integrar o Google Maps à página web. Para criar a API Key basta acessar o site de códigos da Google, disponível em Figura 32: Configuração do mapa da google na página de contato. Atividades desenvolvidas: Implementar a interface no wordpress; Customização de ferramentas adicionais para o site; Inserção do conteúdo pela interface de administração do wordpress; Verificação d os requisitos mínimos de usabilidade Dificuldades encontradas: Customizar a extensão do google maps para que abrisse o conteúdo em uma caixa externa Formas utilizadas para vencer as dificuldades: Utilização da ferramenta FancyBox Novos aprendizados adquiridos: - Utilização de templates no Wordpress e plugins de efeito Atividade Implementa r a interface no Wordpress, Customizaç ão de ferramentas adicionais para o site RESUMO DO ESTÁGIO - 2. A EMPRESA, 3. DESENVOLVIMENTO % de Data de realização e Tempo conclusão Fonte dos dados horários gasto (acumulad o) 05/10/ :00 as 16:00 06/10/2010, 07/10/2010, 08/10/2010, 11/10/2010, 13/10/2010,14/10/2010, 15/10/2010, 18/10/2010, 19/10/2010, 20/10/2010, 21/10/2010, 22/10/2010 e 25/10/ :00 - Site - Site om - Site - Site - Site m/apis/maps Quadro 5: Relatório das atividades realizadas de 05/10/2010 a 25/10/ horas 87 % Índice de conclusão da atividade 80 de 60 horas (133%)

50 3.6 OTIMIZAÇÃO DAS PÁGINAS PARA SITES DE BUSCA (SEO) NO SITE MÔNICA SCHULZ 38 Para o site da Mônica Schulz foi feita a otimização SEO OnPage. Segundo Jennifer Grappone e Gradiva Couzin (2006) no livro Search Engine Optimization: An hour a day (Sistema de otimização de buscas: uma hora por dia) Search Engine Optimization é uma série de atividades que pretendem aumentar o número de visitantes que chegam em uma página web através de sites de busca como Google, Yahoo, Bing e outros. Essas atividades envolvem alterações nos textos das páginas e HTML e codificação da página segundo os padrões do W3C (de acordo com o site da organização é uma comunidade internacional que desenvolve padrões de desenvolvimento e interpretação de páginas web) análise de concorrentes e do público alvo do cliente, entre outros. A otimização do site teve como foco o mercado de pessoas que procuram por doces para eventos na região de Joinville ANÁLISE DO SITE ATUAL Para definir pontos importantes de otimização foi feita uma breve análise do site que está atualmente no ar. A página em questão foi desenvolvida em Flash e sem nenhum conteúdo textual visível para os buscadores, o único ítem que poder ser encontrado é o título Mônica Schulz. Os ítens encontrados na página se chamam SERP (Search Engine Result Page Página de resultado dos sistemas de busca). Flávio Cabral Filho (2008), Analista Sênior da empresa MestreSEO, descreve no seu artigo SEO e Flash que as ferramentas de busca não conseguem indexar com facilidade conteúdos desenvolvidos com a tecnologia Flash, pois não é possível para os buscadores buscar os links das páginas desenvolvidas com essa tecnologia. Apesar de não possui otimização o site apresentou tráfego médio de 100 visitas/mês nos meses de Agosto, Setembro e Outubro, essa análise foi feita com a ferramenta Google Analytics.

51 39 Figura 33: Acessos ao site atual da Mônica Schulz entre Agosto e Outubro ANÁLISE DE CONCORRENTES Primeiramente foram listados os concorrentes da empresa que possuem site e obtiveram boas posições no buscador da Google. Os termos pesquisados foram doces finos, doces finos em Joinville, doces para eventos em São Paulo e Doces para eventos em Joinville. Foi feita uma breve análise do código fonte nos concorrentes: Kiki Ferreira, D Paula Doces e Dona Zeny Análise do site O site dessa empresa também está em Flash, porém possui descrição e keywords (palavras-chave) no código-fonte: Análise do site O site foi desenvolvido utilizando HTML e css e os links são canônicos, ou seja, tem um link com texto significante, ao invés da página de produtos se chamar apenas page1, por

PROPOSTA DE CRIAÇÃO E DESENVOLVIMENTO DE WEBSITE

PROPOSTA DE CRIAÇÃO E DESENVOLVIMENTO DE WEBSITE PROPOSTA DE CRIAÇÃO E DESENVOLVIMENTO DE WEBSITE Através do presente documento, a agência ACNBRASIL tem como objetivo apresentar uma proposta de criação e desenvolvimento de Website para COOPERATIVA DE

Leia mais

R.A. MKT. Soluções em Mídias Sociais, E-Marketing, Branding e Design

R.A. MKT. Soluções em Mídias Sociais, E-Marketing, Branding e Design R.A. MKT Soluções em Mídias Sociais, E-Marketing, Branding e Design Soluções em Mídias Sociais, E-Marketing, Branding e Design Principais serviços que realizamos: Criação da Identidade Visual, desde Logo

Leia mais

ESTÁGIO CURRICULAR I e II SISTEMA DE MONITORAMENTO DE TI EM SOFTWARE LIVRE

ESTÁGIO CURRICULAR I e II SISTEMA DE MONITORAMENTO DE TI EM SOFTWARE LIVRE FERNANDO RODRIGO NASCIMENTO GUSE i ESTÁGIO CURRICULAR I e II SISTEMA DE MONITORAMENTO DE TI EM SOFTWARE LIVRE EMPRESA: Globalmind Serviços em Tecnologia da Informação LTDA. SETOR: Infra Estrutura SUPERVISOR:

Leia mais

Prezado Senhor, Em prosseguimento aos nossos entendimentos, estamos formalizando a nossa proposta para desenvolvimento do site da Digivox.

Prezado Senhor, Em prosseguimento aos nossos entendimentos, estamos formalizando a nossa proposta para desenvolvimento do site da Digivox. João Pessoa, 18 de Agosto de 2015. Prezado Senhor, Em prosseguimento aos nossos entendimentos, estamos formalizando a nossa proposta para desenvolvimento do site da Digivox. 1. Projeto Desenvolvimento

Leia mais

23 LOCAIS ESTRATÉGICOS PARA INSERIR O OPT-IN DO EMAIL MARKETING

23 LOCAIS ESTRATÉGICOS PARA INSERIR O OPT-IN DO EMAIL MARKETING WHITEPAPER 23 LOCAIS ESTRATÉGICOS PARA INSERIR O OPT-IN DO EMAIL MARKETING Por Juliana Padron CEO da Templateria INFO@TEMPLATERIA.COM WHITEPAPER 23 LOCAIS ESTRATÉGICOS PARA INSERIR O OPT-IN DO EMAIL MARKETING

Leia mais

STUDIO WEB. Contato 81 99704547 REVER CONECT

STUDIO WEB. Contato 81 99704547 REVER CONECT STUDIO WEB Contato 81 99704547 REVER CONECT Ferramentas que podem ser interessantes para a boa performace do seu sistema (site) Gestão de conteúdos - área para inserção e gerenciamento de conteúdos tais

Leia mais

Proposta. Site em Flash (Ramo de Cosméticos) Versão: 01 Data: 09/08/2007 Validade: 30 dias. Para

Proposta. Site em Flash (Ramo de Cosméticos) Versão: 01 Data: 09/08/2007 Validade: 30 dias. Para Proposta Projeto: Site em Flash (Ramo de Cosméticos) Versão: 01 Data: 09/08/2007 Validade: 30 dias Para Contato: e-mail: enviapara@gmail.com Telefone: (21) 9657-2174 Escrita por Empresa: Swiss Web Ltda.

Leia mais

JULIANA MOKWA. EST Á G I O C URRI C U L A R I e II D ESE N V O L V I M E N T O D E W E BSI T E

JULIANA MOKWA. EST Á G I O C URRI C U L A R I e II D ESE N V O L V I M E N T O D E W E BSI T E JULIANA MOKWA EST Á G I O C URRI C U L A R I e II D ESE N V O L V I M E N T O D E W E BSI T E EMPRESA: YOGH SOLUÇÕES PARA INTERNET LTDA SETOR: DESENVOLVIMENTO WEB SUPERVISOR: LUCAS SIMÕES DE CARVALHO ORIENTADOR:

Leia mais

Proposta Revista MARES DE MINAS

Proposta Revista MARES DE MINAS SATIS 2011 Proposta Revista MARES DE MINAS 21/03/2011 A SATIS Índice 1 A Satis 1 A Proposta 1 Serviços 2 Mapa do Site 2 SEO 3 Sistema de gerenciamento de conteudo 4 Cronograma e Prazos 5 Investimento 6

Leia mais

SISTEMA PARA PORTAL DE NOTÍCIAS: Jornais, Revistas, Televisão etc

SISTEMA PARA PORTAL DE NOTÍCIAS: Jornais, Revistas, Televisão etc SISTEMA PARA PORTAL DE NOTÍCIAS: Jornais, Revistas, Televisão etc Técnica SEO: Search engine Optimization "INDEXADOR" Web Software para Grandes Portais (Gera todo o conteúdo SEO - Otimizado nas buscas)

Leia mais

Tabela de Preços Sugeridos

Tabela de Preços Sugeridos WEBSITE Estrutura básica Área institucional Área estática: quem somos, o que fazemos, onde estamos etc. Área de contato E-mail, telefone, formulário etc. Área core Gerenciador de conteúdo para cadastro

Leia mais

TIRE SEU PROJETO DA GAVETA. kinghost.com.br

TIRE SEU PROJETO DA GAVETA. kinghost.com.br TIRE SEU PROJETO DA GAVETA #1 Escolha a ferramenta ideal para impulsionar seu negócio. Existem diversas ferramentas no mercado que podem lhe auxiliar na hora de montar e administrar seu negócio. São plataformas

Leia mais

Projeto: Site Everlast Cliente: Rodrigo. Analista: Adriano Cortez Designer: Davi Barbosa Contatos: Informações importantes: Descrição do projeto:

Projeto: Site Everlast Cliente: Rodrigo. Analista: Adriano Cortez Designer: Davi Barbosa Contatos: Informações importantes: Descrição do projeto: Projeto: Site Everlast Cliente: Rodrigo Mariana Esteban Analista: Adriano Cortez Designer: Davi Barbosa Contatos: E-mail do cliente: rodrigo@megagroupint.com.br, marianamkt@megagroupint.com.br, estebanflorio@hotmail.com

Leia mais

Os websites teem formato dinâmico, com área de genciamento de conteúdo, podem estar linkados com todas as mídias, tanto sociais como institucionais.

Os websites teem formato dinâmico, com área de genciamento de conteúdo, podem estar linkados com todas as mídias, tanto sociais como institucionais. Proposta de websites Comunicação e Marketing na Web Branding e Usabilidade Websites Institucionais A proposta de desenvolvimento de websites para a Gate, Padaratz e Guest House sugere uma integração de

Leia mais

Tópicos de Ambiente Web. Modulo 2 Processo de desenvolvimento de um site Professora: Sheila Cáceres

Tópicos de Ambiente Web. Modulo 2 Processo de desenvolvimento de um site Professora: Sheila Cáceres Tópicos de Ambiente Web Modulo 2 Processo de desenvolvimento de um site Professora: Sheila Cáceres Roteiro Motivação Desenvolvimento de um site Etapas no desenvolvimento de software (software:site) Analise

Leia mais

DOCUMENTAÇÃO DO FRAMEWORK - versão 2.0

DOCUMENTAÇÃO DO FRAMEWORK - versão 2.0 DOCUMENTAÇÃO DO FRAMEWORK - versão 2.0 Índice 1 - Objetivo 2 - Descrição do ambiente 2.1. Tecnologias utilizadas 2.2. Estrutura de pastas 2.3. Bibliotecas já incluídas 3 - Características gerais 4 - Criando

Leia mais

Desenvolvimento de Jogos Eletrônicos para campanhas publicitárias (Advergames) e jogos para treinamento/educação.

Desenvolvimento de Jogos Eletrônicos para campanhas publicitárias (Advergames) e jogos para treinamento/educação. A VIRTUALIZE A Virtualize Interatividade Digital é uma Agência Digital, especializada na produção de conteúdos multimídia com rico grau de interatividade. Principais Serviços Desenvolvimento de Jogos Eletrônicos

Leia mais

Júlio Coutinho Consultor Web Webdesign & Joomla! SEO for Joomla! Joomla! Security Web development. http://www.juliocoutinho.com.br

Júlio Coutinho Consultor Web Webdesign & Joomla! SEO for Joomla! Joomla! Security Web development. http://www.juliocoutinho.com.br Júlio Coutinho Consultor Web Webdesign & Joomla! SEO for Joomla! Joomla! Security Web development WEB E WEB APPLICATION CMS JOOMLA PROPOSTA WEBSITE Página:1 Índice Tópico Página 1. Introdução 3 1.1 Finalidade

Leia mais

Quem Somos. SEO; Links Patrocinados; Campanhas de E-Mail Marketing; Divulgação em Portais e Sites Verticais; Web Analytics; Marketing Social.

Quem Somos. SEO; Links Patrocinados; Campanhas de E-Mail Marketing; Divulgação em Portais e Sites Verticais; Web Analytics; Marketing Social. Quem Somos A Cadastronet é uma agência de marketing digital, pioneira na utilização de WebStandards W3C* (World Wide Web Consortium) para desenvolvimento de websites. Isso significa que nossos sites são

Leia mais

Navegador ou browser, é um programa de computador que permite a seus usuários a interagirem com documentos virtuais da Internet.

Navegador ou browser, é um programa de computador que permite a seus usuários a interagirem com documentos virtuais da Internet. TERMINOLOGIA Navegador ou Browser Navegador ou browser, é um programa de computador que permite a seus usuários a interagirem com documentos virtuais da Internet. Os Browsers se comunicam com servidores

Leia mais

Aline Santos Carlos Augusto Peterson Almeida Rafael Rodrigues Ramon Assis

Aline Santos Carlos Augusto Peterson Almeida Rafael Rodrigues Ramon Assis Aline Santos Carlos Augusto Peterson Almeida Rafael Rodrigues Ramon Assis Marketing Digital Trabalho científico apresentado ao Professor Edvaldo Jr., docente da matéria Marketing Digital, da turma de Produção

Leia mais

1. Objetivo do Projeto

1. Objetivo do Projeto PROPOSTA DE PRESTAÇÃO DE SERVIÇOS VISNET - INTERNET E COMUNICAÇÃO Desenvolvimento de Site para CDL 1. Objetivo do Projeto O CDL Online é o mais novo sistema interativo especialmente projetado para criar

Leia mais

DIFERENCIAIS SERVIÇOS. 1. Desenvolvimento De Sites Personalizados

DIFERENCIAIS SERVIÇOS. 1. Desenvolvimento De Sites Personalizados DIFERENCIAIS Acredito que o desenvolvimento de soluções para Internet não é um trabalho qualquer, deve-se ter certa experiência e conhecimento na área para projetar sistemas que diferenciem você de seu

Leia mais

SEO. Search Engine Optimization

SEO. Search Engine Optimization SEO Search Engine Optimization Vai imprimir? Pense na sua responsabilidade com o meio ambiente. Já imprimiu? Não jogue fora: utilize o verso e recicle sempre. Nossa Empresa A Absoluto Web é uma empresa

Leia mais

Pequenas Empresas na Web

Pequenas Empresas na Web fevereiro 2010 :: ano 7 :: nº 74 :: www.revistawebdesign.com.br E D I T O R A R$ 11,90 Pequenas Empresas na Web Você sabia que, neste nicho de mercado, 80% NÃO possuem sites? Saiba como atraí-las para

Leia mais

Construtor Iron Web. Manual do Usuário. Iron Web Todos os direitos reservados

Construtor Iron Web. Manual do Usuário. Iron Web Todos os direitos reservados Construtor Iron Web Manual do Usuário Iron Web Todos os direitos reservados A distribuição ou cópia deste documento, ou trabalho derivado deste é proibida, requerendo, para isso, autorização por escrito

Leia mais

SGCD 2.2. Sistema Gerenciador de Conteúdo Dinâmico

SGCD 2.2. Sistema Gerenciador de Conteúdo Dinâmico Atualizado em 13/AGO/2012 Sistema Gerenciador de Conteúdo Dinâmico No final de 2007, o Serviço Técnico de Informática da UNESP Marília, disponibilizou para a comunidade acadêmica e administrativa o Sistema

Leia mais

Checklist para ações de email marketing

Checklist para ações de email marketing Checklist para ações de email marketing Publicado em: 15/01/2008 Planejamento Quais os objetivos da campanha (atrair mais visitantes ao site, aumentar as vendas de produtos, conquistar a fidelidade dos

Leia mais

é uma Agência de Internet Marketing e Comunicação Multidisciplinar. Há mais de dez anos no mercado, trabalhamos com foco no planejamento, execução e

é uma Agência de Internet Marketing e Comunicação Multidisciplinar. Há mais de dez anos no mercado, trabalhamos com foco no planejamento, execução e é uma Agência de Internet Marketing e Comunicação Multidisciplinar. Há mais de dez anos no mercado, trabalhamos com foco no planejamento, execução e avaliação de estratégias de marketing e comunicação

Leia mais

Pedro F. Carvalho Analista de Sistemas/Gerente de Projetos contato@pedrofcarvalho.com.br OCP Oracle 10g ITIL FoundationV3 PROJETO DE WEB SITE

Pedro F. Carvalho Analista de Sistemas/Gerente de Projetos contato@pedrofcarvalho.com.br OCP Oracle 10g ITIL FoundationV3 PROJETO DE WEB SITE PROJETO DE WEB SITE EAP Estrutura Analitica de Projeto Preparação Estudar as particularidades do serviço e do cliente; Observar projetos semelhantes (Beanchmark); Definir metas e estratégias; Elaborar

Leia mais

RELEASE F-STORE v. 3.0.0.0

RELEASE F-STORE v. 3.0.0.0 Curitiba (2015) ÍNDICE Aumento de performance no carregamento de imagens Assinatura de produtos Barra de busca flutuante Boleto como imagem Cadastro de cliente com Double opt-in Cadastro de SEO Carrinho

Leia mais

APRESENTAÇÃO. É com grande satisfação que apresentamos a você uma proposta de desenvolvimento de website para sua empresa.

APRESENTAÇÃO. É com grande satisfação que apresentamos a você uma proposta de desenvolvimento de website para sua empresa. APRESENTAÇÃO É com grande satisfação que apresentamos a você uma proposta de desenvolvimento de website para sua empresa. A proposta consiste em um website com uma área administrativa que permite a você

Leia mais

Definições: quando usar cada um?

Definições: quando usar cada um? Framework ou CMS? Definições: quando usar cada um? Framework: Uma arquitetura desenvolvida com o objetivo de atingir a máxima reutilização, representada como um conjunto de classes abstratas e concretas,

Leia mais

1. INICIANDO NO FOTOÍ

1. INICIANDO NO FOTOÍ 1. INICIANDO NO FOTOÍ Após ter criado uma conta no site Fotoí (www.fotoi.com.br) e efetuado a contratação de um plano do tipo PRO (com venda de arquivos digitais, impressão de fotos e seleção de fotos),

Leia mais

BEM VINDO A FARIASDESIGN! SOLUÇÕES E ESTRATÉGIAS EM MARKETING DIGITAL DESIGN WEB E GRAPHIC! PERFORMANCE

BEM VINDO A FARIASDESIGN! SOLUÇÕES E ESTRATÉGIAS EM MARKETING DIGITAL DESIGN WEB E GRAPHIC! PERFORMANCE BEM VINDO A FARIASDESIGN! SOLUÇÕES E ESTRATÉGIAS EM MARKETING DIGITAL DESIGN WEB E GRAPHIC! PERFORMANCE SOBRE A FARIASDESIGN Fundada em 2002 a FariasDesign iniciou suas atividades no Brasil e, posteriormente,

Leia mais

GILMAR ARAUJO ESTÁGIO CURRICULAR I SUPORTE TI HOSPITALAR

GILMAR ARAUJO ESTÁGIO CURRICULAR I SUPORTE TI HOSPITALAR GILMAR ARAUJO ESTÁGIO CURRICULAR I SUPORTE TI HOSPITALAR EMPRESA: TRÍPLICE CONSULTORIA E SERVIÇOS LTDA. SETOR: INFORMÁTICA SUPERVISOR: RONALDO GUIZARDI ORIENTADOR: VILSON VIEIRA CURSO DE BACHARELADO EM

Leia mais

Prezado Futuro Cliente

Prezado Futuro Cliente Prezado Futuro Cliente É com grade satisfação que encaminhamos nossa apresentação institucional e certos de estabelecermos uma parceria de sucesso e duradoura. Ela foi desenvolvida com objetivo de mostrar

Leia mais

SEO E SEM. 1. Apresentação

SEO E SEM. 1. Apresentação 1. Apresentação A Construtiva Internet Software, com o objetivo de oferecer soluções completas e integradas em ambientes digitais apresenta 3 novos serviços para posicionamento online e monitoramento das

Leia mais

Todos os direitos reservados para Alfamídia Prow. AVISO DE RESPONSABILIDADE

Todos os direitos reservados para Alfamídia Prow. AVISO DE RESPONSABILIDADE Todos os direitos reservados para Alfamídia Prow. AVISO DE RESPONSABILIDADE As informações contidas neste material de treinamento são distribuídas NO ESTADO EM QUE SE ENCONTRAM, sem qualquer garantia,

Leia mais

SGCD 2.0 Sistema Gerenciador de Conteúdo Dinâmico

SGCD 2.0 Sistema Gerenciador de Conteúdo Dinâmico Sistema Gerenciador de Conteúdo Dinâmico Atualizado em 24/08/2011 No final de 2007, o Serviço Técnico de Informática da UNESP Marília, disponibilizou para a comunidade acadêmica e administrativa o Sistema

Leia mais

O QUE FAZEMOS MISSÃO VISÃO QUEM SOMOS

O QUE FAZEMOS MISSÃO VISÃO QUEM SOMOS O QUE FAZEMOS Provemos consultoria nas áreas de comunicação online, especializados em sites focados na gestão de conteúdo, sincronização de documentos, planilhas e contatos online, sempre integrados com

Leia mais

ANEXO I Sumário Manual de Preços e Serviços Digitais

ANEXO I Sumário Manual de Preços e Serviços Digitais Sumário 1 -LANDING PAGE...2 1.1)Layout, texto e produção do HTML...2 2 -MÍDIA...2 2.1)Planejamento de mídia...2 2.2)Criação das Campanhas...2 2.3)Mensuração dos resultados...2 2.4)Criação e Produção das

Leia mais

Checklist para ações de E-mail Marketing

Checklist para ações de E-mail Marketing Checklist para ações de E-mail Marketing Os tópicos abordados neste checklist são úteis antes de começar e depois de concluir o desenvolvimento de uma mensagem de email marketing, pois abrange desde os

Leia mais

ALUNES MANUAL DO USUÁRIO. Guia rápido Alunes

ALUNES MANUAL DO USUÁRIO. Guia rápido Alunes ALUNES MANUAL DO USUÁRIO Guia rápido Alunes 1 Manual de Instruções Versão 2.0 Alunes Informática 2 Sumário Introdução... 5 Pré-requisitos... 5 Principal/Home... 6 Como editar texto do home... 7 Desvendando

Leia mais

Manual do Painel Administrativo

Manual do Painel Administrativo Manual do Painel Administrativo versão 1.0 Autores César A Miggiolaro Marcos J Lazarin Índice Índice... 2 Figuras... 3 Inicio... 5 Funcionalidades... 7 Analytics... 9 Cidades... 9 Conteúdo... 10 Referência...

Leia mais

E-Book MKT DE PERFORMANCE

E-Book MKT DE PERFORMANCE E-Book MKT DE PERFORMANCE MKT de Performance O Marketing de Performance é um conjunto de técnicas que permitem mensurar e otimizar o desempenho de um site/ecommerce/landing page e os resultados de ações

Leia mais

ESTÁGIO CURRICULAR II SUPORTE E MONITORAMENTO

ESTÁGIO CURRICULAR II SUPORTE E MONITORAMENTO THALLES GRESCHECHEN ESTÁGIO CURRICULAR II SUPORTE E MONITORAMENTO EMPRESA: NEOGRID INFORMÁTICA S/A SETOR: SUPORTE E MONITORAMENTO SUPERVISOR: FÁBIO ROBERTO MENDES ORIENTADOR: PROF. GERSON VOLNEY LAGEMANN

Leia mais

MURILO TONELLI DE OLIVEIRA RELATÓRIO DE ESTÁGIO CURRICULAR I E II JOINVILLE - SC

MURILO TONELLI DE OLIVEIRA RELATÓRIO DE ESTÁGIO CURRICULAR I E II JOINVILLE - SC MURILO TONELLI DE OLIVEIRA RELATÓRIO DE ESTÁGIO CURRICULAR I E II JOINVILLE - SC 2011 UNIVERSIDADE DO ESTADO DE SANTA CATARINA UDESC CENTRO DE CIÊNCIAS TECNOLÓGICAS CCT DEPARTAMENTO DE CIÊNCIAS DA COMPUTAÇÃO

Leia mais

MAIS CLIENTES, MAIS VENDAS SEO. Estampe sua marca na primeira página do Google

MAIS CLIENTES, MAIS VENDAS SEO. Estampe sua marca na primeira página do Google MAIS CLIENTES, MAIS VENDAS SEO Search Engine Optimization Estampe sua marca na primeira página do Google Prefácio Este e-book que apresentamos ao leitor foi desenvolvido por uma equipe especializada em

Leia mais

MANUAL DE INSTRUÇÕES PAINEL DE CONTROLE

MANUAL DE INSTRUÇÕES PAINEL DE CONTROLE MANUAL DE INSTRUÇÕES PAINEL DE CONTROLE --------------------------------------------------------------------------------------------------------------------------- 1) CADASTRO NÍVEL 1 (controles de contato

Leia mais

Recurso E-Meeting para o Moodle: um relato do desenvolvimento de uma solução livre de webconferência otimizada para redes de baixo desempenho.

Recurso E-Meeting para o Moodle: um relato do desenvolvimento de uma solução livre de webconferência otimizada para redes de baixo desempenho. Recurso E-Meeting para o Moodle: um relato do desenvolvimento de uma solução livre de webconferência otimizada para redes de baixo desempenho. Resumo Este artigo apresenta uma solução de webconferência

Leia mais

Curso de Joomla na Prática

Curso de Joomla na Prática Curso de Joomla na Prática Joomla! (pronuncia-se djumla) é um CMS (Content Management System) desenvolvido a partir do Mambo. É escrito em PHP e roda no servidor web Apache ou IIS e banco de dados MySQL.

Leia mais

CONTRATE UM PROFISSIONAL

CONTRATE UM PROFISSIONAL SITE INTELIGENTE Muitas empresas que nos procuram sempre falam que buscam um site transacional e não institucional, mas afinal o que isso quer dizer? Na prática o que a maioria das pessoas espera é que

Leia mais

Manual do Usuário Layout Novo CMS WordPress Versão atual: 3.5.1

Manual do Usuário Layout Novo CMS WordPress Versão atual: 3.5.1 UNIVERSIDADE FEDERAL DE JUIZ DE FORA UFJF Secretaria de Sistemas de Informação SSI Centro de Gestão do Conhecimento Organizacional CGCO Equipe de Desenvolvimento de Sites Manual do Usuário Layout Novo

Leia mais

Vamos criar uma nova Página chamada Serviços. Clique em Adicionar Nova.

Vamos criar uma nova Página chamada Serviços. Clique em Adicionar Nova. 3.5 Páginas: Ao clicar em Páginas, são exibidas todas as páginas criadas para o Blog. No nosso exemplo já existirá uma página com o Título Página de Exemplo, criada quando o WorPress foi instalado. Ao

Leia mais

Lucas Nascimento Santos

Lucas Nascimento Santos Lucas Nascimento Santos Mobile Application Developer lucassantoos56@gmail.com Resumo Lucas Nascimento Santos (@ll_ucasn), engenheiro de software. Estudante de Ciência da Computação na Universidade Salvador

Leia mais

Desenvolvimento de Sistema WEB com orçamento ajustável

Desenvolvimento de Sistema WEB com orçamento ajustável PROPOSTA DE PROJETO Desenvolvimento de Sistema WEB com orçamento ajustável Etapas / Atividades Desenvolvimento de Site (CMS) Hospedagem de Sistema e Suporte Técnico Gerenciamento do Sistema (opcional)

Leia mais

Coleção - Análises de email marketing em clientes de email

Coleção - Análises de email marketing em clientes de email Coleção - Análises de email marketing em clientes de email Thunderbird e Terra Nesta terceira edição da Coletânea de Análises de Email Marketing em Clientes de Email, apresentamos os estudos do webmail

Leia mais

* Técnicas Avançadas. Desenvolvimento de SOFTWARES. Sistemas de Gerenciamento de Conteúdo com Joomla e Magento

* Técnicas Avançadas. Desenvolvimento de SOFTWARES. Sistemas de Gerenciamento de Conteúdo com Joomla e Magento * Técnicas Avançadas Desenvolvimento de SOFTWARES Sistemas de Gerenciamento de Conteúdo com Joomla e Magento * Tópicos Sistema de Gerenciamento de Conteúdo CMS. Fron-end Back-end Instalando Site e Lojas

Leia mais

D E S E N V O L V I M E N T O D E W E B S I T E. P r o j e t o M a s s a p ê. 2 4 d e j a n e i r o d e 2 0 1 3

D E S E N V O L V I M E N T O D E W E B S I T E. P r o j e t o M a s s a p ê. 2 4 d e j a n e i r o d e 2 0 1 3 D E S E N V O L V I M E N T O D E W E B S I T E P r o j e t o M a s s a p ê 2 4 d e j a n e i r o d e 2 0 1 3 A Empresa: CRISEPE - UFRPE Projeto Massapê Responsável: Caroline Biondi E-mail: carolinebiondi@yahoo.com

Leia mais

ÍNDICE... 2 INTRODUÇÃO... 3. A série... 3

ÍNDICE... 2 INTRODUÇÃO... 3. A série... 3 WORD 2007 E 2010 ÍNDICE ÍNDICE... 2 INTRODUÇÃO... 3 A série... 3 01 CAPTURAS DE TELA WORD 2010... 3 02 IMAGENS 2007/2010... 5 03 NOTAS DE RODAPÉ... 13 04 NUMERAÇÃO DE PÁGINAS... 15 05 CONTAR PALAVRAS...

Leia mais

Formação em WEB DESIGN: Projeto 01 - layout (aula 01 & 02*) Em nosso primeiro projeto criaremos um layout para web utilizando um software gráfico.

Formação em WEB DESIGN: Projeto 01 - layout (aula 01 & 02*) Em nosso primeiro projeto criaremos um layout para web utilizando um software gráfico. Formação em WEB DESIGN: O Curso de WebDesign da Imagine School tem duração de 06 meses e se destina a todos aqueles que desejam conhecer o mundo de desenvolvimento para a web. Durante o curso, veremos

Leia mais

Padrão Visual de Sistemas da Anvisa na Internet

Padrão Visual de Sistemas da Anvisa na Internet Agência Nacional de Vigilância Sanitária Padrão Visual de Sistemas da Anvisa na Internet Gerência-Geral de Tecnologia da Informação Gerência de Sistemas www.anvisa.gov.br Brasília, janeiro de 2007 Agência

Leia mais

Tutorial WEB CONTENT MANAGEMENT [WCM] Obtenha benefícios a partir das aplicações customizadas da ADMT.

Tutorial WEB CONTENT MANAGEMENT [WCM] Obtenha benefícios a partir das aplicações customizadas da ADMT. Tutorial WEB CONTENT MANAGEMENT [WCM] Obtenha benefícios a partir das aplicações customizadas da ADMT. PÁGINA: 2 de 21 Nenhuma parte deste documento pode ser utilizado ou reproduzido, em qualquer meio

Leia mais

ARKETING INTERNET SEO CRIATIVIDADE AGÊNCIA CRIAÇÃO

ARKETING INTERNET SEO CRIATIVIDADE AGÊNCIA CRIAÇÃO DESIGN CRIAÇÃO AGÊNCIA USABILIDA ARKETING INTERNET SEO DIGIT CRIATIVIDADE DESDE 1999 NO MERCADO, A M2BRNET É UMA AGÊNCIA DE MARKETING DIGITAL ESPECIALIZADA EM SOLUÇÕES PERSONALIZADAS. SI ARQ Desde 1999

Leia mais

ESTÁGIO CURRICULAR I e II CUSTOMIZAÇÃO MNT FROTA

ESTÁGIO CURRICULAR I e II CUSTOMIZAÇÃO MNT FROTA RAFAEL REINERT ESTÁGIO CURRICULAR I e II CUSTOMIZAÇÃO DO MNT FROTA EMPRESA: NG Informática SETOR: Desenvolvimento SUPERVISOR: Rafael Diogo Richter ORIENTADOR: Carlos Norberto Vetorazzi Júnior CURSO DE

Leia mais

Sumário. HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1

Sumário. HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1 Sumário HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1 Linguagem HTML HTML é a abreviação de HyperText Markup Language, que pode ser traduzido como Linguagem de Marcação de Hipertexto. Não é uma linguagem

Leia mais

Desenvolvimento de Sistema WEB de Gerenciamento de Conteúdo para a empresa SC PRINT

Desenvolvimento de Sistema WEB de Gerenciamento de Conteúdo para a empresa SC PRINT PROJETO Desenvolvimento de Sistema WEB de Gerenciamento de Conteúdo para a empresa SC PRINT Etapas / Atividades Registro de Domínio Hospedagem de Sistema Desenvolvimento de Site (CMS) Gerenciamento do

Leia mais

Proposta Loja Virtual. Schmitt Tricot

Proposta Loja Virtual. Schmitt Tricot Proposta Loja Virtual Schmitt Tricot Apresentação: Atualmente atuo no mercado de sites e lojas virtuais desde 2010, desenvolvendo novas ideias, trabalhando com agilidade, para sempre atender a todas as

Leia mais

Manual Easy Chat Data de atualização: 20/12/2010 16:09 Versão atualizada do manual disponível na área de download do software.

Manual Easy Chat Data de atualização: 20/12/2010 16:09 Versão atualizada do manual disponível na área de download do software. 1 - Sumário 1 - Sumário... 2 2 O Easy Chat... 3 3 Conceitos... 3 3.1 Perfil... 3 3.2 Categoria... 4 3.3 Ícone Específico... 4 3.4 Janela Específica... 4 3.5 Ícone Geral... 4 3.6 Janela Geral... 4 4 Instalação...

Leia mais

ESTÁGIO CURRICULAR I e II PESQUISA E DESENVOLVIMENTO DE FERRAMENTA QUE PERMITE VERIFICAR A RELAÇÃO ENTRE PERFIL DE EMPRESA E

ESTÁGIO CURRICULAR I e II PESQUISA E DESENVOLVIMENTO DE FERRAMENTA QUE PERMITE VERIFICAR A RELAÇÃO ENTRE PERFIL DE EMPRESA E Guilherme Alexandre Sant'Ana ESTÁGIO CURRICULAR I e II PESQUISA E DESENVOLVIMENTO DE FERRAMENTA QUE PERMITE VERIFICAR A RELAÇÃO ENTRE PERFIL DE EMPRESA E MODELO DE PROCESSO DE SOFTWARE EMPRESA: UNIVERSIDADE

Leia mais

Design de Interfaces e Usabilidade - Tópico 1

Design de Interfaces e Usabilidade - Tópico 1 Instituto Federal do Sertão-PE Design de Interfaces e Usabilidade - Tópico 1 Prof. Felipe Correia Conteúdo Por que estudar Design de Interfaces e Usabilidade?! Conceitos básicos sobre Design! Primeira

Leia mais

Manual de Atualização MATERIAL DE APOIO - KB IMÓVEIS

Manual de Atualização MATERIAL DE APOIO - KB IMÓVEIS 1 2 Manual de Atualização MATERIAL DE APOIO - KB IMÓVEIS Login é a área de autenticação do sistema. Por questões de segurança, é necessário que o usuário se identifique, impedindo a entrada de pessoas

Leia mais

APRESENTAÇÃO. Aprecie as apresentações a seguir. Boa leitura!

APRESENTAÇÃO. Aprecie as apresentações a seguir. Boa leitura! APRESENTAÇÃO A Informatiza Soluções Empresariais está no mercado desde 2006 com atuação e especialização na criação de sites e lojas virtuais. A empresa conta com um sistema completo de administração de

Leia mais

Desenvolvimento de Sites. Subtítulo

Desenvolvimento de Sites. Subtítulo Desenvolvimento de Sites Subtítulo Sobre a APTECH A Aptech é uma instituição global, modelo em capacitação profissional, que dispõe de diversos cursos com objetivo de preparar seus alunos para carreiras

Leia mais

Manual do Instar Mail Sumário

Manual do Instar Mail Sumário Manual do Instar Mail Sumário 1 - Apresentação do sistema... 2 2 - Menu cliente... 2 3 - Menu Importação... 5 4 - Menu Campanhas... 9 5 - Menu banco de arquivos... 16 6 - Menu agendamento... 16 7 - Menu

Leia mais

Plano de Aula - Dreamweaver CS6 - cód.5232 24 Horas/Aula

Plano de Aula - Dreamweaver CS6 - cód.5232 24 Horas/Aula Plano de Aula - Dreamweaver CS6 - cód.5232 24 Horas/Aula Aula 1 Capítulo 1 - Introdução ao Dreamweaver CS6 Aula 2 Continuação do Capítulo 1 - Introdução ao Dreamweaver CS6 Aula 3 Capítulo 2 - Site do Dreamweaver

Leia mais

Proposta Concessionária Terra Nova Land Rover

Proposta Concessionária Terra Nova Land Rover SATIS 2011 Proposta Concessionária Terra Nova Land Rover 21/03/2011 A SATIS Índice 1 A Satis 1 A Proposta 1 Serviços 2 Mapa do Site 2 SEO 3 Sistema de gerenciamento de conteudo 4 Cronograma e Prazos 5

Leia mais

Manual do Usuário. www.ezsites.com.br. Manual de operação do sistema ezsites. ezsites Versão 3.0 Manual do Usuário Versão 1.0

Manual do Usuário. www.ezsites.com.br. Manual de operação do sistema ezsites. ezsites Versão 3.0 Manual do Usuário Versão 1.0 Manual do Usuário Manual de operação do sistema ezsites ezsites Versão 3.0 Manual do Usuário Versão 1.0 www.ezsites.com.br Índice 1. Apresentação... 3 2. Visão geral... 4 3. Sistema de gestão de conteúdo...

Leia mais

Tutorial Básico de Google Analytics

Tutorial Básico de Google Analytics Tutorial Básico de Google Analytics O que é o Google Analytics? O Google Analytics é uma API gratuita disponibilizada pelo Google e que é usada pelos desenvolvedores de sites e profissionais de SEO para

Leia mais

PROJETO BÁSICO A) ORGÃO INTERESSADO E LOCALIZAÇÃO

PROJETO BÁSICO A) ORGÃO INTERESSADO E LOCALIZAÇÃO LICITAÇÃO PARA A CONTRATAÇÃO DA PRESTAÇÃO DE SERVIÇOS DE CRIAÇÃO E GESTÃO MANUTENSIVA, POR PRAZO DETERMINADO, DE DOIS PORTAIS VOLTADOS PARA PROFISSIONAIS DA NUTRIÇÃO INSCRITOS NO CRN3 E PÚBLICO GERAL,

Leia mais

Manual WordPress. Conteúdo Índice. Capítulo 1 Introdução. Capítulo 2 Conceitos básicos do Painel. Capítulo 3 Gerenciamento de Posts ( Artigos)

Manual WordPress. Conteúdo Índice. Capítulo 1 Introdução. Capítulo 2 Conceitos básicos do Painel. Capítulo 3 Gerenciamento de Posts ( Artigos) Manual WordPress Conteúdo Índice Capítulo 1 Introdução Sobre o WordPress Características principais Capítulo 2 Conceitos básicos do Painel Logando no Painel de Controle Alterando Usuário e Senha Painel

Leia mais

apresentação iagente shop

apresentação iagente shop apresentação iagente shop Rua Sport Clube São José, 54 506. Porto Alegre Rio Grande do Sul CEP: 91030-510 Fone: (51) 3398.7638 e-mail: www.iagenteshop.com.br www.iagente.com.br Data: 01 de Abril de 2009

Leia mais

Consultoria sobre Joomla!

Consultoria sobre Joomla! Consultoria sobre Joomla! Joomla! (pronuncia-se djumla) é um CMS (Content Management System) desenvolvido a partir do Mambo. É escrito em PHP e roda no servidor web Apache ou IIS e banco de dados MySQL.

Leia mais

Plano de Parcerias BuenitStore

Plano de Parcerias BuenitStore Plano de Parcerias Agências, Desenvolvedores e Designers 18.03.2015 v.2 Objetivo Apresentar ao mercado de criação digital a nossa proposta de parceria e colaboração técnica para criação de projetos de

Leia mais

CRIANDO UM SITE RESPONSIVO COM W O R D P R E S S. Autores: Marcel Ferrante Silva

CRIANDO UM SITE RESPONSIVO COM W O R D P R E S S. Autores: Marcel Ferrante Silva CRIANDO UM SITE RESPONSIVO COM W O R D P R E S S Autores: Marcel Ferrante Silva Apresentação Marcel Ferrante marcelf@gmail.com Prof. Adjunto no Curso de Gestão da Informação/UFG (2014) Doutor em Ciência

Leia mais

ANÁLISE DAS MUDANÇAS NA PÁGINA DO SITE PORTAL COMUNITÁRIO

ANÁLISE DAS MUDANÇAS NA PÁGINA DO SITE PORTAL COMUNITÁRIO 11. CONEX Apresentação Oral Resumo Expandido 1 ÁREA TEMÁTICA: ( X ) COMUNICAÇÃO ( ) CULTURA ( ) DIREITOS HUMANOS E JUSTIÇA ( ) EDUCAÇÃO ( ) MEIO AMBIENTE ( ) SAÚDE ( ) TRABALHO ( ) TECNOLOGIA ANÁLISE DAS

Leia mais

Utilizaremos a última versão estável do Joomla (Versão 2.5.4), lançada em

Utilizaremos a última versão estável do Joomla (Versão 2.5.4), lançada em 5 O Joomla: O Joomla (pronuncia-se djumla ) é um Sistema de gestão de conteúdos (Content Management System - CMS) desenvolvido a partir do CMS Mambo. É desenvolvido em PHP e pode ser executado no servidor

Leia mais

ALGUNS DADOS DA INTERNET NO BRASIL. (11) 3522-5338 - www.cvsweb.com.br comercial@cvsweb.com.br

ALGUNS DADOS DA INTERNET NO BRASIL. (11) 3522-5338 - www.cvsweb.com.br comercial@cvsweb.com.br ALGUNS DADOS DA INTERNET NO BRASIL 2 + 67.500.000 + 67,5 MILHÕES DE INTERNAUTAS NO BRASIL FONTE: IBOPE/NIELSEN 58.290.000 58,2 MILHOES DE INTERNAUTAS NO BRASIL ACESSAM A INTERNET SEMANALMENTE -87% FONTE:

Leia mais

[SITE FÁCIL CDL MANUAL DO USUÁRIO]

[SITE FÁCIL CDL MANUAL DO USUÁRIO] Câmara de Dirigentes Lojistas [SITE FÁCIL CDL MANUAL DO USUÁRIO] Sumário 1. Controle de versão... 3 2. Objetivo... 4 3. Site fácil... 4 4. Acessando o sistema de gestão de conteúdo (SGC)... 5 5. Páginas

Leia mais

CONSULTORIA E PROJETOS ELÉTRICOS JÚNIOR

CONSULTORIA E PROJETOS ELÉTRICOS JÚNIOR Título do Case: Impulsionando a Captação de Projetos Através do Marketing Digital Categoria: Projeto Interno Temática: Mercado Resumo: Sabe-se que grande parte dos projetos realizados pelas empresas juniores

Leia mais

Este tutorial é direcionado aos câmpus do IFC que já utilizam em seus sites os temas para WordPress desenvolvidos pelo Câmpus Araquari.

Este tutorial é direcionado aos câmpus do IFC que já utilizam em seus sites os temas para WordPress desenvolvidos pelo Câmpus Araquari. Apresentação Este tutorial é direcionado aos câmpus do IFC que já utilizam em seus sites os temas para WordPress desenvolvidos pelo Câmpus Araquari. Antes de iniciar o processo de atualização é recomendado

Leia mais

Portal Anexo II B - Especificação Funcional

Portal Anexo II B - Especificação Funcional Portal Anexo II B - Especificação Funcional Sumário 1. INTRODUÇÃO... 2 1.1. Visão geral do documento... 2 2. DESCRIÇÃO GERAL DO SISTEMA... 3 3. ESPECIFICAÇÃO DOS COMPONENTES... 4 4. ESPECIFICAÇÃO DAS PÁGINAS...

Leia mais

DESAFIO ETAPA 1 Passo 1

DESAFIO ETAPA 1 Passo 1 DESAFIO Um dos maiores avanços percebidos pela área de qualidade de software foi comprovar que a qualidade de um produto final (software) é uma consequência do processo pelo qual esse software foi desenvolvido.

Leia mais

Pré-requisito Conhecimento básico do sistema operacional Windows ou Mac OS.

Pré-requisito Conhecimento básico do sistema operacional Windows ou Mac OS. 1 e Descrição Este treinamento abortará conceitos essenciais de HTML e CSS para a construção de páginas web através do uso do Adobe, com a mínima necessidade de intervir ou escrever códigos, utilizando

Leia mais

Email marketing: os 10 erros mais comuns

Email marketing: os 10 erros mais comuns Email marketing: os 10 erros mais comuns Publicado em: 18/02/2008 Não ter permissão dos contatos para enviar mensagens Um dos princípios fundamentais do email marketing é trabalhar apenas com contatos

Leia mais

Programação para Internet I

Programação para Internet I Programação para Internet I Faculdade de Tecnologia SENAC Curso Superior de Análise e Desenvolvimento de Sistemas Edécio Fernando Iepsen (edecio@terra.com.br) Vantagens da HTML 5 Código notadamente semântico;

Leia mais

HTML5 E SUAS NOVIDADES

HTML5 E SUAS NOVIDADES HTML5 E SUAS NOVIDADES Gabrie Dalla Porta 1, Julio César Pereira 1 1 Universidade Paranaense (Unipar) Paranavaí PR Brasil gabrieldallap@gmail.com, juliocesarp@gmail.com Resumo: Este artigo apresenta uma

Leia mais

Sistema operacional Windows 7, Windows Live Mail e Adobe Reader. Sistemas operacionais em concursos públicos

Sistema operacional Windows 7, Windows Live Mail e Adobe Reader. Sistemas operacionais em concursos públicos Sistema operacional Windows 7, Windows Live Mail e Adobe Reader Sistemas operacionais em concursos públicos Antes de tudo é importante relembrarmos que o sistema operacional é um tipo de software com a

Leia mais