WordCamp Sevilla 2012

AJC_WordCamp Sevilla 2012_040

Me atrevería a decir que, en su segunda edición, WordCamp Sevilla (2012) se consolida como el principal encuentro nacional de usuarios y profesionales de WordPress, salvando así de la mejor manera cierta segmentación territorial en el encuentro principal, con el sano ejercicio de descentralizar el eje principal del argumento “wordpressero”. Localizado ahora en Sevilla gracias al admirable esfuerzo de Luis Rull, Rafael Poveda y Rocío ValdiviaMecus, en definitiva— con el apoyo de Automattic —algo de lo que no todo el mundo puede presumir—. ¿Qué más se puede pedir?

AJC_WordCamp Sevilla 2012_008

Servidor ha hecho lo propio. Si bien el año pasado me prestaron 10 minutos para hablar de Humans.TXT, este año he echado un cable a la organización principal solucionando algunas piezas gráficas y la difusión correspondiente a través de la cuenta de @WPSevilla. Lo tenía fácil ya que la herencia gráfica del compañero Máximo Gavete siempre facilita las cosas. Poco más he hecho, pero la organización es tan bien agradecida que tiene a bien subir a uno al escenario para cerrar el evento. Es de bien nacido ser agradecido. Es decir: gracias y felicidades por el curro.

AJC_WordCamp Sevilla 2012_018

Regalazo extra que me llevo, las conversaciones con todo el mundo. Impresionante el trabajo y plugin de Wysija, que propone una herramienta de newsletter que hace templar a más de un orangután. Genial la presentación de Franck Scipión, un poquito de aire fresco y positivo, a la par que realista: nadie te va a regalar nada, excepto el núcleo de WordPress. El gesto y las risas con Rubén Teijeiro, por estar y hermanar WordPress y Drupal; me quito el sombrero… Y, cómo no, las preguntas de Roberto de Blogalízate. Porque ¿qué sería una WordCamp sin una pregunta de Roberto? xD

El año que viene más y mejor. Allí estaremos.

Flash Talk: About HumansTXT

El pasado octubre de 2011 se celebró la WordCamp Sevilla en la que pude participar aportando una Flash Talk sobre HumansTXT. Casi 5 meses después, WordPress.tv ha publicado todos los videos de las charlas, incluidas las Flash Talks. Os recomiendo un repaso general a todas las charlas ya que hay grandes aportaciones.

Respecto a lo que a mi me trae por aquí, os dejo el video de la Flash Talk de HumansTXT. La calidad del video no es la que esperaba, así que tras el video os dejo unos enlaces que servirán como complemento:

Podéis ver las viñetas de la presentación del video en la página de HumansTXT. Se trata de un slider en HTML5, por lo que os recomiendo visualizarlo con Chrome. Os podéis mover entre viñetas con las las flechas de dirección. Seguro que os gustarán los dibujos de Carlos Mañas (@oneeyedman).

Por otro lado, si estuviste en la WordCamp Sevilla, quizás te interese echar un ojo a algunas de las fotografías que realicé.

Esta Flash Talk no habría sido posible sin la ayuda de la WordCamp Sevilla y el trabajo de los compañeros del H-Team. ¡Nos vemos en la próxima WordCamp Sevilla!

Diseño de comentarios en WordPress

Add you comment

Screenshot de premassagar

Aunque parezca extraño, una de las cosas que más me ha costado diseñar en este sitio personal han sido los comentarios. Muchas son las preguntas que debes hacerte antes de ponerte manos a la obra.

Lo bueno de un sistema de gestión de contenidos como WordPress es que te facilita muchísimo esta labor. Ya sabes que la mayoría de las plantillas (templates) que están a tu disposición cuentan con la integración de comentarios con avatares (leídos desde Gravatar) o el cebreado de color para los mismos (comentarios par, comentarios impar y comentarios del autor). Solventados estos problemas las principales cuestiones que has de plantearte a la hora de diseñar tus comentarios son:

Uso y tamaño de los avatares

Aunque por defecto los avatares se presentan en la mayoría de los sitios con unas medidas “estándar” (unos 48×48 pixel), nunca descartes la posibilidad de presentarlos a un tamaño mayor o, incluso, no presentarlos. Por ejemplo:

  • En un sitio web dedicado al diseño pueden participar diseñadores que tendrán, supongamos, bonitos avatares. Si aumentas el tamaño se verán más atractivos y complementarán el diseño de tu sitio con toques de diseño, color y creatividad.
  • Sin embargo, en un sitio web con formato blog que genere comentarios largos (debates), los avatares podrían robarle mucho espacio al principal protagonista de tu sitio: el texto. En casos extremos no es descabellado prescindir de ellos.

Estructura visual del comentario

En resumen, los comentarios de tu sitio contienen tres partes:

  • Autor (nick, sitio web y avatar)
  • Metadatos (enlace, hora y fecha de la publicación)
  • Comentario (el comentario en sí)

No necesariamente los metadatos tienen que presentarse junto al nombre del autor. Recuerda que tu intención es maquetar con la ayuda de tu hoja de estilos una presentación mejorada y usable de los comentarios. Concibe los datos a presentar como las capas que dispones para crear en tu modelo y juega un poco con ellas. Te propongo algunos ejemplos de wireframes para comentarios:

comentario_modelo1
comentario_modelo2
comentario_modelo3

Seguro que con un poco de imaginación puedes sacar decenas de modelos.

Diseño gráfico de los comentarios

Una vez decidas el boceto (wireframe) de tus comentarios, te será mucho más fácil diseñarlos y posteriormente maquetarlos. Para la labor de diseño debes empaparte de los blogs que más te gustan para anotar acabados y tener en cuenta varios factores además de todo lo señalado:

  • Tipografía

    Si sueles obtener comentarios cortos, considera la opción de ofrecer una tipografía de mayor tamaño para que luzca mejor. Si sueles obtener comentarios extensos, trabaja las propiedades de interlineado (line-height) y espacio entre letras (letter-spacing) para que la lectura no resulte agotadora. En cualquier caso siempre procura que sean legibles y que la tipografía contraste lo suficiente con el color de fondo.
  • Formato

    Procura que tu formulario de comentario permita el uso de etiquetas HTML para enriquecer los textos: los usuarios con más experiencia sabrán valorarlo. Testea y prepara todas estas etiquetas desde tu hoja de estilos para evitar sorpresas posteriores.
  • Mensajes

    Enriquece la estructura de tus mensajes en los comentarios (error, moderación) con hoja de estilos.