Web Design Sydney Melbourne | Wiliam Blog

Why UX Matters

Wed, 15 May 2013 00:00:00 +0000

The design team at Wiliam just finished watching a great video explaining why UX matters. It really gave us an insight into how to better our designs but also how to focus more on the user rather than the marketing of the product.

In order for a website to succeed, it needs to have a great user experience in place that people loved. When users go to a website they have a goal in mind. If they can achieve that goal in an easy manner, then they have had a good user experience and will most likely return to use your site again. The main thing is to create an experience that people get excited about and want to continue using over and over.

One way to ensure a great experience is to not lose sight of your website strategy. For example, Hulu's strategy was "the easiest way to watch tv online". Anything that got in the way of that strategy was dismissed. The site, of course, has had a massive following and a high conversion rate from the onset.

Something that I really thought was a great point, however as a designer struggle with, is that bad design can still lead to a successful website when a problem is solved. Meaning, if the site looks horrible but the user can achieve their goal easily then the site is a success. I struggle with this because I believe all sites should be visually pleasing as well as user friendly.

The video used Craigslist as an example, saying that they have tried to redesign it but failed each time. So it still remains a white page with blue links. I think we'd be perfect candidates at Wiliam to be the first to successfully redesign Craigslist without losing it's high conversion numbers!

Finally, whether you do A/B split testing or gather feedback post launch it is important to listen to your users. If you think they should understand your website, but in reality they don't, you shouldn't be opposed to adapting it. UX is always evolving and changing, there is no end point so you can always change your site in order to keep your users happy and engaged.

Wiliam is one of Australia's leading web site design and web development agencies. Our Melbourne web design and Sydney web design offices provide cutting-edge Web 2.0, internet marketing, business web hosting, email marketing software, search engine optimisation, SEO, Facebook Applications, Link Exchange and SEO Tool services.

Personalized E-Commerce

Thu, 02 May 2013 00:00:00 +0000

As anyone who knows me well can say, I shop online frequently. I recently made an online purchase and the following day I saw ads for one of the same items I’d bought on one of my other frequently visited sites (Facebook).

Since I had shopped at the same store where this item was being advertised, I knew that it was not a coincidence but a case of remarketing. In this case, it was highly personalized and featuring the exact item I’d clicked on and considered.

This is because Google personalizes your search experience based on past search history? There is the option to set this off in Google, however by default it is there and will match your interests to the search.

Privacy you might ask? Well for some that is the case, however for an increasing number of others, they feel that it provides for a better experience.

It’s important to try and personalize in as many places as possible.

Opt-in emails.
Transaction emails.
On your website.
Social media.
Loyalty programs.
Packaging.
On phone and chat.
Ad networks
Landing pages.
Wish lists.
All devices.

As I mentioned before, there will be many who view personalization as an invasion of privacy. However the options are there to erase their cookies, utilise incognito browsers and ultimately opt out if they wish. At the end of the day, making an online shopping experience easier is good for everyone.

And I firmly believe that when executed properly, personalization will add significantly to an online shopping experience. The important thing to remember is not to abuse it – as keeping privacy foremost on your priorities is key.

Getting Involved, Staying Engaged

Wed, 01 May 2013 00:00:00 +0000

Tailoring your site to a key audience is part of great web design and architecture.

It’s possible, however, to try to cast your net too wide and thus fall flat in the process of trying to bring in any audience.

Some websites know their audience instinctively and thus cater their site to match a proven consumer base.

Others make the mistake of trying to appeal to as many people as possible without a clear goal of demographic in mind, thus presenting a watered down offering.

But is there a way to “taper” the experience of your site?

To enlighten your customers and teach them how to use your site over time, opening up new pieces of functionality to the faithful and keeping them engaged?

Of course, and it’s being done all around you.

In a recent client workshop the point was raised that not all users of a particular website or application are full time, hardcore users. The example given was Salesforce.

There are those who use Salesforce to store contacts. There are those who then add Salesforce’s Event planning, Messaging and other functionality.

Then there are those hardcore Salesforce users who treat it as a social media platform.

All of these users are catered for, and Salesforce knows all of these situations are perfectly fine.

So the real key to creating a fluid user experience is not just ease of use and workable interfaces, but real, strategic implementation of client ‘involvement tiers’.

Taking these examples:

If I’m on the first tier, the site is purely functional. It does what it says on the tin. For instance, an address book for my contacts.

If I’m on the second tier, I’m probably generating my own content, or digging a bit deeper. I’m probably a more frequent user of the site too. For instance, I mark events for those in my contacts list, and I send them messages.

Then there’s that third tier – heavy and constant involvement. This application is part of my work or casual life. I’m constantly using it to connect with people, share with people, generate my own content.

Do these principles apply to your site?

Are you making things harder for those at Tier 1?

Equally, are you boring those who expect to be at Tier 3?

Responsive email templates

Wed, 01 May 2013 00:00:00 +0000

In the last few months of 2011 there were more iphones sold than babies born. Over 35% of emails are opened through a mobile device so why are companies only sending out one email?

The table below shows the percentage of emails that are opened on a mobile device¹ :

Japan	U.S.	Canada	Europe
57.3%	40.8%	35.9%	30.0%

Figure 2 / Percentages of people worldwide who read email on their mobile devices.

A study by Mailchimp found that 72% of people read their emails in bed in the morning. As the alarm clock has been phased out by the mobile, these peoples’ routine was to turn off their alarm then click the email button and read what has come in overnight, often still with the light off (if you are sending late night emails, one comment they made was to avoid using bright colours as these people are still adjusting to waking up). ¹

When asked what the top location was to check your emails 35% of people said on public transport.

As with responsive websites, responsive email templates are a great way of tailoring content to the device on which it is viewed. Mobile email clients are now more supportive of web standards which means they can detect the mobile device and server alternative CSS to make the email optimised for a mobile device.

Limitations of responsive emails

There are limitations to responsive email templates the main one being multi-column layout. As cells within a table can’t be manipulated as easily as divs can, responsive email templates generally need to stick to a single column layout.
Iphones support a minimum font size of 13 pixels. This needs to be kept in mind when designing as upscaled font could change the layout
Links and buttons should have a minimum target area of 44 x 44 pixels so they are easily clicked
Keep the features minimal - when hiding certain elements that are not necessary on a mobile device use display:none

Responsive email templates mean developing two versions of CSS but the click-through rate will increase significantly on a mobile device if you get the layout right.

Some of the best responsive email templates out there at the moment:

Mailchimp

Mailchimps layout only slightly changes from desktop to mobile, they remove social links and increase the font size. Their emails are simplistic and easily read on a mobile device

Mr Porter

Whilst not a typical responsive email template their emails seem to work well on a mobile device.

Moo

Moo’s articles change from double layout to single when viewed on a mobile device.

1 http://mailchimp.com/resources/guides/html/email-on-mobile-devices/#fn2

Improving Customer Service Online

Wed, 01 May 2013 00:00:00 +0000

We’ve all been in situations before where a bad experience shopping online has led us to make a complaint. Whether it be bad communication, incorrect stock information or just a longer than normal wait for shipping we all know how irritated it can make us feel. Most of the time complaints come through via email, but shoppers are now increasingly turning to social media to voice their issues online. Therefore it is essential to make sure that you handle any complaints or queries through your social media correctly to not only win back your customer, but other users in the process.

Shopify recently came out with 4 tips for improving your customer service through social media.

The first being Speed. The number 1 reason that a customer makes a complaint or posts a query on a Facebook business page is because they want their request to be expedited. No one wants to see a request posted on Facebook which has still not had received a reply after a period of time. This immediately shows others a lack in customer support. Not to mention you would immediately want to rectify any situation where one of your customers was not happy. If someone posts directly to your business’s Facebook page make sure you can reply within half an hour.

The second is to Pay Attention. A lot of the time, users go to social media because they want their voices heard whether it be for a complaint, a question or just a general comment. Make sure you take the time to understand what has been written so that you can reply directly.

The third it to Accept Responsibility. If a customer has had an issue with your shopping experience then it is essential that you accept responsibility where it is due. Even making sure that you say ‘sorry’ is the first step to working towards rectifying an issue.

Lastly, you need to Be Generous. It’s a win/win situation as not only will your customer be happy, but other users will see this generosity as well. If a problem is reported on your Facebook page, it’s a good idea to not only accept responsibility but offer some sort of condolence such as a voucher or shipping discount.

A finely built website is like a finely brewed beer

Wed, 01 May 2013 00:00:00 +0000

If you are going to be a web developer you better be prepared to cover all the bases. And by that I mean you are going to be learning a lot of tricks and wizardry that is going to confuse a lot of people.

At the end of the day some people are happy if the job gets done while others are happy if the job gets done, is efficient and can allow for dynamic control by the client for things they have not even thought of yet.

Sound impossible? Well, you are probably right. But it is not 100% impossible. I do have to admit that after using Umbraco for several high end client websites that have all the bells and whistles that it gets easer each time.

Umbraco is bringing more tools to the proverbial table and you can resource them at your leisure as you would other peoples code from the stackoverflow website.

A finely built website is like a finely brewed beer, every developer knows that. If you don’t plan it correctly from the beginning you are going to end up with something that is just not useable and should be flushed down the programmers sink of permanent deletion.

Umbraco does allow you to prepare and plan easily with their developers controls.

You can add in a piece of this and a bit of that and fine tune your document types to any clients specifications.

Get the temperatures right and add in the plug-ins available from the Umbraco Packages control and you’ll really be onto something that will come out the other end as a fine tuned product.

One thing to remember as always as a developer is that regardless of the system, if you don’t know what the end product is going to look like and what the desired result is you are going to falter and no amount of adding extra ‘sugar’ is going to fix it.

A proper foundation is the basis and of all code, just as the right temperature and yeast is the best foundation for developer fuel, beer.

Why overwhelm the viewer? Hit them with an informative landing page

Wed, 01 May 2013 00:00:00 +0000

We recently designed a landing page for CeBIT Australia. The aim was to condense a large number of pages into one single page, thus engagng the visitor rather than overwhelming them with irrelevant information overload.

Things to consider when designing a landing page:

The page should have a single purpose / story to draw in the visitor
Edit to remove unnecessary content
The Call To Action should follow the user as they navigate the page
Try testing new ideas using A/B testing. Let your customers decide which message works best for them. Enough emphasis cannot be given here as websites need to be iterated from the data you receive from your analytics.

Landing page = simplicity. Simple

www.cebit.com.au

UMBRACO 6 AND THE SERVICECONTEXT

Tue, 30 Apr 2013 00:00:00 +0000

One of the highlights for me with Umbraco 6 was the new feature of being able to access the Umbraco datastore from an external application that didn’t have direct access to an Umbraco Context. Yes you could achieve this with the WebService layer in the past, but wouldn’t it be nicer if we could just use the standard Umbraco connection string?

This is now possible, though as it’s quite new and not entirely well documented yet (and in various states of being broken up until Umbraco 6.0.3) I thought I would assemble together how I managed to grant a console application complete access to the Content and Media APIs.

1. The base to get you started is a project called UmbConsole, written by Morten Christensen: https://github.com/sitereactor/umbraco-console-example/tree/master/UmbConsole

Have a look at the project to get familiar with the idea, but let’s create a new console application project inside your existing solution, where I assume you already have an Umbraco website up and running.

2. Ensure your website is updated to 6.0.3 or later. This is important as there were problems with 6.0.2 that interfere with the ServiceContext.

3. You will note that the UmbConsole project references many DLLs and has a full App.config. This is overkill. Add references to the following libraries only (again ensuring you have updated to 6.0.3):

Businesslogic
Cms
Controls
Interfaces
Log4net
Umbraco
Umbraco.core
Umbraco.datalayer
Umbraco.editorcontrols
Umbraco.web.ui
Umbraco.webservices

You will also need the usual references from the GAC:

System
System.Core
System.Data
System.Web
System.XML
System.XML.Linq

4. This part is very important. Ensure you have a folder called Config in the root of your project and copy the umbracoSettings.config file from your website to this folder. Without this file, the Save and Publish methods will fail.

5. Create an app.config. We really don’t need much to make this site work, just a couple of very important sections:

You need to reference a config section FileSystemProviders and add the relevant block below, like so:

It is necessary for your console application to know where the physical media folder is for uploading images and files to the Umbraco data store. The attribute rootPath you need to customize to point to the location of your website media folder. The attribute rootUrl leave as shown above.

Copy your umbracoDbDSN from the website web.config verbatim.

6. Copy the ConsoleApplicationBase.cs and ConsoleBootManager.cs from the UmbConsole application to your new application.

7. Examine the UmbConsole application’s Program.cs and instantiate the same services as shown there. This gives us access to the Content, ContentType and Media services.

8. You now have the base required to work with the Umbraco ServiceContext. I won’t go into the methods available to you as they are fairly self explanatory, but the basics are:

9. Similar methods are available for the MediaService. When working with the MediaService, I did notice that the overloaded method that allows for a MemoryStream to be uploaded to Umbraco did not work for me. Instead, I needed to convert the stream to a HttpPostedFileBase, which is the other accepted overload. Your mileage may vary.

10. One last very important note I nearly ripped my hair out trying to solve (and with big thanks to Wiliam tech lead Matthew Cox for the help here). If the Save or Publish methods fail for you with cryptic errors about loading DataType XML, check the data types of your properties in Umbraco. Are any of them non-standard plugins?

If so, you need to reference the library for the property (in my instance DigibizAdvancedMediaPicker.dll) and lastly, you need to ‘jump start’ the library for inclusion in the context. Take a look in ConsoleBootManager.cs and pay attention to the lines regarding DataTypeResolver. For each non-standard property in your document types that require a library, you need to include them here. For example:

I hope this guide is useful to developers wishing to use the Umbraco Contexts from outside of their website.

Stop your site from being hacked, speed up your site - CDN on budget - cloudflare

Tue, 30 Apr 2013 00:00:00 +0000

What is a CDN? The acronym itself it pretty self explanatory….

CONTENT DELIVERY NETWORK

Right, now that we’ve established that, how does it help your site? A CDN effectively distributes your content by caching it at different nodes (globally - dependant on your provider) - minimising the network hop required to deliver your site. This cache comes in the form of HTML, images, javascript, stylesheets etc - fundamentally all the static content that makes up your site.

CDN implementation for your site can be costly dependant on how your webmaster has developed it and ultimately what provider you are utilising.

Here’s where cloud flare comes in. This site basically does it all for you!.. create a site, forward domain dns to cloudflare and boom! - CDN & Site security done.

On top of the CDB- cloudflare bolts in site security leveraging there reputable firewall to fight off the nasties. https://www.cloudflare.com/features-security

Its extremely flexible allowing you to simple forward the traffic straight through to your site; or ‘cloud flare it’

It also enables you to opt how optimised you would like the CDN to be - offering minifying services for all your static content!

https://www.cloudflare.com/features-optimizer

Impressive.

Provide your user proper support

Fri, 26 Apr 2013 00:00:00 +0000

I’ve found a couple of stats that I’d like to share with you.

86% of consumers quit doing business with a company because of a bad customer experience, up from 59% 4 years ago
Source: Harris Interactive, Customer Experience Impact Report

91% of unhappy customers will not willingly do business with your organization again
Source: Lee Resource Inc.

It’s pretty clear that you want to ensure that your customers are very happy.

A nice way to give extra support and improve your customer experience is to facilitate communication between consumer and company.

I found live chat a great way to get some quick answers. Personally, I never read FAQs, and I have no time to go and find answers for my questions, on help /support search system.

I’m a consumer, there is only one of me, and there is always many competitors so, simply give me a quick answer otherwise I will leave.

One of the live chat providers BoldChat has said that according to their recent report, Live Chat Effectiveness 2012, there is a substantial increase on the US and UK market of consumers that engage live chat before making the decision to purchase items online.

Now let’s be clear, adding a live chat on your site in not enough, you have to be online and you have to be ready to reply to questions.

If your Live chat is always off line or you don’t reply in time, or your answers make no sense, you are just shooting yourself in the foot.

The majority of the providers today offer the ability to install live chat on mobile smartphone, so you can always reply to needy customers, even when you are far from your desk.

I have used in the past these systems, so if you don’t have a live chat it’s worth it to have a look:

Help your customer to love you:

Resource from:

Why Mood Boards are worth the effort

Wed, 24 Apr 2013 00:00:00 +0000

Here at Wiliam, before we start any new website design, we begin by creating a mood board for the project. Mood boards are a collection of assets, other web designs, patterns, textures, colours etc that create a basis for a very basic style guide and tone we would want to carry through onto the website design. Mood boards are a brainstorming activity that are not only fun but highly beneficial.

One of the most beneficial reasons to create a mood board is to show clients a proposed look and feel without investing too much time and effort in the wrong direction. This allows us to better collaborate with our clients and ensure we head down the right track.

To get the most out of a mood board exercise with clients, I believe that 2 or 3 variations in direction should be show. For example, one could be illustrative, sketchy, using hand written text and bright colours whilst the could be more refined and muted in terms of colour choices. It is important to stick to the clients brand guidelines but this is also the time to push the boundaries a bit and see what the reaction is.

When presenting the mood board to clients, it is important to talk through the reasons for each variation and direction. This gives the client more confidence in your choices and shows that you have listened to their brief. However, in most cases the client will immediately identify with one direction on the board which makes the excerise easier and beneficial.

jQuery 2.0, less is more

Mon, 22 Apr 2013 00:00:00 +0000

jQuery version 2.0 has just been released and with it a death knell for IE 6, 7 and 8.

As of version 2.0, jQuery will no longer support those notorious older versions of IE we all love to hate.

The result is a more streamlined jQuery release with a smaller file size.

There have also been some refinements to the custom build system for smaller custom versions.

There are also a slew of bug fixes and smaller updates in the release. Have a read of the jQuery blog article for more details.

For those of us who still need support for those decrepit web browsers, the 1.x branch is still available and in active development.

Happy coding.

eCommerce - Sell your product

Tue, 16 Apr 2013 00:00:00 +0000

The whole purpose of an eCommerce site is to sell products. And what makes something sell? Making whatever it is appear better than similar options. And it can’t always be the price. Most customers will purchase a more expensive item if it is marketed to be a better product. And what does the marketing on a website? The product page. The following provides some tips for designing product pages that do sell.

The visuals

The number one thing that will get a customers attention when scrolling through a list of products is a good product image. This means not only a high quality image but one with good composition and styling. Have people wearing clothes cropped to the item, sheets made up on a bed etc. Once they have selected the product give them even more images. Show views from different angles. And styled and unstyled images.

The Iconic website below does this well.

As does the White Company…

If you want to take it a step further why not include video? ASOS use video to show clothes modelled on a catwalk and Canon uses it to demonstrate new functionality on their cameras.

Describe concisely

Keep the most important features at the beginning of your product description. Better yet use bullet points to highlight those features, so easily read by those in a rush. And provide a more detailed product description for those who want to have more information for their decision. But keep it concise. Avoid trying to hype the product. Stick to the facts.

Be clear on price

The price should be prominent on the page in a large font and a different colour. Ensure any additional costs, like delivery, even if estimated are also shown on the product page so the customer has an idea of the total cost without having to go to the checkout.

Give them tools

These might as simple as a size conversion chart or as complicated as a ‘Decorate your room’ tool. You can upsell through both of these. For the former, by presenting them with similar products that are in stock and in their size, and with the latter – well you have the whole room.

Remove anxiety

Part of the decision making process involves removing any anxiety a customer may have over delivery costs, returns policies, privacy and customer support. For this reason ensure that there are clear links to this information on all product pages.

Surfstitch do this by persisting the above on all pages of the website, and in a prominent position.

Reviews have power

Positive reviews are a powerful selling tool. They support the websites claims of product quality and will convert a customer where they may have been wavering. Negative reviews are also helpful as they educate the customer and the seller where products aren’t performing well. Finally, reviews also provide a valuable source of new content on the website which helps improve the site’s SEO position which increases traffic to the website.

What you are likely missing out on if your browser isn't HTML5 compatible.

Tue, 16 Apr 2013 00:00:00 +0000

HTML 5 and CSS3 offers developers some much wanted functionality that previously required many, many lines of programming code. That has now been reduced in many cases to 0 lines of programming and 1 CSS declaration! With many effects now being handled natively, interactive and dynamic elements respond more quickly and smoothly than ever before.

However… if you aren't using an HTML 5 compatible browser, the internet is probably looking less glossy than it did just 1 year ago.

What's the reason? Graceful fallback. This means that developers are coding all the bells and whistles (which are now often very quick and easy) for HTML5 and the "graceful fallback" for older browsers is that you just don't get to see all the cool stuff any more, that used to take days of work!

4 things you're probably missing out on if you're using an older browser.

Transitions: HTML element CSS attributes can now easily transition between values. From it's screen coordinates to it's colour, it's so simple that a developer would be mad to bother getting older browsers to transition from one state to the next now.
Animations: In part thanks to transitions, remember that cool sub menu that used to slide down when you hovered the top level item? It's likely you're seeing it just show and hide.
Transforms: Once the domain of IE only (ironically IE is currently the least advanced) you're possibly missing out on 3D, at the very least you're not seeing any 2D transformations.
Canvas: Allowing the programmer to draw on the screen using vector graphics a frame at a time, this allows for any number of cool high resolution dynamic effects. If you haven't played a canvas game in your browser, you really missing out!

Bootstrap and Responsive Design

Tue, 16 Apr 2013 00:00:00 +0000

Responsive Design comes in handy when you want the one application to look good for multiple devices with difference screen sizes such as a tablet, iphone and PC. By default bootstrap can achieve this by adjusting column and gutter widths as follows:

Label	For window width px	Adjust column width (span1)	Gutter width (in between columns)
Large display	1200 and up	70px	30px
Default	980 and up	60px	20px
Portrait tablets	768 and above	42px	20px
Phones to tablets	767 and below	Fluid columns no fixed width
Phones	480 and below	Fluid columns no fixed width

Note the screen ranges will cause the columns widths and gutters to automatically adjust.

View the following example bootstrap structured code.

<div>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum

<div>

<div>

<div>

<div>

Note: The base css and javascript can be downloaded here http://twitter.github.io/bootstrap/

The required bootstrap class structure for responsive design is used in the above code. ie Container-fluid -> row-fluid -> “span?”. Another important point is the span determines the width of the column compared to the other columns Ie. Span 3 will be 3 times bigger than span 1.

So now let’s see this in action:

1190px (desktop/notebook)

890px (portrait tablets)

470px (mobile)

So as you can see, bootstrap has resized the text as well as even resizing the images to suit the platform. Enjoy!

What are the best email subject lines?

Fri, 12 Apr 2013 00:00:00 +0000

MailChimp (an email platform we often recommend to clients) has published a fantastic and really easy to read breakdown of which email subject lines deliver the best email open rates.

The best?

[COMPANYNAME] Sales & Marketing Newsletter
Eye on the [COMPANYNAME] Update (Oct 31 - Nov 4)
[COMPANYNAME] Staff Shirts & Photos

The worse?

Last Minute Gift - We Have The Answer
Valentines - Shop Early & Save 10%
Give a Gift Certificate this Holiday

Of course, how well these email subject lines work (or don't work) for you will come down to trial and error, though the article should certainly have done the heavy lifting for most email campaigns.

Update to blog: 15 April 2013

I've had some interesting feedback to this blog - or more specifically the list of email subject lines - from a client. He makes some good points:

The successful subject lines are exclusively B2B only and the usuccessful subject lines are exclsuively B2C.
It would be interesting to know the email unsubscription rates from email subject lines; those email subject lines that might garner open rates though go onto lead to users unsubscribing… something my good colleague points out, is a short-term game many companies engage in, with misleading and excitable subject lines (designed to get users opening) with the view of often promoting open-rates to email sponsors.

But which annoy users and cause brand damage to the email sender.

I'll look up statistics on successful B2C email subject lines and post them…

Website Terms and Conditions: The Good, the Bad and the Ugly

Thu, 11 Apr 2013 00:00:00 +0000

When I used to design and develop smaller websites than I do today, I was occasionally asked by clients if I had a pro-forma set of website Terms and Conditions I could throw their way.

I always referred them to the Internet – at the very least – to find and then adapt website Terms and Conditions that were close to the terms they were prepared to enter into with their users.

The Internet has come a long way since those days and whilst your website Terms and Conditions might remain a small, hidden link buried among other links in your footer, you need to think more about your Terms than this.

In this blog, I am going to talk about The Good, the Bad and the Ugly of Term and Conditions.

Website Terms and Conditions: The Good

I wrote a blog many, many years ago about The Guardian (Newspaper) website and the backlash it received from users over its terms and conditions and specifically, how users of its website reacted to The Guardian’s treatment and publishing of its Terms and Conditions in hosting an online forum on the Iraq war.

In simple terms, users of the website were invited to participate in an online forum on Iraq and leave comments on how they felt about the war and so forth.

No problems there.

What The Guardian website didn’t tell users – or at least not specifically and clearly – was that their comments could be used in its print, newspaper publication.

And indeed, they were.

Rightly (or wrongly), users became particularly upset when they found their comments in print.

It wasn’t what they had signed up for or expected.

Terms and conditions be damned.

I say “or wrongly” (see above), because in the grand scheme, The Guardian’s actions aren’t that big a deal.

Eight years on from writing my original blog, I still suspect it was the painful 10% of any website audience (the audience that ‘knows its rights’, ‘knows Fair Trading’ and demand answers anytime it thinks its privacy is breached) that complained and made the noise.

The audience doesn’t matter however, especially if one is to be sensibly risk adverse.

At the very least, users have a reasonable right to be clearly notified that their contribution to a website will be used elsewhere, irrespective of whether it is buried in the website Terms and Conditions or not.

The Guardian learnt its lesson and changed its policy such that any term of use even bordering the erroneous or impinging on the ‘self-appointed’ rights of Internet users was either quickly scrapped or even better, made very clear in bold type.

Users could make an informed decision and that is all they wanted.

This is the good of Website Terms and Conditions…

Website Terms and Conditions: The Bad

I watched Clint Eastwood’s movie The Good, The Bad and The Ugly a few weeks back.

The ‘Bad’ is a character called Tuco and he is a pretty bad guy; for purposes of this blog, we’ll call Tuco, Instagram.

Many of us are aware of Instagram’s somewhat recent screw-up over its Terms and Conditions.

Though in case you’re not aware, Instagram recently updated its website Terms and Conditions.

The announcement of the update naturally caused users to focus on the new Terms and the changes Instagram was proposing.

Users were shocked by the changes they read and demanded blood; who was Instagram to own their images etc etc etc?!

Users threatened to walk away in droves and Instagram was initially like a deer in headlights.

Changing its terms and conditions is not what makes Instagram bad however.

Instead, Instagram was bad firstly in how they ultimately responded to the whole episode and secondly, in how the whole episode will invariably shape the shady behaviour of other websites and Internet companies going forward:

Once the noise of angry Instagram users became too loud to bear, Instagram famously reverted to its previous Terms and Conditions, no more questions asked.

Users cheered everywhere, having forced a billion dollar Internet Company to fall on its sword.

The joke however… was on the users.

You see, the previous Instagram Terms and Conditions were not as good to users as the new Terms and Conditions.

None of those bleating users had in fact ever read the previous Instagram Terms and Conditions and so didn’t know what they were gaining or missing out on.

The users just felt aggrieved.

Instagram is firstly at fault for not simply and clearly explaining the changes and the benefits its users would receive from the new Terms, right from the get-go.

Instagram’s second fault, is that it allowed poorer terms and conditions to be imposed on its users without any rear-guard fight or argument.

It caved.

And its users are far worse off.

Bad.

The second ‘bad’ is the precedent that the whole Instagram Terms and Conditions saga has unfortunately left.

Instragram was trying – to some degree – to be noble in notifying users of its change to its terms and conditions; however poorly it did it.

The problem is that the noise it made and the poor execution of the whole exercise means that any self-respecting Internet business out there with traffic and a database to protect, is going to be far more suspect in how they roll out any changes to their Terms and Conditions.

And that is a bad thing for users.

It is far better that as users, we are aware of changes to website Terms and Conditions and not the situation where changes are made under the cloak of murkiness and fog.

Bad like Tuco.

Website Terms and Conditions: The Ugly

Here’s where it gets ugly…

And not because the case study I’m using here – Zappos – was deliberately ugly; but because the outcome of their actions was ugly.

Zappos is an enormous fashion eCommerce website; they’re part of Amazon.

At the beginning of 2012, Zappos had a major data breach affecting around 24 million of its customers.

Lawyers circled, filing dozens of class actions, though Zappos tried to shoo them away, arguing that its Terms and Conditions contained an arbitration clause; a clause designed to keep class actions and the like out of expensive and unhelpful courts.

Website Terms and Conditions (often referred to as website User Agreements) can be one of two types:

Clickwraps or Clickthrough Agreements:

A Clickthrough Agreement is one where a user needs to acknowledge their consent with the website Terms and Conditions; say clicking a checkbox and pressing Submit.

It is unambiguous and the user is offered a consistent and clear opportunity to read the website Terms and Conditions and then to proceed.

Or not.

Courts love Clickthrough Agreements.

Browsewrap Agreements:

A Browsewrap Agreement attempts to bind users of a website through the implication that users understand and have agreed to a website’s Terms and Conditions by virtue of being on and browsing the website.

The onus is on the user to locate the website Terms and Conditions, read them and then decide whether to remain on the website or go.

As a web designer, Browsewrap Agreements are certainly my preference because they represent one less hoop for website users to jump through; less friction.

The problem is that US judges and courts consistently view Browsewrap Agreements as ‘no contract’.

Bugger.

The view – quite rightly – is that no reasonable user would have reason to locate and read through website Terms and Conditions, especially if it is not pointed out to them.

Subsequently, reasonably assumed and reasonable Terms and Conditions are all well and good, though Terms and Conditions that attempt to bind users into an agreement – such as arbitration – without the user having a reasonable opportunity to understand and agree to this, will very likely be struck out.

In the instance of Zappos, this meant that it was open to class actions and fighting it out in US courts.

There exists a further possible challenge for those websites relying on Browsewrap Agreements and that is how they can claim to notify users of changes to their website Terms and Conditions, given that users are not required to confirm that they have read and understood the website Terms and Conditions either with each transaction or in the first place.

It is true that with a Clickthrough Agreement, there remains a challenge in that you should probably make some effort to email existing users with changes to your website Terms and Conditions or make clear to users on your website, when you changed your website Terms and Conditions and what these changes were.

Though this is a challenge I reckon a quick whiteboard session could handle away.

It is possible that your website is not the sort of website that can reasonably handle a Clickthrough Agreement by virtue that you do not have any interaction with your users other than to publish content.

This said, such a website surely wouldn’t need a User Agreement or at least, website Terms and Conditions that contained anything unusual?

Unfortunately for Zappos, its use and reliance on a Browsewrap Agreement – something pretty much ubiquitous across the web – meant it was exposed.

And sued.

Ugly.

No longer the Wild West I’m afraid

When I watched The Good, the Bad and the Ugly the other night, the Wild West was at its best.

Shoot anyone, trick anyone, do whatever you want.

The WWW is still sometimes referred to as the Wild Wild Web and that’s because it comes from a strong background of Internet cowboys and Internet cowgirls.

Times are a changing however.

Courts are catching up and take a very dim view of activity that isn’t kosher or fair to users.

We’re now all pretty suspicious because of the early actions of many Group Buying websites and nobody buys online without knowing a website’s policies on returns and freight.

Frigging with users is a no no and this means we need to draw a line under how we handle and present our Terms and Conditions.

We also need strategies to ensure our users can easily read and understand our website Terms and Conditions and be notified when we make changes.

Don’t see your Terms as a negative; turn them into a positive and win over your users.

And if your embarrassed of any part of your website Terms and Conditions, you should be.

Conversion Rates Are Plummeting

Thu, 11 Apr 2013 00:00:00 +0000

What can you do?

A recent Econsultancy report put forward the staggering statistic that for every $92 spent acquiring customers, just $1 is spent on converting them to sales.

The answer as to why this is may surprise you – it would seem it all comes down to people.

According to the report, the four variables most strongly correlated with improved website conversion are:

Perceived control (it is seen as a priority and something that is within the control of the business, so more resources are directed at achieving the goal of conversion)
Having someone directly responsible for the outcome, and incentivising them
Incentivising other staff to follow the lead
A structured approach (planning to succeed at converting customers through careful planning and eventually increasing numbers)

This appears to be counterintuitive to the way the industry has been running itself, using a complicated mix of A/B testing and continuous customer feedback – but not a lot of staff involvement.

While these are positive steps, if the mindset of your company isn’t just on getting the customers to the front page, you might as well forget it.

So what can you do?

To move your organisation from clueless to clued up, it starts with viewing conversion as a process, not a one off project. Given time and involving staff directly in the ways outlined above, incremental changes in conversion will become noticeable.

Check out the findings here

Designing in the mobile era

Thu, 11 Apr 2013 00:00:00 +0000

We all strive to uncomplicate our life. We want to make things more simple or easier. I'm doing it now. I started by cleaning out my closet, giving away old clothing and reducing down the amount of items I own. I'm even moving closer to work to make life a bit easier.

So what does this have to do with Designing in the mobile era?

Well, like life we need to simplify our online experiences by removing items that are not necessary.

Why?

Because it's a necessity in our increasingly oversaturated online world. Simplification will create a better online customer experience. The other reason is that there is a huge increase in web access via mobile sites, this trend will not abate.

How do we achieve web simplicity?

Well one idea is Mobile First, whereby companies organise their business around the mobile as their primary user channel and then design their desktop experience around this. This can simplify not only the design but the whole UX.

Where to from here

Start by looking at your site traffic to understand what your customers value and what they can do without.
Keeping testing and refining your website. Similarly to other marketing material, a website needs to evolve as your business does.

Facebook Introduces the #Hashtag

Thu, 04 Apr 2013 00:00:00 +0000

Since the hashtag was introduced, it has always been known as Twitter’s trademark way of organising conversations and keywords. Well, now the popular feature is coming to Facebook!

For those unaware, the #hashtag is a way of categorizing tweets (Twitter) or photos (Instagram) with the addition of a keyword, such as “Just chilling under the Harbour Bridge on this beautiful day #sydney #noplacelikeit”. It essentially provides for items to be categorised and grouped, and therefore searchable.

As Facebook declined to comment further, it’s yet clear whether we’ll be able to search friend’s streams of posts and comments, or that it may be incorporated into the newly released search feature they recently rolled out, dubbed Graph Search. Since Twitter’s tweets are public and viewable to all users, the privacy settings tightly wrapped within Facebook could mean the hashtag feature won’t be as effective.

What does this mean for website owners? An effective idea would be combining this new feature with your website by means of a widget, displaying all posts or images uploaded by users that have used your business hashtag, say #wiliam. All posts, comments or photos uploaded could then be grouped and presented, potentially as content or in the form of a competition.

#TimeWillTell #ImExcited #ThisCouldGetOutOfHandVeryQuicklyThough #GoodLuckFB