Just as the title says, speech bubbles done beautifully just with pure CSS.
All examples use simple, semantic HTML. No empty elements, no unnecessary extra elements, no JavaScript, no images (apart from that Twitter logo)…
Uniform
Uniform supposedly helps you produce “sexy forms with jQuery.” Essentially, it is a jQuery plugin that styles form elements and provides them a consistent look. A few designs are initially available as themes and it should be fairly easy to build your own from it.
Notes on @font-face
In my struggle playing with @font-face at my personal blog, I’ve learned that right now, it really isn’t worth it yet. Unless if your design really requires it. Here’s a bunch of links I’ve used while trying it out though:
- Font Squirrel | Download Hundreds of Free @font-face Fonts
- High Performance Web Sites :: @font-face and performance
- Fighting the @font-face FOUT – Quicken the load time « Paul Irish
- Gzip your @font-face files / Stoyan’s phpied.com
- More @font-face fun
- Using CSS3 @font-face to “fake” multiple font weights – IliaDraznin.com
- Samer: Genius solution to detect @font-face feature
- @font-face feature detection « Paul Irish
Simple Print Stylesheets
Many of us web desingers and users mainly focus on how our pages look when viewed through a browser, which is our primary medium of presentation. However, there are sites that cater to a much broader audience that include a significant chunk of “paper users,” people who print pages for various purposes.
37signals’s Basecamp is one application in such a situation. It was primarily developed for web use, but users found it very useful that they printed a good part of their pages for meetings, presentations, and reports. Despite the not–so–expected printing trend, the developers found it easy to allow for beautiful printing just through the magic of CSS. Yes, CSS only. No specialized “printer–friendly pages” or similar nonsense.
Utilizing specific stylesheets for screen and print combined with smart use of display:none; allowed them to produce nice–on–paper pages that do not affect web presentation. Also from their Signal vs. Noise weblog, this guide for producing print stylesheets will come very handy when you encounter webpage printing requirements.
cssQuery
cssQuery is a javascript library that provides an easy way to access DOM elements, without the need for focusing too much on transversing the document’s elements. More developers are more adept in CSS than in Javascript, making this a useful tool for those fairly proficient in CSS. cssQuery may be considered similar to jQuery and Behaviour, which somehow change the way we approach browser scripting.
Using cssQuery, you can now use common CSS selectors like body > p instead of getElementsById() or getElementsByTagName(). The downside would be the library’s size, though that is slowly becoming less of a consideration as broadband rapidly becomes widespread.