Planning a Website

by

Purpose of a website

  • Provide information:
    • Company, product, service, expert info
  • Sell online
    • Subscription service, products via ecommerce
  • Marketing material
    • Landing pages, videos, brochures and whitepapers
  • Provide a digital product or service
    • As a service model
  • IT
    • Integrate with other internal systems
  • Customer support
    • Help desk, knowledgebase
  • Operations
    • Reduce costs by streamlining a process
  • HR and Recruitment
    • Advertise jobs, communicate culture etc

 

Planning your website

  • Review your current site
  • Benchmarking
  • Define goals and objectives
  • Develop personas
  • Use personas to develop user journeys
  • UX and site design
  • Choose a build option
  • Technical considerations
  • Build your site
  • Test
  • Measure against your goals
  • Continually review

 

Website benchmarking

  • Understand how your current website is being used
    • Use Google Analytics to understand your users and their current activity profile
  • Understand who is using your current website
    • Use google analytics to understand demographic information about your current users ie age, sex, location, how they find your site etc
  • Understand current goals and how they are being met
    • Customers interviews
    • Online surveys

 

Website goals statement

  • SMART
    • Specific (simple, sensible, significant).
    • Measurable (meaningful, motivating).
    • Achievable (agreed, attainable).
    • Relevant (reasonable, realistic and resourced, results-based).
    • Time bound (time-based, time limited, time/cost limited, timely, time-sensitive).

 

Example website goals statement

  • Generate more sales
    • Increase monthly bookings by 15% within 6 months
  • Increase sales conversion rate
    • Increase the website sales conversion rate by 5% over the next 12 months
  • Improve sales support
    • Improve sales support on the website through inclusion of knowledgebase articles,
    • Increase avg review rating to 4.5+ within 3 months

 

USER JOURNEY

 

What is a user journey?

  • Series of descriptive steps
  • Typically between 4 and 12
  • Represent i real world scenario
  • Demonstrate how a user currently does something
  • How they could do something in a new and improved website

 

Why should we use user journeys?

  • Demonstrating the vision for the project
  • Understand user behaviour
  • Identify possible functionality at a high level
  • Define your taxonomy and interface
  • Highlight similar journeys

 

How do I create a user journey?

  • User’s goals
  • Their motivations
  • Their current pain points
  • Their overall character
  • The main tasks they want to achieve

 

What should a user journey include?

  • Context
    • Where is the user? What is around them? Are there any external factors which may be distracting them?
  • Progression
    • How does each step enable them to get to the next?
  • Devices
    • What device are they using? Are they a novice or expert? What features does the device have?
  • Functionality
    • What type of functionality are they expecting? Is it achievable?
  • Emotion
    • What is their emotional state in each step? Are they engaged, bored or annoyed?

 

Create a user journey

  • Remember to consider
    • Your user’s goals
    • Their motivations
    • Their current pain points
    • Their overall character
    • The main tasks they want to achieve
  • Don’t forget to include
    • Context
    • Progression
    • Devices
    • Functionality
    • Emotion
  • You can have different feature boxes for different personas, addressing their needs
    • You can utilize different color codes for these different user journeys

 

USER EXPERIENCE

 

Why does User Experience matter? 

  • Good design sells
  • Strong consumer trust
  • Perception of your product or server
  • User-friendly content
  • Good first impression
  • Sets you apart from competitors
  • Consistency = quality
  • Motivate people to take action

 

What is UX (User Experience)?

  • Human interaction
  • Design / aesthetics
  • Utility
  • Usability
  • Performance
  • Ergonomics
  • User Experience

 

How to do UX yourself

  • User journeys
  • Look at the entire process
  • Prototype / wireframes
    • Challenge the status quo
    • Try new ideas
  • Don’t just focus on aesthetics
  • Simple is usually best
  • Test with real users
    • Prototypes first
    • Once built
  • Use date
    • A/B testing
    • Once live use analytics
  • https://www.hotjar.com/

 

Digital Agency

  • Offer full range of services
    • Designers
    • Developers
    • UX experts
    • SEO experts
    • Project managers
  • Things to consider when hiring a digital agency
    • Do they work with similar companies to yours
    • What project apprıach do they take – agile or waterfall
    • How easily could you move from them if you wanted to
    • Are they selling you their own website product or a known CMS
    • What are their ongoing support and maintenance costs
  • 4-6k standard website
  • 10-15k custom website
  • 10-30k ecommerce website

 

Freelancer

  • Technically skilled
  • Cheaper than an agency and may well have agency experience
  • Flexible
  • Usually a faster turn around than an agency
  • Might work with other freelancers for design, SEO, PPC etc
  • Things to consider when hiring a freelancer:
    • Make sure you own the code / IP
    • Be aware that they might not be available if they are with another customer
    • Be mindful that they need to be paid on time
    • They might work strange hours

 

WEBSITE FEATURES AND FUNCTIONALITY

 

Standard Features of a website

  • Navigation
  • Homepage
  • Content pages
  • Footer
  • Contact form
  • Newsletter signup
  • Blog
  • Carousel controls
  • Video content
  • Social links and widgets
  • Custom features

 

Navigation

  • Main navigation
  • Footer navigation
  • In-page navigation
    • Internal links
    • Off-page links
  • Think about information architecture
    • Categorising of information
    • Meaningful ways for users to find and move between information
    • List pages
    • Paging controls
    • Descriptive links

 

Homepage

  • This is where you make your first impression
  • Communicate your businesses personality
  • Give visitors the information they need
  • Provide options for routes into your content

 

Content pages

  • Publish information about your business, product or service
  • Standard layouts – maybe 2 or 3 page templates
  • Concise and relevant copy
  • Use images (ideally real images of your offering not stock images)
  • Make sure content includes links to other relevant content on your site
  • Consider SEO
  • Include call to action (CTA)

 

Footer

  • Contact details
    • Address
    • Phone numbers
  • Legal links
    • Terms and conditions
    • Privacy policy
    • Cookie policy
  • Newsletter sign-up
  • Social links
  • About us paragraph
  • Copyright
  • Company number and or VAT no

 

Blog

  • Communicate with your audience in an informal tone
  • Publish domain expertise
  • Present you organisations personality
  • Build trust with your customers
  • Attract inbound links
  • Increase search rankings
  • If you have a blog, make sure you post to it regularly
  • Integrated or stand-alone?

 

Social widgets and plugins

  • Great if you are active on social media
  • Remember that your posts will be seen on your website so be mindful of what you post
  • Some plugins and widgets are easy to add others require a developer

 

Choosing a domain name

  • Choose a domain name that represents your business
  • Avoid hyphens or numbers if you can
  • Think about domain suffixes
    • Com
    • Co.uk
    • Org
    • Uk
  • Since 2015 there are hundreds of new domain suffixes
    • .london
    • .name
    • .agency
    • .shop

 

Buying a domain name

  • There are lots of places that will sell you a domain name
  • Ultimately all domains are registered on a central register
  • Make sure the domain is registered in your company name, not the company you are purchasing it via
  • 123-reg.co.uk
  • Costs range from 1-100 GBP

 

Hosting

  • Your own server
    • Located at your business
    • Limited resilience / failover
    • Requires IT to take responsibility for security and updates
  • Dedicated server
    • Locate in data centre
    • Shared responsibility for security and updates
    • Can be expensive
  • Virtual server
    • Located in a data centre
    • One of many virtual servers on one physical server
    • Often includes automatic security updates
  • Cloud hosting
    • On demand resource provision
    • Very scalable and can be cheap at the entry level

 

Hosting and website builders

  • Hosting is included
  • SaaS model means you are in effect subscribing to a hosting package
  • Check terms for usage limits
  • Once your site is built and hosted with a service such as wix.com you can not move it another hosting provider
  • Some builders such as wordpress do offer an export / backup restore feature meaning you can move it to another hosting provider
    • This can be time consuming and might cause issues

 

Cross-browser testing (F12 key)

  • Web browsers render HTML as web pages
  • Each browser has a slightly different rendering engine
  • Make sure your site looks the same in all browsers / devices
  • Most website builders will have cross-browser compatibility covered
  • Most frameworks ie Twitter bootstrap have it covered
  • Most modern themes and templates will also have it covered

 

WordPress Plugin Recommendations

  • Yoast
  • Smush
  • WP-cache