{"id":3999,"date":"2022-04-06T12:10:00","date_gmt":"2022-04-06T12:10:00","guid":{"rendered":"https:\/\/new.salago.design\/sin-categorizar\/jerarquia-visual-en-diseno-pongamos-orden\/"},"modified":"2022-04-06T12:10:00","modified_gmt":"2022-04-06T12:10:00","slug":"jerarquia-visual-en-diseno-pongamos-orden","status":"publish","type":"post","link":"https:\/\/salago.design\/es\/blog\/jerarquia-visual-en-diseno-pongamos-orden\/","title":{"rendered":"Jerarqu\u00eda visual en dise\u00f1o, \u00a1pongamos orden!"},"content":{"rendered":"
\n
\n
\n

La jerarqu\u00eda visual en dise\u00f1o es muy importante. De un vistazo, permite al usuario de una web o al lector de una publicaci\u00f3n entender la distribuci\u00f3n y verlo todo con claridad. Hay unas  normas b\u00e1sicas de jerarqu\u00eda visual <\/strong>establecidas a las que atenerse para que el usuario reciba la informaci\u00f3n y la procese adecuadamente de forma r\u00e1pida.<\/p>\n<\/div>\n<\/div>\n

\n
\n
\n

\u00bfQu\u00e9 es la jerarqu\u00eda visual en dise\u00f1o?<\/h2>\n<\/div>\n<\/div>\n<\/div>\n
\n
\n

Es la definici\u00f3n de la importancia u orden de elementos que forman parte de un dise\u00f1o <\/strong>por parte de quien los crea y que permite al usuario el reconocimiento primero de los elementos importantes, mejorando la comprensi\u00f3n r\u00e1pida del conjunto.<\/p>\n

Jerarqu\u00eda visual en dise\u00f1o para poner orden f\u00e1cilmente<\/h2>\n

El tama\u00f1o es clave para establecer una jerarqu\u00eda visual en dise\u00f1o<\/h3>\n

El tama\u00f1o mayor de un elemento logra captar r\u00e1pidamente la atenci\u00f3n <\/strong>e indica su mayor importancia.<\/p>\n

Cuando todos los elementos son de tama\u00f1o <\/strong>similar al usuario le resulta complicado saber cu\u00e1l es m\u00e1s importante. Requiere much\u00edsimo m\u00e1s tiempo y m\u00e1s esfuerzo averiguarlo. Sin embargo, adjudicar un mayor tama\u00f1o a los elementos m\u00e1s importantes e ir reduciendo este seg\u00fan descienda su importancia permite al usuario identificar esta de un vistazo. <\/p>\n

Por ello dentro de la jerarqu\u00eda visual el tama\u00f1o es una de las formas m\u00e1s importantes de ordenar los elementos<\/strong>.<\/p>\n<\/div>\n<\/div>\n

\n
\n

Contraste para la jerarquizaci\u00f3n visual<\/h3>\n

Otro factor importante para establecer una jerarqu\u00eda visual es el contraste<\/strong>. Se combinan con el color pero tiene entidad propia. <\/p>\n

El contraste permite resaltar elementos de una imagen o un texto <\/strong>para capturar antes la atenci\u00f3n del usuario. Pueden lograr un impacto m\u00e1s o menos explosivo o dram\u00e1tico en funci\u00f3n de c\u00f3mo se use. <\/p>\n

Color e impacto visual en dise\u00f1o<\/h3>\n

El color es un poderoso factor<\/strong> para establecer una jerarqu\u00eda visual en dise\u00f1o. Est\u00e9tica y visualmente es f\u00e1cil de asimilar por el usuario. Es una de las formas m\u00e1s inteligentes de  crear un orden en un dise\u00f1o.<\/strong><\/p>\n

En el dise\u00f1o de p\u00e1ginas web o de cat\u00e1logos, por ejemplo, los colores deben estar alineados con el branding<\/a><\/strong> de la marca. No siempre se pueden utilizar libremente para generar una  combinaci\u00f3n arm\u00f3nica <\/strong>y establecer un orden<\/strong>. Pero se debe aplicar probando c\u00f3mo las distintas  combinaciones de colores y tonalidades <\/strong>impactan y permiten dejar claro ese orden que se quiere mostrar.<\/p>\n

Temperatura, valor o saturaci\u00f3n <\/strong>son distintas formas de jugar con el color y el contraste <\/strong>para lograr el objetivo deseado.<\/p>\n

Proximidad y repetici\u00f3n en la composici\u00f3n, otros factores para establecer un orden visual en un dise\u00f1o<\/h3>\n

Cuando se habla de proximidad en jerarqu\u00eda visual <\/strong>se hace referencia a c\u00f3mo se separan, colocan o agrupan los elementos. La proximidad permite  agrupar elementos similares <\/strong>para que se les reconozca individualmente y como parte de un conjunto.<\/p>\n

En cuanto a la repetici\u00f3n<\/strong>, permite reconocer elementos similares. Pero si se abusa de ella el dise\u00f1o puede terminar resultando excesivamente plano. <\/p>\n

Alineaci\u00f3n, repetici\u00f3n y composici\u00f3n para indicar la importancia de un elemento<\/h3>\n

La ubicaci\u00f3n<\/strong> de un elemento tambi\u00e9n es una forma de mostrar su importancia <\/strong>para que sea f\u00e1cil entenderlo y captarlo. Por ejemplo, en un dise\u00f1o web los elementos centrales suelen atraer m\u00e1s r\u00e1pidamente la atenci\u00f3n que los laterales. Y los superiores m\u00e1s que los inferiores. <\/p>\n

No obstante, hay reglas de composici\u00f3n de la imagen que permiten establecer un orden a fin de lograr que la atenci\u00f3n del usuario se dirigir\u00e1 a ellos en el mismo:<\/p>\n