Luke
December 03 2007 @ 02:46PM #
Ah, so that’s what that site was! Pretty nifty article mate, I’m sending across to my company’s designer as we speak. Nice one :)

On 1st December, Drew launched this year’s 24 Ways, the web industry’s annual ‘advent calendar’ of tips and tricks, and I’m pleased to announce that my article for the site has gone up today! Entitled “The Neverending (Background Image) Story”, it’s a quick run-down of how to create a seamlessly repeating background, reduced to 5 simple steps that you can apply to pretty much any image you use.
The premise behind the 24 Ways is a simple one: to give away a web design tip for every day of December up until Christmas Eve. It’s a kind of mini A List Apart except that you get a present every day. It’s a shame Zeldman isn’t Santa, though – I think he’d make a jolly good one.
My article will sit alongside tips, tricks and musings from some of the web’s finest designers and a whole bunch of my heroes, so I’m extremely proud to be a part of this excellent publication. ’’The Neverending (Background Image) Story" is on 24 ways from today, so go and check it out… and let me know what you think!
Thanks for reminding me about 24ways. I followed it last year, but forgot about it again. Nice article too.
Thanks guys! I’m glad you enjoyed the article. There are loads of great authors coming up on 24 Ways, so make sure you keep your eyes on the site!
Darn nice work there Elliot. =)
I think it might have been cool to use that “one-pixel wide” image as an x-repeated image on the body element and then your image overlayed on that. Would have been a similar effect without repeating the graphic on super-huge monitors. Just an idea.
Elliot, I’d add one technique to your excellent description: the offset filter (found under Other). Choose a horizontal offset of about half the picture width, select ‘wrap around’ and presto! The ‘join’ is now in the middle of your image. You can now apply all the effects you describe, including the clouds, directly on that part of the image. As long as you never ‘touch’ the new edges, you will get perfect repeatable images.
Thanks for your comments, guys! I’m glad you enjoyed the article. There have been some great ones since by the likes of Andy Clarke, Dave Shea, Simon Willison, Mark Boulton, Paul Boag, Natalie Downe, Ethan Marcotte, Mark Norman Francis, and Richard Rutter (to name but a few), so I hope you’ve been visiting the site regularly. If not, go there now!
@ Chris Coyier: That’s a possibility I considered, but most of the time gradients like that look pretty bad; the blends between the pixels are just too obvious. It’s worth considering on other occasions, though, as it’s completely dependent on what colours or imagery you’re working with.
@ Bruce Bowden: Thanks for the tip! I’ve never actually used the offset filter before so I’ll have to experiement.
Hi there,
Very nice site, I was wondering how you got the background image to remain in the same position and have the site scroll instead, is it a secret or something you can share.
Nice Job.
Recent Comments: