MegaSack DRAW - This year's winner is user - rgwb
We will be in touch
i've been looking at Salsa Cycles and really like the effect at the top of this page. could i do it on my own Wordpress website?
http://salsacycles.com/stories/2_days_gunflint_trail_buffet
a strong logo over blurred image, scroll down to remove the blur, sharpen the image and see a bold headline. scroll down further and the text comes up from below. is it something to do with sliders?
Had a look at the source? line 70 onwards has the Blured and Clear Images
What a slow, slow loading website.
I haven't seen the posh effect as I gave up after 20 seconds or so.
Personally, I would rather have clean, quick loading and works on every browser/device, than some posh effect that looks good on your one browser and connection.
Ouch, that's terrible in terms of load time and I frickin hate timer indicators that loop around (and are therefore basically just there to indicate something is still happening as they know its stupidly slow rather than give you a meaningful progress indicator).
Doesn't work on my handheld mobile device but the picture looks amazing on my laptop though. It's a great effect once it's loaded, although the wait time does remind me a little bit of the old days of dial-up connection! 🙂
I'm with Matt.
It's parallax. An css or jquery option for background images in some wordpress themes.
I'm unimpressed by the website too. I can understand having nice covers on magazines, brochures, printed material etc. But it very rare for it to work on a website. Just adds to the number of clicks to find anything.
Also, not a fan of sites that have this fancy scroll down malarkey either. It would be ok if everything lined up with my screen but after 3 "page downs" on the salsa site, its all skew-wif and I've ended up with everything straddling the top/bottom screen edges. waste of money.
Actually, I'll add another annoyance, as I'm scrolling down its sliding thing on from the side. Just because you can, doesn't mean you should!
end of rant....
I should add, that I've never designed a website, and have no experience of online sales. So could be talking complete bol...
They seem to be using an opacity effect which goes from 0 - 1 as you scroll
Basically an image on top of an image, when you scroll the opacity changes to reveal the perfect sharp image below the blurred.
In Chrome - right click on the page, click [b]Inspect[/b] target the main image and it will show you in the Elements window that opens what I mean.
Maybe just me, but if they were hell bent on the effect I would have gone from sharp to blurred.
Seen parallax before but not the blurred/focus thing. Quite cool.
Large part of the reason the page is a bit slow is that it transfers 20MB of JPEGs and doesn't let the page draw until that's done.
Even on a quick connection & CPU it takes a while to download, then the rendering of the images takes a while too (some are 2000x1333 in dimension).
Got bored waiting for page to load and gave up. Not a feature I'd want.
No reason why the blurred/unblurred thing needs to make it so slow to load. The slowness is because it's pre-loading all the images for the entire page, which is silly.
Generally I hate the "one big scrolly page" fad, but I think for something like this which is a single article it works well. Apart from the loading delay and the pointless animation of the sidebars, I quite like it.
Also, gave up 🙁
It's nice but I agree they've traded off too much speed/usability to do it.
No chance of that EVER loading on my rubbish internet connection! Therefore, obviously, I would suggest not using that effect!
What a slow, slow loading website.
It's the huge spike in traffic it's getting from this link.
(or maybe not)
transfers 20MB of JPEGs
TWENTY MEGABYTES of images on a single page??!!!
Ouch, that's terrible in terms of load time and I frickin hate timer indicators that loop around
My thoughts exactly. I think it's slow because it's loading what's basically an entire image-heavy website as one single page. Form over function.
That said, you could probably get the effect of the blur / sharp image independently from the rest of the Site Of Stupid design and it wouldn't take an Ice Age to load.
TWENTY MEGABYTES of images on a single page??!!!
How times have changed. Back when I was doing webdev, IIRC the rule of thumb was no more than 50Kb for a single page...
(and are therefore basically just there to indicate something is still happening as they know its stupidly slow rather than give you a meaningful progress indicator).
I doubt it's even doing that, rather it's just an animated logo which doesn't actually tell you anything meaningful other than the site hasn't completely crashed.
No one has traded off anything.. basically a crap web developer / designer or theme is the reason its bloated. The effect is fine and can be done with very very little impact.
Yes its easy to do - but for you to do it yourself and keep it fast, probably not.
What a slow, slow loading website.
I haven't seen the posh effect as I gave up after 20 seconds or so.
yup, gave up.
If the effect you're after is that of driving people off to other sites, it's probably a masterpiece.
more to the point, what the hell is the drivetrain on that green thing? looks like 2 cogs at the front and at the back, but no mechs and nothing to take up chain slack - is it a case of 4 gears but a manual 'drop the wheel and retension of the chain' each time?
Even on our super fast broadband, that page takes several seconds to load. Very interesting when it does, and some fantastic photography, but it's very much style over substance. No way I'd bother trying to look at that on my 'phone, on 3G!
20Mb. When I first had the internet, that would have taken hours to load. Bearing in mind many people don't have particularly fast internet, I don't understand why that company thought it a good idea to have such a demanding site. I imagine most would simply not bother waiting for it, I know I wouldn't!
And I had to actually check to see what it was for; that's a big fail. Didn't know whether it was for bikes, or clothing, or other stuff.
Not very good. Less is more.
Completely agree with the earlier comments about massive pages that scroll forever and have parallax scrolling. Does my nut in, increases load times and means I have to scroll for ages. I've noticed that some sites have a menu and all it does is link to anchors further down the single page. Eurgghhhh.
National Trust is another example of a website that has gone down this route.
5lab - Membermore to the point, what the hell is the drivetrain on that green thing? looks like 2 cogs at the front and at the back, but no mechs and nothing to take up chain slack - is it a case of 4 gears but a manual 'drop the wheel and retension of the chain' each time?
Dingle-speed.
Almost exactly what you describe but actually only 2 gears matching insides and outsides only. As the tension is done with rockers and the dropout horizontal if you get the gears right you just drop the wheel to switch and dont need to retension*
*you should if you are obsessive as the difference in tension changes as the top and bottom run of chain are more parallel in the lower gear and thus a few % shorter distance which would need to be taken up, in reality tho its good enough to not need to with tall toothed singlespeed rings holding the chain on.