Oakley's monster page of baubles

    Posted by Phil Hawksworth on
    and tagged #excess and #examples

    The ridiculous trend of giant, bloated web pages crammed with every visual bauble and gimmick imaginable seems set to continue. This time thanks to a site by Oakley.

    I have been gathering examples of this kind of site and using them as examples of what NOT to do in my talk "Excessive Enhancement" for some time.

    When Brad Frost alerted me to this example though, I thought it had to be a spoof. Nobody would consider this to be a good idea would they? Really? These types of site, which uses HTML5, CSS3 and emerging web development techniques to create a page with parallax effects and animations as you scroll are frequently bloated and terrible citizens of the Web.

    Vital statistics

    Without a primed cache, over my home broadband (advertised by my provider as 16meg but usually peaking around 11meg) this was my experience:

    • 85.4MB page weight
    • 471 HTTP requests
    • 2 minutes 45 seconds until loading screen replaced with content
    • 4 minutes 10 seconds minute onLoad event

    Astounding!

    You can visit the page to take a look while it is still around at http://moto.oakley.com (I predict it might not last forever) but you can see a video of it below at a cost of just 28.5MB (saving you almost 60MB of bandwidth and allowing you to skip 2 minutes 45 seconds ahead to see the site)

    Now, I want these things to stop emerging, but at the same time, I'd rather not let Brad beat me with this example. Does anyone have a better (worse) example out there to share? Send them my way on Twitter at @philhawksworth

    Update

    Oakley responded and have updated this site. Some of the particulars are in my follow-up post: Oakley's Moto diet

    Comments

    Let me know your thoughts using the form below.

    Leave your comment

    Markdown is allowed, but HTML is not. Neither is spam thanks.

    Related: Reflecting on Full Frontal 2011