Técnicas a seguir

• Utilizar una arquitectura plana para la estructura de nuestra web.
• Organizar nuestro sitio web en base a las temáticas de nuestras keywords.
• Utilizar textos simples como enlaces a nuestras páginas internas,intentando huir de menus en flash.
• Tener un menú de navegación idéntico en cada página basado en nuestras keywords.
• Las páginas más importantes no deberían estar a más de un link de distancia o al menor número de ellos.
• Relaciona las páginas utilizando enlaces en los contenidos.
• Utiliza los keywords para enlazar con las otras páginas.
• Utilizar palabras  que esten en el <title> o en <h1> de la página destino para los enlaces a ella.
• Utilizar rutas absolutas en los enlaces.
• Añadir el atributo “nofollow” en aquellos enlaces que queramos excluir de las búsquedas , como privacidad, acerca de… etc..
• Utilizar Disallow en el robot.txt en aquellas páginas no indexables , como la versión imprimible . Ej: Disallow:print.php
• Crear un sitemap.xml y enlazarlo desde el archivo robot.txt.
• Asegurarnos de no tener errores 404 en nuestras estructura de enlaces
• Nunca utlizar pop-ups para navegar entre contenidos.
• Intentar no tener más de 100 enlaces por página.
• Utilizar la etiqueta canonical para controlar la duplicidad de contenido derivado de multiples dominios o páginas parametrizadas.
• Utilizar la etiqueta <meta name=” robots ” content=” noindex,nofollow”> en los contenidos SSL para evitar duplicidad de indexación ya que estos tambien son indexados en su versión no segura.
• Utilizar las redirecciones 301 cuando eliminemos o redirijamos algún contenido.
• Utilizar una herramienta como Google Webmaster Tool.

Por último os dejo una serie de enlaces via un tag en Delicious creado para la ocasión que os pueden ser útiles para entender esta serie de recomendaciones que he tratado de sintetizar.

¿Cómo leemos en Internet?

Cuando un usuario entra en nuestra web se encuentra en un determinado contexto:

• Se encuentra delante de un monitor y no delante de un libro asi que es difícil conseguir una postura relajada para la lectura.
• El ordenador está en un entorno multitarea e hipertextual que nos dificulta conseguir una concentración similar a la alcanzada en la lectura en papel.
• La paciencia en internet es menor que en el mundo real. El usuario quiere inmediatez.
• A diferencia de un texto en papel, en internet cada página tiene miles de páginas similares que leer, hay muchísima competencia a sólo un click.

A diferencia de la lectura en papel en la que leemos de forma ordenada, en el ordenador leemos a saltos
buscando algo que nos llame la atención.Una técnica usada para conocer este comportamiento es el eyetranking.

Eyetranking de la lectura en internet

¿Cómo debemos escribir en internet?

Bien ahora que hemos entendido como leen los usuarios nuestras webs vamos a intentar maximizar la eficacia de nuestros textos para este entorno muy particular.

A continuación voy a tratar de explicar una serie de técnicas a seguir en la escritura online:

• Cuando escribimos en internet debemos recordar que escribimos para seo. Es decir debemos seguir una sencillas pautas:
  • Se deben utilizar las palabras clave que el usuario posiblemente utilizará para realizar las búsquedas.
  • Se deben escoger palabras clave adecuadas y potenciarlas en el sitio web.
  • Títulos, subtítulos y enlaces ayudan a potenciar estas palabras clave.
• Decir primero lo más importante, utilizando una piramide inversa.


Método de la piramide inversa

• Escribir textos sencillos ya que estos son más compresibles y menos agotadores para el lector, unas buenas prácticas para ello serian:
  • Sintetizar una idea por párrafo.
  • Utilizar un lenguaje simple y directo.
  • Adoptar un tono familiar acorde con la cultura del usuario.
  • Escribir en voz activa.
  • Evitar los verbos en infinitivo.
  • No usar perífrasis verbales.
• Comienza diciendo algo interesante, un par de ideas buenas serian:
  • Utilizar textos cortos e interesantes.
  • Intenta en las primeras frases comunicar lo que busca el usuario.
    

    Ejemplo de "buena escritura online"

• Escribir menos de la mitad de lo que se escribiría en un folio.
• Escribir textos fácilmente escaneables.
• Facilitar la legibilidad de los textos. Este último punto no influye en el posicionamiento pero si en la lectura que hagan nuestros usuarios. Algunas medidas para mejorar la legibilidad de nuestros textos serian:
  • Utilizar colores de fondo y primer plano con sufiente contraste.
  • Utilizar letras minúsculas preferentemente. Esta demostrado que las frases en mayusculas dificultan entre en 14% y 20% la lectura.
  • Evitar fondos de agua o con dibujos.
  • Las fuentes a usar deben cumplir:
    • Tener un mínimo de 10 puntos
    • No usar cursivas para fuentes pequeñas.
    • Utilizar varias tipografías para títulos, subtítulos,texto, etc.
    • Usar variaciones en tamaño o usar negrita para enfatizar, pero no ambos.
    • Emplear fuentes sin remate (sherif).
    • Usar una o dos tipos de familia.
    • Dentro de cada familia, variar el tamaño y el peso para dar énfasis.

Contrastes y facilidad de lectura

Edit

Cssbarcelona añade via twitter dos nuevos puntos a tener en cuenta que me habia descuidado de comentar:

• No hacer faltas de ortografía.
• Interlineado para ayudar a la legibilidad.

Espero que os haya servido de ayuda este articulo , y a los que hayais llegado o mejor dicho saltado hasta aqui muchas gracias

En los últimos meses google ha intentado subsanar esta problematica en la indexación y lo ha conseguido parcialmente, a dia de hoy google es capaz de indexar las siguiente información de un archivo flash:

Contenido indexado por google de flash

• Archivos .swf , no indexa archivos .flv.
• Todo el texto que el usuario vea en el flash .
• Las URL que contenga el flash.

Incluir contenido flash de forma seo friendly

Una vez hemos visto que contenido es capaz de indexar google de un archivo flash , llega la hora de encontrar la forma más seo friendly de cargar nuestros archivos flash.

Para esta tarea os recomiendo usar swfobject una libreria javascript que ademas de ser seo friendly al permitirnos incluir contenido alternativo nos servira tambien para activar de forma automatica las peliculas flash en los navegadores microsoft.

Ejemplo de uso de swfobject

<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
swfobject.embedSWF("rutaarchivo.swf", "contenedorflash", "300", "120", "9.0.0");
</script>
</head>
<body>
 <div id="contenedorflash>
 Contenido alternativo que indexará Google
 </div>

Video tutorial de swfobject

Indexar diferentes páginas flash

Cuando hemos diseñado un site en flash nos ocurre que google solo indexa una única URL,  lo cual dificulta la indexación de diferentes contenidos de nuestro flash. Para resolver esta problematica existe la libreria de javascript SWFAddress que utiliza la funcionalidad ExternalInterface introducida en Flash Player 8.

SWFAddress permite insertar links en aplicaciones y websites hechos en flash y de esta forma utilizar los botones Adelante, Atras y Recargar del navegador. Además se pueden crear URL únicas con títulos de páginas para aplicaciones flash.

Ejemplo de uso de swfobject

En el head del html

<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript" src="swfaddress.js"></script>

Codigo a incluir en nuestra pelicula flash

import flash.external.*;

_global.SWFAddress = function(){

this._check = function() {

if (SWFAddress.onChange) {

clearInterval(this._interval);

ExternalInterface.addCallback('setSWFAddressValue', this, SWFAddress.setValue);

SWFAddress.setValue(SWFAddress.getValue());

}

}

this._interval = setInterval(this, '_check', 10);

this._value = '';

};

_global.SWFAddress = new SWFAddress();

SWFAddress.getTitle = function():String {

var title:String = String(ExternalInterface.call('SWFAddress.getTitle'));

if (title == 'undefined' || title == 'null') title = '';

return title;

}

SWFAddress.setTitle = function(title:String):Void {

ExternalInterface.call('SWFAddress.setTitle', title);

}

SWFAddress.getValue = function():String {

var addr:String = String(ExternalInterface.call('SWFAddress.getValue'));

var id:String = String(ExternalInterface.call('SWFAddress.getId'));

if (id != 'null') {

if (addr == 'undefined' || addr == 'null') addr = '';

} else {

addr = SWFAddress._value;

}

return addr;

}

SWFAddress.setValue = function(addr:String):Void {

if (addr == 'undefined' || addr == 'null') addr = '';

ExternalInterface.call('SWFAddress.setValue', addr);

SWFAddress._value = addr;

if (SWFAddress.onChange) SWFAddress.onChange();

}
SWFAddress.onChange = function() {

var arr = new Array('', '/home', '/blog', '/forum');

var addr = SWFAddress.getValue();

gotoAndStop(getIndex(arr, addr));

SWFAddress.setTitle(formatTitle(addr));

}

En el boton de navegación de nuestra pelicula flash

this.onRelease = function() {

SWFAddress.setValue('/home');

}

Video tutorial de swfaddress

_________________________________________________________________________________

Espero que os haya servido de ayuda este articulo , si quereis seguir investigando acerca del flash y seo os recomiendo la siguiente web:

• Adobe Search Engine Optimization Technology Center

Comparativa de tiempos de carga y optimización

¿Que podemos hacer para mejorar nuestro tiempo de carga?

Optimizar nuestras imagenes

Para lograr optimizar nuestras imagenes y asi reducir el tiempo de carga podemos:

• Redimensionar la imagen al tamaño al que va a ser visualizada.
• Usar servicios de optimización de imagenes como:
  • Punypng
  • Image Optimizer para WordPress
• Si utlizamos herramientas como photoshop guardar la imagen para web.

Minificar el tiempo de carga de nuestros scripts

Podemos minificar nuestros javascripts si:

• Usamos las versiones minificadas de las librerias javascripts que usemos , como en el caso de jquery.
• Utilizamos herramientas como Closure Compiler para compactar nuestros ficheros javascript
• Utilizamos las bibliotecas ajax de google para incluir nuestras librerias utilizadas como jquery,mootools , con el objectivo de ganar velocidad de cache al ser estas librerias incluidas por millones de sitios web.

Minificar el tiempo de carga de nuestras hojas de estilo

Por último y no menos importante tambien debemos recordar optimizar nuestras hojas de estilos para ello debemos:

• No repetir estilos
• Usar herencias para minificar el número de herencias.
• Utilizar herramientas como YUI Compresor.
• Segmentar nuestras hojas de estilos en diversas hojas de estilos , para incluir solo las que necesitemos en cada página

Conclusión:

Optimizar nuestras páginas no solo nos ayudará a mejorar nuestro posicionamiento web , si no que mejorara la usabilidad de nuestra página al ser mucho más agil y de esta forma más accesible desde dispositivos mobiles.

ZKYKCHRTYZPX

<!–googleoff: index–> y <!–googleon: index–>

Si quereis saber más acerca de esta tecnica os remito al articulo oficial de google al respecto.

Para facilitarles esta labor debemos preocuparnos de que nuestro HTML sea lo más explicativo posible usando tags descriptivos del contenido que albergan.

Debemos tener en cuenta que aunque la validación de una página web no influye en la indexación si que se tiene en cuenta que el contenido de nuestra página siga una lógica de estructuración en su contenido.  Es por ello que debemos cuidar que nuestro html sea:

• Descriptivo.
• Estructurado.
• Jerárquico.
• Coherente.

Muchos os preguntareis por que he empezado el post con esta frase un tanto extraña y forzada, el motivo es claro , en el mundo SEO , el orden de los factores si altera el producto.

Los motores de búsqueda otorgan mayor importancia en los resultados de búsqueda a aquellas indexaciones que contengan las palabras claves de la búsqueda entre las primeras palabras de su titulo, URL y descripción.

Ejemplo de resultado en Google

Cuando escribimos un post debemos recordar que lo escribimos tanto para nuestros lectores como para los motores de busqueda y debemos prescindir de reglas de la escritura periodistica para máximar el resultado de indexación de nuestro post en aquellas palabras claves en las que queramos posicionarnos.

Una norma no escrita dentro del SEO la encontramos en “forzar” la aparición del titular de nuestro post dentro del contenido del mismo para demostrar al motor de búsqueda que nuestro articulo realmente trata acerca de lo que le estamos anunciando en el titular.

A la hora de citar fuentes externas via enlaces debemos analizar si el sitio esta bien considerado por los motores de busqueda. En mi caso cuando me quiero referir a terminos tecnicos enlazo a la pagina de la W3C y la Wikipedia , páginas bien consideradas por los buscadores y que contienen contenido de calidad para mis lectores.

Búsqueda avanzada de imagenes en Google

A parte de los conocidos tamaño de imagen , color etc… los buscadores nos permiten filtrar por el tipo de licencia de  la imagen .

El uso de licencias de imagenes nos permitira ademas de dar una información extra al buscador tener un control del uso de nuestras imagenes en la Red.

Para definir la licencia de una imagen mediante HTML nos valdremos de las extensiones RDFa mediante el cual mostraremos en nuestro código HTML el tipo de licencia de la imagen de forma transparente para el usuario final .

Ejemplo de la semantica a utilizar

<div about="image.jpg">
<img src="image.jpg">
<a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">
Attribution-Share Alike 3.0 Unported</a>
</div>

A continuación os dejo el video explicativo del blog oficial de Google al respecto:

El termino estandar web encierra en si mismo un conjunto de técnicas y normalizaciones  que tienen como objectivo mejorar la accesibilidad,usabilidad y interoperabilidad de un sitio web.

Los motores de búsqueda usan spiders robots para rastrear e indexar los sitio web. Estos motores de búsqueda usan navegadores basados en texto.Los navegadores basados en texto no son capaces de mostrar imagenes , flash o cualquier otro contenido embebido de nuestro sitio web; solamente interpretan el contenido con formato texto plano.

La importancia pues de crear nuestros sitios webs estandarizados reside  en ser capaces de comunicar mediante tags la relevancia y jerarquia de un contenido dentro de nuestra página y dar la mayor información indexable  a los motores de búsqueda.

Navegador basado en texto

Para visualizar nuestro sitio web como lo haria un motor de busqueda podemos usar servicios de emulación como el que ofrece  Yellowpipe.com o bien descargar Lynx uno de los navegadores basados en texto más extendidos.

Un ejemplo del beneficio del uso de los estandares en nuestras páginas lo encontramos en  los atributos alt y title en imagenes y enlaces , dichos atributos ofrecen información extra a los motores de búsqueda acerca de nuestras imagenes o enlaces ayudando a entender el contenido de nuestra web.

<a title="Inscríbete a nuestro RSS" href="http://dominio/suscripcion-rss.aspx">
<img alt="Icono RSS" src="/imagenes/RSS.png">
</a>

Recuerda que los estandares web ademas de ser un técnica SEO nos ayudarán a hacer de nuestra web un sitio web accesible para personas discapacitadas o usuarios que se conecten desde dispositivos moviles o videoconsolas de última generación.

Dentro del archivo robots.txt indicaremos que zonas de nuestra web queremos que no sean indexadas por ejemplo por ser directorios de configuración de nuestro CMS.

Esto lo realizaremos con la siguiente directiva:

User-agent: * User-agent: *
Disallow: / cgi-bin / Disallow: / cgi-bin /
Disallow: / admin / Disallow: / admin /
Disallow: / stuff / Disallow: / stuff /
Disallow: / private.html Disallow: / private.html

Una de las posibles funcionalidades más olvidada dentro de archivo robots.txt es la de indicar al motor de búsqueda la localización del archivo Sitemap , del archivo Sitemap os hablare más detenidamente en otro articulo pero os dejare unas pinceladas del mismo comentando que este archivo con estructura XML nos permite mostrar al motor de búsqueda que páginas de nuestra web pueden ser indexadas por el mismo facilitando la indexación de las mismas.

La linea que os pongo a continuación es un ejemplo de como mostrar dentro de nuestro robots.txt la ruta de acceso a nuestro Sitemap

Sitemap: http://www.unprogramadormas.com/sitemap.xml

Para obtener más información acerca de la configuración del fichero robots.txt os recomiendo robotstxt.org