Versión móvil de tu web en 3 pasos con Mobify

Topic created · 7 Mensajes · 1467 Visitas
  • Me parece que voy a probar a hacer la de UJ con symbian jeje
    A ver qué sale... GRACIAS! 🙂

  • **Ya sabemos todos que la web móvil está ganando cada vez más terreno ya sea por tener una Tablet, Smartphone o cualquier otro dispositivo móvil existente y por existir, así que no debemos serle indiferente y si aún no hemos empezado a movilizar nuestras páginas por todo el trabajo que hay detrás, pues hoy les traigo una aplicación web que nos va a ayudar muchísimo para los que recién empezamos y queremos ir probando la experiencia móvil que podría dar nuestra web.

    Mobify

    [alinear-centro][/alinear-centro]

    Mobify es una aplicación web muy interesante que nos ayuda reestructurar nuestra web para hacerla compatible para móviles y es muy fácil de usar: solo tenemos que darnos de alta en la página luego iniciar sesión y ahí estaremos en un entorno así

    [alinear-centro][/alinear-centro]

    Ahí vemos que yo ya tengo 3 dominios que ya he editado, entre ellos Cristalab (a ustedes les aparecerá cuando ya tengan los suyos lo más probable es que pasen a la siguiente imagen) no te preocupes @freddier se puede hacer con cualquier web en este caso yo usare la de Cristalab para la explicación y para que vean cuán potente es la herramienta.

    PASO 1: configurar el sitio desde el panel

    Luego de introducir la web a la queramos movilizar nos aparecerá este panel.
    Este es el primero de los tres pasos a seguir: "elegir", aquí debemos seleccionar todas las divisiones que queramos que aparezcan en nuestra versión móvil, todas las áreas rojas son las que aparecerán en la versión móvil

    [alinear-centro][/alinear-centro]

    Luego presionamos el botón de siguiente que está en la parte superior derecha y así pasar al 2do paso: "el diseño"

    PASO 2: el diseño

    [alinear-centro][/alinear-centro]

    Aquí nos encontramos con la tarea principal que es un editor de css ya que nuestra página no los conservará por completo dependiendo de cómo hayan realizado su css. En este caso yo me encontré así la web que por cierto el html es impecable; las imágenes de por sí ya estaban adaptadas: (gracias equipo de Cristalab gente así me hace la vida más feliz 🙂 ). Aquí sólo me dediqué a poner css así que manos a la obra! Go go go!!

    Después de un rato en el que juntando habilidades ninja y averiguar clase por clase y colocar el respectivo css quedo lista la home de cristalab móvil, tratando de ser lo más fiel al diseño de la web de escritorio.

    Aparte del css también le hice un pequeño banner para la cabecera lo más parecido a la web actual para que se vea aún mejor, esto lo hice con la opción de agregar html y sólo puse imagen que adapté desde Photoshop.

    [alinear-centro][/alinear-centro]

    Luego que terminas de editar pasamos al tercer y último paso que es la "administración"

    PASO 3: Administración

    [alinear-centro][/alinear-centro]

    Aquí nos muestra las secciones que hayamos editado y las opciones para detección de dispositivos y personalizar el dominio

    [alinear-centro][/alinear-centro]

    Así es, con un pequeño código que insertamos en el head de nuestra web detectaremos a todos los dispositivos móviles que se conecten a ella.

    **

  • UJ ya tiene versión móvil feo, no hace falta xD

  • Para symbian no ¬¬
    No todo el mundo es tan rico como tú xD que por cierto, ayer petó mi nokia 😕 ahora voy con un ladrillo 😄

  • 1 minuto de silencio por tu nokia xD Los nokia son una mierda tío, cómprate algo decente(algo con iOs o Android) xD

  • wow, excelente aporte Kamikaze, voy a hacer unas pruebas ^^
    pd: Anghios te vendo una blackberry bold xDDDD

  • **Espero les sirva bastante ^^ los Androids se apoderan del mundo, ahora todos quieren uno! los Nokias son buenos! **