Marian Middle School

Los menús del sitio antiguo seguían los departamentos internos de la escuela, no la forma en que cada tipo de visitante piensa en Marian. Los caminos más importantes estaban enterrados: inscribirse, inscribirse como voluntario, asistir a un evento. Nada en una página destacaba sobre lo demás.

Los buenos resultados de la escuela ni siquiera estaban en el sitio, aunque las familias que piensan en la universidad quieren verlos primero. Y la única forma de participar era un botón Donate, sin nada para quien quisiera dar su tiempo o asistir a un evento.

Empecé con una auditoría de la arquitectura de la información, que es cómo se organizan las páginas y los menús de un sitio, como el plano de un edificio. Recorrí cada página del sitio antiguo y me pregunté, para cada tipo de visitante, qué venía a hacer realmente. Esa respuesta fijó la estructura y todo lo que vino después.

Nadie entrevistó ni encuestó a los visitantes. La mayor parte de lo que sostenía el diseño eran creencias, y el registro de abajo dice cuáles se comprobaron y cuáles no. La única regla firme, que cada tarea clave estuviera a no más de dos clics de cualquier página, se acordó antes de empezar el diseño.

Seis secciones con forma de departamentos escolares se convirtieron en cinco pensadas para los visitantes: About Us, Admission, News & Events, Get Involved y Donate. Get Involved ocupó el lugar que antes tenían solo las donaciones: está junto a Donate, al final del menú principal a la derecha, siempre a la vista, para que el voluntariado y los eventos lleguen al mismo público amplio que las donaciones. Lo que salió del menú principal, como el calendario y los enlaces de contacto, pasó a un nuevo pie de página de cuatro columnas.

La página de inicio muestra tres botones grandes antes de desplazarse, y los resultados de la escuela pasaron de un folleto impreso para padres nuevos a la página de inicio. Los cinco valores de la escuela recibieron una pestaña cada uno, con la fe en primer lugar. Para la comunidad, se creó una sección de eventos en torno a una cuenta regresiva en vivo para actividades de recaudación como Girls Night Out, con una suscripción por correo de un solo campo debajo.

El verde azulado era el color de los elementos en los que se puede hacer clic, y el tono por defecto salió publicado con un contraste de 2.45 a 1 sobre blanco. Es demasiado claro para cumplir el mínimo de accesibilidad para el texto de los enlaces y las etiquetas de los botones. El tono más oscuro, que cumple con 5.08 a 1, se quedó sin usar salvo al pasar el cursor.

El sistema de color era real, pero nada lo comprobaba. Nada medía el contraste ni si los espacios se mantenían en la retícula, así que también se colaron pequeños espacios fuera de la retícula procedentes del framework. Todavía se pueden ver ambos errores en la hoja de estilos del sitio una década después. Hoy haría del tono oscuro el color en reposo y lo oscurecería aún más al pasar el cursor.

Antes del lanzamiento, comprobé cada elemento del menú frente al mapa del sitio, y todas las tareas clave quedaron a dos clics como máximo. Fue una comprobación sobre el papel, no una prueba con visitantes. Nadie configuró analíticas después del lanzamiento, así que no puedo decir si se inscribieron más familias o si la gente donó más. El 87%, el 96% y el 84% son cifras publicadas por la propia escuela; el rediseño las puso donde las familias pudieran verlas, no las creó.

La estructura sí perduró. Nueve años y un rediseño completo después, el Internet Archive muestra siete elementos de About Us que siguen en el mismo orden desde 2017.