eBusiness Programme workshop programme



       BEST PRACTICE
         WEBSITES
        Presented by: Ann Stanley
       ...
Agenda
• How important is your website?

• Design & Layout
 • Good and bad examples
 • How design effects usability?
 • To...
How important is your website to your business
Score Customer types                     Purpose of website              Of...
“How to look good naked” beauty parade –
most people have the wrong image of
themselves (and their websites!)
Score your site as compared to others
 SCALE
 1-4 = you consider the site poorly designed or unprofessional
 5 = you would...
Importance of your website vs how you
perceive the site (performance)

            10
 Best                               ...
The 3 “conflicting approaches” used in web design
                      Design – first
                      impressions
 ...
Design & Layout
User-Centred Design


“Unless a website meets the needs of the
intended users it will not meet the needs of
the organizati...
Target audience - site aimed at parents and kids
Target audience - site aimed at techies
Branding – lifestyle & aspirations
Branding – lifestyle & aspirations
Branding – design & imagery
Effective well laid out web design
Poor Web Design
Usefulness: Good Example
Usefulness: Bad Example
Building Trust: Good Example
Building Trust: Bad Example
Building Trust: Bad Example
How design effects usability
Usability – Common Problems


• Confusing navigation/links


• Breaking the Back button


• Pop-up windows


• Page elemen...
Liquid Layout
Liquid Layout
Navigation: Good Example
Navigation: Bad Example
Navigation: Breadcrumb Trails
Navigation: Sitemaps
Tools to improve your design
Layout Planning: Wireframes
Cascading Style Sheets (CSS)
 • Enables different style elements to be controlled
   across the site:
       • Typography
...
Cascading Style Sheets (CSS)
Cascading Style Sheets (CSS)
Website Management Systems –
that allow you to modify elements of the layout, design, menus & footer
Website Management Systems –
that allow you to modify elements of the layout, design, menus & footer
Website Management Systems –
that allow you to modify elements of the layout, design, menus & footer
Try it for yourself – www.anicca-web.com
Try it for yourself – www.anicca-web.com
Try it for yourself – www.anicca-web.com
Content
Images: no text = no keyphrases
Images: no text = no keyphrases
Multimedia - Flash




                     www.mowbot.co.uk
Too much text!
Typography
Nottingham City Council – Text Size
Nottingham City Council – Text Size
Content Management System – DIY changes
Edit the page content
See changes on the live site
Multi-lingual content management system
Functionality – what the site can do for
       you and your customers
Features of a property website




“Calls for
action” –
registration
                                      Log-in
& latest...
Registration form
Using your site as a sales tool – searching the
customer database
Clicking into a customer profile




   Customer databases
     and profiling –
  should be modified to
    meet your spec...
Ability to create your own customer registration forms
(with the corresponding database)
Ability to create your own customer registration forms
(with the corresponding database)
Is your site accessible
and search engine friendly?
Accessibility

• Risk of excluding large audience:
   14% of the UK population registered
   disabled

• Accessible sites ...
Accessibility Guidelines
How design, functionality & content influence
visibility in the search engines
 • Design
   • Images can’t be indexed
   •...
Is my content listed in Google? – Yes!




                              This technique also allows
                      ...
Is my content listed in Google? – No!




                              These sites have been
                            ...
Is your site performing?
Do you need to invest in your website?


                  Offline          Online
                advertising      advert...
Get free site metrics from Google
Pulling it all together!
        Getting
        traffic to your
        website




         Quality &
         performan...
Improve Your Search Engine Rankings
Presentation: email ann@anicca-solutions.com
Workshops & events: www.ebusinessclub.biz...
Upcoming SlideShare
Loading in...5
×

Best Practice Website Design Content Functionality

11,614

Published on

This presentations is designed to help small business who are about to build a new or modify an existing website. Using some examples from websites built using the Anicca Solutions Reflex website and content management system. This is a seminar presented by Ann Stanley on behalf of Business Link at the HM Customs and Revenue business roadshow in Northampton.

Published in: Technology
1 Comment
6 Likes
Statistics
Notes
  • Great slideshow. It helped me get organized a bit in my head.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
11,614
On Slideshare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
300
Comments
1
Likes
6
Embeds 0
No embeds

No notes for slide

Best Practice Website Design Content Functionality

  1. 1. eBusiness Programme workshop programme BEST PRACTICE WEBSITES Presented by: Ann Stanley MD of Anicca Solutions
  2. 2. Agenda • How important is your website? • Design & Layout • Good and bad examples • How design effects usability? • Tools to improve your design • Content • Functionality • Is your site accessibly & search engine friendly? • Is your site performing?
  3. 3. How important is your website to your business Score Customer types Purpose of website Offline equivalent 0-3 Majority of regulars, repeat & Business card: recommendations (R-Factor) •Contact details & Map Passing trade 4-5 Large R-factor Brochure site: Some new customers (eg from •Credibility advertising) •Check out offer <50% enquiries or bookings have •Contact details & Map seen or used the website 6-7 Small R-Factor, so rely on new Shop-window: business •Lead generation & enquiries Need to advertise regularly •Most customers use & >50% enquiries & bookings have enquire through the site seen or come from the website •Credibility & information 8-10 Mainly new customers Transactional: Current customers also use •Lead generation & online website to book marketing >80% of enquiries and bookings •Enquiries, registrations & come from website booking engine •Email marketing •Integration with back-office
  4. 4. “How to look good naked” beauty parade – most people have the wrong image of themselves (and their websites!)
  5. 5. Score your site as compared to others SCALE 1-4 = you consider the site poorly designed or unprofessional 5 = you would not bother to browse the site 6 = you would browse the site 8 = you would consider buying or using the service from this site 5 8
  6. 6. Importance of your website vs how you perceive the site (performance) 10 Best Plot your importance No more score vs your effort quality score required Site 5 Performance Need to Quality matches develop a importance – new site not worth investing Poor 1 1 5 10 Importance to Not Very your business important important
  7. 7. The 3 “conflicting approaches” used in web design Design – first impressions counts These approaches are often used by different types of web designers or developers and can conflict with each other Content – what Functionality – the site says to what the site the user and does for the search engines user and your business
  8. 8. Design & Layout
  9. 9. User-Centred Design “Unless a website meets the needs of the intended users it will not meet the needs of the organization providing the website.” Jakob Nielsen • Who is your audience? • What are their demographics? • How will they use the site? • What technology do they have?
  10. 10. Target audience - site aimed at parents and kids
  11. 11. Target audience - site aimed at techies
  12. 12. Branding – lifestyle & aspirations
  13. 13. Branding – lifestyle & aspirations
  14. 14. Branding – design & imagery
  15. 15. Effective well laid out web design
  16. 16. Poor Web Design
  17. 17. Usefulness: Good Example
  18. 18. Usefulness: Bad Example
  19. 19. Building Trust: Good Example
  20. 20. Building Trust: Bad Example
  21. 21. Building Trust: Bad Example
  22. 22. How design effects usability
  23. 23. Usability – Common Problems • Confusing navigation/links • Breaking the Back button • Pop-up windows • Page elements that look like adverts • Ignoring common conventions
  24. 24. Liquid Layout
  25. 25. Liquid Layout
  26. 26. Navigation: Good Example
  27. 27. Navigation: Bad Example
  28. 28. Navigation: Breadcrumb Trails
  29. 29. Navigation: Sitemaps
  30. 30. Tools to improve your design
  31. 31. Layout Planning: Wireframes
  32. 32. Cascading Style Sheets (CSS) • Enables different style elements to be controlled across the site: • Typography • Backgrounds • Borders/margins • Structural elements, e.g. navigation • Benefits: • More control over layout • Quicker loading pages • Quicker development & updates • Easier to support multiple platforms eg pda • Allows use of different font sizes and colours for accessibility • Better for search engines (page layout data stored in CSS not diluting page text) www.csszengarden.com
  33. 33. Cascading Style Sheets (CSS)
  34. 34. Cascading Style Sheets (CSS)
  35. 35. Website Management Systems – that allow you to modify elements of the layout, design, menus & footer
  36. 36. Website Management Systems – that allow you to modify elements of the layout, design, menus & footer
  37. 37. Website Management Systems – that allow you to modify elements of the layout, design, menus & footer
  38. 38. Try it for yourself – www.anicca-web.com
  39. 39. Try it for yourself – www.anicca-web.com
  40. 40. Try it for yourself – www.anicca-web.com
  41. 41. Content
  42. 42. Images: no text = no keyphrases
  43. 43. Images: no text = no keyphrases
  44. 44. Multimedia - Flash www.mowbot.co.uk
  45. 45. Too much text!
  46. 46. Typography
  47. 47. Nottingham City Council – Text Size
  48. 48. Nottingham City Council – Text Size
  49. 49. Content Management System – DIY changes
  50. 50. Edit the page content
  51. 51. See changes on the live site
  52. 52. Multi-lingual content management system
  53. 53. Functionality – what the site can do for you and your customers
  54. 54. Features of a property website “Calls for action” – registration Log-in & latest deals Search Search on results every page from property database
  55. 55. Registration form
  56. 56. Using your site as a sales tool – searching the customer database
  57. 57. Clicking into a customer profile Customer databases and profiling – should be modified to meet your specific needs
  58. 58. Ability to create your own customer registration forms (with the corresponding database)
  59. 59. Ability to create your own customer registration forms (with the corresponding database)
  60. 60. Is your site accessible and search engine friendly?
  61. 61. Accessibility • Risk of excluding large audience: 14% of the UK population registered disabled • Accessible sites work better in less popular browsers/platforms/sizes • Accessible sites are more flexible • Accessible sites are more search engine friendly • It’s the law! Disability Discrimination Act 1999 (2002)
  62. 62. Accessibility Guidelines
  63. 63. How design, functionality & content influence visibility in the search engines • Design • Images can’t be indexed • Certain technologies such as Flash, Frames and JavaScript can’t be indexed • Design can limit the space for optimised text, or too much text can spoil the design • Functionality • Certain database functionality such as dynamic urls, ecommerce sites and some content management systems can’t be indexed • Content • Amount, structure and keyphrases within the content (on-page factors) all have significant influence on positions achieved for keyphrases used by searcher • Content consists of the visible content (ie elements seen by the user) and the content in the code and tags (meta-data) both are important for search engine optimisation • Search engine optimisation is the process used to build or modify a site to improve its rankings in search engines for the keyphrases used by customers
  64. 64. Is my content listed in Google? – Yes! This technique also allows you to see how your web developer has set-up your urls, titles and descriptions for your site (key for being found in the search engines)
  65. 65. Is my content listed in Google? – No! These sites have been constructed in Frames and Flash, technologies which can't be indexed (or spidered) by the search engines
  66. 66. Is your site performing?
  67. 67. Do you need to invest in your website? Offline Online advertising advertising No traffic due to poor search engine positions Website <1% call or email Less than 50% browse >50% exit due to poor No online design or Enquiry/ usability Booking/Shop
  68. 68. Get free site metrics from Google
  69. 69. Pulling it all together! Getting traffic to your website Quality & performance of your website
  70. 70. Improve Your Search Engine Rankings Presentation: email ann@anicca-solutions.com Workshops & events: www.ebusinessclub.biz Further support: eBusiness Programme: Workshop programme advice: Joanne Mobbs: joanne@emcc.org.uk Business Link Business Support Adviser appointment: 0845 058 6644
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×