¿Qué es?
La alineación se refiere a la colocación de los elementos de manera que sus lados o sus centros coincidan respecto a un eje. Este eje de alineación suele ser:
- Horizontal, de manera que los elementos forman una fila.
- Vertical, de manera que los elementos forman una columna.
En esta litografía de finales del siglo XIX, los elementos se alinean respecto a un eje horizontal, formando filas.
Fuente: https://commons.wikimedia.org/wiki/File:The_basic_elements_of_phrenology,_physiognomy_and_palmistry_Wellcome_L0074425.jpg.
Diseño de la portada del primer ejemplar de The New York Times. El contenido se ordena en columnas.
Fuente: https://upload.wikimedia.org/wikipedia/commons/8/86/The_New-York_Daily_Times_first_issue.jpg.
Las alineaciones vertical y horizontal son las más frecuentes, pero en algunas ocasiones encontramos alineaciones basadas en otras formas, como las diagonales, en espiral, irregulares… Las posibilidades son infinitas, dependiendo de los objetivos del diseñador.
Cartel de Alexander Ródchenko para El acorazado Potemkin (1925), que alinea los elementos a lo largo de ejes diagonales.
Fuente: https://c2.staticflickr.com/6/5528/12308077373_d93df0de22_b.jpg.
Implicaciones en el diseño de interfaces
En diseño de interfaces es muy recomendable trabajar con retículas, que facilitan la alineación de los elementos incluso cuando un mismo documento es accesible desde diferentes dispositivos.
Ejemplo de retícula para página web
Fuente: https://c1.staticflickr.com/4/3721/8905035966_fd79c66465_b.jpg.
La alineación en interfaces gráficas debe ser pixel perfect: es decir, los lados o los centros de los elementos deben coincidir a nivel de píxel. Cualquier irregularidad será visible para el usuario como un problema de diseño.
Por otra parte, respecto al texto en pantalla, la alineación a la izquierda es la más legible, ya que mantiene un punto de referencia fijo como inicio de línea y facilita el escaneado visual.
Alineación izquierda para el texto de una interfaz
Fuente: https://upload.wikimedia.org/wikipedia/commons/2/2e/Failed_login_attempt_notification_on_a_different_wiki.png.
Las alineaciones centrada y a la derecha se reservan para textos breves que tengan funciones específicas. Por ejemplo, la alineación centrada suele corresponder a títulos o elementos sobre los que se quiera atraer la atención de manera especial.