Contenido destacado en rejilla visto en una tableta.

Un blog estilo magazine: Un repaso al tema Twenty Fourteen

Ya hemos hablado de lo mucho que nos gusta el tema Twenty Twelve de WordPress en nuestros tutoriales.

Hoy daremos un respaso por el nuevo tema que los chicos de WordPress han lanzado para este año 2014.

Ciertamente es un tema bonito y a la vez un poco mejor que sus precedesores, el “peculiar” Twenty Thirteen y nuestro “querido” Twenty Twelve.

El tema está inspirado en los temas tipo “revistas o magazines”. Se refieren a él como “beautiful magazine theme”.

En este post vamos a repasar este tema para descubrir las virtudes y las defectos del mismo.

Si todavía no lo conoces echa un vistazo a su demo oficial.

No está mal ¿verdad?.

Así a primera vista uno diría que está bastante bien para ser un tema gratuito de WordPress.

¿Qué tiene de bueno el tema Twenty Fourteen?

  • El diseño de TwentyFourteen es: un encabezado simple, barra lateral izquierda y la configuración de pie de página con una barra lateral opcional de la derecha que se alinea con el contenido. El encabezado estrecho es fijo y permanentemente visible, lo cual está bastante bien.
  • El esquema de color es negro, blanco y verde y el sitio hace uso de la fuente Lato de Google.
  • Contenido destacado en formato cuadrícula o slider.
  • destacadosLas personalizaciones del tema son más o menos lo mismo que en los otros temas con la adición de la función Contenido destacado que permite el contenido destacado que se ofrecerá en la página principal, ya sea en forma de deslizador o slider o en forma de rejilla o grid. El contenido se selecciona de dos modos: especificándolo con una etiqueta o “fijando” dicha entrada en la página principal.
  • Existen dos ubicaciones de menú, uno en la cabecera y otro en la barra lateral izquierda y tres áreas Widgets – Barra Lateral Primaria, Sidebar contenido y pie de página de la zona. El pie de página permite añadir widgets ilimitados, pero cuatro es lo óptimo.
  • El tema ofrece un widget adicional a la lista estándar: TwentyFourteen Ephemera. Esto es en realidad un widget muy útil y se utiliza ampliamente en la barra lateral de contenido en la demo, y está bastante bien, pero decepciona un poco el que no puedas controlar más lo que se muestra.
  • Combinación de colores. A pesar de las reservas que hay sobre los fondos negros, la combinación negro, blanco y verde funciona.
  • La tipografía es buena, con fuentes claras, nítidas y de aspecto profesional que funciona bien incluso cuando se muestra como texto blanco sobre un fondo negro (aunque no sea una combinación favorita).
  • Las imágenes también se ven bien, sobre todo las imágenes destacadas en las páginas de entrada.
  • El estilo de las etiquetas. Se ven como verdaderas etiquetas creando una indicación visual instantánea.
  • Etiquetas que parecen etiquetas, y atractiva navegación de entradas.
    Etiquetas que parecen etiquetas, y atractiva navegación de entradas.

    Navegador de post con estilo. Simplemente apilar la navegación es mucho más limpia y estéticamente agradable que la tradicional alineación a la izquierda y a la derecha.

  • Menús Desplegable funcionan bien en el margen izquierdo del menú de navegación y de nuevo el texto en blanco sobre el fondo verde es muy eficaz.
  • Rejilla de Imagen destacada. Mecanismo muy eficaz y sencillo para resaltar las entradas destacadas en la página principal.
  • Widget de Ephemera. Esto podría ser aún más útil si tuviese unas pocas más e opciones.
  • Comportamiento en la búsqueda. Sobre esto hay un debate acerca de cuál es mejor, si la que despliega la caja de texto por debajo o la que hace que aparezca un cuadro de texto al lado del icono de búsqueda. A nosotros nos gusta que haya que hacer clic para ver una caja de entrada de texto de búsqueda.

Pero también Tiene sus contras

  • Slider. Necesita tener imágenes de gran tamaño (más grande que 800px ) para que funcione correctamente en el escritorio lo que podría hacer con el tema de un sitio existente difícil.
  • Slider. No tiene la funcionalidad de reproducción automática.
  • Rejilla. Estaría mejor especificar la configuración de la misma (es decir, poder escoger el número de imágenes por fila ) en lugar de dejárselo al diseño responsive.
  • Submenús muy a la derecha se salen de los límites de la página.
    Submenús muy a la derecha se salen de los límites de la página.

    Los submenús no se pueden utilizar en la parte derecha del menú, de esa manera se salen del límite de la página.

  • La barra lateral de contenido se aplica a todos los contenidos, es decir, se aplica tanto a las páginas como a las entradas. Aunque en las páginas siempre puedes usar la plantilla de ancho completo para quitarla.
  • Enorme hueco en la parte superior de las páginas internas. Esto es para dar cabida a la barra de búsqueda , pero no entendemos por qué no pudieron haberla superpuesto como lo hace en la página de inicio.
  • Diseño ancho máximo fijo pero alineado a la izquierda en lugar de centrado.
  • La cabecera es bastante estrecha. Poner un logo de tamaño decente ahí podría resultar un reto.
  • Página de Inicio. Usando la cuadrícula para los posts destacados y a continuación listar los demás posts, parece que hay una lucha por captar la atención entre la rejilla de destacados y la imagen destacada del post.

¿Cómo responde?

 

Volvamos a TwentyFourteen. Es, naturalmente, un tema responsive, pero ¿cómo responde y qué opciones tiene? Como se comporte el sitio en los diferentes dispositivos móviles puede afectar al contenido.

Tablets

Contenido destacado en rejilla visto en una tableta.
Contenido destacado en rejilla visto en una tableta.

En las pantallas de las tablets, el tema esconde el menú superior, reemplazándolo con el icono de menú estándar de tres barras. Al hacer clic en el icono se desplega el menú de una manera básica, pero no es tan eficaz o tan estéticamente agradable como el cuadro de búsqueda de texto que se superpone.

La cuadrícula o rejilla responde a la perfección, la reconfiguración de sí mismo para ser dos imágenes , pero tienes que tener en cuenta que en el paisaje sólo cuatro imágenes estarán disponibles en el modo de retrato de un visitante verá de seis, pero eso es todo.

El contenido se ve muy bien, con la tipografía y las imágenes destacadas grandes que sobresalen en la pantalla pequeña, haciendo una experiencia de lectura placentera.

Hay tres cuestiones, sin embargo, todas ellas causadas por el desplazamiento de la barra lateral de la izquierda entre el contenido y el pie de página.

En primer lugar, la desaparición de la barra lateral significa que el menú de la barra superior sea, probablemente, el que los usuarios busquen para navegar. Esto prácticamente obliga a usar ese menú superior como de navegación principal del sitio, reduciendo las opciones.

En segundo lugar, el tagline o descripción que está en la barra lateral, y el cual informa a los usuarios de que va tu web, no es inmediatamente visible para los usuarios de tabletas, lo que significa que los nuevos usuarios sólo tendrán el título de la página y cuatro o seis imágenes destacadas (o una sola imagen, si se opta por el slider) para determinar el propósito y la utilidad del sitio.

Moviles

La opción del slider funciona mejor en los móviles.
La opción del slider funciona mejor en los móviles.

Como en las tablets, el contenido se ve muy bien en un dispositivo móvil y sin problemas.

Sin embargo, los mismos problemas señalados anteriormente con las tabletas también se experimentan en un móvil. De hecho, el problema de navegación es en realidad acentúa debido al tamaño limitado de la pantalla y la posibilidad muy real de que un menú de cualquier longitud no encaja.

Además, la visualización del contenido destacado en el formato de la rejilla no está bien adaptada a los dispositivos móviles, donde se reduce a una sola imagen. Con sólo una imagen ajustada en la pantalla, hay que hacer bastante scroll para pasar del contenido destacado a otro tipo de contenido, lo que significa que, incluso, utilizando una página estática como página de ” bienvenida “, hay que hacer el mismo scroll para llegar al contenido propio de la página.

El Slider o control deslizante, por otra parte, funciona muy bien tanto en los móviles como en las tabletas (mejor en modo vertical).

En otras palabras: La cuadrícula funciona bien en los ordenadores de escritorio, para las tablets y móviles mejor la opción del slider.

× En otras palabras: La cuadrícula funciona bien en los ordenadores de escritorio, para las tablets y móviles mejor la opción del slider.

Las mejoras potenciales

  • Permitir al usuario que especifique el número de imágenes en una fila de la cuadrícula
  • Añadir el control deslizante para desplazarse automáticamente a la siguiente diapositiva, Autoslider.
  • Posibilidad de asignar el Siderbar del contenido a la página principal sólo o a las que queramos.
  • Opción de poder configurar la imagen ofrecida para cada plataforma (es decir rejilla para escritorio y slider para tabletas, móvil).
  • Centrar el diseño
  • Convertir la barra lateral izquierda en una barra lateral deslizable y añadirla en el icono de menú en la cabecera.

¿Es un tema tipo magazine?

Así es como lo llaman los de WP pero a fin de cuentas deja esa sensación de que podría haber estado mejor. Aunque esa no es la finalidad de los desarrolladores del tema.

El diseño es sin duda de lo más “minimal”, lo que no está mal, si lo que se busca es calidad en vez de cantidad.
Este tema, según se comporta en tablets y móviles, puede no resultar adecuado si lo que se pretende es hacer uso de banners para anunciantes y demás.

Así que de ti depende. Principalmente opinamos que este nuevo tema, con algunas “customizaciones” puede resultar una buena opción para tu blog estilo revista. Eso sí, hay muchas cosas que mejorar.

Y tú, ¿has probado ya Twenty Fourteen? ¿Crees que se puede usar cómo “Magazine Theme”?

Artículo inspirado en esta fuente.

Carlos para FreelanceEvolution®

Comenta, Difunde, Comparte.

4 Comentarios en “Un blog estilo magazine: Un repaso al tema Twenty Fourteen

  1. Muy buena descripción de lo que es el tema, sin embargo veo que no dice nada del idioma. He buscado por otros sitios y pasa lo mismo, como se pone la traduccion al español?
    El tema por defecto viene en ingles…

    1. Hola Marco.
      1) El hecho de que el idioma venga en inglés me imagino que sea por la instalación de WP, que esté en inglés.Cuando accedes a wordpress.org, hay un enlace para descargarse WP en español. Imagino que tengas la instalación hecha en inglés, que es la que viene por defecto.
      Para saberlo tienes que editar el archivo config.php y buscar la línea:
      define(‘WPLANG’, ‘en_EN’); y cambiarla por define(‘WPLANG’, ‘es_ES’);
      2) El tema Twenty Fourteen viene con un archivo preparado para las traducciones, en la carpeta languages. Es como una palntilla de Powerpoint que podrás traducir a tu gusto. Puedes hacerlo con Poedit, el cual genera 2 archivos, es_ES.mo y es_ES.po, cuando guardas el documento. Después tienes que subir los dos archivos a esa carpeta languages y ya.
      Pero creo, por lo que me cuentas que es porque tienes instalado WP en inglés.
      Cualquier duda me dices.
      Gracias por comentar.
      Saludos

Deja un comentario

Your email address will not be published.Los campos requeridos están marcados *