Pro tips to breathe new life into your website

Content matters

The oft-wheeled-out mantra in web design circles is 'content is king', but text is no longer the absolute ruler it once was – something to be mindful of during refreshes.

As CEO of Modera Siim Vips notes: "Scaling down text content is popular, since there's too much information available online anyway and excessive copy can negatively impact on a website." Elliot Lewis, creative director of No Two the Same, adds: "A CMS of some sort is becoming a prerequisite, but this puts copy in the hands of clients, which isn't always a good thing."

Ultimately, the level of control clients should have regarding copy comes down to their skills and designers need to guide clients who don't have appropriate in-house resources available, helping them outsource to copywriters where necessary.

For any components that can be edited, you need to keep the refreshed text succinct and avoid duplicating information, both so users don't get bored and so clients have less scope for fiddling!

Graphical refreshes also offer a huge range of options, although they can be tricky to get started. "Clients tend to want to hold onto something that's been successful for them," argues Lewis, adding that, while stagnation is dangerous, so is "jumping on any current trend – such as shiny surfaces – that may make a site look tired very quickly."

Vips adds that, although consumers generally like to see progress, they're typically shocked by sudden, radical changes. He suggests making subtle visual refreshes that are small and gradual, such as amending backgrounds, while East reckons designers should consider the merits of craft-based design. "I'm not just talking about hand-drawn elements," he adds, "but also letterpress-style typography."

Style with substance

For some, though, a site refresh provides the opportunity for a more drastic visual overhaul. It can often be tempting to pepper 3D, video and animation components about the place, or to update tired-looking components such as forms with spangly new CSS and imagery.

Whether you should use such technologies or not depends on their relevance and the site's intended audience. "3D and video can quickly bring a message across that would have taken many paragraphs of text to explain, but these things can also be distracting and should only be used when they serve a communicative goal," recommends Webjam user experience designer Sjors Timmer.

"And if convergence is your goal, it may be wise to leave standard web components such as form elements the way the browser renders them, so people can recognise them immediately and understand how they work without explanation."

In contrast to streamlined static copy, the amount of content integrated into commercial websites via social media is likely to grow substantially during 2009 as businesses catch up with the masses – something savvy designers can take advantage of.

"Social elements are becoming very important, with users increasingly expecting to see other people's recommendations, share content and interact with brands," says Ané-Mari Peter, managing director of on-IDLE.

She suggests that site refreshes should, to some extent, centre around user experiences becoming one-on-one, rather than the old-fashioned 'one-to-broadcast' style that most sites cling to. "Adding a newsfeed – with relevant content – or a blog increases the currency of a site and helps to develop a deeper relationship with a site's users," she says.

And whether you're going for an off-the-peg or bespoke solution, these aren't massively expensive components to set up and integrate. It's also possible to use blog headlines and Twitter updates for portions of a homepage, ensuring that a site appears to update on a regular basis between major events such as product launches.

The biggest danger with social networking is that some companies see it as an easy option during a refresh, not fully understanding what it entails. Forums might, on the surface, seem an enticing prospect, potentially reducing support queries and getting users to help each other, but they can be costly to maintain and police and shouldn't be seen as a replacement for existing services.

There's also the risk of, as Peter puts it, "keeping up with the Joneses", whereby companies buy into social media only to rapidly lose interest when the costs, in terms of time and input, become clear. "If you want to start a blog and get on Twitter, make sure you've got something to say and be prepared to listen to feedback," advises East.

"Don't do it if you can't commit to regularly updating it." As long as that's understood, companies should be taught to embrace social media as fully as possible, even going so far as encouraging users to use Twitter to give feedback, rather than just sending questions via email.

Brands must also be made aware that immersing themselves in social media can backfire massively if they attempt to subvert it. "Users have become adept at sniffing out planted reviews and information," warns Peter.

"Companies must avoid abusing their 'new toys' and designers should provide guidelines before unleashing social components during site refreshes."

Ready-made tools

One of the biggest advantages of social media during site revamps is that the relevant platforms already exist. If you're working with Twitter, the tool is built, ready and waiting.

If you're setting up a blog, various solutions exist that can be integrated into a site in a relatively short space of time.

Designer Chris Garrett thinks this is a major advantage: "In times of financial uncertainty, clients are less likely to want to be tied into proprietary platforms. Utilising open platforms with documented APIs can help win business because the client knows they'll be able to continue working with the platform if their supplier goes under."

Also, for smaller components, ready-made tools can increase a site's usability for little cost. During the 1990s, designers toiled for hours to craft fairly unhelpful location maps, but now Google Maps can be welded to a site with almost no effort.

So if a client asks for a solution to a problem during a refresh, search around to see if a relevant and freely available component already exists before considering building one from scratch.

"However, business owners must examine legal and consistency risks before integrating third-party APIs," warns Vips. He argues that to minimise risk you must have a contingency plan in case services drop or vanish – not least because many APIs are in a perpetual state of beta.

Garrett argues that such risks are outweighed by potential rewards. "APIs have gained massive traction in web applications, but 2009 will no doubt see even more widespread adoption," he says.

"Simply adding an RSS feed to a website enables people to repurpose content in a plethora of ways, increasing your reach exponentially and for little cost. With a cut in marketing spend, making your content open and reusable can be a cheap, effective way of reaching new consumers."

Of course, structure, content and even component integration aren't new, even if they're being used in new ways – they've been around since the dawn of the popular web. Today's market, however, finds a major new spanner in the works when it comes to refreshing websites: mobile.

Going mobile

Usability guru Jakob Nielsen confidently predicts, "The trend towards increased use of mobile websites is no doubt the most important challenge facing web designers in 2009."

People are clearly shifting from desktops to mobile environments for browsing and many upcoming refreshes will largely avoid the 'main' website and concentrate on targeting mobile users. "That prompts a big strategic question," says Nielsen. "Whether to design a separate mobile site or make the main one mobile-friendly."

The direction to take depends on your target audience. Although it's easy to assume that mobile users mostly browse on the move, plenty of people prefer general surfing using an iPhone rather than a laptop. Therefore, find out how your site's users interact with content and develop accordingly.

Nielsen says that a dedicated mobile site with fewer features is best. This should be optimised for smaller screens and pointer/finger-based input, with links to the 'main' site for users who require more advanced features.

However, a client may balk at the cost and there is another way. During a refresh, ensure the main site has clean, semantic markup and a layout driven by CSS, then create a style sheet specifically for mobile (using relevant code to 'sniff' mobile browsers such as Safari that effectively consider themselves desktop browsers).

It'll be the same site, but you can simplify the design and make content more readable and usable for mobile devices by adjusting text size and the positioning and visibility of page sections.

East goes further than that, arguing that designers should take advantage of a refresh to make a site work on everything: "Not just IE, Firefox and iPhones, but other mobile devices and the Nintendo Wii. It could be years before your next refresh and web-enabled next-gen TVs will arrive before then. Don't deny them access!"

Perhaps an awareness of that simple fact – that the web was always supposed to be about accessible information – is the biggest advantage you'll have this year when it comes to reworking websites, whether for yourself or your clients.