Aprendiendo Web

Acabo de ver CSS3test, una interesante forma de probar soporte de CSS3 en tus navegadores… ¿porque usas varios, no?

Como explica su autora, Lea Verou, CSS3test prueba (muy superficialmente) casi todo de las siguientes especificaciones (y no solamente lo más implementado).

1. Backgrounds and Borders
2. Image Values and Replaced Content
3. Selectors
4. Media Queries
5. Basic User Interface
6. Transitions
7. Animations
8. 2D Transforms
9. 3D Transforms
10. Text
11. Fonts
12. Color
13. Multi-column Layout
14. Values and Units

Y cuando dice casi todo, en verdad es casi todo. Puedes darle click a cada una y ver exactamente qué tests pasó y cuales no

Aquí puedes ver, por ejemplo, como mi navegador (Chrome) pasa background-size pero no completa background.

Además termina con la siguiente frase:

Cheaters WebKit claims to support CSS3 background-repeat, but it’s LYING

En fin, una herramienta más en el arsenal del diseñador web.

Continúa leyendo...

CSS1K es un proyecto de Jakob Rask que busca probar el poder de las hojas de estilo.

La idea es sencilla, darle estilos a una página sin modificar el markup y usando un CSS que pese como máximo 1kb (1024 bytes).

Algo así como CSS Zen Garden con un límite en el tamaño del CSS. Pero esa no es la única limitante, tampoco puedes usar recursos externos como imágenes o @font-face, lo que hace que este proyecto se vuelva aún más interesante.

Para participar debes hacer un fork de CSS1K en github y enviar tus estilos mediante un pull request.

Yo ya envié mi diseño (de hecho la imagen de arriba muestra una parte), sería genial que también participes y compartas tu diseño en los comentarios!

Continúa leyendo...

El sábado pasado dicté una charla en Arequipa sobre CSS 3

Y ya que estaba hablando de CSS 3 decidí no usar slides sino más bien usar una página hecha en HTML5 y CSS3!

La charla no fue grabada pero estoy seguro que les gustaría a ver la página Usando CSS 3 hoy que diseñé para el evento.

Estoy usando Media Queries en esa página, así que prueben de cambiar el tamaño de la ventana del navegador :)

Continúa leyendo...

Este es el resumen de la primera charla de An Event Apart Chicago 09.

A Site Redesign

Presentación de Jeffrey Zeldman.

Continúa leyendo...

Sabes que CSS significa Cascading Style Sheets, con lo de Style Sheets (hojas de estilo) nadie tiene problemas, pero la idea de Cascading (en cascada) suele ser un tema algo complicado para diseñadores web que están empezando.

Hoy me encuentro con un juego de diapositivas hechas por Russ Weakley de maxdesign que explican muy bien el tema de la cascada.

CSS cascade - a simple step-by-step presentation

Continúa leyendo...

Los libros de sitepoint son muy bueno, y ahora tienes la oportunidad de descargar gratis el libro The Art & Science Of CSS.

Es una oportunidad que no puedes perder, esta promoción sólo estará disponible 12 días más, así que descargalo ya.

El libro en Amazon cuesta alrededor de US$30 en amazon sin contar el envío, y tiene un promedio de 4 estrellas en las reseñas de los lectores, puedes verlo en la página del libro en amazon.

Cómo descargar The Art & Science Of CSS

Hay dos maneras, puedes seguir a sitepoint en twitter, luego te enviará un mensaje directo con el link para la descarga, también puedes suscribirte por email, para eso basta ingresar tu direccion de email en sitepoint twitaway.

Nunca está de más un libro así en tu colección.

Gracias por el dato Arturo!

Actualización: Terminó la promoción y el libro ya no está disponible para descarga.

Continúa leyendo...

Cuando hablo de diseñadores web me es imposible no nombrar a Andy Clarke, de hecho él es en mi opinión uno de los mejores diseñadores web del mundo, además es el autor de mi libro favorito sobre CSS, Transcending CSS.

Ahora me entero que Andy ha sacado un DVD llamado Inspired CSS donde recorre aspectos como los principios de transcending CSS, Marcado significativo, Microformatos, Selectores avanzados de CSS, Técnicas de layout con CSS, Tipografía y CSS 3 .

Este DVD está a la venta junto con el libro transcending CSS en un paquete llamado CSS Artistry: A Web Design Master Class, no es algo que le recomendaría a un diseñador novato, pero si ya estás usando CSS en el día a día, este video, junto con el libro, te ayudarán a convertirte en un diseñador web mucho más sofisticado.

Aquí te dejo una muestra de 3 minutos del DVD CSS Artistry.

CSS Artistry: A Web Design Master Class

Y un ejemplo de cómo Andy nos enseña CSS durante el video.

Continúa leyendo...

6 cosas que odio del diseño web

Las intros en flash

Pocas cosas me irritan más que tener que perder segundos de mi vida mirando una intro en flash para poder entrar a una página y no es excusa que tengan el famoso botón saltar intro (que generalmente es tan chico que no se ve)

La música en las webs

Me ha pasado muchas veces que navego escuchando alguno de mis grupos favoritos, cuando de pronto se empieza a escuchar una mezcla extraña de sonidos, y es que a alguien se le ocurrió que su blog estaría mucho mejor si empezara a tocar música apenas lo visitas.

No tengo que decir que esas páginas no duran más de 5 segundos en la ventana de mi querido Firefox.

Nota, la música está OK si tu sitio es el de una banda o algo por el estilo, en cualquier otro caso, por favor evítala.

Los layouts con tablas

Qué les puedo decir acerca de eso, ver layouts con tablas me hace sentir como en un museo...

Continúa leyendo...

Cada vez hay monitores más grandes y con mayor resolución, y eso es algo que hay que tener en cuenta eso al momento de diseñar un web.

¿A qué me refiero cuando digo que tus páginas estén centradas?

A que por defecto, el contenido de las páginas está alineado a la izquierda, es decir, el contenido de tu página está pegado al borde izquierdo de la ventana del navegador.

Esto nunca fue un problema cuando la mayoría usaba monitores de 800 x 600, pero ahora (y desde hace bastante tiempo) este tipo de resolución casi ha desaparecido, entonces conviene diseñar pensando en monitores con resoluciones mayores.

Es mucho más fácil darse cuenta de esta diferencia con una imagen, aquí te muestro cómo se vería Aprendiendo Web centrado y alineado a la izquierda...

Continúa leyendo...

Hace unos minutos fue publicado en nuevo borrador de CSS 3 acerca de borders y background.

Para mi la especificación de CSS 3 es uno de los pasos más importantes hacia una mejor web, con esa especificación se podrán hacer cosas increíbles en diseño web, con un marcado limpio y sin necesidad de hacks.

¿Te imaginas poder usar varias imágenes de fondo para un mismo elemento y manejarlas a tu antojo?, ¡y que me dices de usar una imagen como borde!

¿Suena bien?, entonces no lo puedes dejar de leer.

Continúa leyendo...