Menús con animación en CSS3 Gratis
Todo lo que antes era impensable en un diseño web, ahora es fácil con CSS3, y más si te ofrecen el código para que te lo descargues gratuítamente !!
Tympanus.net nos deja 10 ejemplos espectaculares para que hagas tu menú más atractivo para el usuario. Se trata de varios ejemplos que juegan con los tamaños y animaciones de fuentes, colores e iconos, seguro que encuentras el que andabas buscando !!.
Transiciones realizadas con jQuery y CSS3
4 efectos Flip, 6 efectos de rotación, 3 de multi-flip, 4 efectos cubo, 2 unfold y 7 efectos más que harán que te quedes alucinado con estas transiciones de imágenes, de nuevo con jQuery y CSS3
Más artículos relacionados con jQuery en https://www.gloobs.com/blog/index.php/category/jquery/
Creación de Patterns con CSS3
Hoy traemos a este Blog de Diseño Web, un ejemplo de cómo hacer un pattern con CSS3, más que un ejemplo, un par de utilidades que nos vendrán muy bien a la hora de diseñar nuestro background de fondo. Como siempre, ojo con las versiones de navegador, especialmente al Explorer.
En http://leaverou.me/css3patterns/ podemos encontrar varios ejemplos de patterns hechos con CSS. Lo mejor de todo es que estos ejemplos son editables, por lo que podréis customizarlos.
El segundo ejemplo, lo he encontrado en http://patternizer.com Una web en la que podrás diseñar tu propio pattern mediante un interface gráfico, para más tarde copiar el código CSS generado
GENERADOR DE CÓDIGO CSS
CSS 3.0 MAKER es una herramienta de diseño web que ya lleva un tiempo online, creada para generar CSS3, y con la cual podemos crear todo tipo de esquinas redondeadas, gradientes, animaciones, transiciones, sombras, rotar texto,…
La interfaz es muy intuitiva. Generamos gráficamente el efecto que deseamos, lo vemos en pantalla simultáneamente y cuando lo tenemos definido y terminado nos descargamos la CSS, así de fácil.
Cada una de las posibilidades de CSS 3.0 MAKER, nos muestra la compatibilidad con los distintos navegadores del mercado
Generador de texto curvo en CSS y HTML5
Gracias al HTML5 el diseño web está viendo cómo paso a paso van cayendo todas las barreras que hasta ahora nos limitaban como diseñadores.
Gracias a CSSWarp ahora podemos diseñar un texto como si estuviésemos trabajando con Ilustrator. Con CSSWarp podemos rotar, inclinar, curvar el texto de tal modo que nos permite hacer cualquier diseño con él y luego obtenerlo como código HTML. Además también nos permite seleccionar cualquier tipo de fuente de Google Web Fonts, lo que lo convierte ahora mismo en la herramienta más potente para generar texto en CSS y HTML.
El uso no podría ser más simple, una pantalla gráfica nos ayuda a generar el diseño y una vez finalizado no tenemos más que pulsar sobre el botón «Generar HTML», sencillamente GENIAL !!!
HTML5 y CSS3
TUTS+ es uno de los mejores sitios (conjunto de sitios) que existen en la red relacionados con el diseño web. En este caso el artículo es de net tuts +
En él podréis aprender a montar una estructura de página típica para blog, es decir, cabecera, menú de navegación, cuerpo principal, columna lateral y pie. Veréis cómo se utiliza el HTML5 en compañía de CSS3.
Desgraciadamente todavía existen navegadores que no reconocen el uso conjunto de estas dos tecnologías, sin embargo parece ser que todos los esfuerzos se encaminan a que un día podamos dejar de la do el «parcheo» de las CSS para cada navegador, y dedicarnos a lo que verdaderamente nos ocupa, diseñar un sitio web para sus usuarios.
En cualquier caso, el artículo me parece muy útil, ya que todas las tendencias nos encaminan al uso de HTML5 con CSS3.
En este post, nos enseñan a estructurar una página en HTML5, y a usar etiquetas como <article>, que sirve para denotar la entrada independiente en un blog.
Respecto al CSS3, en este post se analiza cada contenido del blog por separado y nos introduce en «nuevos trucos», como son los degradados, sombras o esquinas redondeadas.
