La regla de los tercios es un principio con el que muchos fotógrafos y artistas ya están familiarizados. Sin embargo, un diseñador web también puede hacer uso de esta regla en sus proyectos. Si aún no comprendes cómo es esto posible, te explicamos cómo funciona la regla de los tercios y cómo puedes sacarle provecho al realizar layouts.
¿Qué es la regla de los tercios?
La regla de los tercios tiene su origen en el arte tradicional, donde una composición se divide en 9 cuadrados iguales (3 por fila y columna). Si tienes alguna cámara fotográfica y te has encargado de revisar todas tus opciones, probablemente tiene un modo donde divide la pantalla en 9 cuadrados. La razón por la que se realiza esta división está relacionada con la regla de los tercios. Sin embargo, muchos artistas ya están acostumbrados a realizar este tipo de división de espacio en sus mentes.
Según la regla de los tercios, los puntos de mayor interés en la composición se deberían encontrar en las intersecciones o cercanas a ésta. Entonces, la regla de los tercios te permite, de algún modo, realizar composiciones que sean más atractivas.
Apoyarte en la regla de los tercios no implica que tu composición debe ser estática o uniforme. No tenemos nada contra este tipo de composiciones, pueden llegar a ser muy bien logradas, sin embargo, muchas veces la asimetría y el dinamismo son esos elementos que le añaden más interés a tus composiciones. Es por ello que te animamos a apostar por estas características.
Parece ser que la regla de los tercios tiene relevancia con el arte y más específicamente, la fotografía. Entonces, ¿cómo se relaciona con el diseño web? Pues la regla de los tercios te permite ubicar tus elementos de mayor interés en puntos estratégicos. En el diseño web también cuentas con elementos que deseas que destaquen más que el resto, es por eso que la regla de los tercios resulta ser útil cuando se aplica al diseño web.
Comprendiendo la utilidad de la cuadrícula
Como ya habíamos explicado anteriormente, al aplicar la regla de los tercios a tus composiciones las divides en 9 cuadrados iguales con 4 puntos donde se intersectan (los cuales son los puntos de interés de tu composición). Se conoce que la mayoría de personas ven un sitio web siguiendo un patrón en forma de Z o F. Según esta información, los usuarios ven las páginas de arriba hacia abajo, de esta manera, la esquina superior izquierda es el área que tiene mayor atención y este suele ser justamente el lugar donde se coloca el logo de la empresa en una página web.
Los puntos que se intersectan en la cuadrícula no tienen que ser necesariamente usados para colocar enlaces o cualquier otro elemento que consideres importante, sino que puedes usarlo como marcadores que te indican que parte de tu layout es importante. Por ejemplo, podrías hacer que tu botón de llamada a la acción se alinee con la segunda recta horizontal.
Si deseas emplear esta técnica, recuerda que debe ser aplicada en el primer pantallazo de la página web. También puedes crear un archivo de las dimensiones en las que deseas realizar tu sitio web para poder determinar los puntos de interés mediante la regla de los tercios. Recuerda además que la regla de los tercios en el diseño web sirve como apoyo para mejorar la experiencia de usuario.
Usar cuadrículas como guías
La regla de los tercios y la cuadrícula que resulta de ella no debe ser usada para realizar un diseño pulcro, sino como una herramienta para testear un diseño ya existente. En base a la cuadrícula podrías determinar que la barra de navegación debe estar más arriba, alinear el logo a una recta o incluso alejarlo de una intersección. Todo depende de los elementos que tengas que incluir en tu diseño.
Entonces, crea tu sitio web de acuerdo a tus habilidades y conocimiento de diseño y realiza modificaciones de acuerdo a ello. Otra forma de familiarizarte con la regla de los tercios es realizar capturas de pantalla de sitios web que te parezcan buenos y ver en qué medida cumplen con la regla de los tercios. Esta experiencia podría ser valiosa para ti como diseñador.
Aclaraciones finales
La simetría es un principio del diseño y en ocasiones, aplicar simetría a ciertos elementos puede ser útil. Pero si todos tus elementos son simétricos, tus diseños quedarían muy uniformes y aburridos. Es necesario agregar variaciones y la asimetría puede darle a tus composiciones la atención que estás buscando.
Ya mencionamos que la cuadrícula debería servir como una guía. El hecho de que todos los cuadrados sean iguales en tu cuadrícula no implica que ciertos elementos puedan sobrepasar estos límites. Este es un concepto que también se emplea en la diagramación de revistas y definitivamente se obtienen resultados más interesantes si existen elementos que rompan, de tanto en tanto, con la uniformidad de los párrafos. Este mismo principio puede ser llevado al diseño web.
Realizar variaciones, teniendo en cuenta la jerarquía entre los elementos es uno de las habilidades que debes adquirir como diseñador web. Por ejemplo, si usas una tipografía en gran puntaje para el título te aseguras que capte la atención. Para realizar un contraste puedes usar la misma tipografía, pero en menor puntaje. De esa manera, el punto central de atención sigue siendo tu título mientras que el cuerpo de texto sirve como apoyo.
Entonces, a pesar de que uses como base una cuadrícula simétrica y perfecta, el resultado final no debe cumplir con estas características. De hecho, es recomendable realizar contrastes y variaciones entre tus elementos para hacer tu composición más interesante.