Want to help a Scottish charity and get a £10 Amazon voucher?

We’ll be carrying out some user-experience testing on an arts charity website soon and we need your help. If you’re over 18, can travel to Edinburgh or Glasgow and have 45 mins to spare  then we’d love to hear from you. Ideally we’re looking for people who don’t have a web/design background and you don’t need to know anything about the arts.

We’ll give you a few simple tasks to complete on the site and we’ll ask you your opinion on elements of the site as we go along. What you think about the website matters to us and by giving up 45 minutes of your time you’ll be helping the charity provide an even better service (we’ll be able to tell you who they are when you get in touch). Oh and did I mention there’s a £10 Amazon voucher in it for those who take part.

We’ll set a date/time that suits you – if you’re interested in taking part or simply want to find out more then get in touch: ross[@]thirdsectorlab.co.uk or @ThirdSectorLab or leave a comment below.

Six steps to determine if it’s time for a website redesign

The prospect of a website redesign can be daunting for any small business owner. Before investing the time and money necessary for such an undertaking, entrepreneurs should consider six factors.

Does your site feel fresh? If your site feels as though it no longer accurately reflects your company, feels stale, is overly complicated or just unmemorable, it’s time for an update.

Does your site feel effortless? Your site worked exactly the way you wanted it to when it first launched. Does upgrades, changes, expanded product categories and new content made it unwieldy and difficult for visitors to navigate (and for you to manage and easily update)? If so, it’s definitely time for a redesign.

Are you really as customer service oriented as you think you are? What and how your customers order (or don’t order), their comments and phone calls, tell you everything you need to know about how user-friendly your site is. You might believe you are doing everything you can to make their experience positive, but their words and actions will tell you if that is true. Listen and redesign around their feedback; it will pay off for both of you.

Are you really as shopper-focused as you think you are? Your site’s design must cater to your customers. Your content and labeling should speak their language. Your navigation structure should allow for customers to shop the way they want to shop – not how you think they should. Be there when they need you, and get out of their way when they don’t.

Are you utilizing social media? The time when you could ignore social media is gone. Integrating sharing and interaction features with your site will increase traffic and sales. Different businesses need different amounts of social exposure, but almost every site can benefit from it in some way.

Are you capitalizing on recent technology advantages? Every day, new technologies are making more and more things possible and raising consumers’ expectations. These days, it is imperative to offer location-based functionality, integrated product reviews, fast page load times and simple methods for browsing and finding products.

If you answered “no” to any of these questions, it’s probably time to at least consider a website redesign.

The Ultimate Website Prelaunch Checklist

We’ve all been there.

After months of development, meetings, conference calls, protracted arguments over typography, photography, colour ways and copy. All of a sudden the site is approved and the client wants it live.

Do you think to yourself, ‘I know every pixel on this site inside out’ and put it live?

Hopefully not. You’ll have a printed checklist which you complete before you go public.

By no means is this an exhaustive list. Neither is it presented in any particular order. Your own checklist will be very much tailored towards your own individual clients and the type of project you are delivering. Be sure to add your thoughts and suggestions to the comments at the bottom of the page.

Either way, get your team together, get out the red pen and start ticking them off.

Copy Checks

Check your spelling.

If it comes down to a web designer to highlight the smelling pistakes of a copywriter then so be it. Show the world you are no slouch and run a spell check. Better still, get your copywriter / project manager to do this. Be sure you check for widows or orphaned items in important paragraphs too.

Check your tone of voice.

Ensure this is consistent across all your pages, that your audience is being addressed the same way throughout the site. If your services include ‘Research & Development’ ensure it is expressed using ‘&’ everywhere it appears, always with capitalisation, and if you display times and dates be sure to express them the same way throughout. This is a cornerstone of well-crafted, easily scannable copy.

Copywriting on the web workshop

 

Need some help with your copywriting? Enrol on Relly Annett-Baker’s upcoming workshop

Check your details.

I’m quite serious about this. Phone all phone numbers you have been supplied. Do they work? If you’re building a site for The Royal Albert Hall, do they answer? And are they aware you are shortly going to launch a site, with their number on it, inviting thousands of people to call for more information? These are crucial checks to ensure that the entire marketing process, right down to (phone) calls to action are prepared for the site going live. Check email addresses you have been supplied and make sure they work and are being received by someone. Oh, and check they are not still pointing at you for testing – make sure the clients email address is specified when the site goes live.

Check through any ‘hidden’ copy on site.

Look at ALT text and ensure it is descriptive and not just ‘XXX’ – read through any text within Javascript functions, failure or alert messages, and also and remove anything potentially embarrassing or plain unnecessary.

Make sure you are not going live with any test copy on your site.

Check for instances of ‘For more information call XXXX,’ or worse still, ‘At ACME and Co we pride ourselves on [Dave, has the client approved the mission statement yet]‘ You get the picture.

SEO

Check your keywords.

Ensure you have your meta description in place, and that any keywords are suitable for the site. Do the keywords appear in your site copy where appropriate? Turn off your style sheets and read your site as a search engine will, and check your keywords are written in HTML and not all contained within images.

Check your titles.

Do you pages have relevant and descriptive title tags, and are your page names suitably descriptive.

Check your URL structure

Google has taken considerable steps within Webmaster Tools to reward site owners for declaring, and being consistent about canonical URL’s. That is to declare to Google which URL structure you will maintain on your site, to avoid the duplicate content penalty. So if you choose example.com/products over www.example.com/products, then check to ensure the links within your pages follow this convention.

Check you have a sitemap.

Generate an XML sitemap and submit it to Google, Bing, and Yahoo. Gsite Crawler is a great tool to help create these automatically for you.

Set up analytics on your site and schedule any weekly reports that might need sending to your clients, and also set up any statistical alerts you might need to notify you of any spikes in traffic that might signify malicious activity. Stats packages worth your attention are listed in the URL’s below.

 

haveamint.com

Mint is one of a number of tools that will help you optimise your site for search engines and track results.

Standards and Validation

Clearly this is not something that should be left until the last few days prior to launch. But you should always make one final sweep through your content to check for validation issues. You should be checking your HTML, CSS, Accessibility and your Javascript. Quite often you can encounter validation issues late in the project with the addition of javascripts from a third party if a client has reporting software they wish to use, or if you are carrying advertising or inviting referrals from an affiliate network. As these are so often just thrown in to the code at the last minute it is vital to check that they don’t interfere with functions that were (up until then) working just fine. The Developer Toolbar for Firefox is a great time saver when it comes to validating your HTML and CSS, with the WAVE toolbar being similarly indispensable for checking against WCAG guidelines. That said there is no substitute for a good working knowledge of the WCAG guidelines as so much of them cannot be checked against by a plug-in, and requires common sense and a keen eye to avoid problems.

 

Web Developers Toolbar

The Web Developers Toolbar for Firefox is a great time saver when it comes to validating your HTML and CSS.

Site Functions

Does everything work?

Again, this should have been tested long before now, but don’t go live without checking it. Often you will have moved a site from a development server to a production server in the run up to putting it live, and that may have upset your file structure. Maybe you have an API which relies on the address of a development server to work and will need altering if it is to work at the live address.

Check your search facility

Check your search facility if you have one and make sure that is pulling in results. Also check for dead links across the site with something like Xenu’s Link Checker.

 

Screenshot of Xenu

Xenu’s Link Sleuth checks Web sites for broken links.

Check all browser variations

Check all browser variations that you promised to support, all screen resolutions and ensure that your site degrades gracefully without the support of Javascript and Flash. Your site should be easily interpreted by a screen reader with CSS switched off, and this can be checked by downloading a text only browser such as Lynx for the PC.

Think about common web conventions and whether your site breaks them. Are all your links consistently styled? If all links are underlined, check that no text is underlined for presentational reasons that people might mistake for a link.

Don’t forget to set up a print style for your site.

It is stunning quite how often this ignored. Insert this line into your <head> tags and create your print style sheet.

<link rel="stylesheet" type="text/css" href="print.css" media="print" />

Security

Ensure you have your site files backed up, but assuming that this is something you do as a matter of course, ensure that you are backing up any databases on the website that might contain important customer data. There are services and applications who can automate this for you such as Site-Vault and Iron Mountain, providing you with the peace of mind that only a reliable backup can bring.

 

Screenshot of Site Vault website

Site Vault automatically backs up your website on a regular basis.

Check your form fields against SQL injections, and test any anti-spam functions you have in place to prevent spam bots.

Protect any sensitive pages

Protect any sensitive pages or folders from being indexed on search engines by putting in place robots.txt files and by excluding them from within Webmaster Tools / Bing / Yahoo Site Explorer and also consider whether you need to use an htaccess file to disable folder view within directories.

Performance

Increasingly this is becoming more an issue. With rumours of Google rewarding faster sites with better rankings it is crucial that your pages load as swiftly as possible.

Safari 4 has a great tool within its developer menu which checks the speed of your pages downloading, and highlights which elements take the longest and therefore might need attention.

Check your image optimisation with a tool like Smushit.

 

Smush.it website

Smush.it is a great tool for compressing images with no loss of quality.

Check you have caching enabled if appropriate.

If possible consider the use of image sprites to reduce http requests to your site. SpriteMe.org offers simple online solution that might get you started.

Minify your Javascript and CSS files using a tool such as YUI or YSlow from Yahoo to ensure your code is delivered as swiftly as possible. Firefox add-ons such as Dust Me Selectors can help to remove unused selectors from style sheets, helping to keep file sizes down.

Legal

Those lawyers get everywhere. Links to legal policies are so often added to a footer element on a website and then given no further thought until moments before go live.

Copyright

Check that this is set to automatically refresh from the time stamp on the server, and that the copyright owner stated is correct. It won’t always be the client or brand who should be credited.

Terms and Conditions

If your site has a promotional element or takes payment then you will need to make available t’s and c’s. Always consult either the Institute of Sales Promotion or a lawyer for the best advice on these, or if they are supplied to you then make sure they have been checked.

Privacy Policies

If you use cookies, capture data, or distribute data, then you need one. The best advice is always to be honest, and to state clearly what you collect data for, how it is stored, and to whom might it be passed. So if you this might be you then be sure you have a clear statement explaining all of this, or least provide details of how you can be contacted for further information.

Company Registered Information

If you are a registered company then you must display on your website the registered company name, number, and address. Simple, but so often forgotten about. For more information visit either Companies House or Business Link online for more information.

 

Companies House website

If you are a UK registered company then visit the Companies House website for more information on your legal obligations.

Add icons and error pages

Add your favicon.

And while you’re at it, do you need one for mobile devices such as iPhones? Add this into the <head>

<link rel="icon" type="image/x-icon" href="/favicon.ico" />

And this for an iPhone

<link rel="apple-touch-icon" href="/favicon.png" />

Create 404 pages.

Crucial for so many reasons. If the project is a re-design then search engines will have cached links to pages that will no longer exist. Use 404 pages to present users with links to where that information is now located. Webmaster Tools provides an easy way to produce 404 pages if you aren’t an experienced developer, but ignore these at your peril.

 

Example error page

Make sure you handle 404 errors gracefully.

 

Anything to add to Boagworld’s Ultimate Website Prelaunch Checklist?