-
En el marco del XXIV Congreso Nacional y X Congreso Internacional de Informática y Computación (CNCIIC-ANIEI 2011) que se llevó a cabo en la Facultad de Telemática de la Universidad de Colima tuve la fortuna de compartir un tiempo con estudiantes, profesionistas, profesores, etc., que asistieron a las diferentes actividades que tuvieron lugar en el evento. Como parte de estas actividades disfruté de una breve charla con algunos estudiantes provenientes de diversos lugares del país, en esta charla tuve el privilegio de hablar con ellos acerca de los Mitos y Realidades del HTML5 y de presentarles mi reciente libro Arrancar con HTML5.
A lo largo de los próximos días comentaré algunos puntos interesantes acerca de algunos temas que escuché en este congreso, escribiré respuestas a las preguntas más comunes que me hicieron llegar los estudiantes con los que platiqué a lo largo del evento y por supuesto compartiré ejemplos y código (con explicación) que también me solicitaron a lo largo del evento.
Sin más deseo agradecer al comité organizador de CNCIIC-ANIEI 2011 a la ANIEI, a la Universidad de Colima, a la Facultad de Telemática, al equipo AlfaOmega y sobre todo a los asistentes a la charla Mitos y Realidades de HTML5 (que anque nos quitaron tiempo espero algo hayan sacado provecho de la charla).
Emmanuel Herrera
IT professional with several years of experience in management and systems development with different goals within public and private sectors.
Emmanuel worked through development and management layers, transitioning from developer and team development leader to Project Manager, Project Coordinator, and eventually to Scrum Master, Product Owner, and Agile Coach.
Some certifications include: PSM, PSPO, SSM.
4 CommentsCSS3 / Desarrollo / Development / Diseño Web / HTML5 / Ideas / Programación / Programming / SoftwarePuede ser un poco difícil hablar “bien” de tu propio trabajo, especialmente cuando se busca promocionarlo, pero además de ser necesario para vivir, creo que está bien cuando crees que ese trabajo puede servirle a alguien más y de esa forma se crea un círculo virtuoso donde todos ganan (al menos esa es mi intención).
Continuamente estoy experimentando con nuevas tecnologías de desarrollo para aplicaciones (multimedia y web principalmente), lo que constantemente me lleva buscar información de utilidad en todas las fuentes que tengo a mi alcance. La información que se puede encontrar está escrita predominantemente en inglés, lo cual no me representa problema hoy en día, pero en algún momento fue una difícil barrera.
Además del lenguaje, otro problema que sufrí en mi vida como simple estudiante mexicano con cierta curiosidad por las tecnologías de información, era la falta de interés del ambiente que me rodeaba (para ser honesto) y por lo tanto la falta de disponibilidad de información reciente, de punta y veraz acerca de algunos temas de tecnología. Aunque Internet ha llegado para ayudar a mitigar este inconveniente de gran manera, la selección, interpretación, exactitud y orden de la información no siempre es sencilla y es en estos casos en los que un simple libro es aun algo muy útil.
Entre otros, estos inconvenientes siguen existiendo el día de hoy en la vida de muchas personas, sobre todo cuando somos “principiantes”. Es por todo esto que decidí crear un libro que abordara el tema de HTML5 y así apoyar a todas las personas de habla hispana que estén interesadas en iniciarse en el fascinante mundo del desarrollo web, pero que también desean hacerlo con tecnologías de vanguardia y así ser competitivas casi desde el inicio.
Aunque este libro (Arrancar con HTML5) enfatiza en desarrolladores que comienzan, definitivamente también es una buena alternativa para el programador con experiencia pero que también comienza con HTML5. Aunque lo anterior indica el nicho principal al que apunta Arrancar con HTML5, el programador ya iniciado en HTML5 puede usar el libro como una referencia rápida para algunos puntos precisos.
Sin más, las personas que conforman AlfaOmega Grupo Editor, a las cuales agradezco, y su servidor ponen a su disposición Arrancar con HTML5 – Curso de programación en toda latinoamerica. En España este libro está diponible gracias a la editorial Marcombo.
Emmanuel Herrera
IT professional with several years of experience in management and systems development with different goals within public and private sectors.
Emmanuel worked through development and management layers, transitioning from developer and team development leader to Project Manager, Project Coordinator, and eventually to Scrum Master, Product Owner, and Agile Coach.
Some certifications include: PSM, PSPO, SSM.
No CommentPor alguna razón mucha gente buscamos que haya buenos y malos en muchas situaciones, casi sin cuestionamiento el títlo de bueno se le ha dado a HTML5, los malos Flash y Silverligth y si desea agregar el feo quizá una vez más Silverlight.
La realidad es que no hay bandos reales, lo que tenemos son más opciones y eso es lo que hay que aprovechar. Por supuesto habrá situaciones donde hay que elegir, y para tomar decisiones hay que conocer algunas características de nuestras alternativas:
Animación.
Flash.
Primero hay que estar al tanto que Flash nació como una herramienta de animación en un sentido más tradicional, la primera herramienta que creaba contenido Flash era un programa con herramientas del tipo “diseño gráfico” como líneas, círculos, rectángulos, bote de pintura, etc., y con una línea de tiempo para colocar las figuras dibujadas frame a frame y manipularlas de acuerdo a lo que se deseaba.
Flash ha evolucionado y ya no cuenta con una sola herramienta para crear contenido, Flash ya no solo está orientado a sólo a hacer animaciones “artísticas o experimentales” si no que inclinado a ser un verdadero framework para crear aplicaciones conocidas como RIAs (Rich Internet Aplications), en estas puede combinar diferentes grados de animación.
Ventajas:
- Hacer y animar fluidamente dibujos de trazo libre es amable y fácil.
- Hay una amplia comunidad desarrollo.
- Existe mucha documentación libre y de pago.
- Adobe está constantemente mejorando esta tecnología.
- Los resultados visuales que se pueden obtener son realmente de muy alta calidad.
Desventajas:
- Se require de un plug-in de tercero instalado para ver contenido Flash.
- La versión del plug-in puede ser un factor problemático para usuarios y desarrolladores.
- El contenido Flash no es indexable, esto dificulta que los buscadores y otras herramientas ubiquen, interpreten y clasifiquen su contenido.
- Además de conocer HTML, JavaScript, CSS, etc., hay que aprender ActionScript y múltiples herramientas para explotar verdaderamente el potencial de Flash.
- Los elementos más interesantes de la plataforma Flash son propietarios, por lo tanto tienen costo.
HTML5
La animación en HTML5 cuenta con varias alternativas para ser creada, puede usar solo JavaScript y CSS3, puede utilizar el elemento Canvas o la tecnología SVG. Todos estas alternativas han sido creadas desde un punto de vista programático, es decir, siempre se pensó en crear animaciones utilizando código de programación y no una herramienta de diseño con una interfaz de usuario.
HTML5 se encuentra evolucionando rápidamente y mucha gente está prestando atención, la misma compañía dueña de Flash ha estado experimentando con las posibilidades de este nuevo estándar y proponiendo cosas, como la importación de contenido desde la aplicación Adobe Flash a HTML5, la creación de Adobe Edge (que si me preguntan es un intento de hacer de HTML5 lo que Flash fue originalmente) , entre otras cosas.
Ventajas:
- Todo es libre y gratuito.
- No existe necesidad de utilizar plug-ins.
- Una rápidamente creciente comunidad de desarrollo y documentación.
- La indexación de contenido combinado con la fuerte semántica de HTML5 van de la mano de gran manera.
Desventajas:
- HTML5 no es lo más conveniente para la animación detallada y fluida (del tipo dibujo animado) por ahora.
- HTML5 no es una especificación terminada, por lo que hay cosas que aún no están concluidas o son experimentales.
- No todos los navegadores soportan todas las características de HTML5 o no las soportan de igual manera.
- HTML5 no tiene aún buenas alternativas que sean amables con diseñadores gráficos.
Cuando hablamos de animación, el consumo de recursos es un punto donde se critica mucho a Flash, pero tengo que admitir que Adobe se está esforzando mucho en este sentido y HTML5 aunque promete en este tema, tiene sus bemoles en ciertas circunstancias, habrá que esperar un poco para definir este punto con claridad.
Conclusiones:
Si desea hacer animaciones con trazos libres, que no requieren demasiada programación pero si mucho trabajo gráfico y deben ser de gran fluidez, mi recomendación es Flash.
Si desea hacer aplicaciones de escritorio con moderado grado de animación y muy buena presentación, considere utilizar AIR , si desea importar estas aplicaciones a la web o viceversa Flex es una buena opción (estas tecnologías son parte de la plataforma Flash).
Si desea hacer aplicaciones web con moderado grado de animación y desea familiarizarse con los estándares del futuro vale la pena dedicarle tiempo a HTML5.
Si el presupuesto es un problema, los estándares libres siempre son una interesante opción, es claro que HTML5 brilla en este caso.
En la siguiente parte de esta serie de posts abordaré ventajas y desventaja de estas tecnologías desde el punto de vista de video.
Emmanuel Herrera
IT professional with several years of experience in management and systems development with different goals within public and private sectors.
Emmanuel worked through development and management layers, transitioning from developer and team development leader to Project Manager, Project Coordinator, and eventually to Scrum Master, Product Owner, and Agile Coach.
Some certifications include: PSM, PSPO, SSM.
No CommentEn la entrada anterior hablé de la tecnología Flash y un poco de su historia, con el fin de comprender mejor de que va Flash desde su inicio. Ahora le toca el turno al famoso y esperado HTML5. De unos dos años para acá se ha hecho mucho escándalo alrededor del flamante HTML5, y con razón, ya que presenta muchas nuevas y prometedoras características.
He observado que muchas persona caen en una impresición similar a cuando se habla de Flash, es decir se habla de HTML5 como un todo, como una especie de entidad única que merodea en la Web creando páginas interesantes. La verdad es que HTML5 es algo que viene acompañado de varías tecnologías con las cuales se complementa para poder funcionar.
HTML5 es únicamente la especificación más nueva, publicada por la W3C para HTML, el lenguaje base para crear páginas Web. La especificación define como deberían escribirse las etiquetas o tags que instancian un elemento HTML en nuestras páginas, que atributos y eventos poseen. Eso es todo, y lo más curios de todo es que ni siquiera es una especificación completa ni terminada, pero entonces ¿por qué tanto escándalo? :
HTML5 es más rigorista.
Anteriormente si se escribía una página HTML podía caer en errores de escritura, combinar mayúsculas y minúsculas en el código, no cerrar etiquetas que requerían cierre, ignorar tipos MIME, entre otras cosas de mal gusto para programadores exigentes, y las páginas en muchos casos aún se veían como se esperaba, haciéndonos olvidar todos los errores cometidos y creando malos hábitos. Para intentar solucionar esto se creó XHTML, pero nunca fue ciento por ciento adoptado por todos los desarrolladores. HTML5 intenta recuperar el espíritu de precisión de XHTML, mantener la familiaridad de HTML y unificarlo todo en la nueva especificación HTML5 (en el futuro crearé un post para hablar de XHTML2 y XHTML5 que tienen su historia, pero me lo guardo para no salir de contexto).
El énfasis en la semántica en el código HTML es realmente notable e incluso abrumador cuando se comienza a desarrollar.
Nuevas etiquetas para formularios.
Tengo la impresión de que este punto no es muy mencionado pero a mi me parece importante porque puede ahorrar tiempo y costos. HTML5 incluye una nueva serie de etiquetas para colocar nuevos controles para formularios, por ejemplo, barras de progreso, campos de texto que filtran números y patrones, campos de texto que validan direcciones de correo y URLs, campos de texto que muestra color pickers y calendarios, entre otros más. Este tipo de controles requerían de programación y tiempo extra o incluso de comprar controles de terceros, pero HTML5 lo incluye de entrada.
Nuevas etiquetas para contenido multimedia.
Este aspecto en realidad al que la mayoría de la gente se refiere cuando habla de HTML5. La nueva especificación propone nuevas etiquetas para colocar audio y video de manera nativa sin el uso de plug-ins de terceros y/o propietarios, como justamente son el Flash Player o el reproductor de contenido Silverlight.
Pone sobre la mesa el elemento Canvas, que es justamente uno de los recursos principales para crear animaciones con gráficos vectoriales e imágenes, sin embargo esto se hace hoy por hoy principalmente de manera programática, nótese esto porque será un punto importante para el encuentro mano a mano entre Flash y HTML5 para la tercera parte de la entrega de posts.
CSS3 y JavaScript.
Tecnologías sin las cuales HTML5 no podría hacer algo mínimamente interesante y que se encuetran evolucionando paralelamente al mismo HTML5. Esto es algo sumamente importante, ya que antes de alguien pueda pensar en que aprender HTML5 solo es conocer algunas etiquetas nuevas, la realidad es que si aspira a desarrollar con HTML5 debe aprender la nueva especificación para hojas de estilo nivel 3 o CSS3 y los nuevos recurso JavaScript. Combinando etiquetas HTML5, CSS3 y JavaScript se puede lograr una mucho mejor manipulación del aspecto y comportamiento de elementos HTML que nunca antes, logrando una mejor estética en nuestras páginas y en nuestro código al separar programación estructural de programación visual.
Web sockets y Web workers.
No hablaré mucho de esto, solo diré que aquellos gurús adentrados en programación con sockets y la programación por hilos tienen en HTML5 algo muy interesante por revisar.
En la próxima entrada ¡comenzarán los verdaderos golpes!
Emmanuel Herrera
IT professional with several years of experience in management and systems development with different goals within public and private sectors.
Emmanuel worked through development and management layers, transitioning from developer and team development leader to Project Manager, Project Coordinator, and eventually to Scrum Master, Product Owner, and Agile Coach.
Some certifications include: PSM, PSPO, SSM.
No CommentDesarrollo / Development / Diseño Web / Experiencia de Usuario / UX / HTML5 / Ideas / JavaScript / Programación / Programming / SoftwareNo se trata de una guerra, ni de una pelea, de hecho consideré titular esta entrada como Flash y HTML5 pero me pareció que el “versus” sería más provocador para los “fanboys“. Personalmente creo que Flash se ha ganado el lugar que tiene en la Web, pero esto no quiere decir que siempre estará ahí, que siempre será la mejor o la única opción.
Últimamente de manera continua algunas personas, que comienzan a desarrollar, me han preguntado que es mejor y al mismo tiempo me he dado cuenta de algunas confusiones en el tema, de manera que decidí hacer una serie posts abordando el asunto y esperando despejar algunas dudas a quienes desean desarrollar con estas tecnologías.
Flash:
Aveces se menciona a Flash como un todo, pero en realidad hay varias partes involucradas. Flash surgió como una tecnología propuesta por la compañía Macromedia a finales de los 90s, que permitía desplegar gráficos vectoriales en páginas Web, Flash consta básicamente de un plug-in instalado en el navegador de un usuario que permite el despliegue de contenido elaborado en este formato, a esto se le conoce como Flash Player. Al mismo tiempo que Flash Player Macromedia creó la herramienta con la que originalmente se podía crear este tipo de contenido, esta herramienta fue concebida como un software de animación para crear contenido destinado principalmente a la Web, este software se le llamaba simplemente Flash.
El Flash y el Flash Player han ido evolucionando lo largo de los años, durante este tiempo Macromedia liberó parte de su tecnología para permitir a terceros crear contenido SWF (el formato que comprende Flash Player), e esto se agregó la posibilidad de incluir video en formato FLV el cuál también se visualiza gracias a Flash Player. Otra parte importante de Flash es su script de desarrollo conocido como ActionScript el cuál también ha tenido cambios importantes.
En 2005 la compañía Adobe (dueños de Photoshop) adquiere a Macromedia, con esto también vinieron cambios sobre Flash, la herramienta de autoría ahora se conoce como Adobe Flash Professional y surge también la nueva versión de su script el popular ActionScript3, el cuál introduce al desarrollo con Flash verdadera programación orientada a objetos.
Una de las mayores limitantes de Flash ha sido su pobre interacción con datos y su poco practicidad para crear aplicaciones que buscaban más productividad y un tanto menos de animación como tal, manteniéndose aún sobre la Web pero considerando también aplicaciones de escritorio. Adobe consciente de esto crea Flex y AIR, un conjunto de tecnologías que también crean contenido Flash pero con mejores capacidades en cuanto al desarrollo con el manejo de datos, y más orientada al desarrollo tradicional de aplicaciones.
Las grandes desventajas de las tecnologías basadas en Flash siempre han estado relacionadas con el rendimiento en general, el consumos de recursos y algunos temas de seguridad. Factores que hay que considerar antes de crear una aplicación.
En la siguiente parte de esta entrada abordaré al novedoso HTML5…..
Emmanuel Herrera
IT professional with several years of experience in management and systems development with different goals within public and private sectors.
Emmanuel worked through development and management layers, transitioning from developer and team development leader to Project Manager, Project Coordinator, and eventually to Scrum Master, Product Owner, and Agile Coach.
Some certifications include: PSM, PSPO, SSM.
- ElanzaLite developed by ThemeHunk