webdesign: programação, website e redes sociais
TRANSCRIPT
![Page 1: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/1.jpg)
WEBDESIGN:PROGRAMAÇÃO, WEBSITESE REDES SOCIAIS
RENATO MELO - 2015
![Page 2: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/2.jpg)
REGISTRANDO UM SITEE INTRODUÇÃO AO HTML
![Page 3: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/3.jpg)
Registro.brPortal oficial de domínios do Brasil.Domínios para pessoas físicas e jurídicas.
![Page 4: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/4.jpg)
Para os BuscadoresDomínios do Brasil também contam pontos no ranking dos motores de busca
![Page 5: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/5.jpg)
Evite Dor de CabeçaEvite registrar domínios diretamenteno Provedor de Hospedagem.
![Page 6: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/6.jpg)
Domínios reservadosO Comitê Gestor pode reservar nomes de acordo com o critério constante na regulamentação vigente
![Page 7: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/7.jpg)
CategoriasUma pessoa ou empresa pode registrar o mesmo domínio em categorias diferentes:Ex: seusite.com.br e seusite.net.br
![Page 8: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/8.jpg)
PesquiseAntes de registrar, você pode pesquisar se o domínio já existe. Senão, busque alternativas que estejam disponíveis.
![Page 9: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/9.jpg)
![Page 10: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/10.jpg)
![Page 11: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/11.jpg)
Faça seu cadastrocomo usuário e registro do domínio
![Page 12: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/12.jpg)
Quanto custa?R$ 30 no primeiro anoR$ 27 para os restantes
![Page 13: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/13.jpg)
O pagamento é feito via boleto ou cartão de crédito
![Page 14: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/14.jpg)
O domínio só garante seu endereço. Você precisa de uma hospedagem para armazenar seus arquivos.
![Page 15: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/15.jpg)
E O REGISTRO.BR PEDIRÁ O DNSÉ o equipamento responsável por permitirque seu domínio esteja ativo na internet. Éum endereço fornecido pelo seu provedor.
![Page 16: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/16.jpg)
CONTRATE HOSPEDAGEM EM LINUXHospedagens em Linux são ideais para trabalhar com banco de dados (php). Uma hospedagem em Windows é boa somente para a linguagem da microsoft: ASP.net
![Page 17: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/17.jpg)
Outros domíniosEmpresas utilizam também o registro .com para preservar a marca.
![Page 18: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/18.jpg)
Outros domíniosEleito o melhor site de registros do mundo
![Page 19: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/19.jpg)
CelularMantém o mesmo domínio. A diferença é que um código redirecionador identifica que o acesso é via celular e lhe encaminha para a versão mobile.
![Page 20: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/20.jpg)
CelularMas, quando uma versão específica é necessária, é comum criar um subdomínio para armazenar o site via celular. O mais comum é registar um subdomínio chamado “m”, ficando, por exemplo, m.facebook.com
![Page 21: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/21.jpg)
SubdomínioVocê pode criar um subdomínio também para outros sites independentes, como o google, que criou um subdomínio chamado “translate” para abrigar o google tradutor.
![Page 22: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/22.jpg)
OportunidadeFique atento a um domínio estratégico para o seu negócio ou para um negócio novo. Um exemplo é o brejas, uma rede social só para cervejas.
![Page 23: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/23.jpg)
OportunidadeOutro bom exemplo é o site Pizzaria em Santos.
![Page 24: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/24.jpg)
Muito longosEvite domínios muito longos. O site deste festival ficou como festludi.com.br para ficar curto e de fácil interpretação.
![Page 25: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/25.jpg)
Ao criar uma empresaSe você está criando uma empresa, faça uma busca no registro.br e veja se o nome está disponível. As pessoas sempre vão digitar nomedasuaempresa.com.br quando não procuram no google.
![Page 26: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/26.jpg)
E....Mesmo se você optar por outro domínio, registre sempre o domínio com o nome da sua empresa para proteção de marca. O provedor de hospedagem pode redirecionar o site e você ter mais de um domínio para o mesmo site.
![Page 27: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/27.jpg)
anatel.gov.brUm exemplo é a Anatel, que não comprou o domínio .com.br. Ao acessar este endereço, você é redirecionado para a página da empresa Terra Preta.
![Page 28: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/28.jpg)
E como meu site vai pro ar? Como eu mando meus arquivos?
![Page 29: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/29.jpg)
Você transfere os arquivos via FTP
![Page 30: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/30.jpg)
Pode ser feito no site da sua hospedagem, via windows explorer ou de um programa
![Page 31: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/31.jpg)
Filezilla: o mais usado
![Page 32: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/32.jpg)
Você precisa de:Endereço do FTPUsuárioSenha
![Page 33: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/33.jpg)
AGORA, O HTML...
![Page 34: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/34.jpg)
Internet, como é composta?
1. Tecnologia de rede aberta
2. Hipertexto
3. Interface gráfica
![Page 35: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/35.jpg)
HTMLNão é grego, nem coisa
de nerd.
É que nem inglês. Não precisa saber, mas quem sabe sempre tem um diferencial.
![Page 36: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/36.jpg)
INTERFACE GRÁFICAA parte legal da história...
![Page 37: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/37.jpg)
Mas antes, vem a
teoria...Antigamente: Interface com computadores era negócio para gênios da informática
Hoje: O desenvolvimento de interfaces gráficas permite o
uso por não especialistas
![Page 38: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/38.jpg)
Os opostos
se atraemO desenvolvimento das interfaces
gráficas permitiu a criação de programas WYSIWYG
What You See Is What You
Get
![Page 39: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/39.jpg)
HTMLHtml é um arquivo que pode ser interpretado por navegadores.
![Page 40: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/40.jpg)
HTMLE pode ser editado desde o bloco de notas até programas WYSIWYG, como o Dreamweaver
![Page 41: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/41.jpg)
Bloco de notasSomente a linha de código contendo sua programação
![Page 42: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/42.jpg)
DreamweaverEdição do html na linha de código ou no design.
![Page 43: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/43.jpg)
INTRODUÇÃO AOE-MAIL MKT E HTML
![Page 44: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/44.jpg)
E-mail MKTNão deixe que sua empresa seja igual ao seu “Tio chato”
![Page 45: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/45.jpg)
Se você não gosta de receber, por
que enviar?
![Page 46: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/46.jpg)
LegislaçãoCompra de dados é ilegal! Tanto para e-mail, quanto para SMS, você precisa ter autorização da pessoa para enviar e-mail marketing.
![Page 47: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/47.jpg)
LegislaçãoMesmo com autorização, você tem que disponibilizar um link de opt-out, caso o cliente não queira mais suas mensagens.
![Page 48: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/48.jpg)
SPAMQuanto mais marcação como SPAM no seu domínio, pior para você
![Page 49: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/49.jpg)
INTRODUÇÃO DO CSS NO
WEBDESIGN
![Page 50: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/50.jpg)
Antigamente: Site com
emaranhado de tags, estilos e
formatações
![Page 51: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/51.jpg)
Se o cliente pedisse alteração
você tinha que alterar página
por página.
![Page 52: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/52.jpg)
![Page 53: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/53.jpg)
Programação em Três Partes
Html: Conteúdo
CSS: Estilo
Javascript: Inteligência
![Page 54: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/54.jpg)
SEM PADRÕES
✗ Extensão da Mídia Impressa
✗ Layout baseado em Tabelas
✗ Conteúdo, Apresentação e Comportamento “aninhados”
✗ Código Incompreensível
![Page 55: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/55.jpg)
COM PADRÕES
✔ Acessível de qualquer dispositivo
✔ Layout baseado em CSS
✔ Separação entre
Conteúdo, Apresentação e Comportamento
✔ Código Acessível
![Page 56: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/56.jpg)
VANTAGENSCarregamento mais rápido
Menores custos com hospedagem
Melhor Consistência Visual
Redesign mais barato e eficiente
Melhores resultados nos Mecanismos de Buscas
Maior acessibilidade
![Page 57: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/57.jpg)
Prazer CSS
![Page 58: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/58.jpg)
nomeDefine um estilo único para um elemento: body, h1...
TÉCNICOParte mais importante
![Page 59: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/59.jpg)
#nomeDefine um estilo único para um identificador
#TIMESeguem as ordens do técnico
![Page 60: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/60.jpg)
.nomeDefine um estilo único para uma classe, que pode ser utilizada qualquer hora.
.jogadorJoga para o #time
![Page 61: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/61.jpg)
Exemplobody{background: #ccc;font: 12pt Arial, Sans-Serif;color: #000;
}
#topo{width: 780px;background: #ccc url(bgtopo.jpg) repeat-x;font-size: 20pt;color: #ff0000;
}
.produto{float: right;text-align: center;font-size: 16pt;color: #ff0000;
}
![Page 62: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/62.jpg)
PADRÃO DE
CORES
![Page 63: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/63.jpg)
COR HEXÉ a cor do #
![Page 64: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/64.jpg)
As Fontes também merecem atenção
![Page 65: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/65.jpg)
Exemplos de fontes:Arial, Calibri, VerdanaTrebuchet, Times New Roman...
![Page 66: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/66.jpg)
Pode-se colocar mais de uma fonte + opção de “Sans-serif” ou “Serif”
![Page 67: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/67.jpg)
O UX e Usabilidade
![Page 68: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/68.jpg)
“Você deve começar com a experiência do usuário e depois ir para a tecnologia”
![Page 69: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/69.jpg)
O USUÁRIO NÃO QUER ESPERAR!
![Page 70: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/70.jpg)
A CADA 100 MILISSEGUNDOS DE TEMPO DE CARREGAMENTO DE PÁGINA REDUZ 1% DE VENDAS NA AMAZON.
AMAZON
![Page 71: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/71.jpg)
AO AUMENTAR O CARREGAMENTO DO SITE DE 0.4 PARA 0.9 SEGUNDOS, PERDEU 20% DA RECEITA EM PUBLICIDADE,
![Page 72: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/72.jpg)
INTERNET ONTEM
Anúncios Sites Institucionais
![Page 73: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/73.jpg)
INTERNET HOJE
Anúncios Sites Institucionais SEO Mobile
RedesSociais
Geo localização ConversãoNo PDV
Logística
![Page 74: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/74.jpg)
USUÁRIO TEM QUE POSSUIR UMA EXPERIÊNCIA POSITIVA EM TODOS OS CANAIS
![Page 75: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/75.jpg)
O QUE PRECISA SER PENSADO
CONTEXTO
USUÁRIOCONTEÚDO
![Page 76: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/76.jpg)
LEMBRE-SE: O FOCO É NAS PESSOAS!
![Page 77: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/77.jpg)
CHECKLIST DO UX
TAMANHO DA TELA
CONECTIVIDADE
OBJETIVOS DO USUÁRIO
AMBIENTES DO
USUÁRIO
CAPACIDADE DO
USUÁRIO
![Page 78: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/78.jpg)
EXPERIÊNCIA NO CELULAR
![Page 79: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/79.jpg)
NÃO ESTAR NO MOBILE É COMO FECHAR SUA LOJA UMA VEZ POR SEMANA.Fonte: Google
DETALHES
![Page 80: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/80.jpg)
NÃO CONFUNDA O USUÁRIO!!!
![Page 81: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/81.jpg)
O QUE PRECISA TER?
PÃOMAIONESETOMATEALFACEMUSSARELACHEDDARCARNEOVOONION RINGSBACONKETCHUPMOSTARDA
O HAMBURGUER
![Page 82: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/82.jpg)
O QUE PRECISA TER?
PÃOCARNE
O HAMBURGUER
![Page 83: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/83.jpg)
VALIDAÇÃODA IDEIA
![Page 84: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/84.jpg)
A ARTE DA VALIDAÇÃO:PIADAS ERAM CONTADAS ATÉ PARA AS FAXINEIRAS
![Page 85: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/85.jpg)
A MAIORIA É BURRA
![Page 86: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/86.jpg)
FEZ TESTE?
LANÇOU BETA?
FEZ UM PROTÓTIPO?ENTÃO O BURRO É VOCÊ!
![Page 87: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/87.jpg)
LEP
O L
EP
O N
O T
WIT
TER
![Page 88: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/88.jpg)
MODELO ANTIGO
IDEIADESENVOLVIMENTO
LANÇAMENTO
MAIS CHANCE DE ERROSEM APRENDIZADOSEM CONTINUIDADE
![Page 89: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/89.jpg)
MODELO NOVO
IDEIADESENVOLVIMENTO
LANÇAMENTO
VALIDAÇÃO
ITERAÇÃO
MENOS CHANCE DE ERROAPRENDIZADOCONTINUIDADE
![Page 90: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/90.jpg)
NÃO SE PODE MELHORAR O QUE NÃO SE MEDE
![Page 91: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/91.jpg)
ConversãoUX e Usabilidade
![Page 92: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/92.jpg)
O BÁSICO: O QUE FAZER E O QUE NÃO
FAZER
![Page 93: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/93.jpg)
1 – DEIXAR CLARO DOQUE SE TRATA O SITE
![Page 94: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/94.jpg)
2 – FONTE BACANA, MAS
LEGÍVEL
![Page 95: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/95.jpg)
3 – NÃO USE POP-UP
![Page 96: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/96.jpg)
4 – NÃO USE URLS DISCONEXAS OU DESPROTEGIDAS
![Page 97: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/97.jpg)
![Page 98: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/98.jpg)
5 – NÃO TOQUE
MÚSICA
![Page 99: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/99.jpg)
6 – BOTÃO VOLTAR SEMPRE
FUNCIONANDO E NAVEGAÇÃO FACILITADA
![Page 100: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/100.jpg)
7 – LINKS COM COR E QUE TROQUEM DE COR
DEPOIS QUE SÃO VISITADOS
![Page 101: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/101.jpg)
TESTES
![Page 102: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/102.jpg)
1) FEEDBACK
até 0,1s: ideia de continuidade
até 1s: delay percebido, mas ok
depois de 10s: o usuário muda de tarefa.
![Page 103: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/103.jpg)
2) PÁGINAS DE ERRO
O usuário deve saber o que está acontecendo em uma linguagem fácil.
O usuário deve saber que a culpa não foi dele.
O usuário deve conseguir voltar para o site.
![Page 104: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/104.jpg)
Nome:
Endereço:
Telefone 1:
Celular:
Telefone da Mãe:
CPF:
RG:
Nome do Cachorro:
Estado Civil:
3) FORMULÁRIO
![Page 105: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/105.jpg)
3) FORMULÁRIO
Nome:
Endereço:
CEP:
CPF:
Telefone:
Renato Melo
Rua dos Bobos, número zero
01234-000
12345678900
48 6666-6666
Houve um erro no preenchimento do formulário.
Onde?Não use espaços ou hifens no telefone. Utilize somente números.
13 6666-6666
![Page 106: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/106.jpg)
4) CAIXA DE BUSCA
![Page 107: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/107.jpg)
5) ETAPAS DO SEU SITE
1. Escolhas dos produtos
2. Cadastro ou login
3. Entrega e embalagem
4. Pagamento
![Page 108: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/108.jpg)
Testes de Usabilidade
![Page 109: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/109.jpg)
TESTE COM USUÁRIOS!Nunca mencione a palavra teste, ela assusta as pessoas.
![Page 110: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/110.jpg)
Maior controle de dados e variáveis;
Mais fácil de envolver o cliente;
Maior custo
Usuário pode se sentir desconfortável
Comportamento distante do seu universo real
LABORATÓRIO
![Page 111: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/111.jpg)
Mais barato;
Usuário se sente mais a vontade;
Mais próximo de seu uso real;
Menor controle dos dados e variáveis
Dificuldade de envolver o cliente (quem contrata)
AMBIENTE DO USUÁRIO
![Page 112: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/112.jpg)
Laboratório
Medir performance (tempo, número de
erros)
Produção acadêmica (maior “aceitação”
científica para teses, artigos e dissertações)
Estudos permanentes com equipe dedicada
(Globo, Nokia)
Ambiente do Usuário
Obter feedback rápido
Projetos com recursos reduzidos
Testar conceitos e interfaces em fases iniciais de design
![Page 113: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/113.jpg)
SÉRIES AMERICANASNOVELAS BRASILEIRAS
![Page 114: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/114.jpg)
![Page 115: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/115.jpg)
CASES
![Page 116: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/116.jpg)
EFICÁCIA:
Novo Design e Disposição:Passou de
500 inscrições para 1200 por
mês
![Page 117: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/117.jpg)
EFICIÊNCIA:
35% da operação do Call Center
existia apenas para responder uma demanda: Onde encontrar
a 2ª via do boleto.
![Page 118: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/118.jpg)
ConversãoFazer seu usuário agir da forma
desejada e mensurável
![Page 119: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/119.jpg)
WEBDESIGNNAS REDESSOCIAIS
![Page 120: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/120.jpg)
AS AGÊNCIAS DE PUBLICIDADE E A
GUERRA ENTRE ON E OFF
![Page 121: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/121.jpg)
PESQUISA MAIS RECENTE: 2013
BRASIL ATRASADO!52% TV ABERTA16.4% JORNAL E IMPRESSOS7.7% TV FECHADA6.5% INTERNET
EUA:42 BILHÕES – MKT DIGITAL
40 BILHÕES – TV ABERTA
![Page 122: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/122.jpg)
AGÊNCIAACOMODADA
MERCADODESESPERADO
REPRESENTANTE COMERCIALDE JORNAIS, REVISTAS E EMISSORAS DE RÁDIO E TV.
MOBILE MARKETINGMARKETING DIGITALTUDO MUDANDO A CADA TRIMESTRE
![Page 123: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/123.jpg)
COMERCIANTEACOMODADO
MERCADOALIENADO
ANÚNCIOS EM JORNAIS, REVISTAS E EMISSORAS DE RÁDIO E TV, ALÉM DE FLYERS, FOLDERS E MÍDIA IMPRESSA.
NÃO SABE O QUE FAZERNÃO SABE COMO PEDIRAGÊNCIA NÃO SABE COMO OFERECER
![Page 124: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/124.jpg)
PÚBLICOCONECTADOFACEBOOKWHATSAPPTWITTERSNAPCHATINSTAGRAMWE HEART ITPINTERESTLINKEDINGOOGLE+GOOGLEANGRY BIRDSCANDYCRUSH
E O DIA CONTINUATENDO 24H...
![Page 125: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/125.jpg)
AGÊNCIA DE PUBLICIDADE
Remuneração: 20% do investimento
Resultado: você fala e os outros escutam. Ponto final!
![Page 126: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/126.jpg)
AGÊNCIA DE PUBLICIDADE
ROI: baseado na audiência.
No fim, quantas ficaram no canal até o comercial do seu anúncio? Quantas viram o seu anúncio?
![Page 127: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/127.jpg)
HOJE, MÍDIA TRADICIONAL ESTÁ
SAINDO MUITO CARO PARA AS
PME’S
![Page 128: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/128.jpg)
![Page 129: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/129.jpg)
![Page 130: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/130.jpg)
![Page 131: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/131.jpg)
INSTAGRAM:1 MILHÃO DE NOVOS USUÁRIOS POR DIA
![Page 132: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/132.jpg)
FOTOS NO FORMATO SQUARE (QUADRADO). EXIBIDA COM 612X612
pixels. TAMANHO MÁXIMO: 2048x2048 px
![Page 133: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/133.jpg)
YOUTUBE
![Page 134: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/134.jpg)
![Page 135: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/135.jpg)
![Page 136: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/136.jpg)
![Page 137: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/137.jpg)
![Page 138: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/138.jpg)
IMAGENS THUMB:1366X709px
![Page 139: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/139.jpg)
![Page 140: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/140.jpg)
POST: A IMPORTÂNCIA
DA FOTO
![Page 141: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/141.jpg)
Publicações com foto!Chamam atenção e aumentam em 180% as chances de engajamento.
![Page 142: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/142.jpg)
O número de cliques na foto é o maior
índice de engajamento.
![Page 143: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/143.jpg)
Faça posts “humanos”, mostrando as pessoas e equipes que estão por trás da fanpage/empresa.
![Page 144: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/144.jpg)
SÓ USE GATINHO EM IMAGEM SE VOCÊ FOR SOCIAL MEDIA DA WHISKAS.SÉRIO, NÃO USE!!!
![Page 145: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/145.jpg)
NEM SE ELE FOR MEIGUINHO?NÃÃÃÃÃOOOO!!!
![Page 146: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/146.jpg)
NEM SE ELE FOR CUTI-CUTI?NÃÃÃÃÃÃOOOOO!!!!
![Page 147: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/147.jpg)
TER UMA REDE SOCIAL HOJE É
O CAMINHO MAIS FÁCIL DE
CONSEGUIR VISITANTES PARA O SEU
SITE
![Page 148: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/148.jpg)
PRIMEIRA DICA E REGRA DE OURO NO FACEBOOK:
SÓ USE IMAGENS EM PNG!
![Page 149: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/149.jpg)
IMAGEM PARA POST
![Page 150: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/150.jpg)
As imagens são encaixadas numa espécie de “box invisível”, com altura máxima de 394px e largura máxima de 470px. Se a imagem estiver no tamanho errado, ela ficará com espaço branco (foto).
![Page 151: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/151.jpg)
As imagens são encaixadas numa espécie de “box invisível”, com altura máxima de 394px e largura máxima de 470px. Se a imagem estiver no tamanho errado, ela ficará com espaço branco (foto).
![Page 152: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/152.jpg)
O tamanho ideal é 700x522 pixels. Para imagens com melhor definição, você pode ampliar o tamanho mantendo a mesma escala.
![Page 153: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/153.jpg)
Na hora de postar um link, crie uma imagem com 1200x628, porém será exibido com a medida de 246x470 px
![Page 154: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/154.jpg)
Link de vídeos externos ou páginas que tenham imagens menores do que 246x470px serão exibidas como miniaturas de 150x150px.
![Page 155: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/155.jpg)
FACE ADS
![Page 156: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/156.jpg)
FOTOS PROIBIDAS:LOGOS E MENÇÕES AO FACEBOOK (LIKE, ETC)NUDEZ E FOTOS VIOLENTASBELEZA PERFEITA (EMAGRECER)RACISMO/PRECONCEITOS/ÓDIO
![Page 157: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/157.jpg)
POST PATROCINA
DO
![Page 158: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/158.jpg)
O Facebook permite apenas 20% de texto, por isso construa uma grade com linha guia, criando 25 quadrados. Assim, apenas 5 poderão conter texto.
![Page 159: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/159.jpg)
O Facebook permite apenas 20% de texto, por isso construa uma grade com linha guia, criando 25 quadrados. Assim, apenas 5 poderão conter texto.
![Page 160: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/160.jpg)
ANÚNCIOS
![Page 161: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/161.jpg)
A mesma coisa serve para anúncios de curtidas ou cliques no site.Curtidas: 1200x444pxCliques no site: 1200x628px
![Page 162: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/162.jpg)
WEBDESIGN HOME OFFICEFREELAS
![Page 163: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/163.jpg)
Meu primeiro JOB vai nascer! Quanto cobro?
![Page 164: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/164.jpg)
1º O que o cliente quer?
![Page 165: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/165.jpg)
Solução para o problema dele
Um site horrível!
Prazo: OntemPreço
Barato, pois o sobrinho sabe fazer
um igual
Atendimento
Tratar o cliente como a mãe dele o trataria
![Page 166: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/166.jpg)
Não fale grego e facilite a
comunicação
![Page 167: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/167.jpg)
Como cobrar?
Por insumo (fotos, páginas)
1)Prefira estipular um valor para a identidade visual.
2)Só depois, estipule um valor por página.
![Page 168: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/168.jpg)
Como cobrar?
Preço Fechado
1)Entendeu o que o cliente quer.
2)Notou que o cliente não trará grandes problemas ou já conhece o cliente.
![Page 169: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/169.jpg)
Como cobrar?
Preço por Hora
1)Fazer o Mapa do Site
2)Calcular seus custos
3)Calcular quanto tempo irá levar
![Page 170: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/170.jpg)
MONTANDOO MEU HOME OFFICE
![Page 171: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/171.jpg)
Custos Fixos
InternetLuzTelefone
![Page 172: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/172.jpg)
Custos Variáveis
DomínioHospedagemBanco de ImagemProfissional Extra
![Page 173: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/173.jpg)
Custos Variáveis
Não esqueça dos extras:
-Pizza para comer rápido pois o prazo está curto
-Café para manter acordado, etc
![Page 174: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/174.jpg)
Patrimônio
ComputadorLivroSoftwareCursos
![Page 175: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/175.jpg)
Quer ganhar quanto?
Salário13ºFériasDias da semana trabalhados
![Page 176: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/176.jpg)
VALOR HORA – Iniciando:
Valor Hora
Custo + patrimônio R$ 2,22
Mão de obra (salário base de R$2.500,00) R$ 14,57
Valor Hora R$ 16,79
![Page 177: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/177.jpg)
LUCRO HORA:
Valor Hora
Custo + patrimônio R$ 2,22
Mão de obra (salário base de R$2.500,00) R$ 14,57
Valor Hora R$ 16,79
Lucro de 30% R$ 21,83
![Page 178: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/178.jpg)
Ajustes Tempo:
Valor Hora
Custo + patrimônio R$ 2,22
Mão de obra (salário base de R$2.500,00) R$ 14,57
Valor Hora R$ 16,79
Lucro de 30% R$ 21,83
20% para e-mails, estudos, etc R$ 26,19
![Page 179: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/179.jpg)
Ajustes Cliente:
Valor Hora
Valor Hora R$ 16,79
Lucro de 30% R$ 21,83
20% para e-mails, estudos, etc R$ 26,19
10% margem de erro R$ 28,81
10% margem de choro R$ 31,68
![Page 180: Webdesign: Programação, Website e Redes Sociais](https://reader038.vdocuments.com.br/reader038/viewer/2022110122/55b11832bb61eb506e8b456e/html5/thumbnails/180.jpg)
Ajustes para Tipo de Cliente:
Cliente Valor Hora
Pequeno comércio R$ 633,60
PME 50% R$ 950,40
Grandes Empresas
250%R$ 3326,40