Seb Lee-Delisle lights up our 2016 advent series with an illuminating guide to making your own Stranger Things style fairy lights to pick up messages from the upside-down (also known as the Internet).

Remy Sharp picks that old chestnut – tabs – and roasts it afresh on the open fire of JavaScript to see how a fully navigable, accessible and clickable set of tabs can work. Everybody knows some scripting and some CSS can help to make your website bright. Although it’s been said many times, many ways, please be careful to do it right.

Jonathan Snook considers the problem of container (or element) queries in the context of responsive web design and looks at the approach taken by current open source JavaScript solutions. Remember, no matter what size of box your Christmas gift comes in, it’s the thought that counts.

Eric Eggert celebrates the simplicity of making websites accessible and, when accessibility is as fundamental to a project as performance and code quality, how it can improve the experience for all users. The web, like a gleeful cheer of “Merry Christmas” at yuletide, is for everyone.

Rachel Andrew unwraps the new paradigms of web layout, comparing their features and showing how they can free us from grid-based, div-infested frameworks. Beautifully wrapped boxes look lovely under the Christmas tree, but we need to think and break out of them.

Ros Horner rings out a Christmas message for designers far and near of peace and goodwill to all, especially if they’re developers. With a rallying cry to take back control to see your own designs realised, young or old, merry or sober, the story is clear; as you design, so should you build.

Guy Podjarny sounds a sober warning during our festivities, and gathers some winter fuel to help secure your apps and users from the web’s occasionally cruel frost. So mark his footsteps good, my friend, and tread thou in them boldly. Thou shalt find the hacker’s rage freeze thy site less coldly.

Ethan Marcotte dashes through the wintry landscape, his sled of flexboxed content drawn faithfully by a team of well-ordered hierarchical HTML huskies. For when it comes to structure and presentation, we must take care not to put the sleigh before the hounds.

Emma Jane Westby cracks open the door on Santa’s workshop to investigate what lessons can be learned about git rebase from the elves (or subordinate clauses if you will). Take what you can from their workflow, but don’t feed them too many mince pies; it’s bad for their ’elf.

Ruth John breaks out of the browser and projects a Christmas sound and light show with some JavaScript, the Web MIDI API and a portable A/V pack. Don’t make a spectacle of yourself at the party this year – take it outside!

Jack Franklin darns the holes left in our applications by exploring how our client-side JavaScript frameworks might also be run on the server to provide universal support for all types of user. How will you react when you see mommy kissing Server Claus?

Paul Lloyd perches his partridge in the CSS pear tree to discuss naming methodologies, ontologies and semantics. What’s in a name? That which we call a cherub by any other name would smell as sweet.

Sara Soueidan shows us three ways to create icon sprites using SVG: with HTML, CSS and, perhaps most powerfully, fragment identifiers. SVG has come on leaps and bounds this year – will you do the same in 2015?

Sally Jenkinson asserts that responsive design isn’t just about displaying content on multiple devices – we can also respond to users’ contextual needs to enhance experiences. When the snow lies deep and crisp and even, you’re gonna need a bigger boot.

Jeremy Keith leads us gently back to the basics of progressive enhancement with a simple navigation example. Ask yourself: does Christmas need to look exactly the same in every browser? Nope. Well, as long as you’re reading 24 ways…

Josh Emerson extols the virtues of progressive enhancement by acknowledging the need for speed, in both website rendering and interaction. With a new year imminent, there never was a better time to look backwards and forwards.

Jack Franklin introduces ECMAScript 6’s module system with some tools to help us start using this powerful new JavaScript functionality of tomorrow right now. Always good to be ahead of the game – sorted out your Christmas shopping yet?

Emma Jane Westby exercises her poetic sensibility to help us understand how Git commands can help us out of sticky situations. Quite soon you’ll turn that clatter on the roof into the prancing and pawing of each reindeer hoof.

Chris Coyier grabs Grunt by the snow-white fur of its Santa suit and places it firmly (but gently) in your webdev grotto to dish out its Christmas gifts — and maybe even chuck you under the chin and sit you on its broad and comfy knee. Not at all creepy. No. Nope.

Harry Roberts prepares for Christmas by squirrelling away experiments and drafts in private Git repositories, and here he neatly explains how he puts it in his pantry with his cupcakes. Once you’ve stuffed a stocking, most of all you’ve got to hide it from the kids.

Tom Ashworth exhorts us to become more familiar with JavaScript so we can better understand and use new tools like Node and Grunt — it’s always the box the gift comes in that’s more useful and fun, right?

Emma Jane Westby recommits us to version control by pushing a more mature approach to Git that merges relevant application with practical tips. Christmas might be for the children, but learning is for everyone, in[n]it?

Charlie Perrins reminds us of a fundamental requirement of our work: accessibility; and that there’s more to accessible interfaces than screen readers. Want to unplug at Christmas? Start with your mouse and don’t look back.

Ruth John ushers the Christmas party disco online using the Web Audio API to festoon your browser with some twinkling scripted lights that pulse along with your favourite festive tunes. So don’t be a wallflower — Santa’s up all night to get lucky…

Drew McLellan opens 24 ways’ ninth annual advent calendar with a primer on the sometimes arcane lore of rewriting URLs. But while Drew may ably match URL patterns using regular expressions, that shirt with the snowflake pattern clashes hideously with his holly and ivy tie…

Nathan Peretic weighs the page refresh in the balance and finds it wanting – wanting to be brought up to date, that is, with some future CSS sparkle.

Brian Suda packs his compass and map (well, his smartphone) to guide us all home for Christmas. And there’ll be one jolly fellow who’ll find this little web app useful on that annual 24-hour world trip.

Rachel Andrew unwraps the CSS3 grid layout module and sets out how its new properties can break the ties between source order and layout, and rescue us from the quaking ground of floats. Support is limited to IE10 right now, but Christmas and New Year are times for looking forward to the future.

Brendan Dawes raids his Christmas stocking early and shares some interesting and useful code snippets for you to grab, remix and combine into new things for 2013.

Nathan Ford delves deep into the sack of CSS goodies and rewards our attention with a clever object-oriented, scalable and modular approach to attribute selectors. Old wine in new bottles.

Les James proposes an alternative to the fully fluid grid as an approach to responsive layout challenges. Sprinkle on some Sass fairy dust and, providing you’ve been good this year, watch your creation spring to life.

Paul Robert Lloyd engages with the two main approaches to the matter of responsive images and finds them wanting. Could “Bah, humbug!” be a reasonable response to markup excess?

Val Head marshals overexcited CSS transitions and animations, which are like naughty children elbowing their way out of the presentation layer and into the behaviour grotto to get at the goodies before Christmas. Santa will be pleased!

Rachel Nabors brings together the web’s three Magi – HTML, CSS and JavaScript – to create seamless, soundtracked animations in the browser.

Drew McLellan invites you to pull up to the 2012 24 ways bumper, baby, with an neat JavaScript solution to an HTML5 <video> branding problem. And that was “24 ways bumper” not “Christmas jumper”. He has enough of those already.

Lea Verou unlocks the mysteries of CSS background gradients and investigates how they can be used more creatively to replace images. You’ll soon rather be throwing shapes at work than the Christmas party dance floor.

Scott Kosman administers an optimizing shot in the arm to your seasonally sluggish jQuery with some simple ways to improve performance. Get your jQuery running so fast that Dasher, Dancer, Prancer, Vixen, Comet, Cupid, Donner and Blitzen will struggle to keep up.

Jon Hicks slips the lambswool cardy of minimal markup beneath the stout tweed of CSS to discuss the elegant and practical potential of icon web fonts. Make simple, scalable icons on links, buttons and menu bars the port to your site’s stilton this Christmas.

Drew McLellan dazzles us with the creative typographic possibilities of unicode-range, a little-used property of @font-face declarations. More than just a unloved bauble on the CSS Christmas tree, unicode-range can extend a site’s typography in useful and eye-catching ways.

Brian Suda ponders some techniques for maintaining correct color contrast whilst still offering your users the ability to customise their own color scheme. So put your slippers on, kick back with a sherry and let the algorithms do the work.

Ethan Marcotte explains the theory and practice of CSS gradients, separates the duelling syntaxes and wields a mean color-stop. No longer will gradients confound, baffle or frustrate. Just leave the rainbows to the unicorns.

Sarah Parmenter reminds us that visual design for iOS devices involves more than just a smattering of CSS media queries. With a few extra steps, you can make your iPhone site work harder and put yourself in Santa’s good books.

Dan Mall breathes life into web standards-based animation. By striving for more than just mechanical movement, we can create more believable animated effects to enhance our users’ experience.

David DeSandro breaks on through to the third dimension with an in-depth look at CSS 3-D transforms and the new opportunities they offer to web designers. Go dancing on the Z-axis this party season!

Scott Schiller sounds out the possibilities of HTML5 audio, listening carefully to arguments about competing formats and the quirks in current implementations. When will we hear the sleigh bells in the snow on your website?

Christian Heilmann unwraps local storage, one of HTML5’s very useful new features. Speed up web services and cache frequently accessed data or even an application’s whole interface – local storage isn’t just for Christmas.

Inayaili de León shares her Christmas CSS wish list with us: from adjusting alternative font sizes to flexible box layouts, Santa’s little helpers will be kept very busy finding it all. And what’s on your list this year?

Richard Rutter expands our horizons with a guide to using the WebFont Loader. Whether you’re happy with a FOUT (in Firefox and Opera) or want to eliminate it (like Safari, Chrome and IE), Richard shows us how to avoid inconsistent user experiences.

Drew McLellan opens our 2010 season by revisiting the way we implement maps to cater for all types of visitors. Should we be building all-or-nothing solutions when it comes to mapping, or can progressive enhancement play its part here, too?

Rachel Andrew illustrates how, as more modern browsers come online, CSS3 selectors can be used to get some of the junk out of our front and back-end code, and how JavaScript can be used to provide a fall back for older browsers.

Jonathan Snook picks up our theme of font embedding with some ideas on how to reduce font download sizes and load time to lessen the impact of the Flash Of Unstyled Text. The less flashing the better, if you ask me.

Christian Heilmann uses the Yahoo! Query Language to assert that we already have a content management system in the form of the web. YQL unifies interfaces and combines requests to make working with APIs much easier.

Tim Van Damme continues our advanced CSS theme by introducing what can be done in Webkit browsers when things start to get animated. Get ready to put some motion in your ocean.

Natalie Downe segues seamlessly onto the subject of CSS 3 transforms and transitions with some examples of how a little CSS magic and a modern browser can bring what might otherwise be a flat layout to life.

David Greiner offers invaluable insight into building HTML emails. Just like HTML for the web, email requires an intimate understanding of the software used to view your work. Allow Dave to share from his wealth of experience.

Jeremy Keith issues a call to arms over how passages of dialogue are marked up in HTML, and more specifically, in HTML5. Stand firm, good designers and developers of the web, and don’t let poorly worded specs lead the people astray!

Patrick H. Lauke returns our focus to accessibility, and in particular to styling sites to be usable by visitors browsing with something other than a mouse. All this, whilst still maintaining aesthetic appeal.

Trevor Morris runs us through how JavaScript can be designed to take its configuration directly from your markup. Using the model of a jQuery plugin, learn how adding a simple class name can control how your code functions.

Bruce Lawson takes us a little further down the rabbit hole of HTML5. This week we’ve seen a glimpse of some of the great stuff coming, but how much of it can we start using right away? Luckily we have Bruce on hand to explain.

Inayaili de León introduces some of the new form field types available in HTML5, and then goes on to look at some more advanced CSS3 techniques which can be used to keep your forms looking sharp and ship shape.

Remy Sharp takes us by the hand and guides us through our first steps into the web applications side HTML5 with a look at web storage and offline applications. You’ll need a nice modern browser and some Kendal Mint Cake.

Drew McLellan kicks off our 2009 season with a look at some of the tools CSS3 provides for applying levels of transparency to colour values, enabling you to avoid weighing down a site design with heavy PNG images.

Dan Rubin pops down the chimney to deliver a neat little CSS gift that, in certain circumstances, could be just the trick needed to obtain those matched height columns so often desired. Whilst no technique is perfect for every situation, the more sharp tools we have in our CSS toolbox the better.

Ben Ward walks us through the process of building a small client-side application using the Fire Eagle API. Yahoo’s Fire Eagle is a service for disseminating details of your location physical location to other services on the web. Ben shows us how such a thing can be made useful.

Brian Suda mooves us up a gear with a look at using the Moo API for print-on-demand services. No web application is an island, so well written APIs can be a great way to hook into specialist services with the very minimum of effort. With a few simple steps, print can be one of those services.

John Allsopp has a shining example of what can be done to customise the look of HTML buttons without resorting to images. Custom button styles are a frequent request, but the use of images can heavily restrict the implementation. Avoid those pitfalls by sticking to pure CSS.

Kevin Yank gets down and dirty with CSS tables, a technique that offers all the layout properties we loved from long forsaken HTML tables with the clear advantages of modern CSS based design. Remember, just because it looks like a table and flows like a table, doesn’t mean it has to be bad.

Elliot Jay Stocks steps us through publishing a set of contact details using the hCard microformat. Once the basics are in place follow along as we add some sparkle with the aid of CSS3 web fonts, text-shadow, border-radius and first-child selectors.

Jeremy Keith does the maths and presents an interesting equation to help you to decide when to put the effort into providing support for Internet Explorer 6, and when to fall back on pre-existing shortcuts. Browser support is always a tricky business, so why not roll in some complex algebra too?

Christian Heilmann introduces a handy ‘build your own search’ web service from Yahoo that enables ordinary developers to harness Yahoo’s search technology for their own sites and web applications. Roll your sleeves up and get ready for some code.

Jonathan Snook introduces us to the world of Adobe AIR and talks us through using standard web technologies such as HTML, CSS and JavaScript to build a run-anywhere desktop application. I used to think I could run anywhere, but after sprinting through the town centre naked, the antisocial behaviour order has rather put a stop to all that.

Christian Heilmann delves into the world of JavaScript application dependencies with a smart technique to help manage the loading of parts of your application as and when needed. Just as Santa only loads the presents he needs for each trip into his sleigh, keep your loading lean and the reindeer will thank you.

Ethan Marcotte explores methods of delivering browser-tailored CSS to uncooperative user agents if the need arises. Like the brightly coloured, ill-fitting sweater granny gave you last Christmas, there’s some styles that are only appropriate in certain company. Choose wisely, my friend.

Simon Willison gets practical with microformats and the jQuery JavaScript library to demonstrate how data can be unobtrusively extracted from a page and plotted on a slippy map (like the ones we built the other day). See – it all links up. We think about this stuff.

Matthew Somerville takes us behind the scenes with a peek at how reindeer tackle internationalisation issues client-side. A tongue-in-cheek article with a serious message and a practical method for approaching internationalisation within JavaScript. Howzat?

Mark Norman Francis leaves no stone unturned in the quest for better markup. Today’s target is the humble, yet oft-abused definition list. Help the suffering stop this Christmas. With your help, the definition list can rebuild its life and learn to be happy again. We’re counting on you.

Stuart Langridge ponders that if a desktop application can warn us when Caps Lock is on, why not on the web too? Avoid unsightly login errors with this handy JavaScript technique, offering the opportunity to warn users that they have Caps Lock on when entering their password. You don’t have to tell me twice.

Elliot Jay Stocks demonstrates how, with careful selection, an image can be manipulated so that it can repeat for as long as necessary. Like a 30lb turkey, just when you think it’s gone, there’s always a little bit more.

Andrew Turner helps us take our first steps into neogeography by creating interactive, draggable maps using the Mapstraction library. So if you’re aiming to mash-up more than swede and carrots over the holidays, or simply need to plan an effective pub-crawl there should be something here to get your chestnuts roasting.

Drew McLellan kicks off our 2007 festive season by revisiting the thorny issue of support for alpha channel PNGs in Internet Explorer 6. Why not be charitable and lend a helping hand to those poor IE6 users? They could use some Christmas cheer.

Derek Featherstone contemplates the effects that the lack of CSS or JavaScript may have on your scripts. Let the spirits of Christmas past, present and future guide you so that your scripts needn’t give up the ghost in the face of adversity.

Nate Koechley demonstrates how the compact and powerful YUI Grids stylesheet can be used to conjure up all manner of layouts from the simple to the complex. Take it easy over the festive period, and let the YUI Grids do all the hard work for you.

Jeremy Keith appraises the humble hyperlink and highlights some of the more interesting, and perhaps lesser-known attributes that can be used to enrich the semantic value of your links. Consider it something to mull over whilst you polish off that gingerbread.

Shaun Inman reveals a powerful method for keeping light-on-dark text looking lean, mean and fighting clean. Stay looking trim this Christmas with tantalising tree-topping typography trick from the internets’ Mr Cool himself.

Drew McLellan investigates some of the ways JavaScript can be written to help it co-exist responsibly within your pages, and other pages too. We could all do with a little bit more peaceful co-existance over the holidays, couldn’t we auntie. Pass the gravy.

Mark Norman Francis looks at the increasingly ubiquitous tag cloud, and specifically how it can be marked up in HTML. It’s evidentially not a clear-cut issue, as everyone does it differently. What we need is some kind of markup junkie to weigh in with his suggested method. Oh, wait…

Ian Forrester gives an introduction to using XML’s forgotten child, XSL, as a client-side transformation language. Like a warming wooly scarf against the biting winter wind, Ian shows how XSL can be used to take the edge of even the ugliest XML documents to make them beautiful again. Thou shalt find the winter’s rage freeze thy blood less coldly.

Peter-Paul Koch continues our focus on JavaScript and Accessibility by demonstrating how fall-back HTML elements can be convincingly hidden when their functionality is to be replaced by Ajax. A viable alternative to what could be considered to be flashing your underwear at your users. No one wants that.

Andy Budd explores the thorny issue of adding rounded corners to boxes, this time looking at what solutions lie waiting for us with CSS3. Consider it a little like feeling the presents under a Christmas tree … you know what’s there, you just can’t quite have it yet.

Christian Heilmann frolics with Flickr and provides a super simple way of using photos on your site without the need for server-side scripts or the full API. Want to bore the internets with pictures of your cat? Well now you can, without even touching the server, Gran.

Drew McLellan examines a method of enabling users to control their interface with a dynamic text trimmer, similar to that found in Safari RSS. Feeling bloated? Lose some weight at the touch of a button.

Shaun Inman concludes our series by detailing a technique for executing JavaScript returned by an Ajax call without using eval(). Remember kids, Christmas Eve is when Ajax comes calling, so leave out some sherry and mince pies. Tonight we feast.

Drew McLellan follows on from Day 1’s simple Ajax tutorial by taking the next steps and building a Flickr-style text edit-in-place system. Crank your Ajax dial up to 11 and get stuck in. Ding dong!

Derek Featherstone considers the difference between decorative and informational graphics and how each is best approached, particularly with regard to accessibility. Make sure you know what you’re doing next time you decide to deck the halls.

Jonathan Snook investigates combining a full range of table elements and CSS to create more attractive data tables. Forget about decorating the dinner table for a week, and get styling those data tables.

Dustin Diaz introduces a technique for server-side style sheet switching without reloading the page. Using Ajax, the Unobtrusive Degradable Ajax Style Sheet Switcher combines the convenience of client-side switching with the robustness of processing at the server.

Kimberly Blessing examines some common hacks used to deliver specific CSS rules to the stylistically-challenged Internet Explorer. With the forthcoming arrival of IE7, unchecked hacks could really knock the stuffing out of your turkey, so let us guide your sleigh tonight.

Patrick H. Lauke concocts a rather handy little JavaScript function to help you stripe your tables, lists, bathroom, you name it. And there you were thinking the only stripy thing you were getting for Christmas was a sweater. How little do you know.

Roger Johansson returns to first principles and considers the fundamental differences between Transitional and Strict DOCTYPEs, as well as some of the common mistakes made when dealing with each. A timely reminder of the fundamentals can never go amiss.

Michael Heilemann dabbles with the Script.aculo.us JavaScript effects library to demonstrate how easily powerful effects can be added to enhance interactivity. Thought you were all that now you can do some Ajax? Turns out you’re not so hot, big boy, so get your chops around this.

Andy Budd studies the slightly maligned CSS attribute selector to see how it can be used productively despite incomplete browser support. If I had to select one of Andy’s attributes it would be his compassionate demeanour, but that’s by-the-by.

Drew McLellan takes a quick look at a simple method of styling navigation so that the correct item shows selected on each page. It’s a really simple idea, but extremely effective, and quite a time-saver to boot.

Ethan Marcotte delves headlong into the sticky issue of centered, list-based tab navigation with remarkable verve and compelling results. Snuggle up by the fire with a hot toddy and a moist companion, for today’s tip is freshly ironed for sir’s pleasure.

Simon Willison gets down and dirty with JavaScript and explains why caution should be exercised in use of the eval() function. It may be the season of good will and all, but we can’t have our caution getting all flabby now, can we?

Drew McLellan takes a practical look at the hCard microformat and how easily it can be added to existing markup. He then stops talking about himself in the third person to convince the crowd that it’s not just all hype. Baby.

Jeremy Keith is a man of many words – most of them stolen. Thanks to this nifty technique for enhancing the display of block quotes, at least you’ll know where he got them from. But don’t quote me on that.

Rachel Andrew discusses an approach to rapid and reliable CSS development. Save hours of layout work and testing on your next CSS build – time that could be better spent roasting chestnuts or baiting children.

Ian Lloyd looks at how DOM Scripting can help out with an uncomfortable accessibility issue. Form field labels can be tricky to implement in some cases, but with a little ingenuity Ian demonstrates how a balance can be struck.

Drew McLellan talks us through how to get going with some quick and easy Ajax using the freely available Prototype JavaScript library.