Pauline Randall

Florizel Media Ltd

Get Real

Results from

your Website

Housekeeping

• Session times

• Fire alarm and fire exit

• Break for coffee/tea/phones

Introductions!

Course content

In this course we will:

• Explain what makes a good website

• Help you to critique your own website and others, taking into

account accessibility legislation which applies to websites

• Help you define measurable and achievable goals for your

website

• Enable you to define a brief for a new or redesigned website

WHAT MAKES A WEBSITE

GOOD OR BAD?

First Impressions

• Weird / spammy domain names - too many hyphens, too many

salesy words, unusual TLDs, that kind of thing.

• Too busy

• Poor look and feel

• Too much blinking

• Animation

• Gaudy colours

• Auto sound/auto video play

• Awful mobile user experience

• ALL-CAPS PARAGRAPHS – don’t shout

• Dull fonts or unreadable fonts

Content

• Out of date

• Bad copy

• Too many exclamation marks!!!!!

• No more than one exclamation in a sentence - and no more than three

through the page

• Poor grammar

• Get-rich-quick copy - "Talk to me and I'll tell you more!"

• Too much hype – not everything is “too good to be true”

• Vague stats

• Random quotes from fake people

• Walls of text

Finding things (or hiding them)

• Bad navigation

• No 'About Us' page

• No team / people details

• Hidden phone number / address details

• Hidden pricing

• Obscure payment options

• Obfuscated shipping information

• Social media buttons that block your screen, too many social buttons

• Log in via Facebook

• Legal requirements about displaying company information

Getting the job done

• Hidden value proposition / message –what do you actually do?

• No call to action - what do you want visitors to do?

• No social proof / testimonials

• No user / customer reviews or ratings

• No secure (SSL) certificates (particularly for ecommerce sites)

• 'Are you sure you want to leave?' pop-ups

From 44 Reasons Why People Don’t Trust your Website by Econsultancy

Read the full article (and check out the comments at the end for

some additional points.

Also: 25 reasons why I’ll leave your website in seconds

And: 22 more reasons why I’ll leave your website in 10 seconds

Lets look at some really bad

websites…

http://www.webpagesthatsuck.com/dailysucker/

http://www.exmouth-view.co.uk/

http://www.libertyvan.com/

http://dh.ncl.ac.uk/Identefact/Greek%20Pots/album/slide.html

WHAT SHOULD MY WEBSITE

CONTAIN?

We’ve seen what’s missing so

A Website Content Checklist

Enough product/service information

to be able to make a buying decision

Range, price, colours, size, weight, availability,

terms etc.

Video and images Particularly important to have good images/video of

your products

Reviews and testimonials Especially important for ecommerce sites

Added value Downloads, articles, resources, handbooks,

frequently asked questions (FAQs), blog

Clear calls to action Tell visitors what you want them to do next

Contact information Give people a choice of contact methods

Company notices Terms and conditions, privacy policy, cookie policy,

business’s legal status, VAT number

Personal information Who is behind the business? Name, photo and a bit

of background

THE PRINCIPLES OF GOOD

WEBSITE DESIGN

Design is not just what it looks like and feels like.

Design is how it works.Steve Jobs

Purpose

• What are your visitors coming for?

• Each page should have a clear purpose for the visitor

• Do you want your visitors to:

• Buy something

• Be entertained

• Sign up for something

• Book something

• Be informed

Communication

Users want to get their information quickly:

• Use headings and sub headings to break up text

• Use bullets and numbered lists to organise content

• Keep the key content at the start of the page – not

everyone will read to the bottom of the page

Typefaces

• Font styles: sans serif is easier to read on screen than serif fonts

• Typefaces: limit to maximum of three different ones within your site

• Type size: large enough so that the body copy is easy to read 16 px

(or 12 point) is generally a good size

Sans Serif (e.g. Arial)

Serif (e.g. Times New Roman)

Colour

• Colour can add interest and make the site easier to use. Or it can

make it almost unusable

• Vibrant colour can be used to highlight – don’t overuse it

• Be careful of contrast between the background and the foreground

(accessibility)

• Don’t forget that white (negative) space adds to your site – don’t feel

compelled to fill everything

Imagery

• Straight text on your website can be hard going – add imagery to

increase communication

• Photos

• Video

• Infographics

• Drawings

Navigation

It should be easy for people to move around your website

• Logical hierarchies

• Breadcrumbs

• Clickable buttons

Grid based layouts

• Placing content randomly can seem like a clever, edgy idea

but in practice it makes it harder to follow the content of your

site

• Grids provide structure

• Find out how grids can work with design

F-pattern Design

We read from left to right

An

d to

p to

bo

ttom

The most important part of

the page

Mobile Friendly

Everyone needs a mobile version

of their website today

Usability testing

Get some people who don’t know their way around your site to

do some testing

• Ask them to find something

• Get them to go through the buying/enquiry process

• Find out what they thought of your navigation/design etc

ACCESSIBILITY

Accessibility

Consider the type of disability your site visitor may have that could

make it harder to access your website:

• Visual – poor eyesight, colour blindness or total blindness

• Motor – difficulty in using a keyboard, mouse or making precise

movements

• Cognitive – difficulty in understanding the language or the

context of the information given.

Accessibility

Technical issues which may also affect the viewing of your site

include:

• Small screens

• Slow connection

• Old software

• Old web browsers

Refer to BS8878 for current guidelines http://www.access8878.co.uk/

Website accessibility checker: http://wave.webaim.org/

Colour contrast

Avoid this

Aim for this

Or this

Or this

If you’re not sure - http://webaim.org/resources/contrastchecker/

DOMAIN NAMES

Consider the following …

www.thisismywebsiteindunfermlineandimakecakes.co.ukwww.maryscakes.co.uk

Think of what happens when you remove the spaces…

A database of talent representatives called Who Represents?www.whorepresents.com

http://www.searchenginejournal.com/how-your-domain-name-will-impact-seo-social-media-marketing/

http://www.classiccakes.co.uk/ http://www.classiccakes.org/ http://www.classic-cakes.com/

MARKETING

You need to be found!

• Online

• Content

• Keywords

• Titles and descriptions

• Blogs

• Pay Per Click (PPC)

• Social media

• Email signature

• Offline

• Any printed materials

• Business cards

• Brochures

• Pop-up banners

• Print advertising

CREATING YOUR WEBSITE

Make a sketch

Think about the site technology – a lot depends on what you want your site to do

Static or Dynamic

A static web page (sometimes called a flat page/stationary page) is a

web page that is delivered to the user exactly as stored, in contrast to

dynamic web pages which are generated by a web application.

Advantages of static website:

• Quick to develop

• Cheap to develop

• Cheap to host

Disadvantages of static website:

• Requires web development expertise to

update site

• Site not as useful for the user

• Content can get stagnant

Dynamic sites include:

• Online shops

• News sites

• Wordpress and other CMS sites

Flash

• Rich media experience

• Can cause compatibility/accessibility issues

• Search engines find them hard to index properly

• Suited to media orientated sites – music, film, high profile

brands

• Won’t run on a Apple mobile software so excludes iPhones,

iPads etc

• 5 Reasons why you shouldn’t use Flash for your website

Who will create your site?

Do it all yourself?

• You can produce the site you want

• Update as often as you like

• Do you have the skills?

• Do you have the time?

Template

• Online services

• Quick easy set up

• On-going cost

• One solution fits all

• Can be hard to differentiate

However…

• Often a good choice for online stores

Web Designer

• Most expensive approach

• Most professional results

• Maintenance and updates may be costly

METRICS

Measuring Performance

• Statistics – analytics packages (eg Google Analytics)

• Code/coupons used

• Ask customers how they found you (on forms or over the phone)

• Sales/enquiries

Performance measures should lead back to your website purpose

BEFORE YOU START…

Check…

Timescale

Budgets

Responsibilities

Technology

Special requirements?

Web hosting requirements (and location of your web host)

REAL RESULTS IN THE FUTURE

Your website is never

completed!

• Keep content updated

• Check for broken links – other pages/sites may move or close

• Always check your position in search

• Regularly check out your competitor’s websites

• Keep an eye on current trends but don’t forget that your site

should be accessible for your customers

Summary

• Balance of technical and soft skills required

• Be clear about site goals

• Choose development to suit skills and budget

• Refer to accessibility legislation

• Always review your position

What next?

• Meet with a Business Adviser

• Attend other Business Gateway events – event programmes are

available

• Use the Business Gateway Information Service – call 0845 609 6611

• Check out the Business Gateway Fife website at

www.businessgatewayfife.co.uk or find us on Facebook and Twitter.

Keep in touch – call us on 01592 858333