Mostrando entradas con la etiqueta html5. Mostrar todas las entradas
Mostrando entradas con la etiqueta html5. Mostrar todas las entradas

lunes, 8 de octubre de 2012

Aplicaciones móviles en HTML5



Les presento Mobello, una herramienta OpenSource diseñada para desarrolladores que quieran dar sus primeros pasos en las aplicaciones móviles.

Mobello nos permite crear aplicaciones en HTML5 que además puedan ser publicadas en la AppStore de una manera muy sencilla, dentro de un marco de trabajo nos ofrece 20 componentes de interfaz para diseñar nuestra aplicacón como mejor nos parezca.

 
También disponemos de una aplicación de escritorio llamada Mobello Studio con la que podremos realizar nuestro diseño desde cero con un editor que incluye edición a tiempo real, edición de capas y detección de bugs.

Descarga el editor de forma gratuita en Github haciendo click en este enlace.

martes, 22 de mayo de 2012

Comprendiendo la semántica de HTML5

Una de las principales características de HTML5 son sus posibilidades semánticas. Si antes usábamos DIV para dividir las diferentes unidades de información sin importarnos muchos sobre el tipo de contenido que había dentro, HTML5 nos ofrece un abanicio bastante más amplio: NAV, ARTICLE, ASIDE, SECTION, FIGURE y más.


jueves, 17 de mayo de 2012

Juicebox + HTML5


Hoy dentro de un sitio Web es importante adoptar una galeria de imágenes, ya sea para mostrar productos, fotos personales y un infinidad de cosas.

Juicebox Lite es libre para los usuarios y crear una galería con HTML5, y una de sus cualidades es potenciar las imágenes para ver las galerías con mucha facilidad.

Las galerias creadas funcionan y se adaptan a cualquier tipo de plataforma, ya sea en Tablet, SmartPhone, Pc, etc. Además se encarga de diferencia el tamaño de las pantallas, se pueden crear búsqueda de imágenes, se pueden ver a pantalla completa.

El constructor es perfecto para crear galerías sin codificación arrastrando y soltando archivos, las minuaturas se generan de forma automatica, vista previa de la galeria y el codigo HTML, CSS, JS se crea al instante, esto permite despues poder manipular el código.

Se puede utilizar Flickrs como fuente, definiendo al usuario y las etiquetas que deas mostrar.


Existe una version PRO que biene con mas opciones de configuracion: Soporte de Audio, Auto-Play, Marcas de Agua, Imagenes Ilimitadas, ApI JavaScript para controlar la galeria que desee.

jueves, 26 de abril de 2012

Las novedades de HTML5



Estas son algunas de las características a tener en cuenta de HTML5

Canvas: Es un nuevo componente que permitirá dibujar en la página, por medio de las funciones de un API (Application Programming Interface), todo tipo de formas que podrán estar animadas y responder a la interacción del usuario. Es algo así como las posibilidades que ofrece Flash, pero dentro de la especificación del HTML y sin la necesidad de tener instalado ningún plugin.

Menos tiempo de carga: Actualmente, muchas páginas pueden tardar mucho tiempo en desplegarse debido a la información que manejan o a la forma en que están construidas. El HTML5 permite separar los elementos del sitio en dos planos, para presentar en un primer plano las partes más significativas y que tardan menos tiempo en cargar de manera completa, mientras que el resto se va cargando conforme el usuario va leyendo el sitio.

Imágenes dinámicas: El HTML5 permite la optimización de imágenes, esto incrementa significativamente las posibilidades de crear elementos gráficos de gran interacción para el consumidor. Antes, solamente se podía insertar una imagen al código pero sin muchas posibilidades de modificarla mientras que las galerías eran enlaces a otras páginas o aplicaciones externas con varias limitantes.

Videos sin plugins: En la mayoría de los navegadores, el usuario debe tener instalado algún tipo de plugin que le permita desplegar correctamente un video. Con la nueva herramienta, solo se necesitará un navegador que soporte HTML5 para poder disfrutar de todo tipo de contenido de video sin requerir el apoyo de otras aplicaciones, lo cual mejora el tiempo y estandariza la calidad de reproducción.

Geolocalización instantánea: La aplicación incluida en el HTML5 permite que la ubicación del usuario ya sea por GPS o por cualquier otro método esté disponible para el navegador. De esta manera, se incrementa significativamente la posibilidad de entregar contenido diferente dependiendo del idioma o la localización puntual del usuario en el momento de ingresar a un sitio sin tener que desarrollar una herramienta adicional para poder hacerlo.

Mejora la búsqueda semántica: Gracias a este nuevo modelo se permite dar un mayor nivel de jerarquía a los elementos que así lo ameritan. Es posible establecer con mayor claridad cada sección y así facilitar la vida a los buscadores en nuestros sitios al mejorar el desempeño SEO de nuestro contenido.


lunes, 23 de abril de 2012

¿ Por qué utilizar HTML5 ?

¿Qué es HTML5?

HTML5 es una colección de estándares para el diseño y desarrollo de páginas web. Esta colección representa la manera en que se presenta la información en el explorador de internet y la manera de interactuar con ella.
HTML5 está siendo desarrollado por Ian Hickson de Google Inc. y David Hyatt de Apple Inc. junto con todas las personas que participan en Web Hypertext Application Technology Working Group.

¿Por qué HTML5?

HTML5 nos permite una mayor interacción entre nuestras páginas web y contenido media (video, audio, entre otros) así como una mayor facilidad a la hora de codificar 

(Diseño Básico)


Esta nueva versión se basó en el diseño más común de las páginas web alrededor del mundo para llegar a un estándar de etiquetas que realicen las mismas tareas de manera más rápida y eficiente, he aquí algunos ejemplos:
  • Un nuevo diseño para páginas web, reflejado en las etiquetas <header>,<footer>, <nav>,<section>,<article> las cuales están destinadas a remplazar la necesidad de tener una <div> para cada parte de la página, y en cambio, tener etiquetas específicas para ello.
  • La nueva etiqueta <video> para insertar un reproductor de video, mejorando el reproductor antiguo utilizado por la etiqueta <embed> y evitándonos la pena de insertar el código de <object>, así como eliminar la necesidad del Flash Player para reproducir videos (lo que nos lleva a un ahorro en la cantidad de memoria utilizada).
  • Una nueva tag <audio> para insertar audio en nuestro sitio web, remplazando la vieja etiqueta <embed> con las mismas cualidades de la etiqueta anterior.
  • Una etiqueta <canvas> para manejo de gráficos en internet, sea para dibujar vectores o hacer animaciones.

¿Cómo utilizar HTML5?

Basta con volver a definir nuestras primeras líneas de un archivo HTML para comenzar a usar la nueva versión. De la siguiente manera:




Conclusiones

La nueva versión de HTML contiene elementos dedicados ampliamente a mejorar la experiencia del usuario en nuestra página web, haciendo más fácil al diseñador poder agregar elementos de audio, video y en general del web 2.0 así como organizar sus contenidos utilizando menos código.
La nueva versión es más eficiente y ocupa menos recursos en la computadora del cliente, en particular mediante el uso del nuevo reproductor que no requiere flash o adobe player para utilizarse, y siendo el HTML5 compatible con las versiones anteriores de HTML, utilizar la nueva versión en una página ya diseñada implica un menor trabajo que si fuera una colección completamente nueva.
Por el contrario, HTML5 radica fuertemente en las capacidades del explorador, por lo que en estos momentos no todos los exploradores lo soportan (actualmente sólo Chrome, Safari, Firefox y Opera soportan la mayoría de las características).