¡Hola a todos! Hoy os traigo un post un poco diferente y de gran utilidad para intentar mejorar vuestro sitio y convertirlo en uno de los mejores blogs o webs -en definitiva- de vuestra competencia.

En primer lugar, siento deciros que no traemos ninguna solución mágica ni milagrosa para lograrlo. No obstante, lo que si me he propuesto traeros hoy es una reflexión sobre cómo podemos potenciar el contenido de nuestro sitio para conseguir nuestros objetivos mediante una tarea muy sencilla y además, creativa: impulsando el diseño de nuestro sitio web o blog para hacer de él “algo” único y atractivo. Ese “algo” que te haga desear volver a visitarlo.

Mejores blogs y webs del momento

Potencia tu contenido con un buen diseño ¡el truco de los mejores blogs y webs del momento!

Hay una afirmación que a primera vista parece obvia: el diseño web es importante. No obstante, navegando por diversos sitios o blogs podemos darnos cuenta que en muchas ocasiones éste se descuida y hace que nos planteemos si de verdad le damos la importancia que se merece.

Bien pues, hoy nuestro objetivo será entender de una manera objetiva la importancia del diseño de tu sitio y cómo podemos mejorarlo ¡vamos a ello!

 

El truco de los mejores blogs y websites: El diseño, carta de presentación

Antes de poder decidir cuál es el diseño que mejor se adapta a nuestro sitio debemos entender por qué éste es tan importante y, para ello, vamos a intentar ilustrarlo con algunos ejemplos.

Seguro que muchas veces habéis oído la comparación de que el buscador de Google es como una gran zona comercial y que estar en su primera página es como estar en la mejor calle donde están las mejores tiendas, la que más afluencia de visitas tiene y, por tanto, la que es más prestigiosa. Pensemos por un momento en esas tiendas. Seguro que tienen unos productos excelentes y de gran calidad. Pero estas tiendas, ¿qué aspecto tienen? ¿Verdad que no podemos imaginar unos productos tan exquisitos en un entorno poco cuidado y desaliñado?

Dejando de lado que tenemos que trabajar en el SEO para estar en esa página de Google (¡no debemos descuidarlo!), ya hemos llegado a una buena conclusión: debemos conseguir que ese lugar donde se encuentra nuestro contenido luzca a la altura del mismo.

mejores blogs con buenos diseños

Tu sitio como un producto de la máxima calidad.

Al menos así es desde mi punto de vista. No obstante, ambas cosas son importantes y, si se dan conjuntamente, aseguraremos en gran medida nuestro éxito. Me explico: imaginemos por un momento acabamos de leer un libro magnífico. Un libro que, además, nos llamó la atención no por su autor ni recomendaciones, sino porque tenía una hermosa portada que nos hizo detenernos en él. Así pues, por una parte, posiblemente nunca nos hubiéramos fijado en él si no nos hubiera llamado la atención desde el principio; por otra parte, por muy bonito que sea, si el libro no es bueno lo lógico es que no pasemos del primer capítulo.

Así pues, ambos factores son fundamentales. El diseño es lo primero que los visitantes ven en nuestro sitio y, si es bueno, ayuda a que el visitante se sienta cómodo con lo que está viendo, aumentando la posibilidad de que crezca su interés por tu sitio. El buen diseño web da, de alguna manera, más “calidad” a lo que ofrecemos.

 

Presentando al mundo lo que tú querrías descubrir

Efectivamente, este es el punto de partida que deberíamos tomar cuando empezamos a trazar las líneas que compondrán el diseño (o rediseño) de nuestro sitio web: debemos mostrar a nuestros visitantes lo que a nosotros nos gustaría ver. No obstante, ¡mucho ojo! Cuando afirmamos esto no queremos decir que debemos centrarnos en el contenido que vamos a mostrar, sino cómo lo vamos a hacer para que éste destaque y cree la necesidad de ser analizado por tus seguidores.

 

Estructurando el contenido

Así pues, la estructura es un aspecto fundamental y que debemos plantear antes que nada. Actualmente existen varias tendencias que podemos ver en algunos de los mejores blogs y websites y que nos presentan el contenido de nuestro sitio de una manera muy atractiva y eficiente. Además, la ventaja de utilizar estas estructuras más de “moda” hace que tus visitantes se sientan familiarizados con lo que están viendo y no se sientan perdidos o abrumados. ¿A quién no le ha pasado lo típico de “muy bonito, pero dónde hay que pulsar”?

Algunas de las estructuras más utilizadas actualmente y que debemos conocer son las siguientes:

 

Para webs

  • Las OnePage: éstas se han ido imponiendo estos últimos años y son las que presentan todo su contenido en una sola página, diferenciando las secciones de la misma intercalando contenidos con ancho fijo y ostros con fondos de ancho completo. Estas estructuras son ideales para empresas que lanzan un solo producto, freelancers que ofrecen sus servicios, presentación de complementos web, etc.
  • Podríamos decir que la “contraparte” de las OnePage son las páginas que segmentan su contenido en distintas páginas, como podrían ser: Sobre Nosotros, tienda, blog, etc. Un buen ejemplo lo tenemos aquí, en Anmar Studio. Estas estructuras son más “clásicas” que las anteriores y son ideales para webs con mucho contenido como podrían ser revistas, equipos creativos, tiendas online, freelancers con portfolios, etc. Si escogemos esta estructura para nuestro sitio, un aspecto importante que debemos plantear es la manera de organizar esas páginas a través del menú de navegación:
    • Menú principal superior: Éste es el más utilizado ya que es el más accesible y claro, y más si lo situamos siempre a la parte superior del contenido, independientemente de si el usuario hace scroll en las páginas.
    • Menús superiores: Una buena opción sobre todo para tiendas online es disponer de dos menús superiores, donde pueden segmentar aún más las páginas o acciones que puede llevar a cabo el usuario, ya sea para el registro/login, cambio de divisa, carrito de la compra, barra de búsqueda, etc.
    • Menú adaptativo: Son aquellos que permanecen ocultos y que sólo se muestran al pulsar un botón específico. Este tipo de menús son mucho más dinámicos y además se ven estupendos en móviles y tabletas, pero también pueden crear confusión a alguno de los usuarios que visitan nuestro sitio. Siempre debemos tener en cuenta el púbico al que va dirigido nuestro contenido, y si decidimos incorporar este tipo de menús, debemos asegurarnos de hacerlo bien visible y accesible.
  • Una última estructura que también podemos ver en algunos sitios webs con diseños muy frescos y actuales es el de Slideshow Estas páginas son las que muestran su contenido en diversas diapositivas o slides que ocupan el 100% del ancho y alto de tu navegador. Son ideales para la presentación de proyectos creativos o, en definitiva, páginas webs cuyo mayor reclamo para el visitante sean sus imágenes o clips, las cuales se presentan en primer plano.

 

Para blogs

  • Por muchos diseños nuevos que se creen para la presentación de blogs, no hay nada como el que podríamos llamar el “Blog clásico de toda la vida”. Éste, que es el que tenemos aquí en nuestra web, es el que muestra sus entradas cronológicamente, una por una y que cuenta con una (o como máximo dos) barras laterales, donde encontramos widgets a redes sociales, publicidad del sitio, etc. Ésta estructura es, sin duda, la más conocida por los internautas y por tanto, la más amena para ellos.
  • El Grid: este tipo de diseño es el que muestra sus entradas en –podríamos decir- “cajas”, las cuales también se muestran cronológicamente pero, al ocupar menos espacio horizontal, van colocándose una al lado de otra.
  • En definitiva, hay muchas maneras posibles de estructurar un blog. Para acabar, mencionaré uno que personalmente me parece muy claro y organizado y que si se combina con un buen diseño, es sin duda uno de mis favoritos para bloggear. Éste se compone de una página principal donde se muestran las entradas destacadas, por autores, tipo de contenido, etc., para luego dividir las diferentes categorías en páginas en el menú principal. Este es ideal para blogs más profesionales donde se tratan diversos temas y tiene un buen volumen de publicaciones y visitantes.

Así pues, aunque algunas de estas cosas nos parezcan obvias e incluso poco transcendentes para nuestro diseño del sitio, es muy importante tener estos factores claros antes de empezar a darle forma al aspecto visual, ya que la estructura es lo que va a definir la organización del contenido de tu sitio.

 

Aspectos visuales

Una vez sepamos cómo vamos a estructurar nuestro sitio es importante dedicar tiempo a pensar el aspecto visual del que nuestro blog o sitio web va a poder alardear.

 

En la variedad está el gusto: El bagaje

Para esto, es imprescindible conocer las últimas tendencias en diseño front-end y documentarse para intentar adaptarlas a nuestra página, teniendo siempre en cuenta si éstas son compatibles con el tipo de contenido que nosotros vamos a ofrecer. No obstante, siempre digo que es muy interesante tener un buen bagaje sobre diseño web y artes gráficas que podemos encontrar online, pues aunque no lo podamos adaptar directamente a nuestro proyecto seguro que nos servirá de inspiración para crear cosas maravillosas en nuestro proyecto o en un futuro ;).

 

Identidad: los colores

Un aspecto muy importante son los colores de vuestro sitio web o blog. Al igual que es importante tener un buen logotipo que identifique vuestra marca, es imprescindible tener unos colores que también se asocien a vuestro sitio y que, por descontado, tengan consonancia entre sí y sean amenos con vuestro contenido.

Sabemos que en estos últimos años se ha impuesto mucho el diseño clean, donde predominan fondos blancos y no hay cabida para colores excesivamente llamativos en zonas demasiado destacadas. Es una buena opción ya que, además de ser elegante, el clean design se centra en mostrar de forma clara el propósito de tu sitio, de manera que el único protagonista sea tu contenido.

 

Tipografía ¡cuéntalo a tu manera!

Aunque esto es tal vez algo más personal, la tipografía del sitio también es muy importante, pues no sería muy agradable leer un artículo épico con Comic Sans… ¿o sí?

La tipografía es una manera genial de establecer jerarquías visuales claras transmitiendo prioridades en los elementos de tu sitio, combinando distintos tipos de fuentes, tamaños y colores.

En cualquier caso, tenemos la suerte de contar con tipografías muy diversas y bonitas que además podemos incorporar ahora muy fácilmente en nuestro sitio web con la ayuda de herramientas como Google Fonts. Además, también podremos consultar datos muy interesantes sobre las fuentes que nos gustan, como por ejemplo en qué otras fuentes se combinan, con qué frecuencia, etc. Como podéis ver, ¡es una herramienta de uso casi obligatorio!

 

Recursos eficientes: los iconos

Sin duda es una obviedad que no necesita de ningún análisis exhaustivo: los iconos han invadido internet. Y, francamente, con razón. Éstos nos evitan exceso de contenido al sintetizar el mismo en pequeñas imágenes que, además, lucen de escándalo en nuestro sitio, ya sea para presentar redes sociales, secciones, categorías del menú, etc.

Sobre este punto, aquí tenéis algunos recursos que os serán de utilidad para incorporar iconos en vuestro sitio:

  • FontAwesome – es una fuente de texto que podemos incorporar en el código de nuestro sitio y que cuenta con una gran cantidad de iconos diversos que, además, va actualizándose periódicamente.
  • Flaticon – un fantástico repositorio donde encontramos una gran cantidad de iconos de muchos tipos que además podemos descargar en diversos formatos o simplemente implementar en nuestro sitio web.

 

El flat design o diseño plano

Seguro que si os habéis documentado sobre tendencias en diseño web en estos últimos meses habréis oído hablar del flat design. Este sencillamente nos presenta los elementos con un diseño plano y sin sombreados, ya sean los iconos (de los que hemos hablado anteriormente), imágenes vectoriales, fondos, etc.

Definitivamente, si vais a diseñar o rediseñar vuestro sitio web o blog, tenéis que tener en mente el flat design si queréis tener un diseño llamativo y actual, pues éste va a seguir imponiéndose en los diseños de front-end este 2016.

 

Mantén el diseño renovado

Llegados a este punto, es genial saber que tenemos preparado un buen proyecto de diseño con el que podremos hacer de nuestro sitio uno de los mejores blogs o webs del momento. No obstante, la realidad es que nuestro trabajo de tener un sitio “puntero” no acaba aquí, pues al igual que el planteamiento inicial y desarrollo del diseño es importante, mantenerlo actualizado también lo es.

No es necesario hacer grandes cambios, pero personalmente siempre recomiendo tener actualizado vuestro sitio, ya sea pensando en nuevas manera de presentar secciones concretas, nuevas imágenes o vectores, etc. Además de darle toques frescos al diseño del sitio, es una manera muy eficiente de que tus seguidores vean que estás activo en él.

Infografía para los mejores blogs

 

Un poco de inspiración

En los Aspectos visuales he comentado que siempre es bueno tener buenas referencias antes de trazar las líneas generales de vuestro sitio. Si necesitáis un poco de inspiración, podéis consultar algunas de estas páginas en las que encontraréis muchísimas ideas creativas sobre desarrollo front-end (¡yo personalmente son las que más uso!):

  • Awwwards: Es genial para ver algunas de las páginas que más están gustando en el momento, ya que nos muestra las páginas más votadas por los usuarios.
  • Behance: Es una red social de la mano de Adobe que si no conocéis es de obligada visita, ya que es como un portfolio donde la gente sube sus proyectos (ya sea acabados o en proceso) creativos entre los que encontramos, entro muchas otras cosas, diseños de páginas web y blog.
  • The Webby Awards: Sitio web parecido a Awwards, donde encontramos tendencias en diseño web y podemos realizar búsquedas por año o por categorías.

 

Conclusiones

Así pues, en este post hemos aprendido a darle la importancia que se merece a nuestro diseño web, pues para lucir un buen contenido es preciso tener un diseño a la altura.

Si sois vosotros mismos los que os encargáis de diseñar vuestro sitio, os vendrá genial tener todas estas cosas en cuenta antes que nada ya que os ahorrará mucho tiempo posteriormente; y si por el contrario contáis con un desarrollador/diseñador, también será estupendo ya que podréis marcar las directrices más claramente y os evitaréis que vuestro proyecto se convierta en algo que no os identifica o convence.

Espero quo os sirva de ayuda! 🙂

Te gusta? Comparte!

Etiquetas

Y tú, qué opinas?


Los campos marcados con (*) son obligatorios.


*