SEO com JavaScript e Flash como Usar Corretamente – Final

Olá,
Hoje continuo com o post sobre SEO com JavaScript e Flash como Usar Corretamente.

Menus DHTML

Como são baseados em JavaScript, menus suspensos DHTML apresentam problemas para os search engines também. É aconselhável fornecer uma navegação alternativa a todos os elementos enumerados nos menus. Você pode fazer isso usando um conjunto de links na parte inferior da página, um sitemap ou uma combinação de ambos. Dessa forma, não só os mecanismos de pesquisa, mas os visitantes com suporte JavaScript desativado, serão capazes de navegar no site com facilidade.

Muitos menus suspensos são pouco amigáveis com os bots. A chave aqui é que o HTML e os links estão realmente presentes, embora ocultos no documento. Os algoritmos dos search engines não podem, no entanto, alcançar o conteúdo escondido – tornando-o invisível na página.

Janelas PopUp

Um método típico de mostrar popups emprega o JavaScript. E, como vimos, um search engine não indexa páginas referenciadas por JavaScript. Então, o que fazer para que um popup seja indexado?
A solução, na verdade, é bem simples. Um link de popup geralmente parece com:

<a onclick=””window.open(‘page.html’,” href=”http://www.agenciamestre.com/wp-admin/”#“”>Click here.</a>

Você pode fazer um popup indexável mudando o link para:

<a onclick=””window.open(this.href,” href=”http://www.agenciamestre.com/wp-admin/”page.html”” target=””_blank””>Click here.</a>

Este código ainda apresenta um popup em um navegador com JavaScript habilitado. Os eventos onClick usam o método window.open para abrir o link. Assim, o link está ainda presente, de forma um search engine é capaz de navegar para ele sem executar o código JavaScript.

Se preferir, você pode simular um popup usando regularmente um link que abre uma nova janela, através do atributo target=”_blank”, e ter a própria página automaticamente redimensionada depois de exibido. Tecnicamente, não é realmente um popup. É uma nova janela que automaticamente se redimensiona – mas o efeito é semelhante. O link para um “popup” desse seria mais ou menos assim:

<a href=”http://www.agenciamestre.com/wp-admin/”page.html”” target=””_blank””>Click here</a>

Você deve incluir o JavaScript no link para redimensionar a nova janela. Para fazer isso, coloque o código abaixo no atributo onLoad no body da página:

<body onload=”window.resizeTo(800, 600);”>

Você também pode deixar que a janela seja redimensionada depois de algum tempo. Por exemplo:

<body onresize=’setTimeout(“window.resizeTo(800, 600);”, 100);’>

O setTimeout permitirá o redimensionamento depois de 100ms.

Imagens Gráficas e Textos Rastreáveis

Este é um tema que frequentemente coloca designers e SEMarketers em guerra! Designers tendem a relutar ao pensamento de não ter à sua disposição textos gráficos. Mas spiders não podem ler qualquer texto que está incorporado em um arquivo de imagem, independentemente de quão clara e evidente estiver para um leitor humano. Portanto, o estilo de texto regular – através do CSS – deve ser empregado sempre que possível.

Infelizmente, o CSS nem sempre fornece toda a flexibilidade que um designer precisa, apesar de melhorar consideravelmente o SEO. E outra, os usuários não dispõem de um conjunto uniforme de fontes instalado em todos os computadores. Isto restringe as fontes que podem ser usadas confiavelmente no CSS substancialmente.

Portanto, em vez de depender completamente da configuração do CSS, uma série de técnicas podem ser usadas para implementar “imagens rastreáveis“. Usando client-side JavaScript, você pode percorrer um arquivo HTML e seletivamente substituir textos por elementos gráficos, depois da página ser carregada. Isso é chamado “texto substituto”.

A seguir algumas páginas que introduzem duas das implementações mais comuns de substituição texto:
• A substituição “sIFR”: método que funciona substituindo o texto especificado com arquivos Flash. Este método é documentado detalhadamente em http://www.mikeindustries.com/sifr/.
• Implementação de Substituição de Texto Stewart Rosenberger: faz a mesma coisa, mas substitui o texto por imagens. As imagens são geradas no servidor por um script PHP. O método é descrito em http://www.alistapart.com/articles/dynatext.

Usando estas técnicas, spiders serão capazes de ler o texto presente no documento, e usuários humanos verão ou um arquivo Flash ou uma imagem que contém o texto. Isso mantém tanto seres humanos quanto bots felizes.

Flash e AJAX

Infelizmente, tanto o Flash quanto o AJAX podem representar grandes problemas para os search engines, quando utilizados universalmente. Sites que são inteiramente baseados em Flash ou AJAX não serão indexados muito bem, se forem. A razão é bastante simples. Search engines são projetados para indexar páginas, não aplicações.

Sites construídos inteiramente com Flash ou AJAX envolvem uma enorme mudança paradigmática. Eles não empregam páginas para os diversos elementos de um site; em vez disso, eles são, mais ou menos, uma aplicação embutida em uma única página.

Além disso, mesmo se um search engine consiga descobrir como interpretar um arquivo Flash ou uma aplicação AJAX adequadamente, analisar e indexar seu conteúdo pertinente, não haveria maneira de navegar para uma determinada parte da aplicação usando uma URL. Portanto, uma vez que o objetivo primordial de um search engine é fornecer resultados relevantes para um usuário, um search engine irá hesitar em rankear bem esse conteúdo. Por último, ambos, Flash e AJAX podem incitar a formas novas – e mais difíceis de detectar – de spam.

Blended Approach

Porém, antes de assumir que estamos desqualificando Flash e AJAX completamente, há algumas soluções. Um designer de sites deve usar Flash e AJAX somente para as áreas do site que necessitam deles. Essa é a chamada blended approach. Deve-se projetar um site baseado em HTML e empregar tecnologias Flash e AJAX onde irão proporcionar um benefício tangível para o usuário. Deve-se tentar manter o máximo do conteúdo textual HTML possível.

Freqüentemente, uma combinação de HTML e JavaScript (DHTML) também pode aproximar mais a interatividade destas tecnologias. Por exemplo, clicar em um botão poderia ocultar ou exibir um elemento div, do HTML. Isso implicará na utilização de pequenos elementos Flash ou AJAX dentro de um esquema tradicional HTML. Em outras palavras, você deve usar Flash e AJAX como elementos em uma página, e não como a própria página.

Espero que tenha ficado claro, mas se restarem dúvidas, verifique no Glossário SEO ou deixe um recado.

Receba Novidades

Insira seu email para receber novidades e dicas exclusivas da Agência Mestre!
Divulgue este artigo

Um Comentário para “SEO com JavaScript e Flash como Usar Corretamente – Final”

  1. Aki

    Oi Clara,
    bom sou novo na área de SEO, mas agora vejo como é importanteque a aplicação SEO em um web site, estou construindo um site em Html neste site preciso ter um menu em Flash que seria o menu vertical que irá se localizar no lado esquerdo do site neste menu irá conter os meus artigos, pelo o que pesquisei é totalmente inadequado ter um menu em flash…agora uma pergunta…

    Eu tendo um menu em flash com os links para as minhas páginas principais mas fora desse menu Flash vou ter um link (mapa do site) que é em html, isso totalmente fora do menu Flash, sendo que nesta página mapa do site vai ter os meus links tambem para as páginas principais(o mesmos links que tem no menu Flash).
    Esse menu Flash irá influenciar em algo, sendo que na página Mapa do Site vai ter os links corretos para que os Crawlers indexe as outras páginas??

    Responder

Deixar um comentário

  • (não será publicado)

XHTML: Você pode usar estas tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>