CSS

Dos muy buenos sitios han hecho sus colecciones de los mejores menús de navegación que se encuentran por la web. Los menús tienen diseños modernos y bien logrados, hechos plenamente con CSS y nos pueden dar muchas ideas a la hora de crear algunos proyectos...

En Alvit se han publicado una impresionante colección de menús de navegación Web 2.0 con CSS.

Dr Web también ha hecho una gran colección, que en algunos casos coincide con los menús seleccionados por Vitaly Friedman. Un detalle, casi todos los menús de esta lista incluyen el color blanco.

Lo que se busca con el posicionamiento CSS es tener un mejor manejo de los elementos Html de una página web. Un práctico tutorial (en ingles) nos explica las propiedades CSS (Position:static, position:relative, position:absolute, and float).

Tutorial | Learn CSS Positioning in Ten Steps

CSS y XSL son dos lenguajes con los que se puede formatear un fichero XML (RSS), haciéndolo legible al usuario. Hacerlo con CSS no es nada complicado, ya muchos lo utilizamos para el diseño de páginas HTML. Por el contrario, XSL es muy poco usado, aunque más potente que el CSS...

David Grajal ha escrito un mini tutorial que ilustra como la unión de CSS y PHP puede convertirse en un potente paquete de diseño web. Nosotros ya hemos tocado el tema anteriormente, con artículos sobre CSS reutilizable y visto algunos ejemplos como el de CSS Gradients. Pero este artículo esta muy bien desarrollado y es muy fácil de seguir.

Lo que se logra con esta combinación (CSS y PHP) va desde por ejemplo intercambiar el color de filas de una tabla ó lo que hacemos en BaluArt para cambiar el diseño de los divs en los comentarios hasta crear styleSwitcher para dar la posibilidad al usuario de que escoja el diseño que más le agrade.

En fin, el tutorial es sencillo pero muy valioso para obtener un diseño bien logrado.

Tutorial: Construcción de webs I

Un star raiting es un sistema de votación sencilo y atractivo, que puedes adaptar fácilmente a tus sitios web para que tus visitantes voten por sus canciones favoritas ó valoren los buenos artículos que publicas.

En Komodomedia acaban de publicar un sencillo tutorial de css para lograr el efecto. Antes habían publicado uno, pero este es mucho más preciso. 

Y para complementarlo, en Slim se pusieron manos a la obra para desarrollar el código de servidor que procese las votaciones y han publicado un tutorial de PHP Y MySQL que explica como poner en funcionamiento este sistema de valoración.

Desde hace mucho tiempo, uno de los problemas que aqueja a todo aquel que diseña páginas webs es lo referente al tamaño, disposición y forma de nuestro layout *. Pues gracias al incremento de las resoluciones de pantalla nuestros diseños no se ven igual en todos los monitores.

Hace buen tiempo, en Grancomo se publicó un artículo comparando el diseño fijo contra diseño líquido, donde se recopiló las ventajas y desventajas de ambos y sus alternativas. Una de estas era establecer un diseño líquido limitando su ancho mediante la propiedad CSS max-width y un javascript que cumpla las funciones de esta propiedad en Internet Explorer; sin embargo, luego de probarla uno observa que tiene muchas limitaciones.

Pero ahora, Particletree publicó una nueva alternativa, que seguramente será acogida por muchos. Los Layouts dinámicos, llamados así porque el diseño completo del layout depende de un par de funciones JavaScript que reconocen la resolución del Monitor y recuperan el fichero CSS apropiado para esa resolución.

Si han utilizado o probado el styleSwitcher de Ala, se darán cuenta que el  sistema de layout dinámico se basa en este.

Para mi, este concepto me resulta muy interesante, el código es bien sencillo y creo que va a tener cabida en los futuros diseños por la red.

* Disposición de los elementos (texto, imágenes, etc.) en una página Web

Tutorial: Dynamic Resolution Dependent Layouts
Vía: SitePoint