Give your users the ability to dock a toolbar in the screen

Hedger Wang has another great tutorial/demo. He’s created a dockable DHTML sidebar that allows the user to place it on any edge of the browser or leave it floating in the center of the screen.

I first thought about using this in navigation, but that may be a bit adventurous. It would be a great way to offer other site tools, such as your style-sheet changer, search bar, am I hot or not buttons, contact links, etc.

Multiple medias in the print.css

Let’s say you have a printer-friendly page that consolidates information from multiple sections. The page uses the print.css as all instead of just print. Let’s also assume you want to show things on the screen, such as a link back to the referral page, and different elements on the printed page, such as the url of the referral page.

Simple HTML Example

Go back to the last page.

http://www.last-child.com/multiple-medias-in-the-print.css

CSS solution

You can include multiple medias in one style sheet. Just declare the special rules under @media


@media print{/*show printer only elements, hide screen only elements */
.noprint {display:none;}
.print {display:block;}
}

Your main CSS file would have already declared .print {display:none;}.

CSS, XHTML, JavaScript, ROR Cheat Sheets

Dave Child has created a library of cheat sheets that have been pinned to cube walls around the world. If you haven’t seen these before, takes some time to visit his site and print your own versions. Attached to my wall are:

Mulberry Technologies also has a set of cheat sheets for XML Syntax (.pdf) and XSL 1.0 and XPath (.pdf) .

Design Meltdown – Using spatters and drips in your designs

spray paint drips
My background is in fine art, not computer design. I’ve been frustrated by the digital, screen-based presentation of web sites. I want to get my hands dirty. I want to scrape, scratch, paint, and draw. My attempts at reproducing texture on web sites has been spotty. I wrote about my desire to integrate art techniques into web design a year ago on my personal site, www.tdrake.net.

Design Meltdown has a great post and folowing tutorial about spray paint texture and how to use it in your web design. It would be interesting to use this technique with alpha transparency to give your site a new dimension.

Color Schemer and other online color palette tools

I’ve been using Color Schemer for several years. It’s a simple tool that allows you to find complementary and harmonious colors for your web site. I didn’t have the bookmark on this computer and did a search for it. Openmodo has a great collection of online color palette tools. When you need to choose a color, let these tools help you out.

Before you let an anonymous color generator determine your web site’s look and feel, you should take some time to learn about color theory. The authoritative book on the subject is The Elements of Color by Johannes Itten, of the Bauhaus School. While this book is small and fairly expensive, the knowledge you’ll gain will make it a worthwhile investment. You could also find it at your local library.