• Saltar a la navegación principal
  • Saltar al contenido principal

Sebastián Thüer

Comunicación, diseño y tecnología

  • Acerca
  • Blog
  • Contacto
  • Show Search
Hide Search

Diseño Web

Estrenando nuevo tema en el blog

Sebastián Thüer · 17.09.2009 ·

Si estás leyendo este post sin problemas es porque he podido configurar correctamente el nuevo tema que usa este blog. Después de 4 años de vida esta es la tercera renovación que tiene el sitio que tiene por objetivo ponerlo al día en el aspecto gráfico e incorporar lo que Jyri Engeström llama objetos sociales. En pocas palabras y de forma simple, que puedas traer tu información de actividades en medios sociales como que puedas llevar el contenido que encontrás acá a otros lugares.

Por ejemplo, si te conectás con tu cuenta de Facebook podés hacer que los comentarios que publiques sean visibles en tu perfil. Debajo de cada post también encontrarás la opción de enviar el contenido a las principales redes sociales y sitios para compartir enlaces. No están todas las redes sino aquellas que considero que son más adecuadas por el tipo de contenido que tiene este blog.

Opción de votación para valorar el contenido
Opción de votación para valorar el contenido

Más abajo encontrarás post relacionados con el que estás leyendo y la opción de calificar el contenido en una escala de 1 a 5. Estas opciones ya estaban previamente integradas en el blog pero creo que algo fallaba en el diseño porque su utilización era marginal. Ahora son más visibles, accesibles y ganan en presencia dentro de la página.

Tweetmeme, ver la repercusión del post en Twitter y enviarlo
Tweetmeme, ver la repercusión del post en Twitter y enviarlo

Al inicio de cada post encontrarás un botón informativo que cumple 2 funciones: informar la cantidad de veces que un post fue enviado a Twitter y darte la oportunidad de hacerlo si te parece que el post es interesante.

Comentarios vs. Trackbacks

Separación entre comentarios y trackbacks
Comentarios y trackbacks, mejor separados

Dentro del genial sistema de publicación de contenido que es WordPress una de las pocas cosas que todavía no me termina de convencer es que por defecto los comentarios de los usuarios se muestran junto con los trackbaks y pings (referencias al post publicadas en otros sitios y blogs). Creo que son dos cuestiones semánticamente diferentes y que no tiene sentido mostrarlas de manera conjunta. Por eso, al entrar a un post ambos tipos de contenido se muestran de manera diferenciada.

El formulario para dejar tu comentario está elaborado siguiendo una vieja idea mía que alguna vez también la vi publicada ¿Por qué generalmente tenemos que escribir primero el nombre, e-mail, página web y luego el comentario cuando dejamos una opinión en un blog? El flujo natural es el contrario: pensamos y escribimos la idea que queremos compartir y luego la firmamos.

Nuevo formulario para comentar: Primero el texto, luego identificar al usuario
Nuevo formulario para comentar: Primero el texto, luego identificar al usuario

Un pequeño detalle es que si el sistema te reconoce porque estás conectado o dejaste anteriormente un comentario te salude y puedas elegir cerrar la sesión si es que no sos realmente vos.

Jerarquía de la información y descubriendo nuevo contenido

Los blogs tienen la particularidad de ser un sistema de publicación muy simple y comprensible por prácticamente todo el mundo. Esa simpleza está basada, entre otras cosas, en que el contenido está ordenado cronológicamente de manera inversa para que el usuario vea siempre lo último publicado. Pero muchas veces lo último no es necesariamente lo más importante.

Dos sistemas para jeraquizar: Relevancia y cronología
Dos sistemas para jeraquizar: Relevancia y cronología

Por eso la página principal muestra dos categorías de ordenamiento. La parte superior está reservada a mostrar el contenido que considero más relevante aunque no sea necesariamente lo último publicado. Inmediatamente debajo se encuentran los últimos post publicados ordenados de manera cronológica tal como es habitual en cualquier blog.

Otro aspecto que me parece importante en un blog es que te permite descubrir nuevos contenidos. Muchos usuarios llegan a esta página a través de Google con una idea u objetivo muy específico ¿Por qué no mostrar también que otras cosas hay disponibles para leer? La opción que elegí es mostrar una serie de posts basados en diferentes criterios

Últimos post
Últimos post

Lo último: Algunos de los posts más visitados de mi blog son del año 2006 o 2007. Al mostrar el último contenido el usuario puede ver que este sigue siendo un blog activo con información actual.

Los posts más valorados
Los posts mejor valorados

Los más votados: Aquellos post que tienen la mejor calificación por parte de los usuarios. Lamentablemente no es mucha la gente hasta ahora que ha votado, pero creo que el nuevo diseño puede ayudar al colocar esta opción de manera más visible.

Lo más relevante para los usuarios
Lo más relevante para los usuarios

Los más populares: Un algoritmo calcula la popularidad del post basado en el número de visitas, de donde provienen esas visitas (página principal, página de archivo, visitas directas, etc.), la cantidad de comentarios, trackbacks y otros factores.

Seleccionando información para la página principal

Uno de los principales desafíos del nuevo diseño fue seleccionar qué información iba a ir en la página principal. Con la profusión de servicios sociales, widgets, plugins y agregados de todo tipo es fácil perderse y terminar abarrotando el ingreso al blog de elementos accesorios que terminan por distraer y confundir al usuario.

La pantalla de ingreso no es necesariamente la página de entrada al blog pero sí la más relevante para mostrar la organización del sitio y poder captar rápidamente ante qué tipo de sitio estamos. En mi caso, opté por utilizar la parte superior para hacer una brevísima introducción personal con enlaces a los servicios más relevantes para cada tipo de actividad que realizo: Mi cuenta en twitter como servicio generalista, mi perfil en LinkedIn para lo profesiona, mi perfil en Mendeley para la actividad académica y mi perfil en Facebook para lo social.

Mini presentación en la página principal
Mini presentación en la página principal

Luego viene el contenido destacado y los últimos posts que están separados tal como lo comenté anteriormente: el más relevante al inicio y luego ordenados cronológicamente. Las barras laterales muestran información que permiten al usuario orientarse dentro del sitio. En el caso de la barra de la izquierda está el contenido más popular, los últimos comentarios y debajo dos elementos que ayudan a enfocar un poco el contenido que tiene el sitio: mi lista de personas de referencia en tecnologías de la información y los últimos artículos que leí.

Barras laterales de la página principal
Barras laterales de la página principal

La barra lateral derecha de la página principal reserva la primera parte para cuestiones de marketing como suscripción al sitio y patrocinadores. Debajo se encuentra la opción para conectarte con tu cuenta de Facebook y ver los usuarios que son parte de la comunidad. Inmediatamente debajo hay dos elementos que ayudan a organizarse en el sitio la lista de palabras claves utilizadas en formato de nube de tags y las secciones del sitio.

Sobre este último tema hasta hace poco no estaba realmente convenido de que contar con secciones dentro de mi blog fuese de utilidad. Básicamente, porque me parece que una palabra clave o etiqueta funciona mucho mejor para organizar el contenido. Sin embargo, creo que próximamente comenzaré a utilizarlas definir un primer nivel de clasificación como puede ser separar un tutorial de una noticia.

Al final de la columna derecha están las últimas actualizaciones en Twitter. En un principio había pensado en incorporar un lifestream que resumiera mi actividad en diferentes medios sociales. Sin embargo, creo que en realidad Twitter puede servir justamente para hacer esta síntesis y es mucho más claro ver esto que un sinfín de actualizaciones de Facebook, LinkedIn, Delicious y otros.

Una beta en serio

La versión final del tema la estoy probando desde un par de semanas tanto en un blog de prueba como en este utilizando el plugin Theme Test Drive. Sin embargo, es probable que aparezca algún problema para lo cual está disponible el formulario de contacto para reportar errores.

En cuanto al tema, tiene el nombre interno de Newport pero todavía le falta bastante para poder liberarse por lo cual de momento no está disponible para descargar. Espero poder completar esta tarea en las próximas semanas y así ofrecer un tema desarrollado por mi en su totalidad salvo algunas funciones en PHP que tomé de otros themes gratuitos.

Ssugerencias, opiniones, comentarios… ¡tu participación es bienvenida!

Guía de etiquetas y atributos CSS soportados por clientes de correo

Sebastián Thüer · 15.09.2009 ·

A la hora de diseñar un newsletter la principal limitación la encontramos en el cliente de correo. Tanto los clientes de correo como Outlook o los webmail como Yahoo están bastante lejos de soportar todas las etiquetas de HTML y CSS.

En Campaign Monitor han hecho un muy buen cuadro de doble entrada sintetizando las capacidades que tienes los 10 correos más popuplares para interpretar el CSS. Así podemos ver que la etiqueta style dentro del HEADER no funciona en Gmail o que background no tienen ningún efecto en MSN Live o Hotmail.

email-css

La síntesis es muy buena aunque no hace más que formalizar lo que algunas veces recordamos y otra hacemos por ensayo-error. Seguramente se convertirá en un recurso a usar cuando tengas que crear correos o newsletters.

  • Ver tabla en PDF
  • Ver tabla en Excel

Diseñar web con elementos 3D usando Photoshop

Sebastián Thüer · 03.09.2009 ·

layout-photoshop-3d

Si te gusta el sitio web de la imagen que está más arriba estás con suerte: La gente de SixApart tiene un excelente tutorial donde explican paso a paso como crear el boceto utilizando Photoshop.

[Leer más…] acerca de Diseñar web con elementos 3D usando Photoshop

¿Diseñar para Internet Exporer 6 o no?

Sebastián Thüer · 14.08.2009 ·

ie6nomore-logo

Desde hace unos días se viene hablando bastante sobre un post publicado en Digg acerca de que en el futuro no incluirá más soporte para Internet Explorer 6 (IE6). El viejo navegador de Microsoft que lleva 8 años en el mercado tiene una pobre performance cuando debe soportar los estándares web, varios problemas de seguridad y es un quebradero de cabeza cuando se quieren utilizar las últimas tecnologías disponibles.

El tema parece haber despertado un sentimiento latente en varios miembros de la comunidad de diseño y desarrollo web que han hecho pública su intención de abandonar el soporte para este navegador mediante la página página IE No More. Weebly, Justin TV, Disqus y otros jugadores de relativo peso han dicho basta y dejarán de gastar tiempo y dinero en asegurarse que sus sitios funcionen en un navegador que pese a sus limitaciones se resiste a morir: todavía el 10% de los visitantes que navegan por Digg lo hacen con IE6, un número importante si tenemos en cuenta que esta web ocupa el lugar 126 en el ranking de tráfico de Alexa. Y parece que un peso pesado como YouTube podría sumarse a a este movimiento. [Leer más…] acerca de ¿Diseñar para Internet Exporer 6 o no?

Construir confianza en la web

Sebastián Thüer · 23.06.2009 ·

Construir la confianza en la web

confianzaweb-1

¿Por qué razón terminamos comprando un producto en tal página web en lugar de otra? La respuesta clásica sería el precio. Pero hoy en día es difícil comprar precios -inclusive con herramientas online- porque no siempre los productos son exactamente iguales y en la guerra por mostrar precios bajos muchos gastos (tasas, suplementos, envíos, etc) se ven recién al final del proceso de compra.

Seth Godin se hace esta pregunta en su blog y su respuesta es la confianza. Crear confianza es un valor básico para cualquier proceso de venta online y aparece como una prioridad en todos los manuales de marketing. Pero Godin proporiona un breve pero interesante analisis de su proceso de compra y da algunas pistas: [Leer más…] acerca de Construir confianza en la web

  • « Ir a la página anterior
  • Página 1
  • Páginas intermedias omitidas …
  • Página 25
  • Página 26
  • Página 27
  • Página 28
  • Página 29
  • Páginas intermedias omitidas …
  • Página 38
  • Ir a la página siguiente »

Sebastián Thüer

Creative Commons Atribución 4.0 Internacional © 2025 · Less Is More · Acceder