Apps Web Multiplataforma

¿Quieres aprender a realizar páginas web y que esa misma página la puedas poner en diferentes plataformas (iOs, Android, Windows Phone...etc)?

El desarrollo de aplicaciones para dispositivos móviles: Smartphone y Tablets está en auge y cada vez más las empresas y las personas quieren tener su propia aplicación.

La mayoría de las aplicaciones que más gustan a los usuarios son las mas sencillas y usando los elementos de las páginas web, podemos crearlas de una forma rápida. Una vez tengas los conocimientos para realizar páginas web, podrás hacer muchas aplicaciones. Estas aplicaciones se pueden mostrar tanto en una página web como en una aplicación subida a una tienda. Podrías realizar aplicaciones de las siguientes temáticas con los conocimientos del curso:

¿Ésto que estoy viendo lo podría tener en mi app? Compruebalo por ti mismo. Descárgate la App para Android -> App´s Web Multimedia

Empresas

Apps para hacer marca

Esta demostrado que además de pertenecer a redes sociales, tener una página web, muchos usuarios buscan también aplicaciones en las tiendas de las distintas plataformas para comprobar si muestran algo más que desconocen. Las marcas o empresas que dan importancia a estos valores, van formando poco a poco una mejor imagen más corportativa.

Apps para mostrar sus productos

Para las empresas, otro canal para llegar a sus clientes sería tener una aplicación sencilla donde se muestren los productos o servicios que ofrecen de una forma rápida.

Apps para mostrar su ubicación y contacto

A veces, dependiendo del sector de la empresa, éstas quieren mostrar solo otra forma de contactar con ellos y cómo se puede acceder a sus instalaciones, horarios...etc.

Apps para destacar sobre la competencia

Las comparaciones son odiosas, pero no será la primera vez que escuches, "Tiene hasta su propia aplicación para iOs y Android, y la tuya no. A lo mejor la aplicación es meramente ilustrativa de la empresa, pero la empresa "X" ya tiene algo que la empresa "Y" no tiene.

Otras Apps

Estos ejemplos son meramente una muestra de algunas aplicaciones sencillas que podemos aportar a las empresas, estoy totalmente seguro que se te han ocurrido al menos dos más, si te apetece compartirlas para que sean tenidas en cuenta manda un mail a la dirección: info@aplicacioneswebmultiplataforma.es

En educación

Apps para aprender a leer o a contar

Los tiempos cambian y los niños/as hoy en día están bombardeados por unos dispositivos que antes no existían. No podemos aislarlos y dejar de usar las ventajas que estos nos traen. Existen muchas aplicaciones que pueden ayudar aprender a leer, contar, hacer operaciones básicas:suma, resta, multiplicación...etc. Imagina el campo que se nos abre y lo fácil que sería hacerlo usando HTML5, un poco de control dinámico de la web con jQuery o JavaScript.

Apps para mostrar algún método didáctico

Cuando se está desarrollando un método didáctico o pedagógico, podemos mostrar sus puntos fuertes y si hemos usado en el las nuevas tecnologías, que mejor forma que agregar nuestra propia Apps.

Apps para organizar los exámenes o actividades

Cuando eres profesor de algún curso o aula, puedes conectar y ayudar a tus alumnos teniendo una aplicación donde muestre aquellas cosas que deseemos. Por ejemplo, que actividades hay que hacer, el calendario del año, el baremo...etc. Muchas cosas que realmente son básicas y pueden ayudar la comunicación e interactividad con tus alumnos.

Apps para aprender algún lenguaje de programación

Muchas veces otra forma de aprender es realizar una aplicación que vaya mostrando los contenidos poco a poco y por temáticas. Cada vez más, los usuarios mientras van en el tren, autobus o simplemente esos tiempos de espera los pueden usar con pildoras informativas que poco a poco vayan aprendiendo un lenguaje. HTML5, JAVA, PHP...el que desees.

Apps para aprender idiomas

Con la globalización existente y con la facilidad de comunicación gracias a internet, cada vez más es necesario aprender uno o varios idiomas. Al igual que en el punto anterior, crear una aplicación para enseñar uno o varios idiomas puede ser una gran alternativa.

Juegos

Desafíos, lógica, memoria y estrategia

Este tipo de juegos suelen ser de los más demandados y la verdad que son los que más me gustan personalmente. Consiste en una combinación de varias habilidades del usuario, que no se tiene porque centrar en la operatividad o excesiva complicación gráfica en la plataforma, sino en sacarle partido a la inteligencia del usuario y hacer que se pase un rato entretenido. Por ejemplo realizando preguntas o plateando retos al usuario.

Mecánicos o de teclas

Cuando me refiero con juegos mecánicos o de teclas, son aquellos en los que el usuario no se desafia a nivel lógico o mental, mas bien la acción mecánica o rápida de pulsación de teclas o mejor dicho, pantalla táctil. Aquellos juegos que el usuario pasa un rato entretenido sin pensar mucho y poco a poco va cogiendo más habilidad.

Clásicos

Aquí podemos meter un gran número de juegos: tres en raya, marcianos, ahorcado, descubre el tesoro, de memoria...etc. Existe mucha información, códigos y soluciones con JavaScript que directamente podemos agregar y crear una aplicación de algún applet que tuvieramos creado para nuestra web.

Otros

Por supuesto, no es obligatorio realizar una sola temática, dicen que en la variedad esta el gusto, y hacer variaciones, mejoras y combinaciones de juegos puede ser una buena opción.

Otras

Cualquier otra aplicación de otro ámbito: aplicaciones sobre alimentación, deporte, cocina, programas de televisión, estadísticas, calendarios personales...etc.

Apps Web Multiplataforma

ÍNDICE DEL CURSO

Unidad 1

1. INTRODUCCIÓN E HISTORIA DE LA WWW.
1.1 Esquema y elementos necesarios de la web.
1.2 Estructura de directorios en el servidor web.
2. DIFERENCIAS ENTRE HTML5 Y VERSIONES ANTERIORES
3. PREPARANDO EL ENTORNO DE DESARROLLO
3.1 Editor de textos
3.1.1. Instalación de Sublime Text 2 para Windows
3.1.2. Instalación de Sublime Text 2 para MAC
3.1.3. Instalación de Sublime Text 2 para Linux
3.1.4. Creando snippet propios
3.1.5. Más utilidades de Snippet.
3.2 Servidor de aplicaciones web.
3.2.1. Instalación de Wamp (Windows 7)
3.2.2. Instalación de Lamp (Linux Ubuntu)
3.2.3. Instalación de Mamp (MAC)
3.3 Navegador y emulador de dispositivos
4. RESUMEN

Unidad 2

1. ESTRUCTURA BÁSICA DE HTML5
1.1 Cabeceras, navegación, pie de página y Anexos.
1.2 Párrafos.
1.3 Títulos.
1.4 Listas
1.5 Citas.
1.6 Formateado de textos.
1.7 Saltos de línea.
1.8 Elementos separadores
1.9 Sección y artículos.
1.10 Enlaces e hipervínculos.
1.10.1. Enlaces a una página local
1.10.2. Enlaces a una página externa
1.10.3. Enlaces al interior de la página
1.10.4. Enlaces a una dirección de correo electrónico
1.10.5. Enlaces a un archivo
1.10.6. Enlaces a elementos de bloque
2. MULTIMEDIA E IMÁGENES
2.1 Insertar imágenes.
2.2 Insertar audio y video
2.2.1. Insertar Audio
2.2.2. Insertar Video
3. TABLAS Y FORMULARIOS
3.1 Tablas.
3.2 Formularios.
3.2.1. Campos de texto
3.2.2. Campos de texto para contraseñas
3.2.3. Áreas de texto
3.2.4. Listas desplegables
3.2.5. Botones de selección única
3.2.6. Botones de selección múltiple
3.2.7. Botón de envío
3.2.8. Botón de reset
3.2.9. Botón de acción
3.2.10. Campos ocultos
4. RESUMEN

Unidad 3

1. ELEMENTOS AVANZADOS CON HTML5
1.1 Script y NoScript
1.2 Drag and Drop
1.3 Diseño 2D. Canvas
1.3.1. Trazar una línea
1.3.2. Trazar un rectángulo
1.3.3. Trazar formas geométricas
1.3.4. Agregar texto
1.3.5. Agregar sombreados
1.3.6. Agregar imágenes
1.3.7. Transformaciones
1.4 Geo-localización
1.4.1. Introducción
1.4.2. Protección de la privacidad
1.4.3. Coordenadas
1.4.4. Localización en un mapa
1.4.5. Seguimiento de los desplazamientos
1.5 Almacenamiento de datos
1.5.1. Temporal o de sesión
1.5.2. Persistente
2. RESUMEN

Unidad 4

1. INTRODUCCIÓN A CSS3
2. ESTRUCTURA DE UNA WEB CON CSS3 Y MODELO DE CAJAS
3. ESTILOS
3.1 En línea
3.2 Internos
3.3 Externos
4. JERARQUÍA
5. REGLAS DE ESTILO Y SELECTORES
5.1 Selector de elemento
5.2 Selector de ID
5.3 Selector de Clase
5.4 Jerarquía entre selectores
6. RESUMEN

Unidad 5

1. PROPIEDADES CSS3
1.1 Unidades de medida
1.2 Anchura y Altura
1.3 Colores
1.4 Textos
1.4.1. Tipo.
1.4.2. Tamaño.
1.4.3. Estilo
1.4.4. Grosor
1.4.5. Línea de decoración.
1.4.6. Sombras.
1.4.7. Transformaciones.
1.4.8. Indentación
1.4.9. Espaciados
1.4.10. Alineación
1.5 Márgenes, bordes y rellenos Box Model
1.6 ShortHand CSS3
1.6.1. Bordes
1.6.2. Fuentes
1.6.3. Background
1.6.4. Margin, padding, outline
1.6.5. Listas
2. ELEMENTOS FLOTANTES.
2.1 Float
2.2 Clear
2.3 Overflow
3. POSICIONAMIENTO DE LOS ELEMENTOS
3.1 Normal o estático.
3.2 Relativo
3.3 Absoluto
3.4 Fijo.
3.5 Visibilidad
3.6 Profundidad
4. SELECTORES AVANZADOS
4.1 Selector descendente
4.2 Selector de hijos
4.3 Selector adyacente
4.4 Selector de atributos
4.5 Pseudo-clases
4.5.1. De selección
4.5.2. De enlace
4.5.3. Hover, active y focus
5. COMPATIBILIDAD CON LOS NAVEGADORES HTML5 Y CSS3.
6. EJEMPLOS PRÁCTICOS
6.1 Posicionamiento de elementos.
6.2 Menú de navegación.
6.2.1. Versión 1.
6.2.2. Versión 2
6.2.3. Versión 3
7. PROPIEDADES AVANZADAS DE CSS3
7.1 Degradados de color
7.2 Transformaciones
7.2.1. Rotaciones
7.2.2. Escalado
7.2.3. Deformación oblicua
7.2.4. Desplazamiento
7.2.5. Transiciones
8. RESUMEN

Unidad 6

1. INTRODUCCIÓN
2. JAVASCRIPT Y JQUERY
3. INTRODUCCIÓN A LA PROGRAMACIÓN EN JAVASCRIPT
3.1 Definición
3.2 Variables
3.3 Funciones
3.4 Operadores básicos
3.5 Operadores lógicos
3.6 Control de flujo del programa
3.7 Ambito de las variables
3.8 Arrays
3.9 Objetos
4. EMPEZANDO A TRABAJAR CON JQUERY.
5. SELECTORES Y FILTROS EN JQUERY
5.1 Selector de Etiqueta
5.2 Selector de Id
5.3 Selector de Clase
5.4 Conjunto completo de selectores
6. EVENTOS
6.1 Eventos del ratón
6.1.1. Ejemplo: .click()
6.1.2. Ejemplo: .dblclick
6.1.3. Ejemplo: mouseover vs …out/enter/leave
6.1.4. Ejemplo: .mousemove()
6.1.5. Ejemplo: .mouseup / .mousedown
6.2 Eventos del teclado
6.3 Eventos de formularios
6.4 Eventos de documento
6.5 Eventos del navegador
6.6 El objeto Event
6.7 Gestor de eventos
7. ATRIBUTOS
7.1 Operaciones sobre Clases
7.1.1. Añadir Clases
7.1.2. Eliminar Clases
7.1.3. Permuta de Clases
7.2 Leer
7.3 Editar
7.4 Añadir
7.5 Eliminar
8. RESUMEN

Unidad 7

1. FORMULARIOS
1.1 Selección de elementos
1.2 Validación de formularios.
2. CSS3
2.1 Acceder a las propiedades.
2.2 Modificar las propiedades
2.3 Dimensiones y posicionamiento
3. AJAX
3.1 Introducción
3.2 Preámbulo
3.2.1. Métodos GET y POST
3.2.2. Tipos de datos
3.2.3. Sincronismo/Asincronismo.
3.2.4. Métodos AJAX en jQuery
3.2.5. Posicionamiento (SEO) con AJAX
4. EFECTOS
4.1 Ocultar/mostrar elementos.
4.2 Fundidos
4.3 Desplazamientos
4.4 Animaciones
4.5 Cola de efectos
4.6 Método queue
4.7 Detener efectos
5. RESUMEN

Unidad 8

1. JQUERY UI
1.1 Instalación y uso en nuestra aplicación
1.2 Acordeón
1.3 Autocompletar
1.4 Botones
1.5 Calendario
1.6 Diálogos
1.7 Menús
1.8 Barra de progreso
1.9 Menús de selección
1.10 Slider
1.11 Spinner
1.12 Tabs
1.13 Tooltip
2. USO Y DESARROLLO DE PLUGINS
2.1 Añadir funciones globales
2.2 Añadir métodos de objeto jQuery
2.3 Compartir un Plugin
3. RESUMEN

Unidad 9

1. INTRODUCCIÓN
2. PREPARANDO EL ENTORNO DE DESARROLLO
3. ESTRUCTURA BÁSICA
3.1 Roles
3.2 Temas
3.3 Página, encabezado, contenido y pie
3.4 Navegación entre páginas
4. BOTONES
5. ICONOS PERSONALIZADOS
6. COLUMNAS
7. LISTAS
7.1 Lista básica
7.2 Lista con enlaces.
7.3 Listas divididas
7.4 Filtrado en listas
7.5 Listas compuestas
7.5.1. Título y descripción
7.5.2. Agregar Imagen
7.5.3. Columna adicional
7.5.4. Contadores
8. TAB
9. FORMULARIOS
9.1 Etiquetas.
9.2 Contenedores
9.3 Agrupar elementos
9.4 Botones y campos de texto
9.5 Conmutadores
9.6 Deslizadores/Slider
9.7 Campos tipo fecha
9.8 Menús de selección
10. CORREO ELECTRÓNICO
11. TRANSICIONES
12. TEMAS PERSONALIZADOS
13. CONMUTAR ENTRE WEB NORMAL/MÓVIL
14. RESUMEN

Unidad 10

En esta unidad se hace un resumen de todos los Framework existentes y una introducción a la creación de aplicaciones multiplataforma para dispositivos. Es decir, además de realizar las web multiplataforma, adquirirás los conocimientos básicos para poder exportar tus aplicaciones. Esta aplicación que estás viendo ahora mismo ha sido creada con el código que aprenderás en el curso.

Anexos

1. Guía para exportar aplicaciones multiplataforma con PhoneGap desde un código fuente web.
2. Guía para darse de alta como programador de Iphone.
3. Guía para darse de alta como programador de Android.

Apps Web Multiplataforma

Bienvenido a la Web móvil

Productos en oferta

Ofertas en ruedas. 4 al precio de 2.

Llévate dos fundas de volante y paga solo uno

Por cada maletín de herramientas una gorra gratis

Ultimas novedades

Actualización del sistema de gestión de pedidos

Usuarios Conectados

- Recambios Antonio

- Filtros Rui

- Autorecambios Amador

Historia

La empresa Nombre Empresa nacio en el año 1978 fundada por...Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

¿Quiénes somos?

¿Dónde estamos?

Delegación de Madrid

Calle Inventada numero 12

28013 - Madrid (Madrid)

Teléfono

Tlf información: (+34) 123 345 678

Tlf soporte: (+34) 123 345 678

Fax: (+34) 123 345 678

Skype

empresa.conecta.online

soporte.conecta.online

Redes sociales

Facebook

Twitter

LinkedIn

Email

Dpto Compras Internacional

Dpto Atención al cliente

Dpto Soporte técnico

Dpto Recursos Humanos

Formulario


BOTONES

Acceder

Botones con ControlGroup

Botones con ControlGroup - Horizontal

Botón sin sombra

Botón sin esquinas redondeadas

Botones con data-icon diferentes

Botones con data-icon personalizados

Ubicación de los iconos

Icono sin texto

Columnas y grid

Celda 1.1
Celda 1.2
Celda 1.3
Celda 1.4
Celda 2.1
Celda 2.2
Celda 2.3
Celda 2.4
Celda 3.1
Celda 3.2
Celda 3.3
Celda 3.4

( Lista ul )


( Lista ol )

  1. HTML5
  2. CSS3
  3. JQUERY
  4. JQUERY MOBILE

( Lista ul ) con data-inset="true"


( Lista ol ) con data-inset="true"

  1. HTML5
  2. CSS3
  3. JQUERY
  4. JQUERY MOBILE

( Lista con separadores )


( Lista interactivas (enlaces) )


( Lista Ordenadas interactivas (enlaces) )

  1. LENGUAJES IMPLICADOS
  2. HTML5
  3. CSS3
  4. JQUERY
  5. JQUERY MOBILE
  6. MÁS INFORMACION
  7. ENLACE SIN ICONO

( Lista divida )


( Lista filtrada )


( Lista con descripcion )

Apps Web Multiplataforma

Esta es una aplicación muy básica para mostrarte que el desarrollo de esta aplicación ha partido del conocimiento de HTML5, CSS3, jQuery y jQuery Mobile.

Se ha usado jQuery Mobile porque nos trae muchos temas y funcionalidades resueltas con muy poco código. Si se quiere, no es necesario usar jQuery y en muchos casos será más rápida la aplicación, pero eso sí, tendremos que controlar en todo momento tamaños, posiciones y diseño de todos los elementos, botones, listas...etc.

Si deseas más información o tienes cualquier duda, te puedes poner en contacto con nosotros en: info@aplicacioneswebmultiplataforma.es

Apps Web Multiplataforma

Con muy pocas líneas hemos creado este juego sencillo

¿Qué eres capaz de crear con algunas más? Muchas veces cuenta más la imaginación y la motivación que los detalles técnicos, éstos siempre aparecerán dando soluciones.