Hacer una buena primera impresión es una parte vital del diseño del sitio web. La página de inicio suele ser la primera experiencia que un usuario tiene con un negocio u organización y un diseño llamativo puede ayudar a crear interés. Las tendencias de este mes se centran en elementos de diseño de página de inicio que son un poco diferentes de lo que los usuarios están acostumbrados a ver.

Desde una tendencia puramente estética en encabezados héroes poco profundos y diseños de esquina en diagonal hasta una tendencia de interacción del usuario en esta o aquella llamada a la acción, hay muchas formas interesantes de llamar la atención de los usuarios.

Esto es lo que está en tendencia en el diseño este mes:

1. Jefes de héroe poco profundos

Durante un tiempo, la tendencia con las imágenes de héroe ha sido que las imágenes y videos en negrita y grandes llenan la pantalla, a menudo desde la parte superior de la página de inicio a la derecha donde comienza el desplazamiento. Más diseños están comenzando a alejarse de esta tendencia de imagen sobredimensionada para imágenes de héroe más superficiales.

Gran parte del diseño sigue siendo el mismo. Los encabezados de héroe aún incluyen buenas imágenes o texto con una configuración hecha para ser vista. Pero las imágenes son aproximadamente la mitad de profundas.

Lo bueno de este concepto es que ayuda a mover otra información en la pantalla. La copia del cuerpo y las llamadas a la acción que no están en la imagen del héroe aparecen más arriba en el diseño, dando a los usuarios algo que hacer o hacer clic de inmediato. Puede ayudar a evitar el desorden en la imagen en sí, lo que puede ser muy importante si la imagen está ocupada o es difícil emparejar el texto con eficacia.

Este patrón de diseño también puede agregar más espacio en blanco al diseño general, haciendo que se sienta más ligero y fácil de navegar. Con estilos más minimalistas aún populares, este concepto podría ser uno de los factores que está impulsando esta decisión de diseño.

La parte más difícil de usar una imagen de héroe más superficial es cortar. Es una de esas cosas en las que querrá pensar al principio del proceso de diseño, desde el momento en que habla con el fotógrafo sobre las imágenes. Debido a que la forma no es estándar, es posible que deba explicar cómo planea usar la imagen para obtener una foto o video que se vea bien con esa relación de aspecto.

munk
camioneta
euro

2. Diseños de esquina diagonal

Algunas tendencias son demasiado divertidas para ignorarlas. Los diseños de esquina diagonal son uno de esos conceptos.

Estos diseños están ejemplificados por elementos que se agrupan en una esquina de la pantalla, a menudo en la parte inferior derecha, y se extienden en abanico sobre el resto del lienzo. Los elementos a menudo se colocan para parecer como si estuvieran estallando en el diseño.

Los diseños de esquina diagonal proporcionan un patrón de seguimiento de ojos diferente para los usuarios al crear un punto focal en la esquina inferior de un diseño en lugar de la parte superior izquierda o central y crear profundidad con la idea de elementos que parecen "explotar" en la pantalla. (Para una patada adicional al diseño, considere animar elementos para mejorar ese efecto de explosión con movimiento a medida que el usuario se desplaza o se desplaza sobre elementos específicos).

Para sacar el máximo provecho de estos elementos, muchos diseños "ocultan" más elementos debajo del rollo para agregar ese elemento extra de realidad, de modo que las partes del diseño que no se ven se sientan táctiles y existan en el rollo.

Si bien este tipo de patrón de diseño no funciona con todo tipo de contenido, puede ser una buena idea para diseños que no tienen muchos otros diseños y usan muchos elementos de interfaz de usuario para llamar la atención. También puede funcionar para diseños tipo cartera o servir como una forma de organizar muchos elementos visuales más pequeños en una sola unidad.

raya
api
Bain

3. Esto o eso llama a la acción

Casi todos los diseños de sitios web incluyen algún tipo de llamado a la acción. Ya sea que se trate de un formulario para completar, un enlace para hacer clic o una dirección para seguir desplazándose en busca de más contenido, se le solicita al usuario que haga algo. (Y a menudo reciben algo más como recompensa por ese esfuerzo).

Más diseños están comenzando a surgir con llamadas a las acciones de reflejo, que permiten a los usuarios hacer una elección desde la página de inicio mientras deciden qué hacer a continuación. El diseño podría verse de varias maneras, como el directo , ¿engañarías o no harías preguntas? Las palabras hieren a la opción de dos paneles de Stoli a la navegación con opción de clic para Hola Pointe Drive In .

Este estilo de diseño les da a los usuarios control sobre lo que quieren hacer y ver, que puede ser atractivo con la combinación correcta de contenido y opciones. Los tres ejemplos siguientes hacen un gran trabajo al enmarcar lo que el usuario puede hacer y lo que sucederá. (También hay salidas si el usuario hace una elección incorrecta y necesita regresar).

El desafío aquí es que necesita el tipo correcto de contenido para que este patrón de diseño funcione. Algunos usuarios pueden verse abrumados por múltiples opciones y solo desean una única llamada a la acción con una sola opción: completar la acción o no. Aquí, los usuarios tienen el doble de opciones para considerar. Para aprovechar al máximo las elecciones, el contenido debe ser totalmente atractivo.

engañar
stoli
Hola

Conclusión

A diferencia de algunas de las otras tendencias que hemos explorado recientemente, las tendencias de este mes son elementos visuales puros que puede agregar a un diseño existente sobre la marcha. (Aunque podrías acercarte si tienes suerte).

Estos esquemas de diseño dependen un poco más de la planificación del contenido y el diseño para que coincida, sabiendo que tiene un cierto concepto en mente. Requiere planificación previa y, en algunos casos, incluso requiere un poco de magia HTML o CSS para unir todo.

¿Qué tendencias estás amando (u odiando) en este momento? Me encantaría ver algunos de los sitios web con los que está fascinado. Déjame un enlace en Twitter ; Me encantaría saber de ti.