Cómo crear un sitio web de desplazamiento horizontal con plantillas de formato

¿Te preguntas cómo crear un sitio web de desplazamiento horizontal para tu portafolio creativo utilizando las plantillas de Format? Aquí tiene un montón de ejemplos que puede empezar a utilizar hoy mismo.

pexels cottonbro 5054213

Tanto si acabas de empezar tu carrera creativa como si quieres renovar tu presencia en Internet, es imprescindible crear un sitio web que te permita mostrar tu trabajo de forma atractiva y fácil de navegar. Puesto que tu sitio web es como un estudio digital o un escaparate, es importante que destaque.

Una forma segura de hacer que su sitio web sea memorable es optar por un sitio web de desplazamiento horizontal de una página. Aunque un portafolio horizontal o un sitio web de desplazamiento lateral no siempre se ha considerado la mejor práctica desde el punto de vista de la experiencia del usuario, ha recorrido un largo camino y ofrece una forma única de mostrar tu trabajo, especialmente cuando tu portafolio se ve en un dispositivo móvil.

¿Preocupado por cómo hacer un sitio web de desplazamiento horizontal? La buena noticia es que no tiene de qué preocuparse.

Elija una plantilla de desplazamiento horizontal que haga el trabajo por usted. Al utilizar una plantilla de desplazamiento horizontal bien diseñada, puedes estar seguro de que el diseño de tu web no sacrifica la experiencia del usuario, por lo que este se quedará (¡y con suerte se convertirá en un cliente de pago!).

¿Qué es el desplazamiento horizontal?

El desplazamiento horizontal se refiere a un estilo de navegación de sitios web en el que puede desplazarse de lado a lado, apareciendo el contenido a medida que se desplaza horizontalmente. Es una alternativa o complemento al estilo de navegación más utilizado, el desplazamiento vertical.

Los sitios web con desplazamiento de izquierda a derecha que ofrecen una galería de desplazamiento horizontal son más intuitivos que las experiencias móviles con una sola mano.

Aunque cualquier buen diseñador web le dirá que no debe sacrificar la usabilidad en aras de la novedad, la posibilidad de desplazarse horizontalmente puede ofrecer una gran experiencia al usuario, especialmente cuando se trata de sitios web de portafolios en los que las fotos deben mostrarse de forma destacada.

la mano en el trackpad del MacBook

Si se está preguntando si el estilo de sitio web de desplazamiento horizontal es el adecuado para su portafolio, puede tener en cuenta estas ventajas a la hora de elegir una plantilla.

1) Es coherente en los distintos dispositivos.

Cuando se trata de diseño web, el desplazamiento horizontal es más que una moda. Cada vez más personas acceden a Internet desde sus teléfonos en lugar de desde ordenadores de sobremesa, por lo que adoptar páginas de desplazamiento horizontal se está convirtiendo en un movimiento de diseño más intuitivo: no va a ir a ninguna parte.

Aunque el desplazamiento vertical es la forma más habitual de navegar por un sitio web, la manera en que muchos navegamos por Internet ha cambiado mucho en la última década.

Por ejemplo, si hace 10 años visitaba un sitio web, lo más probable es que lo hiciera desde un ordenador de sobremesa o portátil. Hoy en día, mucho más tráfico web proviene de dispositivos móviles y tabletas.

Esto significa que, para seguir el ritmo del comportamiento de los usuarios, las páginas web tienen que ser responsivas.

A menudo, la versión móvil de un sitio creado para ordenadores de sobremesa fuerza el contenido a lo largo de toda la página, por lo que los visitantes tienen que desplazarse mucho para encontrar lo que buscan. Los sitios web horizontales tienen la ventaja de que el contenido se desplaza menos en los distintos dispositivos.

2) Las imágenes de desplazamiento horizontal permiten utilizar toda la anchura de la pantalla.

Un diseño de sitio web más estándar suele tener un menú de navegación en un lado de la página, lo que limita el área donde los sitios muestran sus fotos. Con un sitio web de desplazamiento lateral, puedes llenar la página con una imagen o incluso desbordarla horizontalmente.

Este desplazamiento horizontal de la galería es perfecto para fotógrafos de naturaleza, arquitectos y diseñadores de interiores, donde los detalles de las fotos de gran tamaño pueden destacar realmente en una pantalla más pequeña.

3) Puede ser una opción de diseño más ordenada si muestras muchas fotos.

Si desea incluir toneladas de contenido en sus sitios, pero quiere evitar una página abarrotada, crear un contenedor de galería para cada sección de su portafolio significa que los usuarios pueden desplazarse verticalmente para acceder a las diferentes secciones, y luego horizontalmente para ver el contenido de la sección.

De este modo, su sitio web de portafolio puede tener un aspecto elegante sin dejar de mostrar un gran número de fotos.

¿Cómo crear un sitio web de desplazamiento horizontal?

Aunque puede escribir código personalizado para que su sitio o algunos de sus elementos se desplacen horizontalmente, puede resultar una tarea complicada. Esto se debe a que HTML se presta más intuitivamente a los diseños de desplazamiento vertical. Y si no entiendes de lenguajes informáticos, puede que necesites contratar a alguien que sí lo haga, como un diseñador o un desarrollador web.

Por suerte, ya no tienes que preocuparte por cómo crear un sitio web de desplazamiento horizontal desde cero.

La mejor manera de conseguir el desplazamiento horizontal en su sitio web es utilizar un creador de sitios web que ofrece plantillas de sitios web de desplazamiento horizontal. De esta manera, puede evitar fallos y la errores comunes que pueden dificultar el uso de este estilo de navegación.

Aunque puedes encontrar tutoriales y ejemplos de sitios web de desplazamiento horizontal en línea utilizando la propiedad overflow x de CSS, incluso un profesional del desarrollo web puede preferir optar por una plantilla personalizable en lugar de empezar desde cero utilizando HTML u otro código. Los creadores de sitios web permiten a cualquiera crear rápidamente un sitio y personalizarlo con tipografía, colores y elementos de marca.

Cuando haya terminado con sus personalizaciones, será un sitio web completamente único.

Si creas tu propia navegación horizontal, debes tener en cuenta que es importante que el usuario sepa que debe desplazarse de un lado a otro. Una forma eficaz de hacerlo es dejar un poco del siguiente contenido asomando por el lateral.

Otra consideración es que una barra de desplazamiento no es la mejor manera de navegar horizontalmente. Pueden ser molestas de usar, especialmente sin una rueda de ratón. Una alternativa a las barras de desplazamiento que resulta más intuitiva sería algo como los botones de flecha y, por supuesto, el desplazamiento con dos dedos.

17 plantillas de desplazamiento horizontal para que tu fotografía destaque

Ahora que ya sabes por qué este estilo de navegación marca la diferencia en tu sitio web de portafolio, ponlo en marcha con una de estas plantillas. Encontrarás impresionantes ejemplos de desplazamiento horizontal, independientemente del tipo de fotografía que hagas.

Hemos recopilado una lista de los mejores plantillas de desplazamiento horizontal para que se inspire en lo que puede conseguir con su sitio web.

Formato Plantilla Web Reel

El diseño permite desplazarse por la página de inicio de izquierda a derecha con dos dedos, saltándose la barra de desplazamiento y evocando el aspecto de una tira de película. Puedes hacer que cada imagen de la página de inicio sea un botón que enlace a una colección, lo que facilita enormemente la organización de tus fotos por proyecto o tema.

Formato Plantilla Web Vantage

Vantage

Vantage se diseñó con fotógrafos inmobiliarios y videógrafos en mente. Sin embargo, cualquiera que trabaje en videografía encontrará que este tema es perfecto para mostrar secuencias.

Incluso si no grabas vídeo, apreciarás la visualización de imágenes a sangre completa. Puede superponer el texto que desee sobre la imagen de fondo de la página de destino para conseguir un aspecto profesional. Si quieres que sea muy fácil para los clientes ver tu contenido, aprender sobre ti y tu negocio, y escribir mensajes que aterricen directamente en su bandeja de entrada, Vantage es una gran opción que marca todas estas casillas para sitios hermosos.

Formato Plantilla Web Skyline

Las fotos a todo color se ven perfectamente en cualquier navegador, y la navegación a la izquierda facilita el acceso a las distintas páginas de la cartera, como proyectos específicos, una imprenta y una página sobre la empresa. Verás que cuando empiezas a desplazarte, el menú se mantiene pero se vuelve más transparente, de modo que la imagen puede llegar hasta el borde.

Formato Plantilla Web Panorama

Si te gusta Skyline pero prefieres un menú de cabecera y un tema más ligero y sencillo, Panorama es tu elección. Deja que tus imágenes hablen por ti, y cualquier página adicional que quieras añadir se puede acceder fácilmente desde la cabecera.

Formato Plantilla Web Brillo

Gloss es una excelente opción si esto te suena a lo que podrías necesitar para tu propio sitio web de portafolio. Limpio y contemporáneo, Gloss facilita la adición de leyendas en las que se puede hacer clic en las fotos de la página de inicio, que llevan al usuario a más contenido de esa sesión o colección.

Formato Plantilla Web Obsidian

Obsidian se ha creado pensando en los mejores artistas y tiene un aspecto estupendo incluso si las fotos de tu portafolio no combinan a la perfección.

Con Obsidian, no tienes que preocuparte tanto de que todas tus imágenes se carguen con la misma relación de aspecto, ya que la variación en el espacio en blanco a medida que los usuarios se desplazan horizontalmente es parte del encanto y da a Obsidian una agradable sensación de collage independientemente del navegador que se esté utilizando.

Formato Plantilla Web Reflexión

Reflection es una opción fantástica si necesita incluir algo más que imágenes en su página web para transmitir realmente una historia a su público. Puede utilizarse para crear un sitio web de desplazamiento horizontal de una página que combine el desplazamiento horizontal con el vertical. En la parte superior, muestre sus mejores fotos en una sección horizontal. Luego, a medida que se desplaza hacia abajo, añada secciones para testimonios y descripciones de sus servicios.

Esta plantilla tiene en cuenta que, para algunos fotógrafos, es importante que los clientes potenciales puedan acceder rápidamente al tipo de información que puedan necesitar antes de ponerse en contacto con usted. Con Reflection, puedes estar seguro de que tu sitio web es a la vez bonito e informativo.

Formato Plantilla Web Meridian

Prueba el tema Meridian, limpio y sencillo, que está diseñado para este tipo de fotos, manteniendo el menú horizontal a la vista para que tus clientes potenciales no tengan problemas para navegar por el sitio y enviar consultas que aterrizarán en tu bandeja de entrada. También es una opción perfecta para carteras de diseño de todas las tendencias.

Formato Plantilla Web Horizon

El poco espacio en blanco entre las imágenes les da un poco de espacio para respirar, por lo que incluso si disparas contra un montón de fondos de diferentes colores todavía puedes mostrar tus fotos una al lado de la otra sin que choquen en este diseño. Horizon es un excelente tema polivalente que se adapta a todo tipo de creativos y que se puede personalizar con tu tipografía y elementos de marca. Tanto si eres un fotógrafo de bodas como un fotógrafo comercial, Horizon es uno de los mejores plantillas web para cualquier profesión.

Formato Plantilla Web Horizonte Izquierda
Formato Plantilla Web Medium

Esta sería una gran opción para un fotoperiodista o cualquier fotógrafo o artista que quiera aportar algo de contexto a cada conjunto de imágenes.

Formato Plantilla Web Editorial
Formato Plantilla Web Crepúsculo

Una característica interesante son los enlaces a proyectos específicos, que superponen los detalles del proyecto sobre una imagen de fondo de ese conjunto de fotos. Aumenta o disminuye el tamaño de la fuente para cambiar el aspecto general de esta sección.

Formato Plantilla Web Beacon
Formato Plantilla Web Coral
Formato Plantilla Web Illuminate
Formato Plantilla Web Converge

Empiece con su sitio web de desplazamiento horizontal

Con tantos temas de desplazamiento horizontal entre los que elegir, seguro que encuentras uno que hará realidad tus sueños.

Ahora que ya sabes cómo construir un sitio web de desplazamiento utilizando una plantilla, puedes empezar con el tuyo propio.

Recuerda que todos estos temas son totalmente personalizables, por lo que incluso si no tienes experiencia en desarrollo web puedes hacer que sean totalmente personalizados y que se vean genial en cualquier navegador.

Colaborar con los clientes también es fácil con el uso de galerías de pruebas de clientes, y mediante el uso de un constructor de sitios web puede estar seguro de que sus datos de usuario se mantienen a salvo también.

El desplazamiento horizontal es una gran característica para los sitios web que son inolvidables. Sáltate el javascript, el CSS y el código, y pon en marcha tu sitio de portafolio único en un abrir y cerrar de ojos con las plantillas Format.

Pruebe una plantilla de sitio web horizontal gratis, sin necesidad de descargas.

Puede crear su sitio web de portafolio con una prueba gratuita de 14 días utilizando Format sin necesidad de tarjeta de crédito: ¡estamos deseando ver lo que crea!

¿Quiere más consejos para hacer brillar su cartera? Siga leyendo.

Actualiza tu cartera: 6 consejos para hacer limpieza de primavera en tu carrera y tu cartera

Nuestra lista de inspiración definitiva

Cómo hacer un portafolio de fotografía para el colegio y la universidad

Colaborador

  • icono negro

    En Format, somos un grupo de personas apasionadas en la intersección de la tecnología y la creatividad, unidas por un propósito: ayudar a los fotógrafos a tener éxito. Nuestro equipo se dedica a proporcionar a los fotógrafos y artistas creativos las herramientas y recursos que necesitan para compartir su trabajo y hacer crecer sus negocios.

A4 1 4

Libera tu potencial creativo

Eleva tu trabajo creativo con nuestro exclusivo paquete de inicio. Accede a conocimientos, herramientas y estrategias de valor incalculable para perfeccionar tu arte, mejorar tus habilidades, crear un impresionante portafolio online y avanzar en tu trayectoria profesional.

Nombre(Obligatorio)
Suscríbase al boletín Etiqueta de campo
es_ESES