O processo do desenvolvimento de um website A medida em que a engenharia de software adquire maturidade, o desenvolvimento de websites se torna mais profissional, possibilitando um maior controle sobre o desenvolvimento e um grande alinhamento entre a expectativa do cliente e o produto desenvolvido.

O processo do desenvolvimento de um website Assim, torna-se cada vez mais comum investir em planejamento de implementação antes da codificação, ou programação propriamente dita. Esse tipo de atividade permite obter mais clareza e solidez sobre o que deve ser implementado, evitando assim o indesejável retrabalho, que aumenta os custos de produção.

O processo do desenvolvimento de um website

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites O processo para desenvolver um site é o mesmo, seja ele um simples documento de três páginas, ou um com 1000 páginas interativas. O ciclo simplificado pode ser entendido como: Planejamento Análise (Requisitos) Desenho (Projeto) Construção Teste Publicação Manutenção Este ciclo (ou processo) deve ser seguido independente do tamanho e da complexidade do site.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites O planejamento do website, o qual requer a análise de suas necessidades e exigências, bem como o desenho de sua comunicação, é o passo mais importante de todo o processo.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Analise Passo 1: A discussão | Reunião Geralmente o inicio do projeto com o cliente começando por uma reunião. No primeiro encontro você precisa estabelecer o escopo básico do trabalho: o que deve ser feito; objetivos, publico alvo, regras e responsabilidades, quem são os atores envolvidos ((incluindo o contato para receber os materiais (textos, imagens..), etc

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Analise Passo 1: A discussão | Reunião O Escopo. De que se trata o seu site? Isto pode soar óbvio, mas considerando que existem milhões de sites na internet, você vai querer pensar nestes aspectos para se destacar.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Analise Passo 1: A discussão | Reunião Quanto ao Publico Alvo: Quem você quer que visite o seu site? Anote alguns dados demográficos sobre o seu público-alvo, como sexo, idade, seu rendimento mensal. Recolha ainda algumas informações mais detalhadas sobre os seus interesses e por que eles possam estar interessados no tema de seu Site. Você pode então usar estas informações sobre o seu público na tomada de decisões futuras relativa ao Design.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Analise Passo 1: A discussão | Reunião Converse muito com o seu cliente, esta primeira etapa é chamada de Briefing, onde você irá coletar o máximo de informações possíveis sobre o trabalho a ser feito. Depois de coletar todas as informações do seu cliente vamos analisá-las e "obter idéias", como fazer isso?.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Analise Passo 1: A discussão | Reunião Seu Objetivo(s) O que você quer que seu público retenha de seu site? O objetivo do site pode ser persuasivo, comercial, como venda de produtos ou serviços, mas também pode ser informativo, instrutivo ou uma combinação dos dois. O objetivo do seu site irá afetar o conteúdo, o grafismo e o design do site.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Analise | | | | | | Passo 2: Brainstorm / Reuniões chuva de idéias Detalhamento do Escopo - Pense como será a estrutura das coisas. O que é importante e o que não é, o que precisa ficar em todas as páginas. Dependendo da escala do projeto você deverá criar um Mapa do Site para o cliente. A preparação do sitemap (é uma representação hierárquica da estrutura de um site, composta por páginas web.) é essencial para a reorganização do conteúdo de qualquer forma.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Desenho Passo 3: Wireframe O wireframe / Portótipo/ Modelo é o esqueleto do site, indicando toda a navegação, função e os elementos do conteúdo que irão aparecer no final do website, (nesse momento o foco é o conteúdo e não a aparência (grafica)) é usado para perceber qualquer tipo de problema ou algum elemento, baseado no wireframe é construído o conteudo, o design e tudo que envolve a construção do projeto que virá só mais tarde.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Desenho Passo 3: Wireframe O wireframe / Portótipo/ Modelo: Esboce algumas idéias do projeto da página de entrada em um folha de papel (a que chamamos de 'wireframing").

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Desenho O wireframe / Portótipo/ Modelo: Recomendação: Lápis e papel, isso mesmo, lápis e papel, e começe a fazer esboços de como ficará o layout, o importante é você conseguir montá-lo.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Desenho O wireframe / Portótipo/ Modelo: 1. Cabeçalho O cabeçalho corresponde à área superior do seu site. Certifique-se de colocar aqui todas as suas informações mais importantes, 2. Corpo O corpo de seu web site contém todas as informações sobre a sua oferta, seus serviços, produtos ou experiências.   3. Rodapé No rodapé - fundo da sua página - deverão estar todas as outras informações que o visitante pode precisar: - contatos - pedir apoio - etc.  

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Desenho Passo 4: Planejando o Conteúdo Trabalhando em cima do Projeto e Protótipo (sitemap e do wireframe), você e seu cliente vão juntos planejar o conteúdo, em específico o texto. O planejamento do conteúdo e sua escrita provavelmente será a fase mais trabalhosa que seu cliente terá durante o projeto, e com certeza vai levar algum tempo para terminá-lo e aprová-lo.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Desenho Passo 5: Iniciando o Design (trabalho); Passo 6: Feedback do Cliente; Passo 7: Retrabalhar o Design (retrabalho) Quando o cliente estiver preocupado em providenciar o conteúdo do site, o designer pode ir trabalhando no design da página principal e as páginas internas.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Desenho Passo 5: Iniciando o Design (trabalho); Passo 6: Feedback do Cliente; Passo 7: Retrabalhar o Design (retrabalho) Quando a base do layout estiver pronta, o cliente precisa checar se o caminho que você tomou é o correto e *sugestionar pequenos ajustes no design se necessário. (*esta é a pior parte do projeto, onde o cliente bota o dedo no design, todos passam por esta etapa... ) Depois do feedback do cliente em relação ao passo 6, agora é a hora de retrabalhar o layout de acordo com as informações passadas pelo cliente.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Desenho Passo 9: Páginas Adicionais ; Passo 10: 1º Aprovação Final do Cliente Assim que a base do design do site estiver aprovado é a hora de começar a trabalhar no layout das páginas internas do site uma a uma. E mais uma vez o cliente irá checar o design e layout das páginas internas se estão de acordo com o pedido, você irá refazer alguns pontos do design e finalmente depois de algum tempo terá a provação final do cliente.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites Memorex: Como é feita a criação de um site? Esta é a primeira etapa de um projeto. Após analise de toda a identidade do cliente, a concorrência e o perfil do público alvo esperado. Caso o layout (protótipo) apresentado não atinja as expectativas do cliente de forma geral ou em alguns detalhes, o protótipo é ajustado;

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Construção Passo 11: Construindo o html (programação)… Agora sim você vai começar a construir as páginas em HTML (ou outra linguagem) ou Ferramenta Case que Implementa HTML…

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Construção Passo 11: Construindo o html (programação)… Qual é melhor? ASP.NET? PHP? Java? A experiência tem mostrado que o sucesso de um site pouco depende da tecnologia escolhida. Todas as linguagens (pelo menos as mais utilizadas e homologadas pelo público em geral) são muito boas e robustas. Geralmente o mesmo site pode ser construído em qualquer uma dessas linguagens sem prejudicar suas funcionalidades. A maioria dos erros encontrados nos sites não está vinculada à linguagem de programação.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Construção Passo 11: Construindo o html (programação)… Estruture sua home page A maioria dos sites são estruturados com as seguintes seções: 1. Cabeçalho O cabeçalho corresponde à área superior do seu site. Certifique-se de colocar aqui todas as suas informações mais importantes, porque este é o primeiro elemento do campo de visão dos visitantes. Todas as outras informações da página serão visíveis apenas quando os visitantes rolarem a página para baixo. Um cabeçalho bonito e funcional, poderá ser constituído por uma barra de navegação no topo esquerdo ou direito, que mostra as páginas do seu site de maneira que as pessoas possam navegar. Em baixo da barra de navegação você pode adicionar um troço de texto cativante, uma imagem visual (como o seu logotipo) e um elemento que chame a atenção da visão.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Construção Passo 11: Construindo o html (programação)… Estruture sua home page 2. Corpo O corpo de seu web site contém todas as informações sobre a sua oferta, seus serviços, produtos ou experiências. Tente criar um bom equilíbrio gráfico entre textos e imagens. Saiba que o tempo médio que um visitante passa a olhar para um site está entre 7-10 segundos, de forma que provavelmente não iria ler todas as informações na página de uma vez.Como todos sabemos, uma bela imagem de motivos vale mais que 1000 palavras.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Construção Passo 11: Construindo o html (programação)… Estruture sua home page 3. Rodapé No rodapé - fundo da sua página - deverão estar todas as outras informações que o visitante pode precisar: - contatos;- pedir apoio;- etc. O rodapé, muitas vezes mostra links para outras páginas de seu site que não têm tanta importância como as da barra de navegação.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Construção Passo 11: Construindo o html (programação)… Estruture sua home page - Tipo de site: alguns modelos de web sites são criados para áreas ou indústrias específicas, como um portefólio de fotografia, escolas, lojas, igrejas etc. Escolher um desses modelos relacionados com o tema é uma opção válida. Se usar uma ferramenta case, você não precisa comprar ou criar as imagens você mesmo, você pode usar as imagens presentes no modelo.  - Seu público: Pense sobre as cores que você gostaria de usar na sua página de entrada. Lembre-se de escolher as cores relacionadas com o seu tema, público e objectivo. Um web site para uma companhia financeira não deverá ter cores brilhantes.  - Seu objetivo: Alguns modelos estarão se concentrando em vender produtos ou serviços, enquanto outros se concentrarão mais em envolver o seu público. A sua opção deverá depender dos objetivos que você tem para seu site

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites Como é definida a navegação? A navegação deve segui um padrão de disposição dos links, proporcionar uma navegação permanente, fazendo com que o visitante não se perca no site. Desta forma, onde ele estiver, sempre terá acesso às demais seções e às páginas anteriores no caso de sub-seções. Como é feita a inclusão do conteúdo? Após a aprovação do layout (protótipo) é iniciada a montagem/produção do site e inclusão do conteúdo. Todo o conteúdo e fotos devem ser incluídos e colocados em uma área de testes para o cliente acompanhar e interagindo no desenvolvimento.

O processo do desenvolvimento de um website Exemplo de seções de um web site

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Construção Passo 12: A Entrega e o Teste Feedback novamente. Você e seu cliente irão trabalhar juntos – trabalho – feedback – retrabalho, paraver tudo que foi feito ou mesmo esquecido antes de finalizar o site por completo.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Construção Passo 12: A Entrega e o Teste O estágio final é o teste do site. O site deverá ser testado em todos os browsers, checado de ponta a ponta, verificando possíveis erros de programação, de design ou quem sabe de texto (esta responsabilidade do cliente), de qualquer forma o teste do site tem que ter um cuidado muito detalhado antes do site ir para o “ar”.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites – Planejamento / Construção Passo 13: Início A imagem diz “THE END – O FIM”, mas logicamente você não irá pegar o cheque e sair correndo pela porta afora, você precisa ver o site pelo menos num período de +- 10 dias ou depois disso no caso de problemas que não sejam culpa do cliente e sim sua, que tenham a necessidade de consertos.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites Por último é feita a revisão dos textos. Como é feita a instalação do site no servidor? Todo o projeto é trabalhado no servidor do cliente desde que possua a hospedagem contratada, caso contrário é criada uma área em servidor terceirizado Quando o site é lançado? Assim que tiver todo seu conteúdo funcional, revisado, aprovado e autorizado e aprovado pelo cliente.

O processo do desenvolvimento de um website Ciclo de Desenvolvimento de Sites 1- Apresentação do MS Publisher Antes (pacote office)Com exemplo de Site. 2- Laboratório construindo um modelo de site: Escola Universidade Loja roupa Loja de Tênis Venda de Carros Venda de Imóveis Clinica de Beleza * Resenha do MS Publisher