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=”https://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=”https://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=”https://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.