Muse CC práctico: Diseño de landing page

Verificación inicial de elementos de la landing page

¡Prueba gratis durante 10 días

nuestros 1218 cursos !

Prueba gratis Mostrar modalidades de suscripción
En este video hacemos una verificación del comportamiento de los elementos que hacen parte de la landing page respecto al tamaño fluido de nuestro sitio web y posteriormente hacemos algunos ajustes necesarios.
02:20

Transcripción

Vamos a empezar el proceso para hacer que nuestra "landing page" sea "responsive". Sin embargo, antes de iniciar ese proceso yo quiero ver cuál es el comportamiento de estos elementos, teniendo en cuenta que el ancho de nuestro sitio web es flexible. Para eso voy a tomar este manejador, hago un clic sostenido, arrastro y observen lo que está ocurriendo. Hay dos cosas que no me gustan. Primero, el formulario de contacto, como no es flexible, su tamaño es estático, entonces se queda en una posición fija e incluso, miren, se sale hacia la parte derecha. Y por otra parte, los logos que tenemos en la parte inferior escalan, pero yo preferiría que no escalaran. Vamos entonces a hacer lo siguiente: voy a seleccionar el formulario de contacto y en el panel Transformar, en el área Fijar a la página, voy hacer clic en el punto derecho. Vamos a mirar el comportamiento cuando activo esa función. Mucho mejor, ¿verdad? Y ahora voy a seleccionar estos elementos y en el panel Transformar, en el área Cambiar tamaño, voy a hacer un clic y selecciono la opción Ninguno. Es decir, que la escala de estos elementos no se va a realizar cuando cambie el tamaño de la ventana del navegador. Verifiquemos. Como pueden observar, el tamaño se mantiene, pero los elementos empiezan a desplazarse. Miren cómo está centrado, presten atención por ejemplo al ícono de la parte del medio. Observen cómo la alineación se pierde. Entonces, para evitar eso, vamos a seleccionar estos tres elementos, los vamos a agrupar y después de agruparlos, en el panel Transformar, en el área Fijar a página voy a marcar la opción del medio. Vamos a ver qué está ocurriendo y los elementos no se escalan, pero tampoco se desplazan, por lo tanto están manteniendo su alineación hacia el centro.

Muse CC práctico: Diseño de landing page

Lleva a la práctica tus conocimientos de Adobe Muse CC con este ejemplo sobre la creación de una landing page con comportamiento responsive y correctamente estructurada.

47 min (15 Videos)
Actualmente no hay comentarios.
 

Este curso video2brain está disponible como descarga y para ser visualizado online. ¡Pero no hace falta que decidas entre las dos opciones! Al comprar el curso, disfrutarás de ambas posibilidades.

La descarga te permite ver las lecciones sin estar conectado/a a internet y supone una navegación fácil y ágil entre capítulo y capítulo. Si vas a trabajar en diferentes ordenadores o si no quieres descargarte el curso completo, entra en la web con tus datos de acceso y disfruta directamente de tus vídeos online. Te deseamos que disfrutes de este curso y te resulte de mucha utilidad.

Estamos a tu disposición si tienes cualquier tipo de duda o pregunta.