NO CONSIGO QUE MI WEB SEA RESPONSIVE EN TODOS LOS TAMAÑOS DE PANTALLA

  • NO CONSIGO QUE MI WEB SEA RESPONSIVE EN TODOS LOS TAMAÑOS DE PANTALLA

    Discusión creada por Gonzalo Furió el 6 de diciembre de 2023 en 1:27 PM

    Muy buenas, ¿ todo bien?, espero que sí.

    Estoy intentando que mi web (www.gonzalofurio.com) diseñada con Divi se adapte a diferentes tamaños de pantalla (sea responsive al 100%). Sin embargo, a pesar de haberla adaptado con el modo responsive que ofrece Divi por defecto, todavía hay determinados tamaños de pantalla en los que mi diseño presenta fallos.

    PREGUNTAS :

    1. He estado leyendo tu artículo “Como agregar custom MEDIA QUERIES CSS en Divi” en el que hablas sobre Media Queries , reglas CSS , puntos de quiebre y el inspector de elementos pero tengo algunas dudas que no termino de entender, te explico mejor en vídeo: https://www.loom.com/share/4ae84a96da9746f597599a75753541b8

    2. ¿Ofreces algún pack de consultorías particulares o soporte de algún tipo para revisar mi diseño web Divi?. Antes de nada, me gustaría comprobar si mi diseño falla porque el responsive de Divi es “imperfecto” y necesita “Media Queries CSS” o porque estoy cometiendo algún error básico de diseño en Divi (o ambos xd). Te dejo un vídeo de cómo está diseñada mi home por dentro de Divi para que puedas ver mejor: https://www.loom.com/share/88954d31f9dd40f69b056fcc0b45a413

    3. En caso de que mi problema responsive se deba a que Divi es imperfecto en algunos tamaños de pantalla, ¿Podrías orientarme sobre cuál de tus cursos me conviene más sobre este tema y en qué orden realizarlos teniendo en cuenta que NO tengo nociones de HTML, CSS ni sé manejar el inspector de elementos de chrome?.

    Jefferson Maldonado ha respondido hace 10 meses 2 Miembros · 5 Respuestas
  • 5 Respuestas
  • Jefferson Maldonado

    organizador
    6 de diciembre de 2023 en 6:29 PM

    Hola Gonzalo, un gusto saludarte y en hora buena por tu sitio web, va quedando genial 😊🖐

    Antes que nada, permíteme expresarte mis más sinceras felicitaciones por los avances que has logrado con tu página web, y agradezco enormemente tus amables palabras.

    Respecto a las inquietudes que planteas:

    1. Punto de Quiebre de Divi

    Pero, ¿sabes? Sería genial si lo aumentas a 1024 px para que tu sitio se vea aún mejor en pantallas más pequeñas. Te cuento un secreto: el plugin Divi Responsive Helper es un salvavidas en estos casos. Te simplifica todo el rollo de las medias queries y hace que todo sea más fácil. Te invito a echar un vistazo a nuestro curso sobre este plugin, te va a encantar: https://uxdivi.com/cursos/curso-de-ajustes-en-movil-y-responsive-divi

    2. Estructura del sitio web

    Al echar un vistazo a tu sitio, me di cuenta de que en la primera fila tienes dos columnas, pero una está vacía. Eso está desequilibrando tu diseño. Si la quitas, ¡vas a ver un cambio impresionante! Y sobre el ancho de las filas, mi consejo es usar un 100% para la primera columna, y luego jugar con el ancho de la segunda entre 60% y 80%, según lo que prefieras.

    En móviles, lo ideal es 100% para la primera y entre 80% y 90% para la segunda. ¡Vas a ver qué bien queda! Dejo acá un contenido donde hacemos referencia a esto: https://uxdivi.com/blog/configurar-el-ancho-de-contenido-ideal-en-dispositivos-moviles-en-divi
    Y también revisa este contenido: https://uxdivi.com/tutoriales-premium/como-ajustar-correctamente-todo-el-diseno-de-divi-en-movil

    3. Consultoría personalizada

    Y si lo que buscas es una ayuda más personalizada para pulir tu diseño web, ¡aquí estoy para lo que necesites! Puedes contratar este servicio directamente en este enlace: https://muxstudio.com/servicios/consultoria-web-o-ux/

    Espero que estos consejos te sean útiles y te ayuden a llevar tu sitio web a otro nivel.

    Cordialmente, Jeff.

  • Gonzalo Furió

    Miembro
    11 de diciembre de 2023 en 10:04 AM

    He quitado la columna que estaba vacía y he seguido tu consejo de establecer el ancho de las filas en 100% e ir jugando con el otro ancho de fila como me dijiste. Pero mi diseño sigue viéndose mal en dimensiones de escritorio más estrechas cómo 981px. Yo trabajo desde un monitor alargado de 1920px x 1080px pero es imposible hacer que se vea bien en ambas dimensiones de pantalla, o se ve bien en una o en otra, pero nunca en ambas. Adjunto vídeo: https://www.loom.com/share/c00bcecf2aa44000a99746181ff5b43a

    • Jefferson Maldonado

      organizador
      11 de diciembre de 2023 en 12:48 PM

      Hola Gonzalo, un gusto saludarte.

      Entiendo tu frustración, mira, con el objetivo de poder ayudarte, he grabado un loom rápido explicándote más o menos lo que necesitas hacer para lograrlo.

      Te dejo acá el enlace: https://www.loom.com/share/b280d98497d646b7bece51967c07b92d?sid=23b09658-ffec-4c7b-8ad1-db23f226972d

      En general, en el video te comentó como ajustar los tamaños de las filas para que sean estándar en todas las páginas, además de revisar por completo el punto de quiebre del sitio y usar diferentes tipos de filas para lograr que el texto quede ajustado en diferentes tamaños de pantalla.

      Por otro lado, los problemas de diseño que tienes en general se dan por malas prácticas de maquetación y vi en otras páginas de tu sitio que no se mantiene de forma estándar los tamaños.

      En este punto, lo más útil sería que puedas agendar una consultoría personalizada conmigo acá: https://muxstudio.com/servicios/consultoria-web-o-ux/

      En una hora podríamos abarcar muchas recomendaciones que puedes hacer para mejorar tu sitio en general.

      Espero haberte ayudado, te envío un abrazo 😊🖐

      • Gonzalo Furió

        Miembro
        12 de diciembre de 2023 en 4:34 AM

        No solo eres un grandísimo profesor, también eres una grandísima persona. MIL GRACIAS Jefferson !!. Te contesto en vídeo:

        https://www.loom.com/share/6bf8ebcbf39249c5a202d6bc47517a36

        • Jefferson Maldonado

          organizador
          12 de diciembre de 2023 en 10:47 AM

          Agradezco tus comentarios Gonzalo, estamos acá para ayudar en todo lo que podamos y nos hace feliz hacerlo 😊🖐
          Vale, no se alcanza a ver bien en el video, pero en efecto, todo se ve más pequeñito, lo que me hace pensar que esa ventana del navegador la tienes con algún tipo de Zoom en Chrome (el navegador como tal)

          ¿Puedes verificar que no sea eso? Una forma de hacerlo es abrir la web en otro navegador diferente, como Edge o Safari en caso de Mac.

          Espero que esta info te sea de ayuda. Para cualquier otra cosa, aquí me tienes 😉🖐

Inicia sesión para responder.