Usamos cookies propias y de terceros para mostrar publicidad. Si continua navegando consideramos que acepta el uso de cookies. OK Más información

Directrices de diseño y contenido

Publicado por Israel Noguera

Google es la referencia. Como desarrolladores web no podemos hacer caso omiso a sus recomendaciones para la creación de páginas web, por ello quiero empezar una serie de artículos donde trataré aspectos que debemos tener en cuenta en todo momento, no únicamente durante el proceso de desarrollo de una web.

Las directrices para webmasters son una base excelente para desarrollar sitios que ayuden a Google a buscar, indexar y clasificar estos sitios de manera adecuada. Veámos las directrices más interesantes:

Navegación web

navegacion_web.jpg

Facilitemos la vida al rastreador de Google y ofrezcamos un código limpio y semánticamente correcto.

Para la navegación web crea un sitio con una jerarquía y enlaces de texto claros. Se debe poder acceder a todas las páginas desde al menos un enlace de texto estático. Olvídate de menús en javascript, flash o cualquier otro lenguaje que no sea HTML.

Si tienes una sección donde hay paginación, ofrécele a GoogleBot la posibilidad de navegar por toda la sección con url's amigables, cuantos menos parámetros en la url mejor.

Si tienes un blog, relaciona artículos. Usa los enlaces habituales para navegar al siguiente artículo o al anterior.

Usa breadcrums si la profundidad de enlaces es importante, resulta muy práctico para los usuarios y es interesante para Google.

El elemento principal en la navegación web es obviamente el menú y submenús de navegación. Intenta que los apartados principales de la web sean accesibles desde el menú principal

Contenido de calidad

La calidad del contenido es uno de los parámetros más importantes para diferenciar un sitio de otro y Google lo tiene muy en cuenta, Google es capaz de determinar si un sitio es de calidad o no y si resuelve que un sitio ofrece calidad lo tendrá muy en cuenta a la hora de ofrecer el sitio en las búsquedas de los usuarios.

Hay que crear sitios útiles con contenido claro y exacto.

Palabras clave de búsqueda

keywords.jpgPiensa en las palabras que podrían introducir los usuarios para localizar tus páginas y asegúrate de que esas palabras estén incluidas en tu sitio. La semántica web es importante en este aspecto; por ejemplo, una palabra clave en una cabecera <H1> será más relevante que introducida en un párrafo <p>, pero además, podemos trabajar un poco más a fondo para darle mayor importancia a las palabras clave que más nos interesan.

Supongamos que vamos a desarrollar una web para un restaurante de comida tradicional en Valencia. Apostaremos evidentemente por: Restaurante de Comida Tradicional en Valencia.

Restaurante de comida tradicional en Valencia, debería aparecer al menos en una url, en un título en una metadescripción, en cabeceras, en enlaces internos, enlaces externos, en un menú de navegación, en listas, etc...

Atributos ALT y TITLE

Intenta utilizar texto en lugar de imágenes para mostrar nombres, contenido o enlaces importantes. El rastreador de Google no reconoce el texto integrado en imágenes. Si debes utilizar imágenes para contenido textual, considera la posibilidad de utilizar el atributo "ALT" para incluir algunas palabras de texto descriptivo.

Asegúrate de que los elementos <title> y los atributos "alt" de tu sitio sean descriptivos y precisos.

Errores 404

Se produce este error cuando el navegador web no localiza un archivo del sitio web. Esto es muy habitual, solo con escribir incorrectamente una URL en la barra de direcciones ya se produce este error.

Además de escribir incorrectamente una URL, puede que algunos enlaces de la web apunten a un archivo que ya no existe. Debemos solucionar lo antes posible este tipo de error.

Como hay casos en los que es imposible controlar este problema, es importante personalizar una página de error 404, ofreciendo un contenido alternativo al que ofrecen la mayoría de servidores web que es bastante pobre y poco útil para el usuario, que puede abandonar incluso la página perdiendo la confianza del sitio.

URL's amigables

urls_amigables.jpgSi decides utilizar páginas dinámicas donde se pasan parámetros por url (es decir, si la URL contiene el carácter "?"), ten en cuenta que no todas las arañas de los motores de búsqueda rastrean tanto páginas dinámicas como páginas estáticas. Se recomienda que los parámetros sean cortos y reducidos en número.

Fíjate en la url que usa Google para hablar de los parámetros URL:

http://support.google.com/webmasters/bin/answer.py?hl=es&answer=1235687

Podrían aplicarse el cuento y usar algo como:

http://support.google.com/webmasters/bin/answer/url-parameters

Prácticas recomendadas para imágenes

Se puede añadir información a un sitemap para proporcionar detalles adicionales sobre las imágenes que se quieran posicionar en el buscador de imágenes, tan sólo facilitando las URL's de dichas imágenes. Las imágenes indicadas en el sitemap, tendrán más relevancia que las que no están.

Existen extensiones de imágenes de Google para sitemaps, para proporcionar información adicional a Google acerca de las imágenes.
Se puede usar el sitemap principal del sitio o usar uno independiente para las imágenes, ambos métodos son válidos.
Disponemos además de herramientas externas disponibles que pueden servir para crear un sitemap (http://code.google.com/p/sitemap-generators/wiki/SitemapGenerators).
Por cada URL incluida en el sitemap acerca de una imagen, se puede añadir información adicional sobre las imágenes importantes de la página. Se puede incluir un máximo de 1000 imágenes por cada página.

Ejemplo:

<?xml version="1.0" encoding="UTF-8"?> <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:image="http://www.google.com/schemas/sitemap-image/1.1">
  <url>
  <loc>http://example.com/muestra.html</loc>
  <image:image>
      <image:loc>http://example.com/imagen.jpg</image:loc>
  </image:image>
  <image:image>
      <image:loc>http://example.com/foto.jpg</image:loc>
  </image:image>
  </url>
</urlset>

Se encapsula dentro de <url>, la url de la imagen entre las etiquetas <loc> y dentro de la etiqueta <image:image> la localización de las imágenes, hasta un máximo de 1000.
Puede darse el caso de que la url de la imagen no coincida con el del sitio principal (imágenes alojadas en un CDN, por ejemplo), se debe verificar la propiedad de ambos dominios en las Herramientas para webmasters de Google.
Opcionalmente, las etiquetas <image:caption> que contiene el pie de la imagen. La etiqueta <image:geo_location> que especifica la ubicación geográfica de la imagen. La etiqueta <image:title> que especifica el título de la imagen y finalmente la etiqueta <image:license> que es la url para la licencia de la imagen.

Una vez enviado el sitemap de imágenes, es aconsejable esperar un máximo de 5 días para asegurarse de que haya suficiente tiempo para su indexación.

¿Problemas derivados con el envío de sitemaps de imágenes?

  • Las URL del sitemap deben incluir la URL del sitio exactamente como aparece en la cuenta de Herramientas para webmasters. Si el sitio aparece como http://www.example.com, la URL que incluye las imágenes, introducida en <loc> no puede ser http://example.com.
  • Las Herramientas para webmasters de Google, ofrece información muy valiosa acerca de los sitemaps en optimización/Sitemaps. Sobre todo errores y advertencias.
  • Consultar la página de errores de rastreo de las Herramientas para webmasters.
  • Asegurarse de que el archivo robots.txt no esté impidiendo que Googlebot rastree las páginas del sitio. Nuevamente las Herramientas para webmasters, dispone de una herramienta para probar el archivo robots.txt (más información adelante sobre robots.txt).
  • Guardar y enviar nuevamente el sitemap, esperar hasta 24 horas.

Se deben utilizar nombres de archivo informativos y detallados para las imágenes. Crear un texto alternativo adecuado ALT.
El atributo ALT, sirve para describir el contenido de un archivo gráfico. Google usa esta información para elegir la mejor imagen sobre un tema.
El uso de palabras clave en el atributo ALT, se puede considerar como SPAM por parte de Google.

El texto de anclaje (anchortext) de los backlinks, generalmente no se pueden controlar, al estar en páginas externas, pero es necesario y recomendado, seleccionar textos en los enlaces del propio site, que ayuden al usuario a comprender el destino del enlace.

Es importante el contexto donde aparece una imagen, porque este se analiza y si no guarda relación con la imagen, el nombre de la imagen o sus metadatos, perderá relevancia.

Es práctica habitual por los webmaster, impedir el uso no autorizado o el ‘hotlinking’, es decir, que se enlacen las imágenes desde otros sitios con la repercusión directa que tiene sobre el ancho de banda. En contrapartida se restringe también la posible audiencia de las imágenes y se reducirán las posibilidades de ser localizadas por las arañas.

Y para finalizar con las imágenes, estas recomendaciones:

  • Fotografías de calidad.
  • Considerar la posibilidad de que cada imagen tenga una página de destino única donde se concentre toda la información respecto a la imagen, incluso añadir comentarios.
  • Al parecer, las imágenes al principio de la página, tienen más relevancia que las situadas a pié de página.
  • Almacenar las imágenes en directorios estructurados, ofreciendo una url de localización más clara e intuitiva.
  • Especificar las dimensiones de ancho y largo de todas las imágenes. Para acelerar el proceso de carga de las páginas y mejorar la experiencia del usuario.

Prácticas recomendadas para vídeos

Marcar el contenido con el formato shema.org.
Al marcar el contenido de un vídeo en el cuerpo de la página, los motores de búsqueda y otros sitios podrán reconocerlo y utilizarlo para mejorar la visualización o los resultados de búsqueda.
Más info en http://www.schema.org sobre el marcado.

Los sitemaps de vídeos de Google son una extensión del protocolo de sitemaps que permite publicar y distribuir contenido de vídeo online y sus correspondientes metadatos para que se pueda buscar en el índice de vídeos de Google.
Se puede añadir información descriptiva, como el título, descripción o duración del vídeo.

Indicar a Google cuando se ha eliminado un vídeo mediante un código de estado HTTP 404 (no se encuentra) o indicar las fechas de caducidad en el marcado schema.org en el sitemap de vídeos, con <video:expiration_date>.

Si Google puede usar las imágenes miniatura representativas del vídeo, las usará, por lo que deben ser de alta calidad y si se indica la ubicación del contenido (la URL del archivo de vídeo), Google las puede generar automáticamente.

Si se usa un solo player, insertado con javascript y con un código complejo, muy posiblemente no se muestre correctamente, ya que Google no puede ofrecer a los usuarios una URL única para cada vídeo.
Sería interesante que cada vídeo tuviera su propia página de destino e impedir con el archivo robots.txt el acceso de la araña al visor original de vídeos para no crear contenido duplicado.

Y respecto a las directrices de diseño y contenido para ir empezando esto es todo amigos. En el próximo artículo continuamos con las directrices técnicas.