SEO con JavaScript y Flash como Usarlo Correctamente – Final

Publicado por Clara Senne en 17 de Julio 2009| Categoría:SEO

Hola

Hoy continúo con el post sobre SEO con JavaScript y Flash como Usarlo Correctamente.

Menús DHTML

Como son basados en JavaScript, los menús desplegables DHTML presentan problemas para los motores de búsqueda también. Es aconsejable suministrar una navegación alternativa a todos los elementos enumerados en los menús. Usted puede hacer eso usando un conjunto de links en la parte inferior de la página, un sitemap o una combinación de ambos. De esta forma, no sólo los mecanismos de búsqueda, sino también los visitantes con soporte JavaScript desactivado, serán capaces de navegar en el sitio con facilidad.

Muchos menús desplegables son poco amigables con los bots. La clave aquí es que el HTML y los links estén realmente presentes, aunque ocultos en el documento. Los algoritmos de los motores de búsqueda no pueden, sin embargo, alcanzar el contenido escondido – haciéndolo invisible en la página.

Ventanas PopUp

Un método típico de mostrar popups lo emplea el JavaScript. Y, como venimos, un motor de búsqueda no indexa páginas referenciadas por JavaScript. Entonces, que hacer para que un popup sea indexado? La solución, en realidad, es bien simple. Un link de popup generalmente aparece con:

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

Usted puede hacer un popup indexáble cambiando el link para:

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

Este código todavía presenta un popup en un navegador con JavaScript habilitado. Los eventos onClick usan el método window.open para abrir el link. Así, el link estará aún presente, de forma que un motor de búsqueda es capaz de navegar para el sin ejecutar el código JavaScript.

Si prefiere, puede simular un popup usando regularmente un link que abra una nueva ventana, a través del atributo target=”_blank”, y tener la propia página automáticamente redimensionada depuse de exhibido. Técnicamente, no es realmente un popup. Es una nueva ventana que automáticamente se redimensiona – pero el efecto es semejante. El link para un “popup” de esos sería más o menos así:

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

Usted debe incluir el JavaScript en el link para redimensionar la nueva ventana. Para hacer eso, coloque el código abajo en el atributo onLoad en el body de la página:

Usted también puede dejar que la ventana sea redimensionada después de algún tiempo. Por ejemplo:

El setTimeout permitirá el redimensionamiento después de 100ms.

Imágenes Gráficas y Textos Rastreables

Este es un tema que frecuentemente coloca a designers y a SEMarketers en guerra! Designers tienden a luchar con el pensamiento de no tener a su disposición textos gráficos. Pero los spiders no pueden leer cualquier texto que está incorporado en un archivo de imagen, independientemente de cuan clara y evidente esté para un lector humano. Por lo tanto, el estilo de texto regular – a través del CSS – debe ser empleado siempre que posible.

Desafortunadamente, el CSS no siempre suministra toda la flexibilidad que un designer necesita, a pesar de mejorar considerablemente la optimización para motores de búsqueda (SEO). Y otra, los usuarios no disponen de un conjunto uniforme de fuentes instalado en todos los computadores. Esto restringe las fuentes que pueden ser usadas confiablemente en el CSS substancialmente.

Por lo tanto, en vez de depender completamente de la configuración del CSS, existen una serie de técnicas que pueden ser usadas para implementar “imágenes rastreables“. Usando client-side JavaScript, usted puede recorrer un archivo HTML y selectivamente sustituir los textos por elementos gráficos, después de que la página sea cargada. Esto es llamado “texto sustituto”.

A continuación algunas páginas que introducen dos de las implementaciones más comunes de sustitución texto:

La sustitución “sIFR”: es método que funciona sustituyendo el texto especificado con archivos Flash. Este método es documentado detalladamente en http://www.mikeindustries.com/sifr/.

Implementación de Sustitución de Texto Stewart Rosenberger: hace la misma cosa, pero sustituye el texto por imágenes. Las imágenes son generadas en el servidor por un script PHP. El método es descrito en http://www.alistapart.com/articles/dynatext.

Usando estas técnicas, los spiders serán capaces de leer el texto presente en el documento, y los usuarios humanos verán como un archivo en Flash o una imagen que contiene el texto. Esto mantiene tanto a los seres humanos como a bots felices.

Flash y AJAX

Infelizmente, tanto el Flash como el AJAX pueden representar grandes problemas para los motores de búsqueda, cuando son utilizados universalmente. Los sitios que son completamente basadas en Flash o en AJAX no serán indexados muy bien, si lo fueran. La razón es bastante simple. Los motores de búsqueda son proyectados para indexar páginas, no aplicaciones.

Los sitios construidos completamente con Flash o con AJAX envuelven un enorme cambio paradigmático. Estos no emplean páginas para los diversos elementos de un sitio; en vez de eso, son más o menos, una aplicación acoplada en una única página.

Además, incluso si un motor de búsqueda consigue descubrir cómo interpretar un archivo en Flash o una aplicación con AJAX adecuadamente, analizar e indexar su contenido pertinente, no tendría la forma de navegar para una determinada parte de la aplicación usando una URL. Por lo tanto, una vez que el objetivo primordial de un motor de búsqueda es suministrar resultados relevantes para un usuario, un motores de búsqueda irá a dudar en rankear bien ese contenido. Por último, tanto, el Flash y el AJAX pueden incitar a formas nuevas – y las más difíciles de detectar – de spam.

Blended Approach

Sin embargo, antes de asumir que estamos descalificando al Flash y a AJAX completamente, hay algunas soluciones. Un designer de sitios debe usar Flash y AJAX solamente para las áreas del sitio que necesiten de estos. Esta es la llamada blended approach. Se debe proyectar un sitio basado en HTML y emplear tecnologías en Flash y en AJAX donde irán a proporcionar un beneficio tangible para el usuario. Se debe tratar de tener el máximo de contenido textual HTML posible.

Frecuentemente, una combinación de HTML y JavaScript (DHTML) también puede aproximar más la interactividad de estas tecnologías. Por ejemplo, hacer clic en un botón podría ocultar o exhibir un elemento div, del HTML. Eso implicará la utilización de pequeños elementos en Flash o en AJAX dentro de un esquema tradicional HTML. En otras palabras, usted debe usar Flash y AJAX como elementos en una página, y no como la propia página.

Espero que le haya quedado claro, pero si le quedaron dudas, verifique el Glosario de SEO o deje un mensaje.