Con casi una década de experiencia en diseño web, he encontrado muchas creencias equivocadas sobre las últimas herramientas y tecnologías de diseño; pero nada supera las ideas erróneas que rodean el uso de HTML 5.

Como desarrolladores, tenemos nuestro propio conjunto de creencias equivocadas sobre cierta tecnología, pero a medida que comenzamos a utilizar esa tecnología podemos entender de qué se trata, su uso y su alcance.

Inspirado por ciertos requisitos de HTML5 que he encontrado en el transcurso del tiempo, quería agregar mis dos centavos para despejar el aire sobre ciertos aspectos de HTML5. La mayoría de las ideas erróneas que rodean a HTML5 se deben a que muchas personas piensan que es un reemplazo para Flash.

Al principio, me gustaría dejar en claro que esta no es una publicación HTML5 vs. Flash. La verdad es que uno no puede actuar como el reemplazo del otro, por lo que no hay una batalla de 'nosotros contra ellos'. Pero, ahí está el núcleo de los conceptos erróneos. El problema es que las personas creen que HTML5 es una alternativa mejorada a Flash. Todos los conceptos erróneos son el resultado de este pensamiento.

Descripción técnica de HTML 5

La quinta revisión importante del lenguaje de la World Wide Web se puede escribir en sintaxis HTML y XML y se ha integrado especialmente con modelos de procesamiento detallados para facilitar las implementaciones interoperables y, al mismo tiempo, mejorar el marcado para documentos HTML y aplicaciones web. Su objetivo principal es resolver la dependencia multiplataforma en la industria web.

Si todo esto le parece griego, analicemos lo que hace HTML5 en un lenguaje que se entienda fácilmente, sin entrar en complejos tecnicismos:

  • HTML5 es un lenguaje de marcado actualizado que sigue los estándares XML.
  • La idea detrás de HTML5 es garantizar la coherencia en el rendimiento y la producción de productos web en todos los sistemas operativos, incluidos iOS, Android, Windows, entre muchos otros.

Los conceptos erróneos más comunes con respecto al HTML son centrados en el diseño. Entonces, echemos un vistazo a lo que ofrece HTML 5 desde el punto de vista del diseño.

  • El soporte integrado de audio y video que ayuda a incrustar los medios directamente en los documentos HTML ha hecho que el uso de complementos externos sea redundante.
  • HTML5 admite elementos SVG y Canvas para animaciones.
  • Ofrece a los diseñadores un elemento canvas que facilita la renderización de gráficos 2D en 'modo inmediato'. Esto significa que los objetos gráficos se representan directamente en la pantalla.
  • Ha sido desarrollado para crear aplicaciones interactivas que tienen un contenido pesado y no solo son fáciles de usar, sino también amigables con el SEO.

¿Por qué las personas piensan que HTML5 es un sustituto de Flash?

Flash es un programa de autoría multimedia que ayuda a ofrecer contenido web interactivo y atractivo que brinda una experiencia web rica a los usuarios. Es una plataforma muy popular que alcanza el 99% de los navegadores de escritorio y portátiles, y ofrece el mismo conjunto de rendimiento técnico y visual en todos los navegadores. Pero tiene un inconveniente importante, que es que no es efectivamente compatible con los sistemas operativos móviles como iOS.

Para eso, hay HTML5.

Ahora mira esta declaración muy de cerca. Tomado en su valor nominal, podría significar que HTML5 es un sustituto de Flash, cuando se trata de desarrollar aplicaciones altamente interactivas para la plataforma iOS.

Los escenarios, en los que los clientes han pedido a sus desarrolladores que repliquen una aplicación Flash en su totalidad utilizando HTML5, para un dispositivo móvil o tableta en particular, son bastante comunes. El problema es que las plataformas de desarrollo y sus funcionalidades no deben tomarse a su valor nominal. Sí, una de las ventajas principales ofrecidas por HTML 5 es facilitar el desarrollo de aplicaciones que funcionen en todos los sistemas operativos de teléfonos móviles en lugar de codificar una nueva aplicación para todos y cada uno de los sistemas operativos móviles.

Pero eso no significa que sea un reemplazo Flash.

Conceptos erróneos populares que rodean HTML5

Simplemente los guiaré por una serie de escenarios que ilustran los conceptos erróneos que las personas tienen sobre HTML 5.

Escenario 1 : Convierta una herramienta de diseño existente basada en Flash en HTML 5

El concepto erróneo : HTML 5 no puede enmascarar imágenes de manera similar a Flash; su enmascaramiento de imagen no es ni correcto ni uniforme. Más importante aún, Flash es más rápido y en lo que respecta a funciones específicas, como el cálculo de áreas y diámetros; Flash es una opción mucho mejor. Las características como Arrastrar / Escalar y Zoom también funcionan mejor en Flash que en HTML 5.

Escenario 2 : Convertir un Biblioteca de audio basada en Flash en una biblioteca compatible con tabletas basadas en HTML5.

The Misconception : HTML5 ofrece soporte de audio y video pero con ciertas limitaciones. Este sitio web basado en Flash tenía casi 800 archivos mp3; convirtiéndolo en una aplicación a gran escala. El problema radica en el hecho de que si bien Mozilla admite el formato .ogg y Chrome / safari admite el formato .mp3, por lo que si el navegador preferido del usuario es IE8, Flash Player se convierte en una necesidad. Las extensiones limitadas disponibles en HTML5 significan que la única solución es convertir todos los archivos de audio en dos formatos: mp3 y ogg / wave. Convertir archivos 800 en dos formatos de archivo no es solo un proceso lento sino que también aumenta el almacenamiento del servidor.

El resultado es una aplicación para iPad que reduce la velocidad de los bloques.

Escenario 3 : Convertir un Sitio web basado en Flash en un sitio web basado en HTML5.

El concepto erróneo: Existe la idea errónea de que HTML5 puede manejar todo tipo de animaciones, incluso las de gran escala. Pero no puede, al menos no todavía. Su capacidad para ofrecer efectos 3D y ejecutar múltiples animaciones al mismo tiempo es muy limitada. Es la configuración del sistema lo que determina el rendimiento de las animaciones HTML5 y, hasta el momento, ha demostrado ser un consumidor de recuerdos. Existe una buena posibilidad de que el uso de HTML5 afecte el rendimiento del sitio web si se le pide que haga mucho en términos de animación. O el sitio web se bloqueará o su velocidad se verá afectada. Por lo tanto, en el caso anterior, es posible que el sitio web HTML 5 no pueda ofrecer la misma marca de rendimiento.

Desenmascarando las ideas erróneas comunes de HTML 5

En primer lugar, HTML 5 ofrece una solución de audio y video muy conveniente con algunas funcionalidades avanzadas. Todo va bien, pero lo que mucha gente ignora es el hecho de que estos archivos de audio y video se reproducen dentro de los navegadores. Cada navegador tiene complementos integrados para audio y video, pero diferentes navegadores admiten diferentes versiones de audio y video. Debido a esto, se hace difícil satisfacer los requisitos de todos los navegadores.

En segundo lugar, los elementos SVG y Canvas definitivamente han hecho que sea más fácil para los desarrolladores implementar e integrar animaciones 2D, pero se ha observado que esta animación tiene un efecto perjudicial en el rendimiento del sitio web. Además, HTML5 está demostrando ser débil cuando se trata de manejar animaciones 3D, lo que hace que los desarrolladores no puedan replicar todo un sitio web Flash con una eficiencia similar en HTML5. Siempre habrá limitaciones.

En tercer lugar, puede utilizar HTML5 Rich Internet Applications, pero no tenga la idea equivocada de que pueden ofrecerle la misma eficacia y funcionalidad que Flash / Flex puede ofrecer, por ejemplo, Flash puede comunicarse directamente con servicios remotos, mientras que HTML5 no puede .

Ahora que sabe lo que HTML5 no puede hacer, permítame ofrecerle una pequeña lista de cosas que HTML5 puede hacer y, de hecho, puede hacerlo muy bien. Esto también puede ayudar a reducir los conceptos erróneos a lo grande.

  • Puede crear una sola aplicación que funcione en el iPad, iPhone, Windows, etc. En otras palabras, facilita la independencia de la plataforma / dispositivo, un gran beneficio en sí mismo.
  • Ayuda a desarrollar un único sitio web que funcione en la tableta, el móvil y el escritorio al mismo tiempo.
  • Si se usa bien y se supone que se utilizará, puede mejorar el rendimiento del sitio web.
  • Permite el uso de etiquetas de audio y video en todas las plataformas, pero prepárese para hacer un poco de trabajo duro.
  • El video, el audio y las imágenes están escritos directamente en los códigos, eliminando la necesidad de cualquier software de terceros.
  • Tiempo de carga más rápido en comparación con su versión anterior debido a la implementación de WebSockets.
  • Ofrece excelentes animaciones vectoriales para gráficos y efectos de luz, pero no esperes la luna, el sol y las estrellas cuando se trata de animaciones; Flash está muy avanzado en este aspecto.
  • Proporciona validación de formularios y declaraciones de tipos incorporadas apropiadas para ofrecer soporte de teclado específico.

HTML 5 definitivamente tiene el potencial de eclipsar Flash en más de un sentido, pero actualmente es un trabajo en progreso. Incluso con su avatar actual, ayuda a que las aplicaciones para teléfonos móviles sean más accesibles, y los desarrolladores ahora pueden crear aplicaciones universales para diferentes teléfonos móviles. Además, no hay duda de que ofrece más flexibilidad en la creatividad del sitio web. Por ahora, esto es suficiente. Lo que sucede en el futuro es pura hipótesis.

Descargo de responsabilidad: Todas las ilustraciones utilizadas en este artículo son solo con fines explicativos para explicar los escenarios pertinentes.

¿Ya está implementando algunas características HTML5 que no son ampliamente compatibles? ¿Qué características estás esperando adoptar? Háganos saber en los comentarios!