7 Principios del CSS Limpio y Optimizado
Martes, Julio 7th, 2009Gracias a @elijahmanor me llega el siguiente articulo:
7 Principios del CSS Limpio y Optimizado
- Use Shorthand
Utiliza el modo abreviado de cada propiedad para escribir menos codigo - Axe the Hacks
Evita y elimina los hacks. Usalos solamente para dar soporte a navegadores viejos, no nuevos. - Use whitespace wisely
Utiliza los espacios en blanco sabiamente. No es bueno dejar demasiados espacios o no dejar ninguno. - Prune frameworks and resets
Limpia los frameworks y resets. Por lo gral suelen poner propiedades que no necesitamos. Sé consciente de lo que hacen. - Future-proof your CSS
Asegura tu estilo, separando el formato del diseño de la pagina. - Document your work
Documenta tu trabajo. Es útil para el trabajo en equipo asi como para tener una vision global. - Make use of compression
Haz uso de la compresión. Muchas aplicaciones permiten bajar el tamaño y errores del codigo css.
He aqui el link al articulo:
7 Principles Of Clean And Optimized CSS Code | CSS | Smashing Magazine.
15 Articulos que se deben leer de CSS para Principiantes
Lunes, Junio 29th, 2009Muy buen conjunto de articulos sobre css!
15 Must Read Articles for CSS Beginners.
He aqui la lista:
- Resetting Your Styles with CSS Reset
- Learn CSS Positioning in Ten Steps
- Internet Explorer and the CSS box model
- Specifics on CSS Specificity
- Faux Columns
- Sexy Ordered Lists with CSS
- Divitis: What it is and How to Avoid it
- Using background-image to replace text
- CSS Sprites: What They Are, Why They’re Cool, and How To Use Them
- How to Create a CSS Menu Using Image Sprites
- 10 Examples of Beautiful CSS Typography and how they did it…
- CSS Shorthand Guide
- Push Your Web Design Into The Future With CSS3
- How to use headings in HTML
- 10 HTML Tag Crimes You Really Shouldn’t Commit
CSS3, los nuevos atributos y recomendaciones
Lunes, Junio 22nd, 2009Por medio de un twitt me encuentro con esto:
Llevar el diseño al proximo nivel con CSS3
Muy buen articulo donde enumera los nuevos atributos y nos da recomendaciones acerca de como implementarlo.
Contenidos:
- 1. Selectors
- 2. RGBA And Opacity
- 3. Multi-Column Layout
- 4. Multiple Backgrounds
- 5. Word Wrap
- 6. Text Shadow
- 7. @font-face-Attribute
- 8. Border Radius
- 9. Border Image
- 10. Box Shadow
- 11. Box Sizing
- 12. Media Queries
- 13. Speech
- Conclusion
- Further Reading And References
Sin duda un Must-Read!
Sobre interfaces de usuario…
Miércoles, Julio 18th, 2007Bueno, hoy compile mucho, lo cual significa que tuve tiempo de leer bastante.
Estuve navegando la seccion de interfaces de usuario de AListApart.com.
Never Use a Warning When you Mean Undo
Nos explica el porque hay que evitar dar mensajes de error del tipo “Haga click para continuar”, “Esta seguro que…”, y de ese tipo. La solución: implementar la funcionalidad de “deshacer” (Undo). Hace una comparacion con gmail.
Muy interesante.
Este articulo, habla sobre la navegacion del usuario en un sitio web, y comenta que 3 pasos debemos dar.
Sinteticamente, indicarle el usuario donde esta, donde puede llegar a estar y donde ha estado.
Este articulo basicamente consiste en destacar la importancia de una pagina de inicio.
Como debe estar construida y que debe mostrar, incluso dependiendo del tipo de usuario.
Para aquellos que no son conocedores, el Holy Grail es conocido en el mundo del CSS. Como el layout de 3 columnas.
En el cual el contenido va en el centro, y al costado la navegacion u otro contenido.
Interesante como muestran paso a paso la construccion del mismo.
Lo unico que me queda, es releerlo, poner el culo en la silla y empezar a aplicar estas cosas en mi web 
Respetando las reglas…
Viernes, Julio 13th, 2007Bueno, paso mucho tiempo desde mi ultimo post y mas aún desde el ultimo mantenimiento al blog…
Hoy lo revise un poco y volvi a hacerlo standard segun las reglas de W3C
Al momento de utilizar el validador que utilizan, descubri que tenia 69 errores.
Todos estos errores, eran basicamente causado por 2 plugins…
El primero es el utilisimo: Viper’s Video Quicktags (permite incluir videos facilmente).
El segundo es la extension para Firefox Performancing o el ex-ScribeFire.
Ambos insertaban un tag <p> para introducir el contenido…
El primero, insertaba algo como: “<div id=”lalala”><p>…</p></div>”
El segundo, insertaba:”<p class=”performancing”>Powered by …</p>”
Lo que sucedia es que WP, cada parrafo lo introduce dentro de un tag <p>. Por lo que se anidaban los <p> y producia un error en la validacion del XHtml.
La solucíon.
La manera que encontre, para el primer caso de los videos, fue modificar el plugin…
Donde decia: “<div id=”lalala”><p>…</p></div>” lo reemplace por “<span id=”lalala”>…</span>” y funciono correctamente y se visualiza correctamente 
y es valido!
Para el segundo caso, del Scribefire, por ahora lo solucione manualmente… reemplazando el “<p class=”performancing”>Powered by …</p>” por “<span class=”performancing”>Powered by …</p>”
Orgulloso muestro:
Crea pestañas utilizando javascript y css
Lunes, Junio 11th, 2007En esta pagina nos brindan 26 diferentes opciones para crear pestañas.
26 Best ways to implement AJAX, CSS and Javascript based Tabs
Powered by ScribeFire.
Compilación de layouts en CSS
Lunes, Junio 11th, 2007Por medio de Sentido Web me entero de http://csseasy.com/
Una compilacion pequeña pero util de layouts en css.
Este tipo de cosas me encantan, que ya te den todo armado =P.
Powered by ScribeFire.