Dangerfield Website Design: Banana Peel - Ziller Web Marketing Blog

Hey there, welcome to our third installment of ‘Sydney-based eCommerce websites we’d change’. Once again, we’ve been trawling cyberspace in search of some of our favourite retail chains that could use a bit of a makeover, and this week, it’s the Dangerfield website.

A bit of a background on Dangerfield

If you’re between the ages of 18-30, are really into the music scene and the fashion that surrounds it, then Dangerfield should be a name that rings a bell. Originally from Melbourne, Dangerfield are now a nation-wide retail chain that specialise in the retail of branded and custom made bohemian style clothing. We’re talking leather jackets, studded belts, chaotic tee shirt designs and skinny jeans to give you a visual.

Dangerfield appeal to a huge demographic, and through their growth have obviously achieved a lot of success through their sales. In fact, you can even visit them in select Myer stores around the country.

A lot of the Dangerfield stores have been designed to reflect the rawer elements of youth culture with a strong emphasis on post-modern art, punk and goth styles.

If you take a look at their website, a lot of this is visually summarised within the insane background image. What’s a shame though, is that there’s actually nothing going on to promote the sales of their products online.

Should a boutique clothing store take to the Internet?

Yes. We don’t need to rant on how important we think eCommerce is, we normally let our clients see for themselves. When you take your business online, you’re effectively opening up an additional revenue stream. In fact, it seems senseless not to.

eCommerce opinions aside, let’s dissect the Dangerfield website and see what they could do to improve usability and customer experience:

1. There’s no catalogue of products – Understandably, if eCommerce is not an option, then your website should become an information portal for customers searching your brand online. The first thing that sticks in my mind when I land on the Dangerfield website is, “I can’t shop, so can I at least browse through their product range?”

If you’re new to the Dangerfield brand, you want to know the style of clothing that they sell. This is best achieved through the brand offering some simple visuals. This could be anything from promotional model shots, to shots of the inside of the store, or more obviously an online catalogue based on the season’s fashion. 

If we were contracted to build a new website for Dangerfield, this is undoubtedly the first point that we would address.
2. There’s no home page? – Awesome, we’ve arrived at a blank canvas. In fact, if it weren’t for the the content in the navigation bar at the top of the page, I’d have no idea where I was. 

The home page is the most valuable real estate on any website, so the question lingers, why have Dangerfield neglected this in favour of a tiled background image? The element of ‘mystique’ doesn’t work on the web. 

If Dangerfield has done this intentionally, then I don’t think they realise the implications. If the home page doesn’t instantly address the needs of the users, then they’ll arrive in a sense of bewilderment and then leave in their confusion.
   

   Here’s a very quick mock-up of how we think it should look:

   

   To run you through it, all I’ve done is added a vertical nav for the user to browse through product categories, I’ve taken a screen grab from the ‘hot topic’ website for a modular presentation of the product specials, and i’ve added a shopping cart. 

I did this all in the space of five minutes, and it looks a lot better already!

3. Search engine optimisation – Again, something this website is completely bereft of. On the plus side, at least it’s not built in Flash. We’d make sure that all pages and products are optimised for search engines, everything from the URL paths, meta data, site content and internal link structure.
4. A phone number above the header? – This is a quintessential element of websites that often go overlooked. For a site that doesn’t even make use of a ‘contact us’ web form on the contact page, all of their online enquiries will be received over the phone. In this case, they should make their contact details visible all throughout the website to make it easier for their customers to just pick up the phone and dial without having to go digging through various pages.

What do you think should be changed about the Dangerfield website? We’ve got many more ideas up our sleeve, but for now let’s just give the website an overall rating out of 5 bananas:

The year is 2011, and for a while now, the team here at Ziller have been predicting change when it comes to the user of an automatic image rotator, or auto slider, on the home page of prominent eCommerce websites.

If you’re new to this concept, to give you a bit of a background, home page sliders are more or less banners that rotate through their images automatically. Sort of like the automatic commercial billboards you see inside of a train station or airport.

They’ve been around for a while now, and originally came to fruition with many major eCommerce websites with a large range of products. Automatic sliders are quite beneficial for businesses because they save space on valuable ‘real estate’ throughout the home page, meaning the business can cram as much marketing material, product sales and offers into the banner as they want without any imposition on home page space.

From a business point of view, you can see why most eCommerce websites would deploy and automatic slider above the fold of their web page. But are automatic sliders really that effective? The answer is no, and here’s why….

Despite the benefits from the business end of things, automatic rotating images banners are actually a usability nightmare when it comes to keeping the attention of the user.

As you’re well aware, the home page of a website is highly likely to be the first element of a web page seen by users. As a result, any element contained within a home page should be considered most important to the business.

In the case of home page sliders, there’s a bit of an underlying psychology. To cut to the chase, they’re distracting and they detract the user’s attention from other valuable elements on a web page. With an image constantly flashing to a new slide every 5-10 seconds, from a user’s point of view this can be extremely distracting when you’re trying to occupy yourself with another page element as you’ll find that your eyes are vectoring immediately towards the sparkly, pretty new image.

It’s like peripheral vision, if you’re driving a car and something flashes out of the corner of your eye, you’ll naturally react to it. Well, the same goes with automatic rotating image banners on a web page!

As of 2011, we’re beginning to see a lot of big eCommerce stores take their slide off ‘automatic’ and instead, program them to be in the complete control of the user. The end result of this is that the slider only activates when a user either clicks on, or hovers over it with their cursor. When they do this, it is at their control and it exactly where there eyes want to be.

We thought we’d take this opportunity to demonstrate some major eCommerce stores who have moved away from the automatic slider, instead opting for the user-controlled sliders.

eBay Australia’s website – A nice, user-friendly slider with hover controls. Exactly what you want to keep the user’s attention at all times.

37signals’ website – Same again. These guys have heaps of services to offer, but do you think that they’re auto-rotating them in your face? No way.

And of course, we wouldn’t finish our post without pointing out those with room for improvement…

Dick Smith’s website – Our suggestion to these guys is to remove the ‘pause and play’ functions completely. While the slider looks good, it’s still set to automatically rotate when you land on the home page. Kind of annoying when you have to press ‘pause’ to browse through the page undistracted!

Harvey Norman’s website – One of Australia’s biggest retailers. They’re slider is stuck on turbo, just try and read through the home page without being distracted!

So what are your thoughts on auto rotating sliders in eCommerce website design? Let us know, and feel free to share some of your own examples

One of the most celebrated sciences of web design is without a doubt, usability. User interface design can very well determine the success and lifespan of a website. Without a well-structured and organised website design, you may as well go back to the days of business cards and xerox to sell your business.

Information architecture and design forms the crux of any online business portal. Why? Because the design of your website will play a primary role in whether your customer came, saw, puked and left – or alternatively – stayed a while, browsed, engaged and perhaps bought something.

Good website design is everything.

On a myriad number of occasions, I’ve been trawling the world wide web searching for a product or service with an immense hunger for a website that is well structured towards meeting my requirements. It just so happens that my mind is ravenous for information of use to me, and all I seem to encounter is a cluttered mess of information, a calamity of keywords and links, a website that looks like a dog’s dinner.

It sounds harsh, right? Well, not in my opinion. The way I see it, it is the duty of every business owner to invest in good website design that not only sells the organisation well, but caters instantly to what the user is searching for without them having to sift through the ancient catacombs of lost static pages just to find anything of topical relevance.

Nothing annoys me more, and I’m sure you feel the same!

I thought that I’d take this opportunity to discuss 10 pitfalls of website design that never cease to have users scamper desperately for the ‘back’ button:

1. The website drawn in crayon and coded – for this one, you’re probably going to start laughing as soon as you see the screen shot. Sadly though, even in the futuristic year of 2010, many web masters still opt for the website design that causes a seizure upon opening. The following is a screenshot of a website for a prestigious educational institution in America, but the presentation is completely paradox. Without making any remarks regarding the navigation, the usability is null and void given the solar flare of colours.Nothing annoys me more than a website that makes me not only have to wear shades to look at my screen, but also makes me feel like my head is going to pop in the impending threat of a seizure. It’s like a scene out of Total Recall:

   

2. The 90s – good music, good TV, bad websites – I know that everyone needs to make an exception towards businesses who don’t have the time to update their web design with something a little more contemporary, but then again, what about governments? Nothing drives me crazy like an ‘informational’ website that’s still stuck in the 90s. I mean, look at North Korea, they can build nuclear weapons nowadays but can’t build a decent user interface? Come on guys…Don’t worry though, Iceland have got decent UI design covered…

   

3. Websites that go overboard with SEO – It has always been said, in order for SEO to be successful, at the end of the day you still need people to engage and interact with your website content once they’ve clicked onto one of your landing pages. Usability and SEO are difficult to balance, but there is a line you should never cross. Truth be told, nothing makes me abort from a web page faster than something like this:Ummm… Do you think that they sell flashlights? It’s almost so overwhelming that I actually forgot where I was for a moment there – easily one of the worst eCommerce web designs that I have ever seen. Want an Australian example? Without naming names, here’s the bottom half of the home page of one of the most popular digital camera stores in the market:

   

   The fact that the website design is so bad makes me never want to shop here. Very successful SEO, though!

4. Websites that seemingly scroll infinitely – Is it really necessary for me to scroll for eons and eons just to reach the end of a sentence? I know, I’ll just get in my car and drive my eyes to the other end of my 2.47km LCD computer screen… Or I’ll just leave instead. Make your content easy to skim over! Before you say anything, yes, this was Nintendo.com’s website once upon a time… The scrollbar = nearly as epic as the legend of Zelda!Want to know something ironic? Since updating in 2010, Google Images now deploys the infinite scroll function (vertically). They do it in a much more user-friendly fashion of course…

   

5. Blank palettes – These websites always seem like a) they’re too cool for information architecture b) don’t want to disclose anything to their users c) are just out to drive you mad with abysmal proportions of blank space or d) all above the above.You guessed it, they’re out to do all three. The below screen shot is one from the website of one of my favourite underground bands. They’re actually a pretty big band in Finland, but they’ve only got two links on the entire website. It doesn’t do much to promote them for the user, does it?

That’s about all I’ve got in me for the time being, but you get the picture, and hopefully you had a bit of a laugh too. I think that I have illustrated my point pretty well, without good website design, your online campaign will be dismal.

Good website design can work wonders for your company’s image, so why not make the most of your online asset and turn it into something alluring and captivating? After all, if you invest valuable time into website development, user interface design and information architecture, your customers will invest their time into engaging and interacting with your website.

What are your thoughts on the importance of good website design?

When a consumer enters a brick and mortar store and starts browsing some products they are interested in, what will they usually do next? they will choose a item their thinking of buying, pick it up and feel it, look at the front, back and sides and read the fine detail. More often then not they will then choose to buy the product that has better packaging and is more attractive on the outside, then the less attractive product even if the less attractive product is in fact better quality.

If you are thinking of starting a online business or already currently do, how do you try and replace what I just described above using your website? Just because a user is now online it doesn’t mean there shopping behavior has changed. If you cannot give the user a good indication of how that product is going to look / feel when it is in their own hands, the product is not going to sell, or at least not sell as much as if you did.

Having better product images is one of the most complained about factors of e-commerce stores. Too many stores out their place no importance on their product images, when this is one of the most critical areas and one where you should be putting much effort into.

If a user can visualise a product in their hands, the hard work is done. Work hard on that.

Website accounts in shopping carts are common things these days. It is not often that you will come across a e-commerce store that does not offer an account of some type with which you can register, in order to get added benefits. In fact many e-commerce websites make registration mandatory in order to even purchase, which is a hot topic and one which I have touched on in a older post.

As I see it, if you do offer an account with your e-commerce store, the goal would be to have as many of your users register for one as possible. Users who are registered are far more likely to make a purchase, and assuming you gained permission to send them email you can use this to promote new products and or services.

One thing I see common across even some leading e-commerce stores is the poor attempt to sell registration to the user. If you offer registration, whats so good about it? What do you get if you do register and why must the user do it? All these questions should be answered on your account sign-up page.

Take pcparts.net.au as a perfect example – their login page has only a couple of lines of text to promote the creation of an account. At this point in time as a user I have no idea what I get if you sign up so I will be very declined to do so.

pcparts.net.au

If your going to ask a user to not only give up their precious time, but provide personal information such as their email address, you have to offer in return something of equal or greater value.

If you have some experience with HTML and CSS, you will understand that you are able to apply an ID or class attribute to any HTML tag, which allows you to then specify styles for that tag via the style sheet. If you look at any well built style sheet you would usually notice the use of both ID and classes. So what is the difference?

The W3C refers to the ID tag as “a unique identifier to an element”, so in plain English what this means is an ID attribute can only be used on one element, where a class can be used on multiple elements. To give an example, you would use an id when referring to a unique element such as a specific list, however would use a class when applying a certain style to one or more objects such as multiple div’s.

One interesting feature of the ID tag that I find is not well known, is the ability to link with anchor text to a specific ID. For example if you specify your footer element with an ID called “footer”, you are able to link directly to that part of the page… Let’s take news.com.au as an example. There footer is contained within a div which has an id named ‘footer’ applied to it, so if we link to:

http://www.news.com.au/#footer

You will notice the homepage loads, but scrolls directly to the footer tag, which is the bottom of the page.

These days, there are many shopping carts available for purchase, and open source CMS’s that come with a set number of features available to use. These features range from product reviews, to discount pricing, wish lists, and so on.

What you will find, for example is if you take a hand full of ecommerce shopping carts, all from completely different industry’s but that use the same shopping cart, there is a good chance that they will have many of the same features. Now this may sound normal, however what I am finding more and more is that certain things work for certain industries, while other things don’t. I have found that implementing a feature on one web site can have outstanding results, but putting that same feature in a different web site wont really get results at all.

The reason for this is every industry is different, people looking to buy a house on the internet don’t really interact and behave how someone who is trying to buy a second hand couch does. When you are designing a web site or planning new features, you must do your research and find out how your customers behave. If you take the time to do this initially, you will find you will save yourself a lot of time and money in the long run.

These days, many websites have a Content Management System or otherwise know as a CMS, which allows a user with no real web design experience to be able to update the content and make other changes to the web site, that usually would require someone with web design experience to do. For many online businesses this is absolutely crucial, and in fact you will not find many shopping carts out there that don’t have either a custom CMS solution or a standard one that came with the cart.

Once you have your shopping cart up and running, to have to constantly pay web designers to update the web site or hire a experienced employee with web design experience can be very costly, and its for this very reason CMS’s are so popular, they save operating costs and allow you more flexibility to be able to update your site.

So now to the point about my post. From my description above you could easily conclude that there are no down sides to a CMS yeah? I mean what could be possibly bad about them, they give you options to regularly update your site that you would not otherwise have, and ultimately save you money. However from my experience in designing these shopping carts with a CMS, there has been a problem that I have noticed over time, which I am not that all happy about.

You spend countless hours designing this great shopping cart. You put a lot of time into thought about the design, how things should look, and in the end have a beautiful looking web site that will be perfect for your portfolio, and most importantly converts users in buying and make the client money. Then you deliver the website to the user, and that is where the problem starts.

Once the client knows how to use the CMS, in most cases they will have the ability to make a multitude of changes, including changes to the homepage, and other content pages. When the client does make these changes, I have found on many occasions that they wreck the site! They will do things like put absolutely stupid images in a prime position, use text with the wrong font, and generally do things that no one with web design or internet marketing experience would do. Unless you have an ongoing contract with the client and perform regular work for them, you really have no control over this.

While it may sound like I am complaining, (which I am) it just annoys me to see a great website ruined because you give the client the ability to manage the site themselves. What I would recommend to anyone one who does run a online website and has a CMS, is to make sure that changes yourself or your employees make, are inline with the designer and or internet marketers ideas and are going to effectively improve your website, not ruin it!