FORMATAÇÃO DE SITES COMERCIAIS
Fazendo um website vender
Orientar profissionais e clientes na correta formatação de websites comerciais (webcommerce)
Público alvo:◦ Webdesigners◦ Publicitários◦ Comerciantes◦ Profissionais de web
Objetivo
Navegador – Explorer (90% da navegação) Resolução – 1024 x 768 (65% da
navegação)
É de primordial importância que a visualização do projeto seja se acordo com
a AUDIÊNCIA, pois somente desta forma iremos enxergar realmente o que o cliente irá ver.
Padrões adotados (Brazil – 2009)
Navegadores
Resolução de Tela
webmotors.com.br livrariasaraiva.com.br magazineluiza.com.br netshoes.com.br quebarato.com.br americanas.com.br submarino.com.br buscape.com.br mercadolivre.com.br
Base Estudo / 8+ Alexa Br
Internauta é infiel, apressado e inteligente. Erros de ‘portuguez’ viram piada. Mais de 90% da visitação é pura
especulação. HTML já morreu NUNCA link para fora! (não seja inocente....) NUNCA bloqueie o history back (não seja
idiota...) 10% já é firefox (existe uma esperança...) IE6 existe ainda (é uma praga!!!)
0. Nunca é demais lembrar
Sites comerciais nunca tem pré-página de introdução (tela de apresentação).
Isto retarda a experiência de usuário.(se não irritassem, não haveria skip, certo??)
Estabelece 01 nível desnecessário.(uma porta na loja) Aumenta a incidência de out´s (saídas). Irrita os “já clientes”. Dever utilizado somente em sites corporativos
institucionais. (e olhe lá...) Site comercial = cotação / fonte de informação Internauta = impaciente irritante (jovem, ou no
mínimo mente jovem)
1. Pré-Página de Introdução
Cada clique é um obstáculo. Clique = Exige raciocínio do internauta Raciocínio > Julgamento Clique = Exige nova sessão de servidor Clique = Espera Sites comerciais > Objetivo final é o botão
comprar O acesso a este botão deverá ser o mais
curto possivel.
Teoria do Obstáculo
Seu site só vai vender se:◦ Se o seu negócio for bom!◦ Se seu produto for decente!◦ Se seu preço for competitivo.◦ Você for direto ao assunto.◦ Ser bastante claro no que está oferecendo (não
enrolar).◦ Exibir seu principal produto logo de cara!◦ Fácil entendimento
1. Pré-Página de Introdução
Teoria N Invertido: O quadrante 01 é o mais visitado. O quadrante 04 e o menos visitado. O botão ‘voltar’ é o mais acionado na rede. A parte superior é a que o internauta vê primeiro. A parte direita é a que o internauta vê por último.
2. Prioridades Estruturais
Mensagem subliminar é a definição usada para o tipo de mensagem que não pode ser captada diretamente pelos sentidos humanos.
Subliminar é tudo aquilo que está abaixo do limiar, a menor sensação detectável conscientemente.
Ícone, mouse, ‘touchscreen’, são invenções que analisaram sentimentos humanos através de mensagens subliminares.
Página web – síntese de exposição subliminar Exemplo – desenhe num papel em branco:
◦ Página da uol.◦ Página do google
Mensagem Subliminar
Seu site só vai vender se: A exibição inicial de produtos inicial for de 10
produtos A exibição total tiver mais de 30 produtos Mais importante que nome é preço competitivo. Praticidade for evidente. Simplicidade é mais importante que beleza
2. Prioridades Estruturais
Devido as exigências comerciais, o site comercial fica meio ‘carnavalesco’.
Websites tipo ´clean´ são lindos, mas pouco eficientes.
Existe a teoria supermercadista de maxi exposição de produtos em ponto de venda.
O interior de um supermercado é um amontoado de mercadorias organizadas
Um website comercial deve impressionar bela abundância de quantidade de bons negócios.
Poucos produtos exibidos significam ´empresa comercialmente pobre’
Teoria da Maxi-Exposição
Teoria Contra-Marketing (25 março)
Margem alta > Vende pouco
Margem Baixa > Vende muito
Decoração elegante Estacionamento incluso Silencio e música
ambiente Ambiente climatizado Café expresso Garrafa de água lacrada Few custumers Negócios de ‘status’
Decoração brega Sem estacionamento Gritaria Ventilador teto Café de garrafa térmica Bebedouro de garrafão Lotada de ‘fregueis’ Barganhas / descontos
Loja Cara (chique) Loja Barata (simples)
Experiências mostram que internautas apreciam barganhas (preço baixo & commodities)
Não existem muitos argumentos de venda. Basicamente preço predomina como principal apelo. Websites comerciais fortalecem posição de lojas de
descontos. Empresas de preços elevados tipo ‘high class’
hesitam em publicar preços na web Elementos de Marketing de alto luxo não encontram
na web ambiente favorável. Marketing de barganha encontra na web um paraíso!
◦ Custo baixo de manutenção de web
Web > Barganha
Inconscientemente, o consumidor percebe:◦ Quando um ponto de venda é caro.◦ Sabe que custa muito para mantê-lo.◦ Quando a loja é ‘grã-fina’ tem preço alto◦ Que o preço elevado irá pagar todo aquele luxo◦ Que um website muito elegante, com elementos
muito sofisticados, dão a impressão de uma operação web de preços elevados.
N Invertido
Inconscientemente, o consumidor percebe:◦ Quando um ponto de venda é de DESCONTO.◦ Sabe que custa POUCO para mantê-lo.◦ Quando a loja é ‘POPULAR’ tem preço BAIXO.◦ Que NÃO PRECISA DE PREÇO ELEVADO pois
absolutamente NÃO EXISTE LUXO.◦ Que um website simples, prático e eficiente é,
subliminarmente, sinônimo de preços baixos.
N Invertido
Criar um site comercial◦ Simples e Prático, e de fácil Entendimento◦ De Lay-Out agradável◦ Que dê impressão de abundância de bons
negócios.◦ Que exiba o ‘expertise’ do comerciante na área
onde ele atua.◦ Que possua um conteúdo comercial consistente.◦ Que oferte produtos de real necessidade.◦ Ser agressivo sem ser invasivo◦ Ser competente sem ser burocrático
O desafio
3. Linguagem – Java x Flash
JAVA Flash
Já faz parte do navegador
Alteração utilizar objeto de usuário
Carrega rápido Qualquer conexão Programador de alto
nível Possibilita interface
amigável Compacta
Precisa ser instalado Alteração necessita
programador Flash Carrega lento Somente banda larga Programador de baixo
nível Não existe interface
amigável Não compacta
Porque flash é ‘bonitinho’ Porque flash é mais fácil de programar Porque flash não é customizável. O usuário
acaba sendo obrigado a depender do programador.
Porque existem muitos templates em flash Porque hack em flash é facílimo (decoder)
Porque muitos programadores preferem fazem flash?
Tela programação Flash
Tela Programação Java (high level)
Estudos mostram◦ Mais de 10s, pode dizer adeus!◦ 30% do acesso ainda é discado◦ 15% via 3G, que é pior que discado! (quem tem,
sabe!)◦ Seu servidor não é tão bom assim quanto vc imagina◦ Que traceroute foi feito para ser usado◦ Que a base de dados TEM que estar no mesmo
datacenter. ◦ Quem PHP é mais veloz que todos!◦ Que fotos na mão de usuario são um perigo (veja
item 7)
4. Velocidade Carregamento
Estudos mostram:◦ Que nosso chefe é o mais simples de todos◦ Que mais de 03 objetos dinâmicos na mesma
página é coisa típica de iniciante.◦ Que URL test deve ser feito◦ Quem as páginas devem estar enlaçadas de
forma simples, porem presente.
5. Simplicidade & Navegação
Uma das maiores dificuldades em navegação é o consumidor achar o produto
Campos de pesquisa devem ser abundantes.
Menus laterais variados também devem existir
Listagens de produtos ordenadas devem ser abundantes
Como achar produtos?
“Em breve novidades / Site em construção” é:◦ Coisa de ‘webdesigner’ preguiçoso◦ Típico de amadores / curiosos de plantão◦ Desrespeito ao internauta◦ Desperdiça audiência◦ Coisa do tipo “vc não me manda material...”◦ Desrespeito ao cliente◦ Falta de inteligência comercial
Navegação: Fato relevante!!!
2ª página mais importante A página que mais gera negócio Utilize video, pdf, tables, e tudo mais NUNCA É DEMAIS INFORMAR Não esqueça dos “veja também”
6. Product Info
Estudos Mostram◦ Que 800x600 está longe de morrer!◦ Que formato .png ainda não pegou (que pena..)◦ Que navegadores lêem fotos de forma diferente◦ Que fotos mal trabalhadas gerem demora no
carregamento geral do site◦ Que postar fotos sem conhecimento mínimo de
photoshop é um SUICÍDIO!!!
7. Design e fotos
Estudos mostram:◦ Que não existe coisa mais chata que fazer
cadastro!◦ Não peça ao internauta informação inútil. ◦ QUANTO MAIS SIMPLES, MELHOR.◦ Comprar sem cadastro, e carrinho anônimo são
OBRIGAÇÕES!!!
8. Cadastro & Cart
A web possibilita ao comerciante vender produtos sem eles estarem disponiveis
Os mecanismos de controle de visitação podem indicar ao comerciante qual produto esta sendo mais visitado
Mesmo se o internauta não pedir um ‘avise-me’, o comerciante consegue saber se existe procura por um determinado item
A página funciona como uma espécie de ‘pesquisa de mercado’
Produtos Indisponíveis
SSL, HTTPS, criptograqfia, injection, ip travado, sessão time limit, senha nível 3,....a gente não precisa mais voltar a estes tópicos, né?
Cálculo de frete >>> SÓ INICIANTES NÃO SIMULAM ANTES!!!
Deposito em c/c, contra entrega, reembolso postal e pagamento para motoboy dão trabalho mas são obrigatórios.
9. Frete & Meios de Pagamento
E-mail, telefone, endereço >> obrigação né! Redes sociais, gmaps >> simpático MSN, twiter, Orkut >> meio infantil...pode vai!!! Chat >> avisa seu cliente que é chato! Se colocar convite >> ai pode! (cuidado, hein...) ‘Enviar proposta’ pré formatada >> boa! Curriculo on-line >> chique. (não esquece auto
resposta) Pesquisa satisfação >> chiquérrimo Youtube channel. >> este é meu garoto!!!
◦ Vídeos decentes, viu! (pague um profissional) Slideshare + flirck
◦ Quer trabalhar comigo?
10. Meios de comunicação
Não publicar telefone é a síntese da arrogância. Não publicar email (principalmente o mailto:) é
a síntese da insegurança do webdesigner. Porque tem gente que ainda teima em impor
esta restrição?◦ Webdesigner inseguro que quer ‘comprovar’ qtos
emails o website produziu◦ Medo de expor o e-mail a hacker de spam (como se
isto fosse evitar) Cliente que não deseja publicar telefone é
cliente que não precisa vender
10. Meios de Comunicação
´Backrup’, ‘FORTRAN’, Integred Eletronics, no inicio publicavam seus telefones/emails.
Depois de atingir 1 bilhão de acessos/dia, empresas mudaram a estratégia.
E, como o custo para atende 50, 100 milhões de ligações/dia é impraticável, estas decidiram subtrair o telefone de sua página principal.
Pois é.
Mas empresas como...
Mostrar IP (brega!!!) Mostrar nome do usuário (meio bobo...) Login automático (perigoso...) No de visitantes (infantil...) Banners HTML (credo cruz!) Frames (piada) www
Saiu da moda
Tableless / CSS / W3C Iphone protocol + dispositivos portáteis Javascript / Ajax / jquery Imagem em background (velocidade) Google analitics Lan house
Está na moda
O comércio na internet muda a cada instante
Trata-se da atividade de negócios mais dinâmica hoje em dia
As ‘regras’ de hoje podem estar obsoletas em breve
O comerciante on-line deve ficar atento as mudanças.
Sites de grande audiência, pois estes são precursores de tendências
Conclusão