CSS Sprites – Picture Slicing’s Kiss of Demise – A Checklist Aside

Article Continues Beneath

My fellow old-time net designers might bear in mind the fun of picture swapping by way of JavaScript. Right here’s how we did it again in 1998 (don’t hate me as a result of I’m lovely):

Even when a few of us discovered, the next yr, that HTML was imagined to be for structured content material, CSS for visible structure, and JavaScript for habits—and even when browsers started supporting that separation of powers a few years later—for years, the net continued to be a hodgepodge of sliced and diced photographs and extreme http calls, all held collectively by way of inline JavaScript that turned HTML right into a chocolate-and-peanut-butter soup. Positive, all of us needed our separation of presentation from construction—however we liked our glitzy visible results extra.

After which in 2004, a beautiful man named Dave Shea—the identical prophet who had launched the CSS Zen Backyard simply eight months earlier—helped our complete trade kiss all that goodbye with a single, deceptively easy A Checklist Aside article.

Rereading CSS Sprites: Picture Slicing’s Kiss of Demise from the consolation of right this moment’s privileged place, it’s simple to overlook how new and revolutionary Dave’s pondering was.

At this time we take refined CSS without any consideration, and we anticipate our markup to be simply that—clear and semantic, not oozing habits and leaking structure. However in 2004, eradicating all that cruft from HTML took braveness. And it was an act of absolute wizardry to conceive {that a} grid of photographs in a single grasp GIF or JPEG may substitute all these http calls and subfolders filled with tiny photographs because of CSS’s hover property and cropping skill. Admittedly, Dave couldn’t have executed what he did with out Petr Stanicek’s (Pixy) Quick Rollovers With out Preload, an ingenious predecessor to CSS Sprites which Dave readily acknowledged in his groundbreaking ALA article.

If you wish to know the way huge an influence CSS Sprites: Picture Slicing’s Kiss of Demise had on our trade, think about that, ten years later, CSS Sprites are nonetheless net design’s commonplace finest observe for including non-textual interactive cues to an internet web page.

As we have fun 25 years of the net, let’s additionally admire the accomplishments of the final ten years by the good members of our net design neighborhood. Congratulations and thanks, Dave Shea—and congratulations to us all.

Leave a Comment