Varios

El cajón de sastre del blog

23 ago
2012

Mejorando los snippets en Google con microdata: Breadcrumb.

Los snippets de las SERP (Search Engine Result Pages) son los pequeños trozos de información se muestran en los resultados de los buscadores, normalmente los controlamos con el titulo de la página y la descripción, pero mediante el uso de microdata podemos aumentar y mejorar la información que se muestra, haciendo que el buscador “entienda mejor” nuestra página y que muestre un rich snippet con más información.

En este post veremos cómo usar el microformato de breadcrumb para indicar a Google el lugar que ocupa nuestra página dentro de la jerarquía de navegación de nuestro sitio. Aunque se presentó en 2009, hay pocas webs que lo usen, pese a que es muy sencillo y útil.

Antes de nada vamos a ver un snippet “estándar”:

image

Muchas veces, la dirección de la página no aporta nada al usuario, sobre todo si el gestor de contenidos que usamos no posee la capacidad de generar urls semánticas(y el usuario ve algo como “www.dominio.com/?p=123232”).

Usando el microformato de breadcrumb, lograremos un doble beneficio:

  • Logramos que el buscador entienda mejor la estructura lógica y de navegación de nuestra web.
  • Mostramos al usuario el lugar lógico de la página dentro de nuestra web, de esta manera podemos mostrar, por ejemplo la situación de un producto dentro de la estructura de nuestro catálogo, aunque la url normal no lo exprese.

Un resultado de búsqueda de una página en la que se ha usado el microformato queda así:

image

Se puede ver que, en lugar de la dirección, aparecen enlaces en cada una de las “migas” de navegación. En caso de que la navegación sea bastante larga, se usan unos puntos suspensivos en los elementos centrales.

 

Para contener esta información debemos añadir unas propiedades a los elementos HTML que conforman nuestro breadcrumb, así en lugar del código HTML “típico”:

<a href="http://www.example.com/dresses">Dresses</a> ›
<a href="http://www.example.com/dresses/real">Real Dresses</a>

Debemos usar algo más de HTML decorándolo con etiquetas de microdata:

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <a href="http://www.example.com/dresses" itemprop="url">
    <span itemprop="title">Dresses</span>
  </a>
</div>

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <a href="http://www.example.com/dresses/real" itemprop="url">
    <span itemprop="title">Real Dresses</span>
  </a>
</div>

Vemos que se crean elementos (en este caso divs) que sirven de contendor y se les etiqueta, primero como un ámbito de ítem (con el itemprop) y luego se especifica que el ítem es de tipo breadcrumb (con itemtype). Luego, dentro del div, la url enlace se identifica como la propiedad url (usando el itemprop) y al contenido del span se le etiqueta como propiedad title, siendo el titulo visible de la miga.

 

Tenéis la documentación y ejemplos mas completos en la ayuda para webmasters de Google , además podéis probar como quedarían con la Rich Snippets Testing Tool.

En resumen, una manera fácil de mejorar la información que proporcionamos al buscador y a nuestros posibles visitantes y que es especialmente interesante en caso de que nuestra web no tenga urls semánticas.

PD: Aquí tenéis más información de microformatos para Google.

Saludos cancamuseros!

Varios | |

15 sep
2011

Mejorar la legibilidad de nuestros contenidos

jeroglifico

Un factor importante para el éxito de una web con contenidos es su legibilidad. Hay que tener en cuenta este factor para que nuestros visitantes lean de forma cómoda y entiendan los contenidos.

Aunque ni este blog ni yo mismo estemos especializados en estos temas, quiero compartir con vosotros algunos consejos que he ido recabando y que empezaré a aplicar a partir de ahora :):

¿Cómo se leen las páginas web?

Pensemos en cómo se lee una web: el usuario no tiene abierta una sola página (¿Cuantas tienes abiertas en este momento?) y cambia cada poco tiempo de pestaña, lo que disminuye la atención prestada.

Además, las páginas no se leen, se hojean: La estadística dice que 79% de los usuarios “escanea” la página en vez de leerla. Por tanto, no le podemos pedir toda su atención y debemos ponérselo fácil, dándole texto y estructuras fácilmente reconocibles:

  • Enlaces diferenciados (y con texto descriptivo).
  • Texto con énfasis para remarcar las ideas.
  • Listas con bullets o numeradas, fácilmente identificables visualmente.
Es curioso ver que la vista se fija en los números mejorando la “escaneabilidad” del texto, por lo que es preferible usar dígitos que su equivalente en texto.

Estructurar los artículos

Pirámide invertida: Deberíamos seguir un esquema de pirámide invertida: presentar la conclusión y la información más importante al principio y posteriormente desarrollarla.

Usa cabeceras para separar partes: Una buena manera par trocear el contenido es el uso de cabeceras. Dan pistas visuales de la estructura del documento y mejoran la “orientación” del usuario en la página. Evita usar gráficos como cabeceras.

No te enrolles: Evita los párrafos interminables, hay que dividirlos y separarlos para que se identifiquen visualmente y mejoren su lectura. Mejor tener 3 párrafos cortos que uno muy largo.

Nos podemos apoyar en herramientas que puede ayudarnos a identificar cuando nos hemos pasado de “literarios”: Juicy Studio tiene el Readability Test, que recibe la url de la página a analizar, aunque tiene el problema de no distinguir los elementos del layout de los de contenido. Hay otros tests que nos permiten introducir directamente el texto, como : Readability Index Calculator, Readability Assessment o incluso desde Microsoft Word.

11 caracteres: A la hora de “planificar” los textos de los encabezados, ítems de listas y los textos de enlaces, hay que tener en cuenta que los primeros 11 caracteres son fundamentales.

Cuidado con las siglas y abreviaturas: Hay una excesiva profusión de las mismas, lo que hace el texto difícil de entender para el que no esté muy familiarizado con el tema. El uso de abbr mejora la comprensión de las mismas.

Diseñando la página

En lo que toca al layout unas cuantas consideraciones que me parecieron útiles:

  • Conocer qué es el F-Shaped Pattern e intentar aplicarlo :)
  • Que el artículo se diferencie claramente del resto de la página y no se confunda con los elementos del layout. Nada de intercalar publicidad o banners en el medio.
  • Si una imagen es parte integral de un artículo debe ocupar un espacio en medio del texto, como si fuera un párrafo más. Si hacemos que el texto fluya a su alrededor es posible que el usuario lo entienda como un mero elemento decorativo.
  • Para logar una longitud de línea óptima (unos sugieren 40-50 caracteres, otros dicen que hasta 75 son aceptables), lo mejor son los layouts fijos, en un monitor grande con un layout líquido puede ser muy difícil seguir las líneas.
  • Respecto a usar tipos de letras con o sin serifa (los remates de las letras), hay muchos estudios al respecto, me quedo con  “Which Are More Legible: Serif or Sans Serif Typefaces?” (muy bien documentado) y con la “Legibility and readability on the World Wide Web” que analiza distintas familias de letras, tamaños y combinaciones de colores. En todo caso lo mejor es usar fuentes específicamente diseñadas para pantallas.
  • Para mantener un contraste adecuado entre letras y fondo, el diseñador debería utilizar una herramienta de comprobación. Personalmente recomiendo el Colour Contrast Analyser.
  • Se pueden sacar más ideas de 30 maneras para mejorar la legibilidad.

Espero que os resulte útil y/o interesante!

Saludos cancamuseros!

6 sep
2011

Productos custom. A veces, lo barato sale caro

Software-Custom-Desastre

Una de las primeras tareas a la que se enfrenta una organización cuando va a abordar un proyecto tecnológico y tiene que recurrir a proveedores externos es la selección misma del proveedor y tecnología, bajo mi punto de vista, es una decisión vital.

En general, cuanto menos profesionalizado está el “departamento de tecnología”, más se recurre a “primos proveedores y/o amiguetes que saben mucho” que hacen un buen precio, ponen mucho “2.0” y  nos dicen “en vez de usar el producto XXX, te pongo este que he hecho yo, que es lo mismo y acabamos antes”, eso es, para que nos entendamos, un secuestro con rehenes.

A los 6 meses necesitas hacer cambios, llamas y a) pide el doble, b) tarda dos meses en atenderte, c) ya no se dedica a eso. Sudor frio.

En los últimos meses he podido analizar varias webs con cierto renombre que usaban este tipo de soluciones: ¿documentación? inexistente, ¿código? búscalo tú, ¿actualizaciones? ¿pruebas de seguridad? ¿por qué no se ve en los navegadores nuevos? Al final toca sacar el código del servidor y bucear a ver por qué una funcionalidad esta repetida 10 veces o cómo hace tal cosa.

A día de hoy, todos los productos “mainstream” serios son extensibles y personalizables hasta un punto bastante razonable, sean Open Source o no. Si no tienes un equipo de desarrollo dedicado (y aún así tampoco lo haría), no elijas una solución hecha alguien que no sabes si va a seguir allí y que nadie mas conoce. Y si lo haces, pide documentación, el código y a ser posible que alguien supervise la “calidad” de la solución, pero luego no te quejes.

Lo mejor es contratar un proveedor más o menos reconocido y utilizar un paquete software de amplio uso para el que no tengas dificultad en encontrar proveedores.

PD: Que sí, que hay gente seria que usa soluciones custom y son buenas, pero no son baratos.

PD1: “Si lo usa mucha gente todo el mundo conoce sus fallos y es menos seguro”. Lee un poco, majo.

PD2: “Pero si tienes el código lo puedes cambiar cuando quieras”. Es cierto que eso es mejor que nada, pero también es muy divertido cuando vas a cambiar algo y ves que el producto “mainstream” equivalente trae eso y 40 mejoras más que tardarás meses en programar.

PD3: Perdón si me ha quedado algo borde el post. Pero hay cosas que me enervan.

Saludos cancamuseros!

26 ago
2011

Cómo Google evoluciona su buscador

En estos días que Google Panda está tan de moda y se están evaluando sus efectos sobre el posicionamiento de las webs, me ha parecido interesante este vídeo que explica brevemente cómo implementan los cambios.

Primero prueban "in vitro" con determinadas personas, comparando los resultados de la query antes y después del cambio y tras ello contrastan los resultados "in vivo" sobre sandboxes con usuarios reales... y así hasta 20.000 veces en 2010.

Muy interesante,no? Saludos cancamuseros!

31 dic
2010

Si es imprescindible, prescinde de él

A menudo nos encontramos organizaciones en las que una determinada persona parece ser imprescindible, es el engranaje sobre el que toda la actividad pivota, nada funcionaria si no es por él, encaja como la última pieza del puzzle:

pu2

A veces, conforme las organizaciones van creciendo y adaptándose a los cambios, los puestos se van moldeando a las características de las personas que los ocupan, de tal manera que el “fit” entre determinadas personas y sus puestos es total.

Esto que, en principio, puede parecer beneficioso es un riesgo muy a tener en cuenta, ya que el puesto al dejar de tener un carácter marcadamente funcional y “personalizarse” será muy difícil de cubrir en un futuro cumpliendo el nivel de expectativas generado por su anterior inquilino.

En general, si vemos que candidatos que parecían idóneos fracasan una y otra vez en un puesto determinado, tal vez lo mas prudente sea rediseñar ese puesto, dado que probablemente estuviera moldeado a la medida de una persona que ya no lo ocupa.

Tenemos que analizar que habilidades requiere, que relaciones dentro de la organización implica, que objetivos debe cumplir… En resumen que parte del engranaje de la aplicación representa.

Muchas veces debemos hacer refactoring de parte de la organización para hacer que su funcionamiento sea mas sencillo y podamos tener puestos que dependan mas de las habilidades y menos de las personas específicas que las llevan a cabo.

Por regla general, cuando un jefe dice que un subordinado suyo es imprescindible puede ser por:

  • Él es un mal jefe y quiere mantener al empleado porque es quien asume el trabajo y le saca las castañas del fuego.
  • Él es un mal jefe y no ha sabido estructurar a sus colaboradores de tal modo que su parte de la organización tenga una dependencia total de una persona en concreto. Esto, en los tiempos de movilidad laboral que vivimos, es un peligro grandísimo, es un secuestro con rehenes.
  • Él es un mal jefe y trata de proteger al empleado porque no confía en que lo haga bien en otras partes de la organización.

Así que cuando os digan que alguien es imprescindible… Yo miraría mal a su jefe. Seguro que no lo está haciendo muy bien.

Saludos cancamuseros

Seguir a enriquin en Twitter View Enrique Blanco's profile on LinkedIn

En ocasiones veo business

Este es el blog personal de Enrique Blanco, Ingeniero Informático y Executive MBA por el Instituto de Empresa, donde trataré temas relacionados con la tecnología, las empresas, Internet y, en general, cosas que me resulten interesantes.

Actualmente trabajo como consultor en Aventia y soy uno de los socios fundadores y el responsable técnico de Deportempresas.

Últimos Comentarios

Comment RSS

Histórico