La idea de desarrollar animaciones css3 surgió en el seno de la empresa como un reto, pues cuando tomamos la decisión estratégica de apostar fuerte por las nuevas tecnologías y el desarrollo web basado en html5/css3, sabíamos que dejábamos atrás años de desarrollo en html4/xhtml y css2.

Una vez tomada esta importante decisión, comenzamos a desarrollar los nuevos trabajos que a la empresa iban llegando utilizando estas tecnologías, lo que le aporta a dichos desarrollos y al cliente un valor añadido, pues empleamos tecnologías que serán lo común en el mercado en no mucho tiempo, una vez los navegadores más reticentes a dar compatibilidad a estas nuevas tecnologías (internet explorer / opera) se sumen a los navegadores punteros en adoptarlas (chrome / firefox / safari).


Pero, ¿que significa esto del html5/css3?
HTML5 es el nuevo estándar del lenguaje html en su versión 5, que permite entre otras cosas, crear sitios web semánticos, es decir, que el contenido se muestra bajo unas etiquetas creadas para tal fin y por lo tanto, es más sencillo mejorar la indexación del contenido de la web por parte de los buscadores.
Por ejemplo: la etiqueta <header> engloba todo el contenido de la cabecera, <footer> todo lo que se muestra en el pie de página, etc.
Ejemplo de web del grupo Tesla Technologies desarrollada en html5:
http://www.reddecompra.com/
Css3 por su parte, son los estilos visuales que se aplican a un sitio web para darle vistosidad al mismo, consiguiendo con ello separar las capas de contenido de las de diseño (aplicación de fuentes, colores, etc.).
Con la revisión 3 de las hojas de estilo, podemos crear, por ejemplo, sitios web que adapten el contenido automáticamente a la resolución del dispositivo que está viendo dicha web.
Esto permite que una misma web, dependiendo del dispositivo (ordenador de sobremesa, tablet, móvil) la web muestra el contenido adaptado al usuario que lo está viendo.
Ejemplo de web del grupo Tesla Technologies adaptada a múltiples resoluciones:
http://www.tiendacentral.com/
Además, con css3 llegan múltiples funcionalidades que permitirán a los desarrolladores poder ofrecer multitud de efectos visuales al usuario de forma fácil.
Por último, el css3 incluye la posibilidad de realizar animaciones, que pueden ser tan complejas como se desee al estilo flash, pero al contrario del flash, visible en todos los dispositivos móviles, como tablets (iPad / Samsung Galaxy Tab) y smartphones (Galaxy S / iPhone).
Y ahora más que nunca, este es el futuro, pues aún hace poco, Adobe a anunciado que no habrá más versiones flash para dispositivos móviles, volcándose por completo en el desarrollo de aplicaciones en html5 para este sector en concreto, dejando únicamente el flash para ser visto en pc's y ordenadores portátiles.


Pero, ¿cómo son las animaciones utilizando css3?
Pues bien, desde Tesla Technologies, en nuestro afán de mejorar y asumiendo el reto de dar un paso más allá de las tecnologías actuales, hemos decidido crear cada cierto tiempo, una cabecera animada que cuente una historia, una historia sencilla que nos apetezca contar y compartir con todos vosotros.
Eso sí, para poder visualizar correctamente la animación debes tener instalado uno de los siguientes navegadores web:
Google Chrome, Firefox 5+ o Safari.

En el resto de navegadores, en versiones más antiguas o en el Internet Explorer (incluso en su versión 9) u Opera, las animaciones css3 no son visibles, pues estos navegadores todavía no son compatibles con la mayoría de nuevas funcionalidades que nos trae el css3.

Y por último, la mayoría de los navegadores móviles de tablets o smartphones están preparados y optimizados para visualizar webs realizadas en html5/css3.

Para ver la animación creada por el equipo de Tesla Technologies para la cabecera de la web empresarial, dos url:

Web en español →
http://www.teslatechnologies.es/
Web en inglés →
http://www.teslatechnologies.com/

Desde el grupo Tesla Technologies nos hemos propuesto, una vez realizada esta primera animación css3, el ir haciendo periódicamente una nueva animación para la cabecera de nuestra web de la que iremos comentando los detalles en este apartado, esperando que sean de vuestro agrado.


El equipo de Tesla Technologies.