¿Debo colocar el borde encima o debajo del encabezado para separar las secciones?

Si el contenido está dividido en varias secciones y cada sección tiene un encabezado, ¿debería colocar un borde debajo o encima del encabezado?

El enfoque de "borde inferior" parece prevalecer (consulte Google, Wikipedia), pero "borde superior" parece funcionar mejor como separador. ¿Cuál es el camino a seguir?

Borde arriba

ingrese la descripción de la imagen aquí

Borde Abajo

ingrese la descripción de la imagen aquí

Respuestas (3)

La razón por la que tiene dificultades para decidir cuál usar es que los títulos de las secciones están demasiado alejados del contenido. Un espacio más grande = separación, un espacio más cercano = asociación, pero debe haber suficiente diferencia entre "más grande" y "más cerca" para que quede claro a la vista cuál es cuál. Aquí, la agrupación de información y la agrupación visual están en conflicto.

Puede ver el problema si elimina la regla por completo. El encabezado está casi exactamente a la mitad del camino entre el contenido de arriba y el de abajo. Entonces el encabezado se vuelve ambiguo; se asocia igualmente con lo que está arriba y lo que está abajo. (Esto es más fácil de ver si usa caracteres aleatorios en lugar de los encabezados reales, para que los significados de las palabras no lo cieguen a la presentación puramente visual).

El espaciado visual debe ser paralelo a la estructura de la información. Si usa Borde inferior, reduzca el espacio por encima y por debajo del borde a aproximadamente un tercio de su cantidad actual, y el diseño encajará en su lugar. Para Borde superior, reduzca el espacio debajo del borde y entre el encabezado y el contenido.

De cualquier manera, la agrupación visual y la agrupación de información coincidirán, y su diseño funcionará. La regla (borde) aquí es un elemento decorativo, no un separador de datos como podría ser en una tabla o una hoja de cálculo.

Personalmente creo que en este caso encima del encabezado..

Razón: Mantiene tu pensamiento completo. El título y las imágenes se agrupan y se mantienen como un pensamiento completo

Realmente depende de con qué desea que se asocie el título. Si son las imágenes de arriba, bordea abajo. Si son las imágenes de abajo, bordea arriba.

El borde sirve como divisor de contenido. Si lo coloca debajo, está dividiendo claramente el título de los elementos debajo de él.

Una tercera/cuarta opción tanto arriba como abajo, o ningún borde, separaría el título sin asociarlo directamente con ningún contenido vecino.

"Si lo coloca debajo, está dividiendo claramente el título de los elementos debajo de él". Pero, ¿qué pasa con Wikipedia colocando el borde debajo de los encabezados? ¿O es este un caso diferente porque es texto?
Wikipedia está dividiendo páginas de texto. Con el texto, la división no es tan prominente. Sin embargo, los bordes debajo de los títulos no funcionarían en Wikipedia si estuvieran dividiendo miniaturas de imágenes. Habría el mismo problema al que te enfrentas.
¿Debo colocar el borde encima o debajo del encabezado para separar las secciones?
RespuestasAquíPolítica de privacidad1y, 0v