Tecnología y Coaching para Emprendedores

Plantillas con Transiciones CSS3 para Webs de Una Sola Página

css3

El diseño web no hace más que evolucionar y las transiciones de CSS3 se añaden al diseño de sitios de una sóla página al mejorar la experiencia de usuario por dos motivos: uno, reducir el tiempo de carga y dos, evitar el contenido duplicado. Desde luego que si se trata de un sitio con muchos contenidos no podremos crear una web de una sola página, pero si lo que queremos es publicar un portafolios o crear una página del tipo about (sobre mí) entonces un sitio web de una sola página puede ser la solución. En este artículo encontrarás varias plantillas con transiciones CSS3 para el diseño de sitios web de una sola página.

Es importante tener presente que Internet Explorer no da soporte a las transiciones de CSS3, al igual que las versiones anteriores a la 4 de Firefox y de la 10.5 de Opera, por lo que antes de implementar alguna de las soluciones propuestas aquí recomiendo comprobar como se ve en el caso que el navegador no de soporte a las transiciones de CSS3. Para comprobar el resultado con las diferentes versiones de Internet Explorer yo utilizo IE Tester

Transiciones CSS3

Transiciones de páginas con CSS3

Las transiciones de estas páginas son diferentes al modelo anterior, es como si la fuera a buscar a la parte de arriba y la trajera para abajo. En IE sólo se puede ver la página principal.

Navegación Responsive con CSS3

El efecto óptico es que un contenido se marcha y deja paso a otro. Al ser responsive se adapta al tamaño de pantalla, incluidos dispositivos móviles como smartphones. En IE se visualiza un mensaje de error de que esta web sólo es visible en navegadores modernos, por lo que no es recomendable si el cliente quiere que se vea en todos los navegadores.

Portafolios biográfico con CSS3 y jQuery

Este portafolios está genial si queremos mostrar nuestra biografía. Viene con una demo y con un enlace de descarga. Funciona con IE8+, pero no con IE7, que da un mensaje de que se debería de actualizar el navegador. Vale la pena echarle un vistazo.

Layout horizontal responsive

Esta plantilla web es muy interesante para transiciones horizontales de una sola página. El menú principal es vertical y viene en el lateral izquierdo. Los contenidos se van desplazando en horizontal. Funciona con IE8+ y en IE7 se carga el contenido pero no se puede hacer el scrolling con el menú de navegación.

PLantilla Web Responsive con HTML5 y CSS3

Esta plantilla web utiliza varias propiedades de CSS3 con las que crear animaciones y ha sido especialmente diseñada para aprender a crear sitios web responsive con HTML5 y CSS3.

Si conoces alguna plantilla con transiciones CSS3 para el diseño de sitios web de una sola página, no dudes en dejar un comentario con el enlace. ¡Gracias!


Comentarios

  • JUGO

    La última me gustó…!

  • Jose Cruz

    muy buen material exelentes diseños