Dev Depot: Spritepad, Speeds Website Delivery

Stephen Yagielowicz

Calling itself the easiest way to make CSS sprites, SpritePad could save web designers countless hours of tedious work.

Savvy web designers know that one of the easiest ways to speed up a website is by consolidating multiple graphics files into a single image; using CSS to specify the dimensions and X- and Y-axis of the selected portion of the final file (known as a “sprite”). The benefit of this approach is in reducing server calls, eliminating the back-and-forth negotiations between server and client (the web browser) usually involved with the request and delivery process.

Using SpritePad is as simple as dragging and dropping images onto the speed-optimized workspace.

While sprites make a definite impact on page load times, creating them is usually a time-consuming process, combining multiple smaller files into one Photoshop image file, for example; and then manually calculating the individual image’s dimensions and positioning and then applying that data to the CSS file.

There is a lot of room for errors and transcription problems, leading to unneeded frustration.

A product of German company KISS, SpritePad (www.wearekiss.com/spritepad) is a free online tool that automates and streamlines the creation of CSS sprites; producing high-clarity, bandwidth-optimized sprite images, along with their enabling valid CSS code, in a mere matter of moments.

According to its publisher, using SpritePad is as easy as writing e-mails — with a background grid, guides, rulers, magnetic alignment and smart document fitting, among other tools, which promote easy CSS coding and sprite generation.

Using SpritePad is as simple as dragging and dropping images onto the speed-optimized workspace, where they become immediately available as a single PNG sprite along with its accompanying CSS code — without the use of external tools such as Photoshop and without manual CSS style assignments.

The sprite and code snippet updates instantly, each time a new image is added, moved or changed, so there is no need to do the same work twice.

SpritePad is compatible with all modern web browsers. The service enables users to work wherever and whenever they want, by registering a free account to download, load, and save their CSS sprites as editable versions, stored online in the company’s cloud. Free accounts allow web designers to store and access up to two CSS sprites, while premium users have the ability to store and share additional sprites, and to make use of the SpritePad collaboration engine, which allows team members to share resources.

Related:  

More Articles

profile

Q&A: Paxum CEO Octav Moise Shares the Wealth

Alejandro Freixes ·
educational

S2S Postbacks: Getting Ad Stats in 1 Place

Juicy Jay ·
opinion

Tips to Master Customer Subscription Retention

Cathy Beardsley ·
opinion

A Primer on How to Integrate Paysite Processing

Jonathan Corona ·
educational

Trademark Ruling a Victory for Adult Products, Services

Marc Randazza ·
profile

Q&A: Rich Girls CEO Cristina Enriches Cam Models

Alejandro Freixes ·
profile

Q&A: LiviaChoice Embraces Grand Camming Destiny

Alejandro Freixes ·
opinion

Refined Protocols Reduce STI Risks for Performers

Eric Paul Leue ·
educational

Camming 101: Establish Boundaries to Keep the Fantasy Alive

Steve Hamilton ·
profile

Nikki Night Forges Cam Model Excellence

Alejandro Freixes ·
Show More