SEO e Usabilidade

Esses dias surgiu para mim algumas dúvidas quanto ao Bounce Rate, ai resolvi fazer uma pesquisa e acabei criando um pequeno artigo sobre ele.

O Bounce Rate (ou taxa de rejeição) é uma métrica que tem o valor da taxa de visitantes que entram e saem do seu site sem visitar outras páginas dividida pelo total de visitantes dessa página.

O tempo de permanência de um usuário em uma página é calculado da seguinte forma: você entra na página A, e tempo depois você acessa página B. O tempo na página A é igual a (Hora de acesso da página B) – (Hora de acesso da página A). Se você acessar uma página e logo depois fechar seu browser ou mesmo voltar, o tempo nessa página é igual a 0. Ou seja, se o tempo na página é igual a 0, é considerado bounce rate. Você pode encontrar mais informações sobre medidas de tempo aqui.

A partir desse tempo se obtém o tempo médio de visita nas páginas e em seu site todo.

As páginas baseadas em Flash ou mesmo Ajax, por não serem carregadas frequentemente, possuem um bounce rate alto. Para contornar isso, você deve fazer o track para virtual pageviews, que é encontrado no próprio Google Analytics.

O bounce rate pode ser usado para verificar a qualidade das suas visitas e determinar se as páginas do seu site, principalmente as de entrada, cumprem seu papel de enviar tráfego para outras páginas que podem ser de maior interesse.

Quanto maior forem as taxas de bounce rate, significa que a usabilidade de seu site não é boa, ou que por uma eventual busca o usuário não encontrou em seu site o que ele realmente desejou. Portanto, recomenda-se revisar também o SEO de seu site.

Caso seu Bounce Rate esteja alto, essas dicas abaixo podem te ajudar:

• Faça algum tipo de interação com o usuário;
• Dê uma boa usabilidade ao usuário, não colocando muitas propagandas
• Pense em combinação de cores que sejam as melhores possíveis para o usuário.

Para o caso de blogs, essas dicas também podem ajudar:

• Convide de alguma forma o usuário a fazer algum comentário em cada post;
• Faça uma listagem de posts relacionados no final de cada post.

Quanto as dúvidas se o Google usa esses dados na criação das SERPs, a palavra oficialmente deles é que eles não utilizam. Nesse vídeo, o Matt Cutts responde uma pergunta semelhante.

Espero que esse post tenha solucionado a dúvida de muitos, e que as dicas possam ajudar bastante. Até a próxima.

Aqui está uma pergunta de Londres, Katy Bairstow pergunta: “Parece de pouco impacto para visitantes humanos onde uma página está na estrutura de um site, então: É melhor manter páginas de conteúdo chave perto da raiz, ou ter ela numa estrutura funil de tópicos, exemplo: comida/comida-rápida/hambúrgueres/hambúrgueres.php”.

Bem, isto não é conselho de SEO, é só um conselho de comportamento. Se você pode ter as coisas à poucos cliques da página principal, visitantes acharão ela mais fácil. Se alguém tem que clicar 8 vezes para achar a página de registro para sua conferência, comparado a registro na página da raiz, poucas pessoas irão encontrá-la se ela está longe de muitos clicks.

Então não importa onde ela está no caminho, como: está na raiz ou 8 níveis depois. Pode importar pra outras ferramentas de busca. Mas pelo menos para o Google eu pensaria mais em: seus visitantes podem encontrá-la?

E isto não é um conselho para posicionamento em resultados de busca. É apenas um conselho geral para melhorar seu ROI (Retorno de Investimento).

Quem está por dentro dos assuntos da Web em geral, como SEO, Web 2.0, Search Marketing, entre outros, conhece bem a antiga disputa do gigante dos buscadores, o Google, com seus clássicos rivais: Yahoo e MSN. Este panorama de disputas está prestes a mudar com a chegada do novo buscador que promete superar o Google em suas buscas: o Cuil.

O Cuil entrou em operação nesta última segunda-feira (28/ 07/ 2008) indexando mais de 121 bilhões de páginas e com um investimento estimado de 33 milhões de dólares.

Porque o nome “Cuil”?

Criado por quatro ex-funcionários do Google:

• Anna Patterson: Ex-arquiteta de buscas do Google, e idealizadora do projeto Cuil
• Tom Costello: Criador de uma ferramenta de análise de buscas da IBM
• Russel Power: Ex-engenheiro do Google.
• Louis Monier: Ex-engenheiro do Google.

A idéia de se chamar o novo buscador de “Cuil” foi porque sonoramente pronuncia-se “cool” que em inglês significa “legal”.

Quais as grandes inovações?

Em termos de design, o Cuil em sua página inicial conta com um fundo de cor preta, diferente do rival Google que tem a cor branca de fundo. Em termos de usabilidade a página inicial do Cuil se assemelha muito a do Google possuindo basicamente o logotipo do site mais acima, uma caixa de texto para se escrever as palavras a serem pesquisadas logo abaixo do logo, um botão de “search” que inicia as buscas e alguns links mais abaixo da caixa de texto.

Mas a inovação mais notável se encontra na exibição dos resultados de buscas: diferentemente do Google que exibe seu resultado de busca em forma de lista na vertical, tendo os sites considerados mais relevantes acima seguido pelos sites menos relevantes; o Cuil exibe seu resultado de busca em forma de colunas:

• Busca Google:

• Busca Cuil:

Uma das questões levantadas por alguns usuários é a respeito de qual coluna representaria os sites mais relevantes, ficando as vezes a dúvida entra a coluna esquerda ou a coluna de centro. Dúvida que não ocorre em outros buscadores.

Uma outra inovação interessante é que o Cuil não apresenta a meta tag description nos resultados de buscas, fazendo com que uma parte do texto interno apareça no lugar desta. Outra diferença em relação ao rival Google.

Sobre as meta tags keywords, foi disponibilizado uma caixa na lateral direta na ultima coluna, onde a cada pesquisa o Cuil apresenta algumas keywords complementares das palavras-chave pesquisadas, que podem ser do interesse do usuário.

O Algorítmo Inteligente de Busca do Cuil

Um fator interessante e inédito no Cuil é o uso de algorítmos de inteligência artificial no processo de busca. Após observar várias buscas no Cuil, os resultados levam a conclusão de que há um certo “aprendizado” sobre a preferência de diferentes usuários na busca por um determinado assunto, buscando assim apresentar resultados cada vez mais relevantes.

Será que o CUIL tem chance de superar o Google?

O Cuil apresenta algumas inovações em relação ao sistema de busca tradicional do Google, algumas melhores outras piores. Assim como toda ferramenta nova, o Cuil traz novas proposta, visual inovador e novas funcionalidades em relação ao sistema de busca tradicional do Google.

Eu acredito que mesmo com todas essas inovações, o Cuil terá que percorrer um caminho muito longo para competir de igual para igual com o Google. Muitas ferramentas de extrema utilidade como o Google Analytics, Google Trends, Google Webmaster Tools, Google Maps, entre outros e serviços como o Google Adsense não encontram equivalentes no Cuil, além de muitas outras facilidades na busca como o Google dispõe.

Bom deixo aí registrada a minha opinião sobre esse novo buscador que promete fazer frente ao gigante das buscas online. Opinem sobre o que vocês acharam do Cuil em forma de comentário, para que possamos discutir opiniões

Abraços!

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. Essas dicas podem te ajudar na otimização de websites.

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.

Ao trabalhar com otimização de websites 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.

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.

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!

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.

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