Curso de Desarrollo Web




martes, 11 de diciembre de 12
Curso de Desarrollo Web




martes, 11 de diciembre de 12
<h1>Agenda</h1>




       <ol class=”agendaCSS”>
           <li>Introducción</li>
           <li>Nativo y Web</li>
           <li>Ventajas y Desventajas</li>
           <li>Frameworks</li>
           <li>Etiquetas</li>
           <li>Optimización iOS</li>
           <li>jQuery Mobile</li>
       </ol>




martes, 11 de diciembre de 12
<h1>Introducción</h1>




    <h2>La Web                  Móvil</h2>

    <h3>¿En verdad existe?</h3>

    <p>La web y su contenido esta presente en cualquier dispositivo con
    acceso a internet y un navegador de buen nivel. No existe una web
    especifica para tablets o para móviles, el usuario solo quiere acceder al
    contenido de la web.</p>




martes, 11 de diciembre de 12
<h1>Introducción</h1>




    <h2>Entonces, ¿Qué          es la Web Móvil</h2>

    <p>Es un conjunto de prácticas, librerías para desarrollo, cosas que hay que
    hacer para generar un recurso de valor para los usuarios más activos.</p>




martes, 11 de diciembre de 12
<h1>Introducción</h1>




    <h2>¿Por            qué desarrollar para Móvil?</h2>

    <ul>
       <li>El móvil ahora representa un dispositivo de primordial importancia
       para los usuarios.</li>
       <li>Se puede tener un mejor enfoque del usuario.</li>
       <li>Cada día los usuarios utilizan con mayor frecuencia los teléfonos
       móviles para consumir contenido, obtener servicios.</li>
       <li>Los usuarios prefieren la comodidad de un móvil ante el uso de un
       equipo de escritorio o portátil.</li>
    </ul>




martes, 11 de diciembre de 12
<h1>Nativo   y Web</h1>


    <h2>¿Que              es una aplicación Nativa?</h2>

    <p>Una aplicación nativa es aquella que puede ser instalada en el
    dispositivo y es desarrollada utilizando un lenguaje de programación
    compatible o establecido por la plataforma en la que se desea instalar.</p>




martes, 11 de diciembre de 12
<h1>Nativo   y Web</h1>

    <h2>¿Que              es una aplicación Web?</h2>

    <p>Las aplicaciones web son sencillas de programar, se desarrollan bajo
    HTML, CSS y JavaScript principalmente. Pueden ser ejecutadas desde
    cualquier dispositivo que cuente con conexión a internet y un navegador
    web de buen nivel.</p>




martes, 11 de diciembre de 12
<h1>Nativo     y Web</h1>



    <h2>¿Nativo                 o Web?</h2>

    <p>Un gran dilema que no tiene una respuesta acertada, cada una tiene sus
    ventajas y desventajas, lo importante es tener claro para que será utilizada
    la aplicación y cuales son los objetivos que deberá cumplir.</p>




martes, 11 de diciembre de 12
<h1>Nativo   y Web</h1>




martes, 11 de diciembre de 12
<h1>Nativo   y Web</h1>



    <h2>Aplicaciones            Híbridas</h2>

    <p>Son aquellas aplicaciones que son desarrolladas como web app´s y
    posteriormente empaquetadas o compiladas para poder convertirse en
    aplicaciones nativas que el usuario podrá instalar en sus dispositivos.</p>




martes, 11 de diciembre de 12
<h1>Ventajas   y Desventajas</h1>



    <h2>Ventajas                de las Web App´s</h2>

    <ul>
       <li>Pueden ser multiplataforma.</li>
       <li>Desarrollo menos costoso.</li>
       <li>Curva de aprendizaje menor.</li>
       <li>Fácil de desarrollar y sin limitantes.</li>
       <li>Mucha información y ayuda disponible.</li>
       <li>Variadas API´s.</li>
       <li>y muchas más.</li>
    </ul>




martes, 11 de diciembre de 12
<h1>Ventajas   y Desventajas</h1>



    <h2>Desventajas             de las Web App´s</h2>

    <ul>
       <li>Pueden ser multiplataforma.</li>
       <li>Curva de aprendizaje menor.</li>
       <li>Rendimiento.</li>
       <li>Fiabilidad.</li>
       <li>Accesibilidad.</li>
       <li>y muchas más.</li>
    </ul>




martes, 11 de diciembre de 12
<h1>Frameworks</h1>




    <h2>Frameworks</h2>

    <p>Existen diversos y variados frameworks que nos facilitan el desarrollo
    de aplicaciones web, entre ellos podemos encontrar.</p>




martes, 11 de diciembre de 12
<h1>Etiquetas</h1>




    <h2>Schemas</h2>

    <h3>Mail Links</h3>
      <a href="mailto:frank@wwdcdemo.example.com">John Frank</a>

    <h3>Phone Links</h3>
      <a href="tel:1-408-555-5555">1-408-555-5555</a>

    <h3>Text Links</h3>
      <a href="sms:1-408-555-1212">New SMS Message</a>




martes, 11 de diciembre de 12
<h1>Etiquetas</h1>




    <h2>Home                Screen Icon</h2>

         <link rel="apple-touch-icon"href="icon.png" />




martes, 11 de diciembre de 12
<h1>Etiquetas</h1>


    <h2>Full          Screen</h2>

         <meta name="apple-mobile-web-app-capable" content="yes"/>




martes, 11 de diciembre de 12
<h1>Etiquetas</h1>


    <h2>Splash              Screen (iOS)</h2>

         <link rel="apple-touch- startup-image" href="startup.png" />




martes, 11 de diciembre de 12
<h1>Etiquetas</h1>


    <h2>Status              Bar (iOS)</h2>

         <meta name="apple-mobile-web-app-status-bar-style"content="black" />




martes, 11 de diciembre de 12
<h1>Etiquetas</h1>




    <h2>Inputs</h2>

    <h3>Búsquedas</h3>
      <input type=”search” />

    <h3>Teléfonos</h3>
      <input type=”tel” />

    <h3>Correo Electrónico</h3>
      <input type=”email” />




martes, 11 de diciembre de 12
Let´s play a game
martes, 11 de diciembre de 12

Web Móvil, Introducción

  • 1.
    Curso de DesarrolloWeb martes, 11 de diciembre de 12
  • 2.
    Curso de DesarrolloWeb martes, 11 de diciembre de 12
  • 3.
    <h1>Agenda</h1> <ol class=”agendaCSS”> <li>Introducción</li> <li>Nativo y Web</li> <li>Ventajas y Desventajas</li> <li>Frameworks</li> <li>Etiquetas</li> <li>Optimización iOS</li> <li>jQuery Mobile</li> </ol> martes, 11 de diciembre de 12
  • 4.
    <h1>Introducción</h1> <h2>La Web Móvil</h2> <h3>¿En verdad existe?</h3> <p>La web y su contenido esta presente en cualquier dispositivo con acceso a internet y un navegador de buen nivel. No existe una web especifica para tablets o para móviles, el usuario solo quiere acceder al contenido de la web.</p> martes, 11 de diciembre de 12
  • 5.
    <h1>Introducción</h1> <h2>Entonces, ¿Qué es la Web Móvil</h2> <p>Es un conjunto de prácticas, librerías para desarrollo, cosas que hay que hacer para generar un recurso de valor para los usuarios más activos.</p> martes, 11 de diciembre de 12
  • 6.
    <h1>Introducción</h1> <h2>¿Por qué desarrollar para Móvil?</h2> <ul> <li>El móvil ahora representa un dispositivo de primordial importancia para los usuarios.</li> <li>Se puede tener un mejor enfoque del usuario.</li> <li>Cada día los usuarios utilizan con mayor frecuencia los teléfonos móviles para consumir contenido, obtener servicios.</li> <li>Los usuarios prefieren la comodidad de un móvil ante el uso de un equipo de escritorio o portátil.</li> </ul> martes, 11 de diciembre de 12
  • 7.
    <h1>Nativo y Web</h1> <h2>¿Que es una aplicación Nativa?</h2> <p>Una aplicación nativa es aquella que puede ser instalada en el dispositivo y es desarrollada utilizando un lenguaje de programación compatible o establecido por la plataforma en la que se desea instalar.</p> martes, 11 de diciembre de 12
  • 8.
    <h1>Nativo y Web</h1> <h2>¿Que es una aplicación Web?</h2> <p>Las aplicaciones web son sencillas de programar, se desarrollan bajo HTML, CSS y JavaScript principalmente. Pueden ser ejecutadas desde cualquier dispositivo que cuente con conexión a internet y un navegador web de buen nivel.</p> martes, 11 de diciembre de 12
  • 9.
    <h1>Nativo y Web</h1> <h2>¿Nativo o Web?</h2> <p>Un gran dilema que no tiene una respuesta acertada, cada una tiene sus ventajas y desventajas, lo importante es tener claro para que será utilizada la aplicación y cuales son los objetivos que deberá cumplir.</p> martes, 11 de diciembre de 12
  • 10.
    <h1>Nativo y Web</h1> martes, 11 de diciembre de 12
  • 11.
    <h1>Nativo y Web</h1> <h2>Aplicaciones Híbridas</h2> <p>Son aquellas aplicaciones que son desarrolladas como web app´s y posteriormente empaquetadas o compiladas para poder convertirse en aplicaciones nativas que el usuario podrá instalar en sus dispositivos.</p> martes, 11 de diciembre de 12
  • 12.
    <h1>Ventajas y Desventajas</h1> <h2>Ventajas de las Web App´s</h2> <ul> <li>Pueden ser multiplataforma.</li> <li>Desarrollo menos costoso.</li> <li>Curva de aprendizaje menor.</li> <li>Fácil de desarrollar y sin limitantes.</li> <li>Mucha información y ayuda disponible.</li> <li>Variadas API´s.</li> <li>y muchas más.</li> </ul> martes, 11 de diciembre de 12
  • 13.
    <h1>Ventajas y Desventajas</h1> <h2>Desventajas de las Web App´s</h2> <ul> <li>Pueden ser multiplataforma.</li> <li>Curva de aprendizaje menor.</li> <li>Rendimiento.</li> <li>Fiabilidad.</li> <li>Accesibilidad.</li> <li>y muchas más.</li> </ul> martes, 11 de diciembre de 12
  • 14.
    <h1>Frameworks</h1> <h2>Frameworks</h2> <p>Existen diversos y variados frameworks que nos facilitan el desarrollo de aplicaciones web, entre ellos podemos encontrar.</p> martes, 11 de diciembre de 12
  • 15.
    <h1>Etiquetas</h1> <h2>Schemas</h2> <h3>Mail Links</h3> <a href="mailto:frank@wwdcdemo.example.com">John Frank</a> <h3>Phone Links</h3> <a href="tel:1-408-555-5555">1-408-555-5555</a> <h3>Text Links</h3> <a href="sms:1-408-555-1212">New SMS Message</a> martes, 11 de diciembre de 12
  • 16.
    <h1>Etiquetas</h1> <h2>Home Screen Icon</h2> <link rel="apple-touch-icon"href="icon.png" /> martes, 11 de diciembre de 12
  • 17.
    <h1>Etiquetas</h1> <h2>Full Screen</h2> <meta name="apple-mobile-web-app-capable" content="yes"/> martes, 11 de diciembre de 12
  • 18.
    <h1>Etiquetas</h1> <h2>Splash Screen (iOS)</h2> <link rel="apple-touch- startup-image" href="startup.png" /> martes, 11 de diciembre de 12
  • 19.
    <h1>Etiquetas</h1> <h2>Status Bar (iOS)</h2> <meta name="apple-mobile-web-app-status-bar-style"content="black" /> martes, 11 de diciembre de 12
  • 20.
    <h1>Etiquetas</h1> <h2>Inputs</h2> <h3>Búsquedas</h3> <input type=”search” /> <h3>Teléfonos</h3> <input type=”tel” /> <h3>Correo Electrónico</h3> <input type=”email” /> martes, 11 de diciembre de 12
  • 21.
    Let´s play agame martes, 11 de diciembre de 12