Although most people know that you can pre-load images using Javascript, I thought I’d add my own method; Pre-loading images with CSS.
You can do it in 2 easy steps.
Often times a designer tends to think that they need to stick to one style or one type of design. I mean come on, we all do it, we all get in a rut and start designing mini clones of previous sites. Sure it’s good to use the cool things from one site, the sweet things from another site, and of course your trademark type styles. However, we need to get creative, we need to incorporate and utilize all the technologies to our advantage. Don’t get me wrong, I am not saying anyone is doing anything wrong. What I am saying is that we need to challange ourselves if we should expect to get better and start producing sites that leave a visitor thinking, “WOW, who made that site.”
How many times have your printed a website only to realize that the content portion of the page doesn’t fit? Or 80% of the page being taken up by ads, headers, and other ink intensive items you wish weren’t there? In this article we will be discussing how to prevent these headaches from your visitors. We spend hours agonizing over how our sites look on the screen, why wouldn’t we spend a few moments getting it to look stellar on paper too?
Setting it Apart
First step to the path of print happiness is that of learning to access the print style. There are two ways that I suggest to do this. Either way will let you specify elements to specify style specific to the printed page.
I am sure that all of us at one time have developed a website with more
than one column. In the past (back in my tables days) columns and rows
were a huge part of my designs. Things are about to change. In the
midst of cross-browser support issues with CSS2, A List Apart has a wonderfully written article that dives into the specifics of the proposed addition to the CSS standard (CSS3).
Funny thing is this was proposed in draft from in 2001. I for one would
find this very useful and a much needed time saver when coding column
websites. Take a moment and read their article.
One last thing to note is the compatibility, according to ALA:
"The script has been tested in IE6, Firefox 1.0.4, Netscape
7.1, Safari 1.2 and 2.0, and Opera 8 (though the Opera tests indicate a
tendency to crash)."