File Under: CSS, HTML5, JavaScript

Celebrate the Holidays With Advent Calendars for Web Nerds

The holiday season is upon us and for web nerds that means only one thing — advent tutorials.

Sure, it might be getting colder, possibly even snowing where you are, but the real way a web developer knows that the holidays are here is that 24Ways, the annual advent calendar for web nerds, is out. That means it’s time to learn new tricks, re-learn best practices and get a leg up on some of the year’s best ideas in web development.

This year’s 24Ways has a decidedly responsive design slant to it (so far anyway). Developer Jeremy Keith weighs in with a tutorial on how to use conditional loading for responsive designs. Adaptive images creator Matt Wilcox also has a great in-depth look at how his technique can serve up the appropriate image size without changing your HTML markup.

Other highlights include a great article from Rich Thornett on the hazards of relying on third-party widgets within your pages. Thornett’s solution is to load your widget content into a hidden <div> at the bottom of the page and then use a local script to move the loaded content from the hidden <div> to its display location. That way, should your third-party widget fail to load, at least it won’t stop the rest of your page from loading.

Also be sure to check out Drew McLellan’s walk-through of CSS 3′s unicode-range. By adding the unicode-range property to a @font-face rule, you can, for example, specify a different font just for fancier ampersands. McLellan covers how to make it work and how to handle the (inevitable) browser shortcomings.

Awesome as 24Ways is — and we’re looking forward to seeing the rest of it — it’s certainly not the only advent calendar around for web nerds. The Mozilla Developer Network has an advent calendar up with some nice articles on topics like WebGL, though in this case most of the articles listed are already up elsewhere on the web.

Somewhat more interesting, especially for those of you who want to get even nerdier than usual this year, is the Performance Calendar. This advent calendar is devoted to tackling the often confusing world of website optimization. All the posts are worth a read, but be sure not to miss Guy Podjarny’s article on why “inlining everything” is not the answer to your site’s speed problems. Also worthwhile is Tim Kadlec’s detailed investigation of mobile networks, appropriately titled: Carrier Networks: Down the Rabbit Hole.

Altoids Advent Calendar photo by Kim Taylor/Flickr/CC. For instructions, visit her blog.