Authors

Categories

brain monkey, impressions, rant

YUI Documentation Printable Stylesheet

05.30.08 | Posted By jason kuhn | No Comments

I justify this entry with the argument that not having a print-friendly option can possibly hurt a user’s experience.

The YUI is an increasingly popular JavaScript framework these days. I’ve been asked to implement it into my work and traversing the documentation, for me, has been just a tad bit annoying. It’s easy to be overwhelmed with links upon first visit.

I just want to see a list of methods/properties and how to use them. I wish one click would get me there, but for now, I’ll be grateful that documentation exists. Now if I could only print it!

yui-print.css

Let’s play “Find-The-Link”. Okay, that looks like what i’m looking for…

Oh, good! A search box. I bet I’m looking for methods that start with B.

So I type B and get Ba… abbr? No, I want something that starts with B, not the first thing with a B in it! That’s why it’s the first letter I typed!

Okay, I’m really looking for methods of the DOM class, but clicking dom under modules didn’t work. It gave me another search box instead. Maybe if I scroll down… that’s a lot of navigation there…

Oh good, this is what I’m looking for! Lemme print so I don’t have to do this crap again. I had better preview or else I may end up with scrap paper!

Phew! Good thing I previewed it! Apparently they don’t supply a print-friendly stylesheet. Copyright info is all messed up and look at all that navigation (which isn’t useful on a piece of paper!)

After some DOM digging, I created an additional stylesheet that would make things a bit more print friendly.

Mmm. That’s better!

I’m not sure how to apply stylesheets in other browers (IE, Opera, Webkit), but Chris Pederick’s Web Developer Toolbar extension for Firefox allows you to.

speak up

Add your comment below, or trackback from your own site.

Subscribe to these comments.

Be nice. Keep it clean. Stay on topic. No spam.

You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

*Required Fields