MANUAL PARA DESIGN DE WEBSITES DE SUCESSO Dezembro/09
DIMENSÕES DO SITE Largura: utilize 950px de largura para melhor atender os usuários que usam resolução de 1024x768. 93% dos usuários usam esta resolução ou maiores. Altura: na página inicial, tente evitar a barra de rolagem usando menos elementos e deixando uma altura razoável Pesquisa W3C sobre resoluções de tela (mundo) Dica: Use e abuse de ferramentas como o 960grid para deixar o seu site alinhado e dar um aspecto muito mais profissional! http://www.960.gs Dados: w3schools
Facilite a vida do usuário: mantenha sempre o conteúdo explícito e acessível a poucos cliques Faça um menu de fácil acesso: não faça o usuário ter que clicar em um botão ou mover o mouse para ver o menu Evite flash em excesso: o flash é ótimo para dar movimento ao site, mas saiba equilibrar  o design e a informação para  não sobrecarregar o site REGRAS DE NAVEGABILIDADE Saiba mais em: http://pt.wikipedia.org/wiki/Usabilidade Traçe um objetivo para seu site e envolva o usuário por meio dos links e um design atraente. Faça ele sentir que encontrou o que procurava!
Não invente a roda: os usuários já estão acostumados com alguns tipos de navegações, inventar uma nova regra pode trazer prejuízo ao seu cliente. Faça essa revolução com clientes que possuem esse perfil. Procure usar padrões de cores Obedeça a leitura natural (da esquerda para a direita, de cima para baixo) SIGA O PADRÃO PARA NÃO ERRAR Conheça mais sobre paletas de cores em: http://www.colourlovers.com/ As pessoas esperam que certos comportamentos se mantenham: cores dos links, posição do logo, o comportamento de um menu, etc. Isso é conhecido como  padrões de uso O azul é a melhor cor para links.
DESIGN É INDICADOR DE CREDIBILIDADE Stanford-Makovsy Web Credibility Study 2002: Investigating What Makes Web Sites Credible Today What Makes A Web Site Credible? A Report on a Large Quantitative Study The Elements of Computer Credibility  Todos os estudos mostram que o usuário julga o livro pela capa, ou melhor, o site pelo design. Mesmo que às vezes de forma inconsciente, elementos como layout, consistência, tipografia, cores e estilos afetam a forma com que os usuários reconhecem um site e a imagem da empresa  Outros fatores influenciadores são: qualidade do conteúdo do site, número de eros, freqüência de atualizações e facilidade de uso. Varios estudos foram feitos para avaliar o que influencia a percepção de credibilidade de um site sobre seus usuários:
DESIGN É CREDIBILIDADE Seu site deve projetar não só uma boa imagem, mas também a imagem certa para a sua audiência Qual desses 2 layouts tem maior credibilidade para você? Site da Fiat em 1996 Site da Fiat em 2009
INSPIRE-SE E APRENDA SEMPRE Sempre visite os sites dos concorrentes do seu cliente para que seu trabalho seja sempre melhor Não se prenda a concorrentes da cidade, veja que ferramentas as outras empresas do mesmo setor no Brasil estão usando em seus sites e proponha ao seu cliente Caso tenha conhecimentos, veja sites internacionais e inspire-se para fazer um grande design! Considere sempre que o atual trabalho deverá ser melhor que o último que fez Mesmo que um cliente vá pagar pouco, dedique-se para que ele te recomende e você recupere o tempo gasto por meio de vários outros clientes que irão ver o seu trabalho! Visite nosso blog! Constantemente postamos grandes designs para você se inspirar
CORES E PUBLICIDADE Evite ficar no preto e branco, abuse de cores, gradientes e efeitos diversos do photoshop Com empresas mais conservadoras como clientes, prefira sempre cores mais claras e sobrias Espaços em branco entre os  elementos melhoram a  leitura e a compreensão principalmente na home e  em páginas de produtos Veja ao lado, como exemplo, o site da Apple. Uma mistura de muitos espaços em branco, cores sóbrias e botões coloridos que chamam a atenção para as páginas de compra.
PUBLICIDADE NO SITE Defina bem a área de publicidade se for usá-la, para que o usuário não se confunda Evite usar banners para chamar o usuário para alguma seção do seu site. O usuário criou uma defesa e evita olhar ou clicar em tudo que se  parece com uma publicidade Não faça do seu site um  carnaval de imagens, seja  coerente No exemplo ao lado, os banners com descontos estão logo abaixo do menu e misturados com a publicidade do site. Mesmo sendo um banner de descontos, a chance do usuário ir para a página em questão é muito baixa, uma vez que ele pode achar que a imagem é um banner para outro site.
MAIS TEXTOS, MENOS IMAGENS Use sempre fontes primárias para textos  longos: Verdana, Arial, Times, Georgia, etc Caso use fontes especiais no menu, elas se  trasnformarão em imagens, perdendo sua  eficácia em buscadores como o Google Mantenha um padrão de fontes, com ou sem serifa, para todo o site, incluindo imagens e banners internos Quanto mais texto, melhor a chance do seu site ser bem rankeado no Google Use imagens apenas para o essencial Nós na domitri, procuramos usar todos os artifícios para melhorar o desempenho do seu site em sites de busca como o Google
TECNOLOGIA FLASH E O GOOGLE Sites feitos todo em flash não conseguem  ser rastreados pelos robos do Google e conseqüentemente não aparecem nos  resultados de busca Mesmo os menus feitos em flash, acabam  dificultando o rastreamento dos robos do  Google.  Na domitri usamos efeitos DHML e CSS puros para ajudar o seu site a ficar bem rankeado nos resultados de busca do Google Use o flash para dar movimento a banners e destaques no seu site
EVITE!!! Sons sem que haja a solicitação do usuário: a música que você escolheu pode não ser do gosto de todos os usuários do seu site, fazendo com que o usuário se aborreça. Se quer oferecer sons, coloque um player e peça para que o o usuário clique no play Páginas de abertura: tempo é dinheiro, deixe seu conteúdo a poucos cliques do seu usuário, evite destraí-lo Popups: apesar de ser barrado pela maioria dos browsers, quando abertos, causam aborrecimentos para o usuário
www.domitri.net ENVIE AGORA SEU LAYOUT PARA  [email_address]

Manual Para Site

  • 1.
    MANUAL PARA DESIGNDE WEBSITES DE SUCESSO Dezembro/09
  • 2.
    DIMENSÕES DO SITELargura: utilize 950px de largura para melhor atender os usuários que usam resolução de 1024x768. 93% dos usuários usam esta resolução ou maiores. Altura: na página inicial, tente evitar a barra de rolagem usando menos elementos e deixando uma altura razoável Pesquisa W3C sobre resoluções de tela (mundo) Dica: Use e abuse de ferramentas como o 960grid para deixar o seu site alinhado e dar um aspecto muito mais profissional! http://www.960.gs Dados: w3schools
  • 3.
    Facilite a vidado usuário: mantenha sempre o conteúdo explícito e acessível a poucos cliques Faça um menu de fácil acesso: não faça o usuário ter que clicar em um botão ou mover o mouse para ver o menu Evite flash em excesso: o flash é ótimo para dar movimento ao site, mas saiba equilibrar o design e a informação para não sobrecarregar o site REGRAS DE NAVEGABILIDADE Saiba mais em: http://pt.wikipedia.org/wiki/Usabilidade Traçe um objetivo para seu site e envolva o usuário por meio dos links e um design atraente. Faça ele sentir que encontrou o que procurava!
  • 4.
    Não invente aroda: os usuários já estão acostumados com alguns tipos de navegações, inventar uma nova regra pode trazer prejuízo ao seu cliente. Faça essa revolução com clientes que possuem esse perfil. Procure usar padrões de cores Obedeça a leitura natural (da esquerda para a direita, de cima para baixo) SIGA O PADRÃO PARA NÃO ERRAR Conheça mais sobre paletas de cores em: http://www.colourlovers.com/ As pessoas esperam que certos comportamentos se mantenham: cores dos links, posição do logo, o comportamento de um menu, etc. Isso é conhecido como padrões de uso O azul é a melhor cor para links.
  • 5.
    DESIGN É INDICADORDE CREDIBILIDADE Stanford-Makovsy Web Credibility Study 2002: Investigating What Makes Web Sites Credible Today What Makes A Web Site Credible? A Report on a Large Quantitative Study The Elements of Computer Credibility Todos os estudos mostram que o usuário julga o livro pela capa, ou melhor, o site pelo design. Mesmo que às vezes de forma inconsciente, elementos como layout, consistência, tipografia, cores e estilos afetam a forma com que os usuários reconhecem um site e a imagem da empresa Outros fatores influenciadores são: qualidade do conteúdo do site, número de eros, freqüência de atualizações e facilidade de uso. Varios estudos foram feitos para avaliar o que influencia a percepção de credibilidade de um site sobre seus usuários:
  • 6.
    DESIGN É CREDIBILIDADESeu site deve projetar não só uma boa imagem, mas também a imagem certa para a sua audiência Qual desses 2 layouts tem maior credibilidade para você? Site da Fiat em 1996 Site da Fiat em 2009
  • 7.
    INSPIRE-SE E APRENDASEMPRE Sempre visite os sites dos concorrentes do seu cliente para que seu trabalho seja sempre melhor Não se prenda a concorrentes da cidade, veja que ferramentas as outras empresas do mesmo setor no Brasil estão usando em seus sites e proponha ao seu cliente Caso tenha conhecimentos, veja sites internacionais e inspire-se para fazer um grande design! Considere sempre que o atual trabalho deverá ser melhor que o último que fez Mesmo que um cliente vá pagar pouco, dedique-se para que ele te recomende e você recupere o tempo gasto por meio de vários outros clientes que irão ver o seu trabalho! Visite nosso blog! Constantemente postamos grandes designs para você se inspirar
  • 8.
    CORES E PUBLICIDADEEvite ficar no preto e branco, abuse de cores, gradientes e efeitos diversos do photoshop Com empresas mais conservadoras como clientes, prefira sempre cores mais claras e sobrias Espaços em branco entre os elementos melhoram a leitura e a compreensão principalmente na home e em páginas de produtos Veja ao lado, como exemplo, o site da Apple. Uma mistura de muitos espaços em branco, cores sóbrias e botões coloridos que chamam a atenção para as páginas de compra.
  • 9.
    PUBLICIDADE NO SITEDefina bem a área de publicidade se for usá-la, para que o usuário não se confunda Evite usar banners para chamar o usuário para alguma seção do seu site. O usuário criou uma defesa e evita olhar ou clicar em tudo que se parece com uma publicidade Não faça do seu site um carnaval de imagens, seja coerente No exemplo ao lado, os banners com descontos estão logo abaixo do menu e misturados com a publicidade do site. Mesmo sendo um banner de descontos, a chance do usuário ir para a página em questão é muito baixa, uma vez que ele pode achar que a imagem é um banner para outro site.
  • 10.
    MAIS TEXTOS, MENOSIMAGENS Use sempre fontes primárias para textos longos: Verdana, Arial, Times, Georgia, etc Caso use fontes especiais no menu, elas se trasnformarão em imagens, perdendo sua eficácia em buscadores como o Google Mantenha um padrão de fontes, com ou sem serifa, para todo o site, incluindo imagens e banners internos Quanto mais texto, melhor a chance do seu site ser bem rankeado no Google Use imagens apenas para o essencial Nós na domitri, procuramos usar todos os artifícios para melhorar o desempenho do seu site em sites de busca como o Google
  • 11.
    TECNOLOGIA FLASH EO GOOGLE Sites feitos todo em flash não conseguem ser rastreados pelos robos do Google e conseqüentemente não aparecem nos resultados de busca Mesmo os menus feitos em flash, acabam dificultando o rastreamento dos robos do Google. Na domitri usamos efeitos DHML e CSS puros para ajudar o seu site a ficar bem rankeado nos resultados de busca do Google Use o flash para dar movimento a banners e destaques no seu site
  • 12.
    EVITE!!! Sons semque haja a solicitação do usuário: a música que você escolheu pode não ser do gosto de todos os usuários do seu site, fazendo com que o usuário se aborreça. Se quer oferecer sons, coloque um player e peça para que o o usuário clique no play Páginas de abertura: tempo é dinheiro, deixe seu conteúdo a poucos cliques do seu usuário, evite destraí-lo Popups: apesar de ser barrado pela maioria dos browsers, quando abertos, causam aborrecimentos para o usuário
  • 13.
    www.domitri.net ENVIE AGORASEU LAYOUT PARA [email_address]