stuff.co.nz re-launch

March 7, 2009 at 11:47 am In Web, stuff I like, 1 Comment

One of my new years resolutions was to not read the news online through the major news agencies and so far I am enjoying my decision. I am no less informed through other channels than I was before, either that or there is a lot of stuff that I just don’t care about because I don’t know about it. However, I heard that stuff.co.nz had relaunched so I had to check it out. Professional curiosity.

From stuff.co.nz’s own article on stuff about stuff here is how the new site is described;

Stuff, New Zealand’s leading news, sport and entertainment website, has been revamped and upgraded, with a fresh, new look, a range of new features and a major upgrade of the underlying technology to produce a faster, more user-friendly site.

First of all I think stuff.co.nz was well overdue for a makeover and change is good for Stuff, as it was looking a tad tired. However I am not convinced of the new look and usability just yet. It isn’t quite working for me (sometimes literally).

Things I am not so keen on

1. A customisable home-page you will never see.

One of the new innovations is a customisable home-page that you can tailor to give you the news you are interested in only. Hurrah, I love these features on other sites, especially on the customisable Google Home-page. However if you want to customise the Stuff home-page don’t get your hopes up too much. The top part of the home-page is fixed and you have no choice as to what content appears here. Fairfax does. To get to the areas you can customise you have to scroll down not one screen worth, but two screens worth of compulsory content, then you get your customised content. So the benefit of this is…? If I want to read the technology articles, instead of visiting the home-page and then scrolling down two screens, it is far easier for me to click the big convenient “Technology” link in the primary navigation. A user wants to see their customised content first, hell that’s why they bothered “customising” the page to start with.

Tip. As a user if I want to customise the home page, I want the things I am interested in at the top so I can easily find it. If you want to spam the user with compulsory content and ads on the home page, then dont make the home-page customisable. It offers no value.

2. Changing the nav on users.

Throughout the Stuff site, and all the other sister Fairfax sites, there is a nav bar right at the top of each and every page. This nav provides you links to all the sister sites, no matter where you are. On the Stuff home-page, it is there with links to all my favourite sister sites like Trade Me, Travelbug, Find Someone and Old Friends. In the middle of the home page is a big colourful navigation bar that has all the sections of the site linked to. Now, as I click into one of the sections of the Stuff site, the big colourful nav bar I just clicked on vanishes. WTF? Also the top sister site nav bar changes on me. It looks the same, but instead of linking to the sister sites, it now becomes the primary nav for the Stuff site, with links to the other sections like National, International, Business etc. So a user has just clicked into a section, and now the primary nav, the most important navigation device on a site, has effectively GONE. Not only that, another navigation device (for the sister sites) is also gone, and has transmogrified into the primary nav.

Tip. Keep your primary navigation consistent! Exclamation mark for emphasis. As a user I don’t want to have to learn new things on each page. I have seen your home-page, which has established the main conventions of using the site for me. Don’t change these conventions! Please keep the navigation bar on every page in the same (or close enough to) the place it was on the home page.

3. The Search UI is Broken.

After recovering from the nav moving around on me, I really wanted to try out the Google search. I clicked the “Search site button” but alas I got a blank page . No error message, no nothing. I click back in my browser and tried again. After clicking around for a bit I relalised I was using the search wrong. The “Search Site” button is a form submit button, but I could not see the search input field and was clicking “Search Site” without specifying what I was searching on. Have a look below and see if you can spot what I was doing wrong.

Spot the search input field
(hint it is the white box with a white border on a white background.

Tip. Perhaps the search input field should be a little more defined or visible even. (I was using Firefox BTW so am not sure if this field is more visible on IE).

4. Confusing icons and interactions.

I wanted to remove some of the rubbish like “Life & Style” (what the hell is Life & Style). So there is a pencil icon to let me configure each of the panels. Awesome, here comes the customisation fun, I was excited. By clicking on the pencil I get a new row roll down underneath the colourful header. I wanted to remove the panel and what do you know, right underneath the pencil (where my mouse is as I just clicked on the pencil) is an . I click the and the config row vanishes, but the panel is still there with Prince Charles still grinning like a loon. What I should have done was click on the word “remove” which neither looks like a button nor a link and is all the way on the left.

Removing Prince Charles Step 1. Click pencil

Removing Prince Charles Step 2. Don’t click , click the word “remove”.

Plus, “remove” is the only option anyway, so I have to click the pencil, then remove to remove the panel, but remove is the only option. So why the pencil?

Tip. Instead, why not have the remove option instead of the config pencil. Then I can remove panels with only one click, not two. If at some point you need to give more config options for each panel, like being able to specify the type and the number of articles to show (which would be really useful), then reinstate the pencil. But right now it is just adding clicks.

4.1 And while I am talking about the configurable panels…

I can move the coloured panels around on the left, but not the panels on the right. If a panel is moveable, then give it an icon indicating this. At the top of the panels there is a good intro instruction that says:

But some content can not be moved. How do I know what can be moved and what can’t?

Tip. Why not put the icon for “Move content” (the arrows) that is includedin the instruction, in the panel headers of the panels that are movable?

5. Give me a sign-in form.

In order to configure the site pages, I need to register with My Stuff. When I registered with the site I got this brief confirmation message.

Success

You have had your email confirmed, you can now login.

But there is no login link or form. There is a tiny weeny [sign in] link up in the header of the site. But that says sign in, I want to login. This is something that catches me out often, so that’s why I look for it. Pick a terminology and stick with it. One day I will learn too.

Also once I have “Signed in” the “Sign in” link becomes “Logout”.

Tip. If you have just confirmed someone’s account, either sign them in auto-magically, or have a sign-in form right there on the confirmation page so the user doesn’t have to hunt around. Also be consistent with your terminology. It is either sign in or login. Sign in is better, and should also be inversely Sign out.

6. Slow.

The site is really slow to load, perhaps not dial-up over broadband speeds, but it is slow. And here is why:

• The home page is 1129.9K. That is a megabyte and a bit. Wow.
• It has 379K of JavaScript and 500k of images.
• It is made up of a whopping 230 HTTP requests.
• Too many JavaScript files. http://static.stuff.co.nz/js/jquery.js and http://static.stuff.co.nz/js/jquery.jqURL.js is included 9 times each. That is 16 requests that can be got rid of for a start. Another tip would be to combine all the scripts together into one request. The stuff.co.nz homepage has 230 http requests. A browser typically downloads two resources from the same host at a time. That is a lot of resources to load all up and simplifying the load of the JS into one file would provide a huge performance boost.
• There are no expires headers on a lot of the resources, so each page is asking for the same images, JavaScript and styles sheets again, and again and again. An expires header simply tells the browser when an element on a page is due to “expire”. If an image has an expires header of next Thursday, then each time you load the page (until next Thursday) your browser won’t ask for the image each time, instead it will just use the copy it downloaded last time. Expires headers are set relative to the first time your browser loads the resource. So images like photos may never need to expire as the wont change and stuff has set the expiry of these resources into the future to 2037 which is good, however there are a lot of reusable images being loaded from the CSS have an expire date of yesterday.
• Move all the JavaScript to the bottom of the page, please. The loading of scripts blocks parallel downloads. Normally your browser will have simultaneous connections for download page elements, so the browser will download two images at a time or more. However as scripts can affect the rendering of the DOM, if the browser needs to load a script, it blocks all other downloads until the script is loaded and executed. By moving all the JS to the bottom, before the close of the </body>, not only do you know the DOM is almost complete so your JS can interact with the DOM safely, all the other resources will have loaded so the JS won’t block any other requests.

7. Georgia, oh Georgia

I am not keen on Georgia font for the article titles, then having the content Helvetica. Pick either a serif font or a sans-serif font. Mixing them up looks ugly (in my book).

Tip. Go sans-serif, it will tie in with all the other Fairfax sites better. Verdana or Arial is good.

Things I like

The weather in the top left hand corner of the banner. 90% of the time I looked at you Stuff, all I wanted was the weather. Fabulous!

Over all it is a nice change. Aside from all my criticisms above, which can all be easily fixed, the new look is fresh. It is an improvement on the old stuff.co.nz. I think there are some nice ideas coming through in the new site. I understand it has just launched and there will be ongoing changes needed, as long as the site is refined and some of the things that I have mentioned get fixed I think it will make for an awesome news site.

I am not picking on things for the sake of picking on things. When I used to read the news online I loved Stuff, and I visited it several times a day. I would really love the new stuff.co.nz to be better. I give it a C+ in it’s current form, and I am sure Stuff will try harder and will make it better.