It is Tour time and I have to get my bike fix all over the internet. Which means I have to go to Velonews on and off. VeloNews used to be my favourite bike site, but they've gone through two redesigns since their acquisition by Competitor. Each one I've felt degraded the site… visually, technically and most importantly from an editorial viewpoint. I've found this all really sad– end sidetrack.

One thing they've done with their site that I've found both innovative and incredibly distracting and annoying (at the same time) is put up large format background images ads. (see the picts). But these ads are too big. They push the page dimensions out too wide for a reasonable display width (1600px) and end up making the site look broken. In an effort to fit it in, they've also made it too close to the margins of the main body content – making it hard to read the site.

I was finding it so difficult to look at the site and read it that I had to do something. I don't know how to 'hack' their webserver, so I had to do something a bit more personal. Enter Greasemonkey and Stylish. I fired up my Firefox browser and clicked on the 'Add ons' area, ' Go get more Ad ons' and did a search for 'stylish'. Stylish is a plugin or add-on for Firefox that lets you write your own custom styles for websites. Normally I just use it to make Government of Canada websites more bearable to look at when I'm working on a project there. This is the first time I've had to use it on a commercial site. But it made all the difference. I just added a simple custom style sheet for Velonews:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("velonews.competitor.com") {

body {background: url(xxx.gif) no-repeat #fff !important;

}}

And voila – no more annoying distracting background ad.

Posted via email from 7thgroove’s posterous