Como planejar seu site

Criar um site pode parecer fácil, porém é necessário um conhecimento avançado em relação ao assunto que será explorado. Somente a ideia não basta, é preciso também planejar e traçar estratégias para que os resultados sejam satisfatórios. Basicamente, são duas fases para um bom planejamento. A primeira fase do projeto é a mais importante, onde deverão ser definidas as informações essenciais e onde e como as mesmas serão dispostas nas páginas do seu site.

Briefing – Informações sobre o site

A primeira fase do planejamento é o briefing, que significa coletar todas as informações que serão disponibilizadas. Nesta fase, algumas perguntas são feitas diretamente ao responsável pelo site afim de organizar a distribuição das mesmas:

  • Qual é o objetivo principal do site?
  • Qual o ramo de atuação da empresa e quais são os serviços oferecidos pela mesma?
  • Quem será o público alvo?
  • Que imagem será transmitida para este público?
  • Quais são as vantagens/desvantagens da empresa sobre os concorrentes?
  • Qual será o conteúdo do site?

Outras questões poderão ser inseridas na fase do briefing, caso seja necessário. Alguns exemplos são prazo/cronograma de desenvolvimento, verba do projeto, ferramentas de marketing, etc.

Arquitetura de Dados

Após finalizar a coleta das principais informações, a próxima fase será definir a arquitetura destes dados. Isso nada mais é do que o design das informações do site, com o objetivo de organizar toda a hierarquia dos conteúdos entre si para garantir uma boa estruturação dos fluxos de navegação. Esse processo consiste em analisar a relevância de todo o conteúdo que foi coletado na fase anterior e desenvolver caminhos entre as páginas para criar uma navegação fácil e intuitiva, definindo o mapa do site e a hierarquia dos menus de navegação. Ou seja, facilitar ao usuário final a busca da informação desejada.

Definir o peso do conteúdo é analisar e definir a relevância dos elementos de interface, como blocos de texto, busca, menu, imagens, etc.

O primeiro passo da arquitetura da informação será agrupar o conteúdo em grupos, relacionando-os entre si e separando por assunto. Esses grupos deverão ser agrupados em áreas para definir a hierarquia entre os conteúdos. Esse processo, chamado taxonomia, consiste na classificação dos elementos dentro de um contexto para que eles possuam um sentido e proporcionem ao usuário final um acesso intuitivo à informação.

Exemplo de Arquitetura da Informação de um site
Exemplo de Arquitetura de Informação

Neste exemplo, a seção Quem Somos também está ligada à página Contato, mesmo esta não estando presente na hierarquia de Quem Somos. Isso significa que a seção Quem Somos poderá ser levada até a página Contato por meio de um hiperlink.

Lembre-se que quanto maior um site, mais complexa será a sua arquitetura de informação. Com esses fluxogramas, os designers conseguem identificar e organizar os caminhos que o usuário fará para encontrar a informação que seja com mais facilidade.

Um bom ingrediente para sites eficientes e persuasivos é uma boa arquitetura.

A arquitetura de informação organiza toda a hierarquia do site. Dentro de cada página existirão elementos que serão distribuídos de acordo com sua relevância. É preciso saber quais serão as tarefas executadas pelos usuários finais para definir estes elementos, e realçar os pontos mais importantes.

Toda ideia pode ser transformada em site, desde que seja bem elaborada e possua fundamentos que colaborem para o seu objetivo. A complexidade do desenvolvimento do site dependerá principalmente do seu planejamento. Por isso, um projeto bem montado e com um fluxograma de conteúdo bem diagramado facilitará a criação do site e agilizará sua publicação.

Até mais, pessoal!

Configurando o Sublime Text 2

Sublime é um editor de código limpo, leve e customizável! Ele possui uma versão free e um desempenho incrível. Você vai adorar a interface do Sublime Text 2, pois ele possui um alto nível de personalização por código, plugins e atalhos.

 

Confira um passo a passo de como configura-lo no Windows 7:

 1º Passo

Você deve baixar o Sublime 2 e instalar em sua máquina.

2º Passo

Após instalar o Sublime em sua máquina será necessário instalar o Package Control. Através dele você poderá descobrir, instalar e gerenciar plugins, então não se esqueça esse passo é muito importante! 😉

Basta acessar a página Package Control copiar o código que está localizando na aba “Sublime 2” (Ctrl +C) e depois abra o Sublime 2 acesse View > Show Console, cole o código selecionado (Ctrl+V) e pressione o Enter.

Feche o Sublime e abra-o novamente para concluir a instalação. Caso apareça alguma mensagem de erro instale-o manualmente.

  1. Clique na guia Preferences > Browse Packages e acesse a pasta.
  2. Volte uma pasta anterior e acesse Installed Packages
  3. Baixe o Pacote Control.sublime-package e copie-o para o diretório Installed Packages 
  4. Restart Texto Sublime.

3º  Com o Sublime aberto pressione Ctrl + Shift + P e pesquise por Package Control: Install Package e presione Enter.

3 Dicas rápidas para utilizar o Sublime Text 2 [Bônus]

Dica 1 – Dois arquivos que você deve conhecer: Atalhos de teclado em Sublime Text 2 > Preferences > Key Bindings – User e definições gerais Sublime Text 2 > Preferences > Settings – User

Atenção se você quiser mudar algo, lembre-se altere sempre o arquivo de USER, pois assim você mantém as definições default intactas! 😉

Dica 2 – Quer relembrar os atalhos do Sublime? Basta pressionar Ctrl+Alt+P, cada comando que você digitar você visualizará a respectiva tecla de atalho. Fácil não é mesmo?

Dica 3 – Quer mover uma linha? Pressione Ctrl + Alt + Seta pra baixo/cima.
Quer mover o bloco todo? Segure o Shift + Seta pra direita.

Sugestão de plugin para turbinar o seu editor de códigos Sublime Text 2

Instale o Plugin Emment no Sublime

Pressione Ctrl + Shift + P digite Package Control: Install Package, depois procure por Emment e pressione Enter.

 

YES, você pediu!

Fundada em 2003 a yesBR Soluções Web oferecia apenas os serviços de hospedagem, manutenção e criação de sites. A partir de 2011 implementou os serviços de desenvolvimento de sistemas e lojas virtuais, atendendo clientes da região do Vale do Paraíba.

Em 2014, a frente de uma nova demanda, a empresa ampliou os seus serviços no meio digital, acompanhando a nova prática da publicidade online. 

A YESbr Agência Web agora representa o conceito de mutação constante. Conta com novos serviços  como, otimização de sites, disparo de email marketing, gerenciamento de redes sociais, links patrocinados e desenvolvimento de aplicativos mobile.

Abaixo o infográfico YES, VOCÊ PEDIU!

infografico_YESbr-01

 

Criando Formulário de envio de e-mail

Nosso formulário de envio de e-mail se divide em 2 páginas, o formulário principal e a página em PHP que é a página que realmente envia os e-mails.

A princípio vamos começar pelo formulário, ele tem como função captar as informações a serem enviadas para o e-mail.

Para isso iremos usar o Dreamweaver um programa de edição de códigos voltados para web. Basta0 iniciar o programa e selecionar a opção “HTML”

criando-formulario-de-envio-de-e-mail2

A partir dai vamos na aba “code” onde podemos digitar o código da página.

criando-formulario-de-envio-de-e-mail3

Vamos utilizar as seguinte tag abaixo:

<table> </table>

<form></form>

<input />

<textarea></textarea>

A tag <table> é responsável por começarmos uma tabela. Esta tabela nós deixamos com borda 0 ou seja ela não é vista pelo usuário. O atributo cellpadding é definido como “5” para que exista uma margem interna, facilitando a visualização. Também definimos cellspacing como 0 para evitar margens externas às células, e alinhamos a tabela ao centro.

Criaremos  uma tabela de 2 coluna por 6 linhas, e depois nas 4 linhas do meio nós iremos dividir em 2 colunas, portanto o código completo da nossa tabela fica da seguinte forma:

<table width="500" cellpadding="5" cellspacing="0" border="0" align="center">
<tr>
<th colspan="2">&nbsp;</th>
</tr>
<tr>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td colspan="2" align="center">&nbsp;</td>
</tr>
</table>

Depois da tag <table>, adicionamos uma “TR”, que é uma linha da tabela, e dentro dessa linha colocamos a tag “TH”, indicando o cabeçalho desta tabela.

Onde encontramos escrito &nbsp; é onde realmente podemos colocar nosso campos e nossos textos.

Os campos onde os dados são inseridos são chamados de input e textarea. A diferença entre os dois tipos é que no textarea podemos digitar várias linhas.

O código para nossos inputs é o seguinte (neste caso, para o campo nome):

<input type="text" name="nome" size="40" />

E o código para nosso textarea é o seguinte:

<textarea name="nome" cols="30" rows="5"></textarea>

Note que em todos os campos existe o atributo name. Ele é o responsável pela identificação do campo que será enviado para o PHP fazer o envio, tornando-se indispensável.

Nos inputs, type se refere ao tipo de dado inserido no form como não pedimos nenhum campo do tipo senha ou algo parecido vamos deixar todos como text, porém podemos deixar no lugar de text como password e então o campo realmente adquire características de um campo senha, como não mostrar os dados.

O atributo size indica o tamanho que este campo apresenta em relação ao quantidade de caracteres que podem ser inseridos. O mesmo vale para cols.

Já o atributo rows indica o número de linhas visíveis no textarea.

O campo input pode ser copiado mais 2 vezes: uma para e-mail outra para assunto. Porém não se esqueça de mudar os respectivos nomes.

Para que o formulário funcione o que falta é o form propriamente dito, o <form> fica antes da tabela, sendo assim engloba toda a tabela, e o comando </form> fica depois do fim da tabela pois ele delimita a área a ser enviada.

<form action="envia.php" method="post"></form>

No formulário, temos os atributos action e method.

Action representa o arquivo para o qual vamos enviar os dados (este ainda será criado). Ele será o responsável pelo envio do e-mail. Por fim temos o method, ele representa o método pelo qual as informações serão enviadas: get ou post. No nosso caso, post.

Tendo em vista que já criamos praticamente o form completo vamos agora colocar os botões que irão ser os responsáveis por apagar as informações nos campos e o botão responsável pelo envio.

<input type="submit" value="Enviar" /> <input type="reset" value="Limpar" />

O mais importante aqui é o “type”: ele realmente define o tipo do botão podendo ser o de enviar e o de limpar os campos. E nós os colocamos no fim de nossa tabela. Até agora nosso código está assim:

<form action="envia.php" method="post">
<table width="500" cellpadding="5" cellspacing="0" border="0" align="center">
<tr>
<th colspan="2">Formulário de Email</th>
</tr>
<tr>
<td align="right"><strong>Nome:</strong></td>
<td><input type="text" name="nome" size="40" /></td>
</tr>
<tr>
<td align="right"><strong>E-mail:</strong></td>
<td><input type="text" name="email" size="40" /></td>
</tr>
<tr>
<td align="right"><strong>Assunto:</strong></td>
<td><input type="text" name="assunto" size="40" /></td>
</tr>
<tr>
<td align="right"><strong>Mensagem:</strong></td>
<td><textarea name="nome" cols="30" rows="5"></textarea></td>
</tr>
<tr>
<td colspan="2" align="center"><input type="submit" value="Enviar" /> <input type="reset" value="Limpar" /></td>
</tr>
</table>
</form>

O PHP

Depois de criado o formulário HTML nós precisamos criar o php que é o responsável pelo envio das informações para o e-mail, para criarmos nosso formulário vamos começar um novo arquivo chamado enviar.php pelo Dreamweaver:

criando-formulario-de-envio-de-e-mail7

Para começar uma página php precisamos iniciar a página com uma tag <?php e finalizar a página com um ?>  segue o mesmo princípio do <body> </body> de uma página HTML padrão:

<?php
$hoje_tmp = getdate();
$nome = $_POST["nome"]; //trata a variável nome
$email = $_POST["email"]; //trata a variável e-mail
$assunto = $_POST["assunto"]; //trata a variável assunto
$mensagem = $_POST["mensagem"]; //trata a variável mensagem
$enviou = mail("seu_e-mail@vem.aqui", // aqui você coloca o seu e-mail
"$assunto",
"Nome: $nome
E-mail: $email
Assunto: $assunto
Mensagem: $mensagem",
"From: $email <$nome>");
if ($enviou){
    header('location: contato1.html');
} else {
    header('location: contato2.html');
}
 
?>

Esta é a programação por trás de nossa página php, a página tem o nome de falar.php não podemos nos esquecer disso, pois nós criamos com este nome .

Dentro desta programação podemos ver os seguinte código $nome = $_POST[“nome ”]; dentro do PHP isso quer dizer o seguinte a variável nome é igual ao post (método que usamos pra enviar as informações da outra página) e dentro das aspas temos o nome da variável que criamos no formulário, isso se aplica aos 4 campos. Por fim tempo o envio do e-mail, e onde esta o exemplo seu_e-mail@vem.aqui colocamos o e-mail que deseja receber as informações. Depois disso as informações que o sistema pegou ele insere nesta na ordem em que eles aparecem em vermelho na programação podendo ser alterados.

Logo depois do envido das informações temos uma condição o conhecido if (se), ele representa a seguinte função “se a variável $enviou for verdadeira vamos para a página contato1.html else (senão) nós iremos para a página contato2.html.

Confira um exemplo funcionado.

DICA: Você pode incrementar seu formulário, utilizando validação dos campos com jQuery e adicionando máscaras jQuery.

Criando menu em HTML com CSS

A função do CSS é definir regras de formatação e estilo de texto dentro de páginas web, então em nosso sistema de hoje vamos usar uma página em HTML e uma em CSS para criar um menu que mude de cor, o que gera um efeito muito interessante para sua página.

Primeiramente vamos criar nossa página em HTML com o nome menu.html para criar está página poremos usar varias ferramentas, como Notepad++ um ótimo editor de código e que pode ser encontrado facilmente na internet para download.

Criando o menu em HTML para criarmos o menu primeiro vamos criar uma lista não ordenada (tag UL), com 5 itens contendo um link cada um. Isto deve ser feito diretamente na página HTML, com o seguinte código.

<ul>
    <li><a href="#">link 1</a></li>
    <li><a href="#">link 2</a></li>
    <li><a href="#">link 3</a></li>
    <li><a href="#">link 4</a></li>
    <li><a href="#">link 5</a></li>
</ul>

Lembrando que este código deve estar entre as tags <body></body> de sua página.

Cada item LI será um botão do nosso menu, e cada um deles terá seu respectivo link.

Até aqui temos a lista dos links para as páginas que você deseja. Porém como o CSS ira funcionar? Nós colocamos o seguinte comando no topo de nossa página para chamar a folha de estilos:

<link href="css.css" rel="stylesheet" type="text/css" />

Então até agora nossa página se encontra assim.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Exemplo de Menu em HTML com CSS - YESbr Agência Web</title>
<link href="css.css" rel="stylesheet" type="text/css" />
</head>

<body>
<ul>
    <li><a href="#">link 1</a></li>
    <li><a href="#">link 2</a></li>
    <li><a href="#">link 3</a></li>
    <li><a href="#">link 4</a></li>
    <li><a href="#">link 5</a></li>
</ul>
</body>
</html>

Agora iremos criar o arquivo chamado css.css na mesma página que nosso página html, podemos criar em outro lugar porem teremos que alterar o destino no começo de nossa página html.

Criando uma página CSS

Para criação de nossa página de CSS nós temos algumas características que mudam e que podem fazer uma grande diferença futuramente nós podemos comentar algumas linhas, linhas comentadas estão entre as tags /* e */ ou seja tudo que estiver dentro destra linha não será lida pelo sistema portanto podemos comentar o que cada parte do código ira fazer, este tipo de coisa que parece pouco importante pode fazer realente uma grande diferença.

A estrutura de uma página css também é diferente de uma html, pois ela não começa com nenhuma tag html.

Dentro da página CSS, nós iremos colocar o estilo para cada elemento de nosso menu.

Primeiramente iremos atribuir características de fontes para toda a página, apenas para uma melhor exibição:

* {
    font-family:Verdana, Geneva, sans-serif;
    font-size:12px;
}

Os próximos códigos vamos usar para poder retirar a marcação dos itens da lista, bem como colocá-los sempre na mesma linha, uma vez que, por padrão, eles vem um embaixo do outro. Vamos também redefinir as margins internas e externas.

ul {
    margin: 0;
    padding:0;
}

li {
    list-style: none; 
    margin: 10px;
    display: inline;
}

Agora vamos definir o estilo dos links, para que a visualização dos mesmos fique mais agradável.

li a {
    padding: 5px 10px; 
    margin:0;
    border: 0px solid #f00; 
    background: #903;
    text-decoration: none;
    color:#FFF;
    /* cantos arredondados */
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
}
li a:hover {
    background: #CCC;
    color: #000; 
    border-color: #000;
}

O código completo de nossa página CSS fica assim:

* {
    font-family:Verdana, Geneva, sans-serif;
    font-size:12px;
}

ul {
    margin: 0;
    padding:0;
}

li {
    list-style: none; 
    margin: 10px;
    display: inline;
}
li a {
    padding: 5px 10px; 
    margin:0;
    border: 0px solid #f00; 
    background: #903;
    text-decoration: none;
    color:#FFF;
    /* cantos arredondados */
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
}
li a:hover {
    background: #CCC;
    color: #000; 
    border-color: #000;
}

Não se esqueça, quando copiar o código ou digitar comente o código ( usando o /*comentário*/ ) pois assim fica mais fácil de interpretar o código depois, e mais fácil de não se perder no meio da sua própria programação. Depois de criada a página você pode brincar a vontade com ela alterando as cores e fazendo varias combinações diferentes até achar uma que lhe agrade.

Confira dois exemplos funcionando aqui e aqui.

Como configurar o Google Webmaster Tools e solicitar nova verificação de Malware

1º Passo – Crie uma conta de email no seu site como “admin”, depois entre no site do google. Clique em Efetuar Login]

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware1

2º Passo – Em seguida clique em Crie uma conta agora.

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware2

3º Passo – Use a conta admin que você criou no seu site, para criar a conta no google. Como mostra a imagem abaixo.

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware3

4º Passo – Depois de criada sua conta no google, você será redirecionado para a página do google. No canto superior direito clique em Minha conta.

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware4

5º Passo – Assim que entrar na sua conta, clique em Ferramentas para Webmasters

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware5

6º Passo – Nesta página você adiciona o site em que irá fazer a verificação. Digite o nome do site por completo, como por exemplo www.yesbr.com.br, na caixa de texto e clique em Adicionar site.

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware6

7º Passo – Assim que o site for adicionado clique nele.

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware7

8º Passo – Quando entrar na Visão geral do site, clique em Verifique seu site.

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware8

9º Passo – Para fazer a verificação do site, você terá que confirmar ser o proprietário do site. Para isso existem 2 escolhas.

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware9

10.1º Passo – Você pode escolher incluir um meta tag dentro do parâmetro <HEAD> na Index do seu site.

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware10

10.2º Passo – Ou criar um arquivo qualquer com o nome especificado pela google e fazer o upload do mesmo em seu site. Feita 1 das opções clique em Verificar.

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware10-2

11º Passo- Caso seu site contenha algum vírus, a visualização sera semelhante a imagem abaixo. Basta corrigir as páginas indicadas pelo google. Feita a correção é só clicar em Solicitar uma revisão.

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware11

12º Passo – Caso seu site esteja limpo, você visualizará uma página semelhante a essa abaixo.

como-configurar-o-google-webmaster-tools-e-solicitar-nova-verificacao-de-malware12

Como configurar meu email no Outlook Express com a opção IMAP

Tutorial – Outlook Express

Configuração de E-mail com a opção IMAP.

1º Passo – Abra o Outlook Express e clique em Ferramentas e em seguida Contas.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap1

2º Passo – Clique em Adicionar Email.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap2

3º Passo – Nessa janela que abriu digite seu nome (o nome que aparecera nos email). E clique em Avançar.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap3

4º Passo – Informe seu endereço de e-mail e clique em Avançar.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap4

5º Passo – Selecione o tipo do seu servidor, que neste caso sera o IMAP. Informe o endereço de entrada e saída fornecidos pelo seu provedor (mail.yesbr.com.br).

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap5

6º Passo – Insira seu endereço de email e sua senha. Depois clique em Avançar.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap6

7º Passo – Feito as configurações necessárias clique em Concluir.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap7

8º Passo – Na janela de Contas na Internet clique em Propriedades.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap8

9º Passo – Nessa nova janela insira seu nome na Conta de email e clique na aba Servidores.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap9

10º Passo – Selecione “Meu servidor requer autenticação” e em seguida clique em Configurações.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap10

11º Passo – Na janela que abriu veja se esta selecionado a opção “Usar as configurações do servidor de entrada de emails”, caso não esteja selecionado selecione-o e clique em OK.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap11

12º Passo – Feito as alterações clique em OK.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap12

13º Passo – Para terminar clique em Fechar.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap13

14º Passo – Aparecera uma nova janela para fazer o download das pastas do servidores e clique em OK.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap14

15º Passo – Em seguida abrira uma nova janela onde você selecionara as pastas que quer visualizar no Outlook Express. Clique em Mostrar e depois OK.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap15

Opção de salvar cópia no servidor

Caso queira deixar uma cópia das mensagens no servidor a fim de poder acessar de vários computadores ao mesmo tempo os mesmos emails, porém:

Atenção -> neste caso há a necessidade de às vezes acessar o webmail para APAGAR as mensagens no servidor para não lotar a caixa de e-mail, então usar isso com cuidado, só em último caso.

Entre em Ferramentas – Contas – Propriedades. Clique na aba Avançado e selecione a opção “Deixar uma cópia das mensagens no servidor”.

como-configurar-meu-email-no-outlook-express-com-a-opcao-imap16

Como configurar meu email no IncrediMail com a opção IMAP

Configurando com a opção IMAP.

1º Passo – Abra o IncrediMail clique em Ferramentas e em seguida Contas.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap1

2º Passo – Clique em Adicionar.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap2

3º Passo – No assistente da conta selecione “Configurarei os ajustes sozinho”. E clique em Avançar.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap3

4º Passo – Informe seu nome e seu endereço de e-mail e clique em Avançar.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap4

5º Passo – Selecione o tipo do seu servidor, que neste caso sera o IMAP. Informe o endereço de entrada e saída fornecido pelo seu provedor (mail.yesbr.com.br). E clique em Avançar.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap5

6º Passo – Insira seu endereço de e-mail e sua senha em seguida clique em Concluir.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap6

7º Passo – No final aparecerá uma janela como esta abaixo informando que sua conta foi criada com êxito. Clique em OK.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap7

8º Passo – Ainda na janela de “Contas de e-mail”, clique em Propriedades.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap8

9º Passo – Nessa janela que abriu clique na aba Servidores.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap9

10º Passo – Selecione “Meu servidor requer autenticação” em seguida clique na aba Avançado.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap10

11º Passo – Agora selecione as opções “Este servidor exige uma conexão segura(SSL) e clique em OK.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap11

12º Passo – Feito as configurações clique em Fechar.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap12

13º Passo – Em seguida aparecerá uma janela informando o certificado de segurança clique em OK.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap13

14º Passo – Logo após surgirá uma janela pedindo para informar o seu e-mail e senha, depois clique em OK. E começe a usar seu gerenciador de e-mail normalmente.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap14

Opção de salvar cópia no servidor

Caso queira deixar uma cópia das mensagens no servidor a fim de poder acessar de vários computadores ao mesmo tempo os mesmos emails, porém:

Atenção -> neste caso há a necessidade de às vezes acessar o webmail para APAGAR as mensagens no servidor para não lotar a caixa de e-mail, então usar isso com cuidado, só em último caso.

Entre em Ferramentas – Contas – Propriedades. Clique na aba Avançado e selecione a opção “Deixar uma cópia das mensagens no servidor”.

como-configurar-meu-email-no-incredimail-com-a-opcao-imap15

Como configurar meu email no ThunderBird com a opção IMAP

Configurando o TunderBird com a opção IMAP.

1º Passo – Abra o thunderbird clique em Ferramentas e em seguida Configurar contas.

como-configurar-meu-email-no-thunderbird1

2º Passo – Clique em Nova conta.

como-configurar-meu-email-no-thunderbird2

3º Passo – No assistente de contas selecione a opção desejada, no caso Conta de email. E clique em Avançar.

como-configurar-meu-email-no-thunderbird3

4º Passo – Informe seu nome e seu endereço de e-mail e clique em Avançar.

como-configurar-meu-email-no-thunderbird4

5º Passo – Selecione o tipo do seu servidor, que neste caso sera o IMAP. Informe o endereço de entrada fornecido pelo seu provedor.

como-configurar-meu-email-no-thunderbird5

6º Passo – Insira seu endereço de e-mail. Depois clique em Avançar.

como-configurar-meu-email-no-thunderbird6

7º Passo – Entre com seu endereço de e-mail novamente. E clique em Avançar.

como-configurar-meu-email-no-thunderbird7

8º Passo – Feito as configurações clique em Concluir.

como-configurar-meu-email-no-thunderbird8

9º Passo – Na janela Configurar contas clique em Servidor de envio(SMTP) e depois em Adicionar.

como-configurar-meu-email-no-thunderbird9

10º Passo – Insira o endereço do seu servidor de saída. Selecione “O servidor requer autenticação” e “Usar autenticação segura” em seguida clique em OK. Como mostra a figura abaixo.

como-configurar-meu-email-no-thunderbird10

 

11º Passo – Feito as configurações clique em OK.

como-configurar-meu-email-no-thunderbird11

12º Passo – Em seguida aparecera uma janela pedindo sua senha, depois de inseri-la é so clicar em OK. E podera usar seu gerenciador de e-mails normalmente.

como-configurar-meu-email-no-thunderbird12

Como configurar meu email no IncrediMail com a opção SSL

Configurando com a opção SSL.

1º Passo – Abra o IncrediMail clique em Ferramentas e em seguida Contas.

como-configurar-meu-email-no-incredimail1

2º Passo – Clique em Adicionar.como-configurar-meu-email-no-incredimail2

3º Passo – No assistente da conta selecione “Configurarei os ajustes sozinho”. E clique em Avançar.

como-configurar-meu-email-no-incredimail3

 

4º Passo – Informe seu nome e seu endereço de e-mail e clique em Avançar.

como-configurar-meu-email-no-incredimail4
5º Passo – Selecione o tipo do seu servidor, que neste caso sera o POP3. Informe o endereço de entrada e saída fornecido pelo seu provedor (mail.yesbr.com.br). E clique em Avançar.

como-configurar-meu-email-no-incredimail5

 

6º Passo – Insira seu endereço de e-mail e sua senha em seguida clique em Concluir.

como-configurar-meu-email-no-incredimail6
7º Passo – No final aparecerá uma janela como esta abaixo informando que sua conta foi criada com êxito. Clique em OK.
como-configurar-meu-email-no-incredimail7
8º Passo – Ainda na janela de “Contas de e-mail”, clique em Propriedades.

como-configurar-meu-email-no-incredimail8

9º Passo – Nessa janela que abriu clique na aba Servidores.

como-configurar-meu-email-no-incredimail9

 

 

10º Passo – Selecione “Meu servidor requer autenticação” em seguida clique na aba Avançado.

como-configurar-meu-email-no-incredimail10
11º Passo – Agora selecione as opções “Este servidor exige uma conexão segura(SSL) e clique em OK.

como-configurar-meu-email-no-incredimail11

 

12º Passo – Feito as configurações clique em Fechar. E começe a usar seu gerenciador de e-mail normalmente.

como-configurar-meu-email-no-incredimail12
Opção de salvar cópia no servidor

Caso queira deixar uma cópia das mensagens no servidor a fim de poder acessar de vários computadores ao mesmo tempo os mesmos emails, porém:

Atenção -> neste caso há a necessidade de às vezes acessar o webmail para APAGAR as mensagens no servidor para não lotar a caixa de e-mail, então usar isso com cuidado, só em último caso.

Entre em Ferramentas – Contas – Propriedades. Clique na aba Avançado e selecione a opção “Deixar uma cópia das mensagens no servidor”.

como-configurar-meu-email-no-incredimail13