Nuevo brutalismo y accesibilidad web: lo que necesitas saber | ryan halcón | octubre 2022

tipografía brutalista con líneas rectas modernas

El nuevo brutalismo es una tendencia que ha ido ganando popularidad en los últimos años. Abandonando el estilo elegante y modernista de los edificios que vinieron de la era de la posguerra, el brutalismo es más crudo y crudo. En su rechazo del glamour, el brutalismo crea una estética casi industrial, a menudo con hormigón visto y otros materiales que recuerdan a fábricas o almacenes.

Hay muchas razones por las que es tan popular entre los diseñadores. Desafía la omnipresencia de las tendencias de diseño web. New Brutalism les da a los diseñadores la libertad de ser creativos. Esta creatividad a menudo se expresa en características tales como “asimetría, jerarquía rota, cuadrículas rotas, tipografía grande y en negrita… elementos superpuestos, formas geométricas, líneas sólidas”. [and] colores brillantes”, como se describe en BRUTALIST WEB DESIGN IS THE MOST DANGEROUS design trend of 2020.

Con el auge de la accesibilidad de los sitios web como un tema clave para los profesionales de la usabilidad, no sorprende que el estilo de diseño brutalista haya llamado la atención de los diseñadores. Muchos de sus principios están directamente en línea con el diseño accesible, mientras que otros están en conflicto directo con ellos.

Esto es lo que necesita saber sobre esta tendencia y cómo evitar las trampas creativas que rompen las reglas del diseño accesible.

Una breve historia del nuevo brutalismo

El brutalismo es un estilo arquitectónico específico, pero también tiene un significado más amplio en el diseño. El término Nuevo Brutalismo se remonta a las décadas de 1950 y 1960, aunque el movimiento arquitectónico comenzó en los años posteriores a la Segunda Guerra Mundial. Comparte su nombre con el movimiento brutalista anterior, pero existen diferencias clave entre los dos. El Brutalismo original era más extremo y se caracterizaba por edificios de hormigón en bruto con poca consideración por la estética. El nuevo brutalismo, por otro lado, es más sutil. Algunos de los principios rectores del New Brutalist incluyen el uso de formas simples y audaces que sirven como un recordatorio de sus orígenes industriales.

Nuevo Brutalismo y Accesibilidad

Un aspecto significativo del Nuevo Brutalismo es su “simplicidad icónica de diseño y su énfasis igualitario en la producción en masa y la utilidad”. Una parte clave de la creación de una interfaz fácil de usar es garantizar que la información de su sitio sea accesible y cómo se presenta a los visitantes.

cuadrícula desordenada de imágenes mixtas y botones borrosos con texto de desplazamiento vertical
Un sitio web que muestra el nuevo brutalismo en el diseño web.

Imprenta

Quizás el marcador visual más dominante del sitio web New Brutalist es el tipo de letra grande y en negrita, a menudo delineado o muy estilizado.

¿Por qué estos sitios no están disponibles? Para que la tipografía se ajuste a los estándares WCAG, debe ser fácil de leer y comprender. También debe tener encabezados claros y anuncios de aria.

¿Estos nuevos sitios brutalistas tienen una tipografía nítida, legible y legible? ¿Hay problemas de contraste? ¿Está disponible el texto vertical? ¿Los elementos superponen texto y botones?

sitio web que contiene poco contraste con texto animado superpuesto a otro texto
Ejemplo A
un sitio web con una copia de marketing inclusiva no muestra esa copia correctamente
Ejemplo B

En la captura de pantalla (Ejemplo B) del estudio de diseño, incluso hay cierta ironía que dice: “es una especie de estudio creativo que pone a las personas en el centro de nuestra prácticamientras aparentemente ignora a las personas que no pueden leer o acceder a los servicios desde su propio sitio web.

Color

De todos los aspectos de la accesibilidad, el color y el contraste están bajo el control de los diseñadores. Si bien gran parte del trabajo disponible a menudo se realiza en el código de los propios productos, se puede decir que el color es el obstáculo más fácil de superar en el diseño accesible.

Disfruté la nostalgia por este sitio. Una especie de regreso a las páginas de geocities de años pasados.

Elegí este ejemplo por el uso de los colores rojo y verde. Estos dos colores son los colores más comunes que causan discapacidad visual en personas con diversos grados y tipos de daltonismo. Tenemos algo serios problemas con el contraste aquí. Alegre y juguetón, pero problemático no obstante.

interfaz de sitio web de estilo retro con marcados contrastes rojos y verdes
Ejemplo C

Navegación

La navegación, como cualquier diseño accesible, tiene componentes tanto visuales como invisibles. Debajo del capó, hay anuncios de navegación claros para dispositivos de asistencia y un diseño visual. Use un diseño de navegación regular y encabezados claros para los menús.

Este es un sitio magníficamente diseñado – estilo Basquiat de medios mixtos, fusionado con nuevo brutalismo. Paralaje multinivel con detección lúdica. Pero navegación borrosa, movimiento excesivo y problemas de legibilidad desafiar múltiples reglas de accesibilidad.

sitio web de estilo grunge parallax con navegación compleja
Ejemplo D

Otro ejemplo de estados de inducción creativos pero abruptos. Dirección de navegación poco clara y sin mucho contexto. Hipercreativo, pero rompiendo las reglas disponibles.

sitio web con navegación basada en tipografía grande y negrita
Ejemplo C
Previous post Cómo aprovechar Amazon Prime Day para aumentar las ventas [Podcast]
Next post 6 respuestas a las preguntas de SEO que los principiantes temen

Deja una respuesta