I’m attending the CSS Summit today and have been introduced to some interesting and useful information about web design, typography and nifty tricks and tips using CSS, particularly the enhancements in CSS3.
While I can’t share the Powerpoints with everyone (they charged for the summit, and I don’t have permission to redistribute the materials), I would like to share some links to resources and information that should help with your web design work. If you’re tweaking your WordPress theme CSS or building a brand new theme/child theme, you might want to play around with these tools.
First, the CSS Summit itself: http://environmentsforhumans.com/2010/css-summit/
This site includes links to each presenter’s website/blog. Some may put their presentations on their blogs (for example, Zoe Gillenwater has already).
CSS 3 Tools
http://CSS3generator.com
all kinds of CSS3 generators including RGBA
http://borderradius.com
play with borderradius settings and get CSS code
http://westciv.com/tools/box-properties/index.html
More powerful tool allowing you to generate CSS3 text and box styling; also see site for gradients, transforms, multiple columns
http://http://gradients.glrzad.com/
CSS3 gradients and buttons
http://css3please.com/
another (odd) CSS3 generator
http://fontsquirrel.com
free web font kits to use with @font-face
http://www.w3viewer.com/
click on letters to read W3C documents/tutorials/reference material
iPhone
http://protofluid.com
website to test CSS on mobile devices
To target iphone in CSS:
@media screen and (max-device-width: 480px){
/* iPhone CSS here */
}
CSS Animations
(Transforms and Transitions… warning, not all supported in all browsers, including Firefox!)
http://developer.apple.com/safari/library/navigation/
http://developer.apple.com/safaridemos/
http://dev.opera.com/articles/view/css3-transitionsand-2d-transforms/
https://developer.mozilla.org/en/CSS/CSS_transitions
Some articles/CSS 3 tutorials:
http://www.smashingmagazine.com/2010/06/17/start-using-css3-today-techniques-and-tutorials/
http://www.smashingmagazine.com/2009/10/26/modern-css-layouts-the-essential-characteristics/
http://www.smashingmagazine.com/2010/05/06/modern-css-layouts-part-2-the-essential-techniques/
I hope these links are helpful. If you know of others, this would be a great place to share what you’ve come across!