SEO e Usabilidade

O intuito desse artigo é alertar e orientar os desenvolvedores de WebSites quanto ao uso incorreto de imagens.
Já visto em artigos anteriores a importância da Otimização de Imagens para SEO, agora vai uma dica de como a otimização de imagens pode ajudar na velocidade do seu WebSite. Vários testes feitos pela equipe do BrasilSEO comprovam que o uso correto das imagens pode melhorar em até 60% o tempo de carregamento do seu WebSite.

OBS: as respectivas telas desse artigo são do programa Adobe Fireworks CS3 na aba Export.

Formatos de imagens mais utilizados para WEB.

• JPG: A Compactação JPG descarta todas as partes menos significativas da imagem não alterando o modo como ela é percebida pelo olho humano.

• GIF: A compactação GIF cria uma paleta de todas as cores utilizadas em uma imagem e um mapa de onde elas aparecem, com isso, economiza pontos de mesma cor em uma imagem, sua grande vantagem é suportar transparência. Por utilizar no máximo 256 cores não é aconselhado o uso em fotos.

• PNG: Formato que veio pra substituir a GIF. Ele suporta 32 Bits de cores, níveis de transparência, compressão sem perda de qualidade e é capaz de definir o nível de opacidade de cada pixel.

Por que não utilizar PNG?

Como vimos o formato PNG mescla as melhores características da JPG e da GIF e com isso surge a pergunta “Por que então todos os WebSites não utilizam somente PNG?”. Não é utilizado em grande escala o formato PNG devido à incompatibilidade com alguns navegadores, por exemplo, o internet explorer 6.0 ainda muito utilizado não suporta os efeitos de transparência substituindo o mesmo por um campo azulado e quando estamos trabalhando com imagem simples ( baixa quantidade de cores ) o tamanho de uma PNG costuma ficar bem maior do que de uma imagem no formato GIF.

Como corrigir os erros na utilização da PNG.

• Usando JScript

Baixe o arquivo PNGfix.js e adicione o código
<!–[if lt IE 7.]>
<script defer type=”text/javascript” src=”pngfix.js”></script>
<![endif]–>

• Usando CSS

Baixe o arquivo iepngfix.htc
Basta colocar o arquivo iepngfix.htc na mesma pasta da sua página. Depois, é só colocar o seguinte parâmetro na classe css do objeto que exibirá a div:
.classe{
behavior: url(iepngfix.htc)
}
O arquivo .htc faz o restante. Você também pode aplicar esse comportamento a todas as imagens, da seguinte maneira:

img{
behavior: url(iepngfix.htc)
}

JPG:

É utilizado para fotos e imagens grandes. Além disso, a jpg tem atributos que ativam o “Progressive browser display”, essa opção ativa a criação de um Buffer na imagem, igual acontece com os vídeos. Vale a pena a ativação dessa opção em imagens importantes do site como Header’s, Banners, e imagens que são utilizadas como plano de fundo, sempre observando o tamanho do arquivo que pode variar com essa opção que, ativada ou desativada, geralmente diminuem quando a imagem tem dimensões grandes e aumentam quando a imagem tem dimensões pequenas devido ao bloco de informações que é alocado para ativação desse recurso.

Outro recurso interessante é a ativação do “Sharpen color edges” ou Arestas Nítidas, esse recurso faz com que os contornos percam o foco. Isso pode economizar muitos Kb em uma imagem.

OBS: você vai notar uma grande perda de qualidade em fontes com fundo vazado e nas cores amarelo e vermelho. Se sua imagem não contem essas características, desative esse recurso.

Utilize uma compressão de 75 ou 80 no campo qualidade podendo variar pra mais ou para menos devido à necessidade.

GIF:

É utilizado para imagens onde não seja necessário uma gama de informações, como por exemplo, em botões, Banners, bordas ou imagens que contenha somente um texto e miniaturas do tipo ícones.Utilize o formato “adaptive” para todos os formatos que não contenha o efeito de degradê lembrando de colocar o numero de cores corretas , mas cuidado para não deformar a imagem ( na figura acima estou utilizando 4 cores ) e use o formato “Exact” para as imagens que contenham degradê.

Ative ou desative a opção “Remove unused colors”. Ela remove as cores que não estão sendo utilizadas na figura. Como por exemplo, os tons muitos parecidos que são utilizados em pequena quantidade na imagem.Ative ou desative a opção “Interlaced browser display”. Ela possui a mesma função do “Progressive browser display” da JPG. Sempre levando em consideração o tamanho do arquivo, uma previa pode ser observada no canto superior do editor de imagem em relação a uma internet de 56kbps dando assim uma visão melhor do tamanho da sua imagem e do tempo de carregamento.

Conclusão.
Segue a baixo um exemplo de como deveria ser a configuração das imagens para um site e suas particularidades.

Utilizei nesta imagem de exemplo uma JPG quality de 75 com “Progressive browser display” e “Sharpen color edges” ligados.

Para o logo quality de 80 e também as duas opções ligadas

Para a miniatura da foto de um dos nossos escritores utilizei uma JPG quality 65 com ambas opções desligadas igualmente utilizada na foto que ilustra o artigo.

Para as GIF’s utilizei o adaptive respectivo a necessidade de cada imagem sempre utilizando a quantidade mínima de cores, em ambas as imagens do nosso site teve a necessidade de utilizar o “Remove unused colors” e desabilitar o “Interlaced browser display”.

Com essas simples trocas agilizei o carregamento do nosso blog em 60%.

Espero que, sabendo da importância e o resultado de uma Otimização de Imagens bem feita, nossa equipe não encontre WebSites tão “pesados” quando navegarmos pelos websites de nossos leitores.

Compartilhe!

Geralmente, ao se trabalhar com descrições em imagens, fotos, ou figuras, usamos o atributo “alt” para fazer otimização de imagens para SEO. Porém, às vezes, essas imagens possuem informações mais complexas que seriam difíceis de descrever com o atributo “alt”, já que este permite apenas descrições curtas. Nesse caso utilizamos o atributo “longdesc” que nos permite fazer uma descrição mais complexa das imagens.

O longdesc funciona de forma parecida com um link onde ao clicar sobre a imagem, você é redirecionado para uma nova página com informações completas sobre dela.

A seguir um exemplo da utilização do atributo longdesc:

<IMG src="images/grafico.gif" LONGDESC="grafico.htm" ALT="Gráfico de Resultados" />

Clique na figura para ver o funcionamento do atributo:

Observação: a página criada nesse exemplo possui informações meramente ilustrativas.

Agora em objetos que não suportam a o atributo longdesc como animações, vídeos ou objetos inseridos na página podemos usar um link para referenciar a descrição dos mesmos. Abaixo um exemplo de como podemos fazer:

<object width="425" height="355"><param name="movie" value="http://www.youtube.com/v/Y1pqA1PCHrU&hl=pt-br"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/Y1pqA1PCHrU&hl=pt-br" type="application/x-shockwave-flash" wmode="transparent" width="425" height="355"></embed></object>

<A href=”longdesc.htm” title=”Vídeo que mostra a utilização do longdesc”>Descrição</A>

Como podemos ver no exemplo acima, colocamos um vídeo do youtube e ao seu lado fizemos um link alternativo que redireciona para uma página que contém uma descrição detalhada do vídeo.

Se tiverem dúvidas, deixem comentários. Até a próxima.

Compartilhe!

Ao trabalhar com otimização de sites logo pensamos em otimização de texto para SEO, mas nem sempre o usuário está apenas interessando em texto. Às vezes, o usuário busca imagens, fotos ou figuras que lhe interessem. Então também devemos pensar em otimização de imagens para SEO, o que pode fazer a diferença para que o usuário encontre seu site.

Existem alguns atributos em HTML e fatores que podem te ajudar na otimização de imagens, figuras ou fotos:

• Alt: o atributo “alt” é considerado como texto alternativo para descrição de imagens. Podemos usar em imagens, áreas mapeadas ou objetos inseridos. O texto é mostrado enquanto a imagem é carregada. Em alguns casos, quando não é possível carregar a imagem, o texto desse atributo serve como substituto da imagem. A seguir um exemplo de como pode ser usado:
  <img src=”image.gif” alt=”Texto alternativo” />
• Title: é um atributo usado para prover uma informação adicional, mas não essencial. Geralmente é usado para imagens e links. O texto do title é mostrado quando se passa o ponteiro do mouse sobre a imagem ou link relacionado. O atributo alt também mostra o texto ao se passar o mouse sobre a imagem, porém apenas em navegadores que foram baseados no navegador Lynx, como o Internet Explorer ou versão mais atual do Mozila Firefox. Também é importante colocar a descrição no atributos alt e title uma vez que as ferramentas de busca ainda não conseguem ler o conteúdo imagens com seus algoritmos de busca. A seguir um exemplo de como pode ser usado:
  <img src=”bola.jpg” title=”Bola vermelha com pintinhas brancas”>
• Longdesc: existem casos em que os atributos alt ou title não são suficiente para se fazer uma descrição, é o caso de animações ou conteúdo de áudio ou vídeo. Então usamos agora o atributo longdesc que permite criar um link para um arquivo com a descrição mais detalhada. Uma dica importante é trabalhar com suas palavras-chave neste arquivo já que ele será outra página que conterá uma descrição detalhada do seu conteúdo. Cuidado para não criar spam usando esse método. Lembre-se que as ferramentas de busca atuais possuem algoritmos que detectam esse tipo de artifício e se caso seu site for considerado como spam, ele poderá ser penalizado. A seguir um exemplo:
  <img src=”resultados_do_grafico.gif” alt=”Resultados do gráfico” londesc=”resultados.html”>
• Posicione o texto certo com a imagem certa. O texto que está em volta da imagem pode ser considerado na hora de relacioná-la ao seu significado. Exemplo: Se existir uma imagem colocado em volta de um texto que fale sobre carros, possivelmente a imagem poderá ser associada a imagem de um carro.
• Coloque nome correto nas imagens. Evite colocar nomes de arquivos de imagens como IMAGE001. Coloque, por exemplo, bola.jpg. O nome do arquivo geralmente é relacionado com o significado da imagem. Abaixo o resultado da busca realizada no buscador Google:

Essas são algumas das dicas mais importantes para se realizar uma boa otimização de imagens para SEO. Espero ter ajudado. Até a próxima.

Compartilhe!

Neste artigo vou falar sobre links, sua importância na otimização e usabilidade do seu website, e como organizar a linkagem dentro do seu site.

O que de fato vem a ser um link? Muito tem se falado aqui no Brasil SEO de link building e como conseguir links externos a partir do cadastro em sites de diretório e da submissão em sites de Social Bookmarking, mas qual a importância disso para que o seu site ganhe relevância e a apareça nas primeiras posições dos mecanismos de busca mais populares como o Google, Yahoo e MSN?

O Link (em português pode ser traduzido como “ligação”) nada mais é do que uma ligação para outro documento, podendo ser tanto para outro site quanto para uma página interna do seu próprio site. A importância dos links se devem tanto a otimização (controle de Pagerank) quanto à usabilidade (navegação da página) do seu site.

Quanto à questão da usabilidade os links podem ser usados quando da criação da navegação principal, de menus, blogrolls e uma técnica que ajuda muito na navegação da página que é o breadcrumb navigation.

Quanto à otimização, links são usados para passar pagerank de uma página para outra, isso tanto externamente quanto internamente, que dependerá tanto do pagerank da página que contém o link, quanto o número de links dessa página.

O que é necessário para se obter uma boa linkagem interna tornando o site fácil de ser navegado, controlando o pagerank? Logo abaixo se encontram algumas dicas de como organizar melhor a linkagem entre as páginas do seu site:

• Para páginas como Login, Join e About US é preferível que o link para essas páginas estejam com o rel=nofollow. Não é relevante que estas páginas apareçam nos buscadores. Logo não é necessário passar pagerank para elas.
• Se você usa algum texto como conteúdo do seu site, procure linkar para as páginas internas do seu site, usando suas palavras-chave como âncoras para o seu link.
• Evite um número exageradamente grande de links em apenas uma página. Quanto mais links você tiver em uma página, menor será o valor de pagerank a ser passado para as página que estiverem sendo linkadas. Saiba equilibrar o número de links de forma a manter uma boa navegação (questão de usabilidade) e controle de pagerank (questão de SEO).
• Quando for linkar para alguma página, use apenas âncoras relevantes em relação à página que estiver sendo linkada. Por exemplo, para a página:

  http://www.brasilseo.com.br/feeds/feeds-um-grande-meio-de-divulgacao

  Procure usar âncoras como Feeds, Feed, Divugação, etc. Não use palavras não relacionadas como âncoras, exemplo: Para aprender sobre feeds <a href=”http://www.brasilseo.com.br/”>clique aqui</a>.

• Não esqueça da title tag nos links. A title tag além de ser útil a nível informativo (quando se passa o mouse sobre um link no IE ou no Firefox é mostrado o conteúdo do title tag), se usada corretamente, ajudará aumentar a relevância do seu link.

  <a href=”http://www.brasilseo.com.br/social-media-marketing/submissao-em-sites-de-social-bookmarking” title=”Submissão em Sites de Social Bookmarking | Brasil SEO”>Submissão em Sites de Social Bookmarking</a>

• Construa um sitemap (em português: “mapa do site”) para o seu site. Um sitemap é uma página que dispõe uma lista de links de todas as páginas internas do seu site. Fazer isso é importante pois favorece ao mesmo tempo a otimização e a usabilidade do seu site: além de disponibilizar para o usuário uma maneira fácil de encontrar uma página específica, são mais links para as suas páginas internas, o que favorece a distribuição de pagerank.
• Como última dica: use o breadcrumb navigation nas páginas internas do seu site. Algumas pessoas recomendam usá-lo apenas para fins de navegação (ou seja deixando sua cadeia de links com Rel Nofollow), entretanto nada impede para que seja usado para fins de otimização, desde que não haja exagero no spam de palavras chave ao longo deste.

Espero que tenha ajudado vocês a se orientarem melhor quando forem trabalhar a linkagem de suas páginas.

Abraços.

Compartilhe!

Falar de estrutura de site para SEO é na verdade falar sobre a forma de organizar um site. É importante trabalhar, usando as técnicas de SEO, as informações de cada site, mas precisamos também trabalhar com o visual e usabilidade do site. Iremos trabalhar com alguns pontos importantes que ajudarão na hora de construir um site:

1. Defina o tema do site. Através do tema será possível escolher o melhor design, títulos, meta tags (palavras-chave e descrição) e conteúdo para o site. Atente para títulos e meta tags que devem ser diferentes para cada página, isso parece lógico, mas muita gente esquece disso. Outra coisa é não repetir conteúdo. As ferramentas de buscas possuem algoritmos que verificam a existência de conteúdo duplicado em suas páginas.
2. Trabalhe com texto de âncora em seus links. Texto de âncora (Ancor Text) é a palavra ou frase usada como link na sua página. É importante trabalhar esse texto de âncora usando palavras-chave, pois ele está diretamente relacionado com a página a qual está relacionada.
3. Mantenha o usuário no site. Sites feitos de qualquer jeito, mal organizados e com apresentação ruim, podem fazer com que um possível usuário nem navegue seu site. Portanto, ao criar ou otimizar um site, não esqueça de verificar se seu design é moderno, chamativo e se está bem feito.
4. Use as tags H1, H2 ou H3 para definir títulos e subtítulos. É fundamental estruturar o conteúdo de forma correta.
5. Posicione suas informações de forma a facilitar a visualização do usuário. Conteúdo ou informações posicionadas de forma errada podem fazer com que o usuário não as encontre. Isso faz com que ele acabe desistindo de navegar o site. Então evite que aconteça isso, faça um estudo de usabilidade para a construção do seu site.
6. Evite formatações in-line nas páginas. Use um arquivo CSS para separar o código da formatação. Isso ajuda manutenção e deixa o código mais limpo.
7. Problemas com navegadores diferentes. Atualmente, existem no mercado vários navegadores diferentes e cada um deles faz a leitura e interpretação de suas páginas de maneiras diferentes. Portanto, faça um teste com suas páginas em alguns navegadores com configurações e resoluções da tela para testar a sua compatibilidade. Recomendo verificar as páginas no IE (Internet Explorer) e Firefox que são os navegadores mais usados atualmente.

Acho que essas são as principais dicas que posso dar para quem vai começar a montar um site. Até a próxima pessoal!

Compartilhe!

Olá leitores da Brasil SEO, esta semana li um artigo muitíssimo interessante no Google Webmaster Central Blog, escrito pelo T.V. Raman, um dos pesquisadores do Google, sobre dicas de como criar um site acessível aos usuários e ao próprio crawler do Google. No artigo o autor cita ótimas dicas acerca do assunto considerando algumas características importantes de um site como sua navegação e conteúdo. É importante ressaltar a grande relevância de dicas de seo como essas oferecidas pelos próprios pesquisadores do Google:

Certifique-se que todo conteúdo crítico de seu site é alcançável:

Usuários e web crawlers acessam seu conteúdo navegando seu site através de hyperlinks. Certifique-se que todo o conteúdo de seu site (suas páginas internas) sejam acessíveis através de hyperlinks HTML. Evite linkar seu conteúdo através de outras tecnologias como JavaScript ou Flash.

Hyperlinks HTML seriam links criados pelo elemento anchor <a>. Certifique-se também que o “href” de todos os hyperlinks acessam URL´s reais ao invés de usar hyperlinks vazios manipulados, por exemplo, pelo atributo onclick para acessar uma determinada URL.

Evite hyperlinks desta maneira:
<a href=”#” onclick=”javascript:void(…)”>Product Catalog</a>

Dê preferência a este tipo de linkagem:
<a href=”http://www.example.com/product-catalog.html”>Product Catalog</a>

Certifique-se que seu conteúdo é de facil leitura:

Um conteúdo útil ao usuário é um conteúdo fácil de se ler. Certifique-se que todo o conteúdo importante em seu site é apresentado dentro de documentos HTML. O conteúdo deve estar disponível na página sem a necessidade de ser alcançado através de algum script. Conteúdo escondido atrás de animações em Flash ou textos gerados no browser pela execução de algum JavaScript são despercebidos pelo Googlebot e podem não ser bem visíveis para alguns usuários.

Certifique-se que seu conteúdo esta disponível na ordem de leitura:

Após assegurar-se que seu conteúdo está disponível e alcançável para o usuário é importante verificar se qualquer um que navegue seu site conseguirá seguir seu conteúdo pela ordem lógica de leitura. Se você utiliza um layout complexo por multi-colunas para a maioria do conteúdo de seu site, a dica é voltar atrás e analisar como você esta atingindo o efeito desejado. Por exemplo, o uso de tabelas em seu código HTML, profundamente aninhadas, dificulta a ligação conjunta das partes relacionadas do texto em uma ordem lógica.

O mesmo efeito pode ser alcançado pela utilização de CSS junto de elementos <div> HTML logicamente organizados. Além de ajudar a navegação do usuário com essas dicas você descobrirá que seu site abrirá bem mais rápido pelo navegador além de facilitar a leitura do mesmo pelos crawlers.

Não tenha medo de ser redundante:

Manter as informações de seu site na forma mais acessível possível não significa torná-lo primitivo e simples demais. Criar um conteúdo redundante é muito importante por assegurar que este será proveitoso para qualquer usuário que acesse seu site. Aqui vai algumas dicas:

• Certifique-se que o conteúdo transmitido através de imagens esteja disponível no momento em que estas não podem ser visualizadas. Assegurar que o usuário entenda o “porquê” de uma determinada imagem estar sendo utilizada em seu site vai além de apenas usar o atributo alt tag HTML. Certifique-se que o texto que cerca a imagem faz o trabalho adequado de ajustar seu contexto para o porquê da imagem estar sendo utilizada. Por exemplo, se você quer ter certeza que todos entendam que a imagem que você esta disponibilizando é de uma ponte, então envolva um texto em torno da imagem.
• Adicione resumos e subtítulos relevantes às tabelas de modo que o leitor possa ter uma leitura de alto nível da informação que esta sendo mostrada antes da visualização detalhada dos respectivos conteúdos.
• Adicione um resumo textual detalhado às animações visuais ou à qualquer tipo de exposição de dados.

Bom, seguindo estas dicas de seo simples você com certeza aumentará a qualidade das suas páginas para seus usuários. Um segundo efeito positivo é que logo você também descobrirá que seu site conseguiu melhores posições por conta de mudanças simples como essas. Mas lembrem-se essas dicas são muito importantes mas não milagrosas, otimização de sites como dito muitas vezes aqui, não é uma ciência exata, tente, faça testes e descubra você mesmo.

Compartilhe!

Olá leitores do BrasilSEO.com.br, hoje vou dar algumas dicas básicas que todo webdesigner deve saber.

1. Existe mais do que um navegador.

Como todos sabemos, o internet explorer é o navegador mais usado atualmente, porém existem muitos outros, e cada navegador renderiza a página de uma maneira diferente, portanto ao se fazer uma página é essencial se preocupar com as diferentes configurações da máquina do usuário, como navegador (e sua versão) e resolução de tela. Sempre teste a nova página em diferentes configurações, recomendo sempre testar em pelo menos nos 3 mais usados atualmente: iexplorer 7, Firefox e iexplorer 6, e ao menos nas configurações de tela 1024×768, 1280×1024 e 800×600.

2. CSS é essencial.

Como já foi discutido em CSS e SEO: O Segredo para o Sucesso, o uso de CSS é essencial para SEO, mas além disso, o uso do CSS é essencial para o usuário também, pois com o CSS é possível fazer a página ser acessível nos diversos navegadores usados hoje em dia, além é claro de facilitar a manutenção.

3. Escreva o código-fonte

Não use programas WYSIWYG, como o Dreamweaver ou Frontpage, pois o código-fonte gerado por eles fica cheio de tags, estilos e estilos inline, deixando o seu código-fonte não muito limpo dificultando a manutenção do mesmo.

4. Use o Firefox para “debugar” JavaScript

O Console de erros de Javascript do Firefox é de longe o melhor para desenvolvedores web, gera relatório de erros detalhados, facilitando a compreensão do mesmo.

5. Use as toolbars para Desenvolvedor Web.

Existem toolbars que facilitam, e muito, a vida dos desenvolvedores Web, com elas encontrar erros na página fica muito mais fácil, seguem os links para download:

• Firefox: https://addons.mozilla.org/pt-BR/firefox/addon/60
• iexplorer: http://www.microsoft.com/downloads/details.aspx?familyid=e59c3964-672d-4511-bb3e-2d5e1db91038

As funções e como usá-las fica para um próximo artigo…

Espero que essas dicas ajudem a criação e desenvolvimento de suas páginas. Qualquer dúvida comentem.

Abraços

Compartilhe!

Olá Leitores do BrasilSEO!

Hoje darei um introdução sobre Google Analytics e como esta ferramenta pode ajudar na usabilidade, acessibilidade e SEO.
Como todos já leram no post anterior, usabilidade é a facilidade de navegação de um site. SEO são técnicas de otimização de websites.

Mas, o que é Acessibilidade?

Acessibilidade é um termo que se refere em como um dado objeto, produto ou serviço é acessível a todos. No nosso caso, estamos nos referindo a web, e mais precisamente em sites. O principal foco da acessibilidade é a não restrição em navegadores.

O que é Google Analytics?

Google Analytics é um serviço gratuito oferecido pelo Google para o monitoramento de seu site. Através dele é possível coletar valisosas informações sobre o site, como por exemplo por qual navegador um usuário visitou seu site, quanto tempo ele navegou no site, em qual país ele se encontra e muitos outros recursos.
Através de vários do seus recursos, o Google Analytics é importante para coletar muitas informações e auxiliar na melhora da acessibilidade, usabilidade e SEO.

SEO

O Google Analytics informa quais são as palavras-chave mais utilizadas para o acesso do site. Ele também informa qual o link que levou usuários a entrarem em seu site. Ele é uma ótima ferramenta para acompanhar análises de SEO.

ACESSIBILIDADE

O Google Analytics, através de estatíticas, informa qual o navegador mais utilizado, de qual país ou região veio o acesso, qual resolução é mais utlizada. Através do Analytics é possível melhorar e muito a acessibilidade do site focando em qual público se quer atingir.

USABILIDADE

Através do Google Analytics é possível fazer melhorias na usabilidade do site. Ele oferece recursos que podem mostrar quais os pontos mais acessados do site, em qual ponto teve mais desistência, por quanto tempo o usuário utilizou o site dentre outros recursos.

Como implementar o Google Analytics nas paginas do seu site?

1º Se não tiver uma conta do gmail, crie.

2º Acesse o site http://www.google.com/analytics/ e entre com seu e-mail e seu login

3º Cadastro do site - Neste passo será pedido a URL do site, nome da conta, o local e o fuso horário. Após ter preenchido, aparecerá outro formulário com nome, telefone, país..

4º Leia e aceite os termos de condição

Após estes passos seu cadastro será completado e você receberá um código em javascript que deverá ser colocado em todas as páginas de seu site.

OBS: Com a mesma conta é possível cadastrar vários websites e para cada um deles será enviado um código diferente.

Espero ter ajudado com este post!

Enviem Comentários!

Até o próximo post!

Compartilhe!

Olá caros leitores do BrasilSEO!

Hoje vou falar um pouco sobre usabilidade.
Por que muitas pessoas pensam que usabilidade e SEO são termos tão distantes um do outro?!
Pois é, não são. SEO e usabilidade são termos que devem sempre estar em harmonia. Site usual é aquele em que o usuário, em apenas poucos segundos, consegue encontrar o que procura e SEO são técnicas que visam um melhor posicionamento nos mecanismos de busca para que usuários possam acessar o site e achar o que procuram.
Alguns pontos que influenciam SEO e usabilidade:

Meta-dados

Por que meta-dados?!
Um fator importante em SEO é a escolha de palavras-chave e descrição. Isso influencia em muito na usabilidade de um site.
Como?!
Se um usuário procura em um motor de busca por uma certa palavra-chave, é óbvio que ele quer achar no site buscado assuntos referentes a ela. Não coloque palavras-chave que não se referem ao site, isso pode ser considerado spam, e não agradará o usuário e nem as ferramentas de busca. Aumentar os clicks no site com SEO mas não se preocupar se os usuários estão gostando do conteúdo é algo grave.

Design e Codifição

- Faça um design na qual os usuários estão mais acostumados, sem muita “frescura”, que seja claro, e fácil de se achar pontos relevantes no site.
- Siga padrões tanto no design quanto no código do site. Faça um código limpo, com definições claras de classes e id’s, isso é muito importante para as motores de busca.
- Não deixe seu site muito pesado e sempre tente mantes arquivos de tamanho reduzido se o arquivo ou o site demoram para abrir, o usuário pode não esperar e abandonar o site.
- Tente sempre fazer uma combinação de cores e imagens que fiquem “dóceis” aos olhos do usuários.
- Não exagere em imagens e utilize sempre “alt text”, assim o usuário terá informação sobre ela.

Conteúdo

Ter sempre um texto bem escrito, contendo sempre as palavras-chave em quantidade relevante (sem exageros…) é sempre muito bom para o posicionamento do site quanto para os usuários.

Estes são alguns pontos importantes sobre SEO e usabilidade. No próximo post traremos mais algumas dicas.
Fiquem a vontade para comentar!
Até a próxima!

Compartilhe!

Um crawler não vê uma página de internet como nós, como são programas de computadores, eles lêem e analisam apenas o código-fonte da página, para se ter uma idéia de como um crawler vê sua página é recomendado o uso de um navegador em formato de texto (Lynx), ou então desativar os CSS da página (no Firefox: Exibir > Estilos da Pagina > Nenhum Estilo ).

O erro que muitos cometem é fazer um site muito bonito para o usuário sem se preocupar com os crawlers. Se um crawler não conseguir ler corretamente seu site, então ele não irá indexar suas páginas e seu site não aparecerá bem nos resultados de busca.

As principais dicas para se fazer um site acessível aos crawlers:

• Evitar o uso de Flash;
• Não usar Frames;
• Colocar Título e Meta-Tags em todas as páginas;
• Usar nomes descritivos nos arquivos;
• Ter um menu acessível;
• Usar links em formato texto com keywords na âncora;
• Usar as Tags h1, h2, h3;
• Usar sempre a tag “alt” em imagens;

Evitar o uso de Flash

Os crawlers ainda não são capazes de ler completamente os conteúdos de arquivos flash, portanto é melhor não colocar conteúdos do seu site em flash;

Não usar Frames

Os crawlers não tem muita facilidade em navegar por páginas com frames, algumas vezes ao invés de ler o conteúdo só recebem uma mensagem de erro e então acabam indexando apenas esta mensagem.

Colocar Título e Meta-Tags em todas as páginas

Todas suas páginas devem conter a tag “Title” e as Meta-Tags “Keywords” e “Description”. Os crawlers usam estas tags para saber o assunto de página. Um exemplo de cabeçalho de uma página HTML:
<head>
<title>Título da pagina</title>
<meta name="description" content="Uma breve descrição da pagina"/ >
<meta name="keywords" content="algumas palavras-chave relacionadas à pagina"/ >
</head>


Usar nomes descritivos nos arquivos

Embora ainda à discussões sobre a importância de se ter keywords na url de uma página, recomendo usar nomes de arquivos descritivos para as páginas, por exemplo:
Se uma página de seu site fala sobre Design e outra sobre SEO, é melhor termos páginas com nomes: design.html e seo.html ao invés de pagina1.html e pagina2.html.

Ter um Menu acessível

Se seu site possuir um menu em flash ou então javascript que o crawler não consegue ler, então ele não conseguirá navegar pelo seu site, e assim não poderá indexá-lo completamente, portanto é imprescindível usar menus que possuem links em formato de texto.

Usar links em formato texto com keywords na âncora

É importante que os links sejam em texto para termos a garantia de os crawlers conseguirem lê-los, outro ponto importante é usar textos descritivos no link, ao invés de usar âncoras como “Clique Aqui” ou imagens, mas isso aprenderemos melhor em artigos sobre linkagem.

Usar as Tags h1, h2, h3

É muito importante usar as tags h1, h2, h3… para estruturar suas páginas, subdividindo-a em seções e sub-seções, pois os crawlers dão maior relevância para os títulos e sub-títulos do que para o texto.

Usar sempre a tag “alt” em imagens

Como os crawlers ainda não conseguem ler o conteúdo de imagens, é sempre bom colocar uma breve descrição da imagem em sua alt tag, exemplo:
<img src="/imagens/urldaimagem.jpg" alt="descrição da imagem" />.

Bom pessoal, essas são as principais dicas para se fazer um site mais acessível para os crawlers. É importante fazer um site com beleza e usabilidade para o usuário e acessibilidade para o crawler. Por isso é muito usado hoje o CSS, mas isso fica para outros posts.

Abraços

Compartilhe!