Mac OS X Lion en tu navegador con CSS3 y HTML5

El CSS3 y el HTML5 se llevan bastante bien y cuando se unen para hacer un sitio web terminan haciendo una verdadera obra de arte (por algo el theme de PuntoGeek.com será en HTML5). El diseñador web Alessio Atzeni ha creado un sitio web con estos dos elementos para recrear el escritorio de Mac OS X Lion, el más nuevo sistema operativo de Apple.

Para probar la experiencia solo debemos ir a su sitio web donde tiene el emulador y entrar con la contraseña admin. Les recomiendo hacer un tweet, un like o un +1 ya que todos deben entrar a este estupendo sitio web. Recuerden que es demasiado bueno para ser lo que es y que hace muy poco fue lanzado, así que no te quejes si no le encuentras la funcionalidad completa de Mac OS.

Sitio web: http://www.alessioatzeni.com/mac-osx-lion-css3/
Página del autor: http://www.alessioatzeni.com/

Prefixr hace compatible tu CSS con todos los navegadores

Prefixr es en resumen: Una herramienta que nos permitirá hacer compatibles nuestras hojas de estilo con cualquier navegador, sin tener que recordar con detalle las propiedades para cada uno de ellos. Por ejemplo, si quieres añadir la propiedad de transition, pero no recuerdas como se maneja en Opera, no te preocupes, tu sólo sigue las recomendaciones de la W3C y listo, Prefixr se encargará de hacerla útil no sólo para Opera, sino para todos los demás navegadores.

Prefixr es fácil de utilizar, entras a su sitio, copias tu código, das Ctrl + Enter o Prefixize, y listo, tu CSS se ha filtrado y adecuado para, como lo menciono, hacerse compatible con todos los navegadores. Además, puedes seleccionar en cual sí o en cual no, así como pedir que se genere una versión comprimida.

Bastante interesante esta herramienta. Sólo hay que señalar que funciona para las propiedades de CSS3, y que existe una API para utilizarlo desde tu editor de código. Eso y más información lo pueden consultar en el sitio oficial.

Sitio web: prefixr

Visto en: Net.Tuts+

Generador de botones CSS3 con degradados

CSS3 es un lenguaje que tiene tanto potencial que últimamente están apareciendo varios servicios o generadores de botones, como este que les quiero comentar hoy. Se trata de un generador que nos permite crear botones con degradados en CSS3, sin necesidad de imágenes.

Esta herramienta es tan completa que al principio nos puede marear con tantos parámetros, pero si le prestan un poco de atención y creatividad pueden lograr resultados muy buenos, todo con CSS.

Dentro de los parámetros que pueden configurar encontramos  el color de los degradados, el tipo de borde, las sombras, tipografías, colores, tamaños, y muchísimas cosas más.

Pero lo mejor de todo es que nos permite configurar el botón en sus tres estados posibles: Normal, hover y activo. Así podemos personalizar al máximo el diseño de nuestro botón.

Una vez que terminamos de diseñarlos el sitio nos genera el código CSS que tenemos que usar en nuestro sitio web.

Visto en Kabytes

Generador de textos con efectos CSS3


CSSWarp es una interesante herramienta que nos pemite generar textos con efectos CSS3 de una manera muy simple. Para ello hace uso de la propiedad text-transform y mediante un par de configuraciones podemos crear textos realmente originales, sólo con CSS.

Su uso es muy simple, tenemos un area de previsualización donde se ve el texto al cual queremos aplicarle el efecto, a la izquierza está el box para modificar ese texto y las demás configuraciones. Dentro de las opciones disponibles encontramos un texto con curva, uno en forma de círculo, y uno más personalizado que permite que nosotros especifiquemos los puntos para las curvas.

Por otro lado también podemos elegir la fuente que queremos para el texto, y lo mejor de todo es que podemos elegir fuentes desde Google Web Fonts para mostrar el texto con fuentes mucho mas elaboradas que lasque traen los sistemas operativos.

Una vez que terminamos de editar el texto pinchamos en el botón Generate HTML y el sitio nos generará el código HTML listo para que peguemos en nuestro sitio web. El resultado será exactamente el mismo que ven en la previsualización.

Enlace: CSSWarp

Visto en Kabytes

Generador de botones CSS3


CSS3 es lo que ya se está viniendo, de a poco todos empiezan a adoptarlo y a crear diseños con este estándar, por eso creo que este generador de botones CSS3 les puede llegar a interesar.

Con CSS3 Button Generator podemos crear botones en CSS3 de una manera muy simple y rápida, pudiendo elegir los colores del botón, ya sea en el degradado como en los efectos de sombra, el color del texto y su sombra, aplicar esquinas redondeadas, fuentes muy elegantes, y muchas cosas más.

Como les dije, su uso es muy sencillo, ya que a medida que vamos haciendo las modificaciones, éstas se reflejan en la vista previa, así podemos ir viendo cómo va quedando nuestro botón, y cuando está listo guardamos y copiamos los códigos HTML y CSS que el sitio nos genera.

Enlace: CSS3 Button Generator

Visto en Delicious

Programa para crear menúes CSS3 gratis


CSS3 es «lo que se viene», y cuando encontré esta herramienta pensé que sería muy útil para todos aquellos lectores que tienen conocimientos básicos de diseño, ya sea gráfico o de programación web.

CSS3Menu es un programa muy interesante que nos permite crear menúes CSS3 gratis. Las ventajas de usar CSS3 son varias, ya que a los menúes les podemos poner esquinas redondeadas, sombras, y muchas cosas que hasta ahora no se podían hacer.

Lo bueno es que este programa está disponible de forma gratuita, tanto para Windows como para Mac.

Enlace: CSS3Menu

Visto en Wwwhats new

Mozilla Labs Gaming: juegos en tu navegador y la futura tienda de aplicaciones libres

Como ya sabrán, ayer a última hora la gente de Mozilla Labs dio a conocer su proyecto denominado Mozilla Labs: Gaming, el cual intenta cooptar a desarrolladores para que utilicen las tecnologías de la Web libre para poder crear juegos en nuestro browser. Ellos aspiran a que sean los juegos los que impulsen los estándares de video y audio abierto, WebGL, gestos multitouch, geolocalización y motores de Javascript.

La iniciativa se llama Game on 2010, donde los desarrolladores de todo el mundo están invitados a participar para poder crear juegos que utilicen todos estos desarrollos modernos, aplicables y funcionales en las últimas versiones de Firefox. Todavía no se habla de competencia, ni de recompensa ni de muchas cosas más; prometen dar más información en el transcurso de estos días.

Leer más

Firefox 4 y la Web del futuro

Hace unos días en Canadá, se estuvo llevando a cabo la Mozilla Summit 2010, una conferencia anual que reúne a Mozilleros de todo el planeta. Alli, los miembros más activos de la Fundación Mozilla se juntan para compartir experiencias, mostrar proyectos y seguir trabajando mutuamente para una Web abierta y llena de oportunidades.

Hoy en twitter, Nukeador (que pertenece a la Comunidad Mozilla) compartió un link interesantísimo de un video que se presentó en el Mozilla Summit. Allí, Paul Rouget (otro miembro) muestra un «demo» de Firefox 4 utilizando todo el potencial de HTML5, CSS3, SVG, WebM, Websockets y otras yerbas más. El video dura casi 8 minutos y está en ingles; pero eso no es impedimento para ver que nos traerá la «nueva Web».

Leer más

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Más información
Privacidad