Jon Raasch's Blog » best practices

Jon Raasch's Blog » best practices http://jonraasch.com/blog Web development and design blog from Portland based developer Jon Raasch Thu, 29 Jul 2010 16:35:00 +0000 en hourly 1 http://wordpress.org/?v=3.0 CSS Summit: The Good Parts http://jonraasch.com/blog/css-summit http://jonraasch.com/blog/css-summit#comments Thu, 29 Jul 2010 16:33:06 +0000 Jon Raasch http://jonraasch.com/blog/?p=1124 CSS Summit featured some the best CSS minds presenting on cutting edge CSS issues. There was a ton of great information presented across the 8 sessions, but here's a wrap up of the single best piece of information from each presenter:

Denise Jacobs – Advanced CSS Troubleshooting

The highlight of Denise's talk was some specific coding tips about clearing floated content. She started with the standard overflow: hidden method, which falls short with support for borders & margins and also doesn't allow scrollbars if they're needed. Denise suggested instead using overflow: auto; width: 100%; which avoids these issues. You don't have to use the exact values above, you just have to set some type of overflow and width / height value. Denise went on to discuss a .clearfix:after method, see the gist. Denise likes this clearing method since it doesn't include any extra, non-semantic markup (as opposed to <br class="clearfix" />). However the fact that the :after selector doesn't work in IE6/7 makes this method unusable in my opinion. Ultimately I'm going to stick to the overflow: auto; method described above.]]> http://jonraasch.com/blog/css-summit/feed 0 Great Examples of Drawing With CSS http://jonraasch.com/blog/drawing-with-css http://jonraasch.com/blog/drawing-with-css#comments Tue, 30 Mar 2010 17:34:15 +0000 Jon Raasch http://jonraasch.com/blog/?p=964

I’ve always been a fan of drawing page components with pure CSS rather than using image support. Although rendering the page with CSS can sometimes be a pain, the rewards of fewer HTTP requests & less download time make it well worthwhile. Until recently, most web designers and developers couldn’t design using CSS alone, because [...]]]> http://jonraasch.com/blog/drawing-with-css/feed 3 10 Javascript Performance Boosting Tips from Nicholas Zakas http://jonraasch.com/blog/10-javascript-performance-boosting-tips-from-nicholas-zakas http://jonraasch.com/blog/10-javascript-performance-boosting-tips-from-nicholas-zakas#comments Wed, 10 Feb 2010 16:55:06 +0000 Jon Raasch http://jonraasch.com/blog/?p=709

10 Javascript Performance Boosting Tips from Nicholas Zakas

Nicholas Zakas is a Javascript guru and principle front-end engineer for the Yahoo! homepage. Zakas just announced his new book High Performance JavaScript, which you should order today. Zakas is pretty much the man when it comes to Javascript performance, and in June he gave a Google Tech Talk entitled Speed Up Your Javascript. While [...]]]> http://jonraasch.com/blog/10-javascript-performance-boosting-tips-from-nicholas-zakas/feed 8 Appending Style Nodes with Javascript http://jonraasch.com/blog/javascript-style-node http://jonraasch.com/blog/javascript-style-node#comments Tue, 22 Dec 2009 15:00:47 +0000 Jon Raasch http://jonraasch.com/blog/?p=456

In Javascript it often makes sense to attach a stylesheet rather than style a bunch of individual attributes. Appending a stylesheet to the DOM has a number of advantages: Stylesheets can be easier to work with than Javascript—it’s just more natural to use CSS syntax for styling. It’s nice to avoid the cross-browser headaches associated [...]]]> http://jonraasch.com/blog/javascript-style-node/feed 3 Book Review : Learning jQuery 1.3 http://jonraasch.com/blog/book-review-learning-jquery-1-3 http://jonraasch.com/blog/book-review-learning-jquery-1-3#comments Mon, 14 Sep 2009 17:06:04 +0000 Jon Raasch http://jonraasch.com/blog/?p=332

For the past couple years jQuery has been gaining in popularity, from a hot script with easy CSS selectors released by John Resig in 2006, all the way to jQuery 1.3.2, probably the most widely used Javascript library today. The jQuery core has been constantly expanding, offering new methods and performance tuning with every release, [...]]]> http://jonraasch.com/blog/book-review-learning-jquery-1-3/feed 1 10 Things Every Good Web Developer Should Know (A Checklist) http://jonraasch.com/blog/10-things-every-web-developer-should-know-2 http://jonraasch.com/blog/10-things-every-web-developer-should-know-2#comments Wed, 12 Aug 2009 15:40:54 +0000 Jon Raasch http://jonraasch.com/blog/?p=299 (more…)]]> http://jonraasch.com/blog/10-things-every-web-developer-should-know-2/feed 10 YouTubin’ Plugin for jQuery http://jonraasch.com/blog/youtubin-jquery-plugin http://jonraasch.com/blog/youtubin-jquery-plugin#comments Mon, 15 Jun 2009 18:47:16 +0000 Jon Raasch http://jonraasch.com/blog/?p=91 YouTube videos clean, easy and unobtrusive. In its simplest form, YouTubin' grabs any links that point to a YouTube page and replaces them with an embedded video. To do so, YouTubin' leverages SwfObject 2 if available, but otherwise just embeds the video through standard markup. Advanced options include flagging specific video elements using a jQuery selector and setting a variety of swf properties such as dimensions, flash version, flashvars and params. Youtubin' can even be used to cause the video to embed once a link is clicked rather than when the page loads. Download YouTubin' jQuery Plugin]]> http://jonraasch.com/blog/youtubin-jquery-plugin/feed 6 Contact-Pop: Contact Form Overlays with a Simple jQuery Plugin http://jonraasch.com/blog/contact-pop-jquery-plugin http://jonraasch.com/blog/contact-pop-jquery-plugin#comments Thu, 07 May 2009 15:52:46 +0000 Jon Raasch http://jonraasch.com/blog/contact-pop-jquery-plugin http://jonraasch.com/blog/contact-pop-jquery-plugin/feed 49 A million ways to embed custom fonts (and keep typography nerds off your back) http://jonraasch.com/blog/embedding-custom-fonts http://jonraasch.com/blog/embedding-custom-fonts#comments Tue, 24 Mar 2009 16:35:27 +0000 Jon Raasch http://jonraasch.com/blog/embedding-custom-fonts http://jonraasch.com/blog/embedding-custom-fonts/feed 15 10 Javascript Resources – From Noob to Pro http://jonraasch.com/blog/10-javascript-resources http://jonraasch.com/blog/10-javascript-resources#comments Fri, 30 Jan 2009 21:54:15 +0000 Jon Raasch http://jonraasch.com/blog/10-javascript-resources Core Javascript Guide. Javascript can be a really confusing language at first and going through each of these pages will make you comfortable with Javascript's peculiar syntax and methods. (It's way better than w3schools.com) ]]> http://jonraasch.com/blog/10-javascript-resources/feed 6