Creating a User Friendly WebSite

1

• Topic 4
• Creating a User Friendly Web-Site

2
Objectives of Topic 4

• Determining the components of a user friendly
  web-site
• Deciding goals for the web-site
• Beginning web-site design
• Modifying and updating web-sites

3
Six Web Design Tips
Stickysauce.comd

• Navigation
• Layout
• Load time
• Browser/screen resolution compatibility
• Color
• Site design

4
Web Design Tips

• Navigation
• It should be concise, quick and easy for your
  users
• Navigation structure should be uniform throughout
  your web-site
• Keep users informed about which part of your site
  they are in and how to move on to other parts of
  your site
• Layout
• Keep the same layout throughout your site
• Never cram your page with too much information
• Try to keep scrolling to a minimum

5
Web Design Tips continued

• Load time is very important
• The longer it takes for your site to load the
  quicker the visitor will leave
• Design your site with a user of a 56k modem in
  mind
• The recommended file size for a web page is
  40-60K
• Save all photos as .jpg and all normal graphics
  as .gif
• Browser / screen resolution compatibility
• Try to make your site friendly to all browsers
  and all screen resolutions

6
Web Design Tips continued

• Color
• If your site is of a business nature use light
  colors such as Blue, Grey, White etc.
• Try to use between 3-5 colors on one page
• Make sure that the colors complement each other
• Site design
• Anyone can build a web-site but not every one can
  design a web-site

7
Web Site Design Donts!
Larry Dotson _at_Stickysauce.comd

• Don't load your web-site with a lot of high tech
  clutter
• Don't use unnecessary words or phrases
• Don't make the mistake that everyone will totally
  understand your web-site message

8
Web Site Design Donts! continued

• Don't write your strongest point or benefit only
  once
• Don't place all your words together on your web
  site
• Don't use content in which your target audience
  has no interest

9
Web Site Design Donts! continued

• Don't use words your web-site visitors might not
  understand
• Don't use many different content formats
• Use the same --
• Fonts
• Text sizes
• Text colors

10
Web Site Design No-No's! continued

• Don't let selling words and phrases go unnoticed
• Highlight important words and phrases with color,
  bolding, italics, underlining, etc.
• Don't forget to use words that create emotion
• Emotion sells!

11
Making Your Site More Useful
Carole Pivarnik _at_Stickysauce.comd

• Teach something
• There is high demand for concise, well written
  how-to information
• If you have a business Web site, you have an area
  of expertise
• Simplify a complex task
• Many tasks are so complex that people have
  difficulty figuring out where to start and what
  to do
• Examples are buying a home, changing careers, or
  starting a business
• Provide checklists, on-line wizards, or other
  tools to organize and automate complex tasks

12
Making Your Site More Useful

• Offer extraordinary value
• People calculate value by comparing what they get
  to how much it costs
• Create value by showing how benefits exceed the
  cost
• If difficult to compete on price, increase the
  value by packaging with "free" add-ons or
  companion products
• Offer unparalleled convenience
• Make it a snap to locate and use your Web site
• Make it easy to remember
• Design it for easy access

13
Making Your Site More Useful

• Assist with decision-making
• Provide organized, easy way to make purchase
  decision
• For example checklist or worksheet
• Provide superior quality
• Provide that extra feature, service, or customer
  care
• Invite participation
• Provide forums, share advice, publish articles,
  etc.
• Sites that provide valuable communities for
  customers gain greater customer loyalty

14
Making Your Site More Useful

• Give something for nothing
• People respond to getting good stuff free
• Differentiate
• Set your site apart by offering a different mix,
  more content, better quality
• Diversify
• Offer content, tools, and services for different
  levels of expertise or areas of interest

15
Creating A Successful Homepage

• How do I organize my web site?
• Write an outline
• Include about us, mission statement, products
  services, testimonials, ordering info, contact
  info
• Always stress the benefits of your product or
  service!

Earl B. Hall _at_Stickysauce.comd
16
Creating A Successful Homepage

• Ask for your visitors e-mail addresses?
• Ask them to sign your guest book
• Ask them to subscribe to your newsletter
• Request information from your auto-responder

17
Creating A Successful Homepage

• Remember content is king!
• If the banner does not generate income, then you
  do not need it
• A clean, crisp logo and a few small images can be
  used to emphasize a particular point of interest
• An eye-catching headline is important!
• Using words like new and "discover will get
  attention

18
Creating A Successful Homepage

• How long is a web page?
• A web page can actually be as long as you want it
  to be
• Try to keep your pages to around 50-60k if
  possible
• Web surfers are impatient!

19
Design Tips
Mitchell Harper _at_Stickysauce.comd

• Tip 1 Select a color scheme and stick to it
• The best way to choose a color scheme is to take
  a look at other sites that you like
• Heres list of good color combinations
• Red, yellow and white
• Blue and white
• Red, gray and white
• Blue, orange and white
• Yellow, gray and white

20
Design Tips continued

• Tip 2 Design for cross browser compatibility
• Never implement either an Internet Explorerd or
  Netscaped specific function into a e-business site

21
Design Tips continued

• Tip 3 Provide an intuitive easy to use menu
  navigation
• Most web sites display either a left-aligned,
  vertically orientated menu or a top-aligned,
  horizontally orientated menu system
• Surveys have shown that using either one (or both
  in a complementary style) of these menu styles is
  guaranteed to provide your customers with a
  positive experience

22
Design Tips continued

• Tip 4 Use cascading style sheets
• Cascading Style Sheets (CSS) allow you to develop
  a specific set of style classes, which you can
  implement throughout your site
• Style sheets can also be used to change certain
  style attributes of the built-in HTML tags
• Use your color scheme as discussed in tip 1 to
  create a variety of styles including a bold
  headline, an important points style, a default
  text style

23
Design Tips To Live By continued

• Tip 5 Open external links in a new window
• Be sure that any links that don't take the
  visitor directly to a page on your site should be
  opened in a new window by default
• This benefits both yourself and the customer
• Users still have your site open and are given
  free reign to browse the external link

24
Keys to Profiting in E-business
Stickysauce.comd

• Key 1 Provide Value
• Your web-site should provide free resources,
  foster a sense of community and show real value
  to your customers
• Key 2 Quality Presentation
• Quality means clear easily understood web
  design that looks good and is easy to understand
• Your e-business users will make quick
  determinations about the quality of your site
• High quality will result in more traffic

25
Keys to Profiting in E-business

• Key 3 Be Unique
• Foster the Five C's (content, community,
  consistency, capability and commerce)
• Key 4 Build Your Brand
• Use a name that people can easily remember
• Utilize brand recognition
• Name needs to be catchy and meaningful

26
Keys to Profiting in E-business

• Key 5 E-commerce
• Visitors need to be able to make purchases at any
  time with just a click of a button
• Cater to the impulse buyer provide a simple yet
  effective shopping cart system
• Key 6 Form Affiliations
• It is important to form solid partnerships and
  affiliations
• Develop joint venture partnerships with those
  web- sites that fit with the "theme" of your
  e-business

27
Keys to Profiting in E-business

• Key 7 Technological Knowledge
• You don't have to be a programmer, but you must
  have access to those people who are
• Key 8 Promote
• Advertise
• Key 9 Patience
• Think long-term
• Create step-by-step and you'll be greatly
  rewarded
• Key 10 Investment
• Invest both time and money

28
Developing the Tech Farm Salesroom Web-Site

• Meetings with principals and graphic designer to
  outline content
• Developed and revised content
• Obtained server space from Tech
• Developed navigation for the site
• Gathered pictures and images

29
Developing the Tech Farm Salesroom Web-Site
continued

• Obtained preliminary images from graphic design,
  digital camera shots, and scanned images
• Obtained Tech logo from the universitys web site
• Manipulated images with Photoshopd
• Assembled images and content with MS FrontPaged

30
Developing the Tech Farm Salesroom Web-Site
continued

• FrontPaged can be used to start placing outline
  items on the Home-page next they need to be
  arranged and links established

31
Developing the Tech Farm Salesroom Web-Site
continued

• FrontPaged also has an html view of the previous
  page shown
• Notice that the first file is named index.html
  Welcome.html or default.html would also work

32
Developing the Tech Farm Salesroom Web-Site
continued

• Initial markup
• Worked as a place holder while the site was under
  construction

33
Developing the Tech Farm Salesroom Web-Site
continued

• Here is the first markup from the graphic
  designer
• The images were either drawn or photographed from
  real objects
• BUT, the color was wrong!!

34
Developing the Tech Farm Salesroom Web-Site
continued

• Revised the markup again utilizing Tech colors
• The web-site is always under construction
  products, prices other information are always
  changing

35
Developing the Tech Farm Salesroom Web-Site
continued

• New Features Poinsettia Order Form can be
  printed on-line
• Can be faxed or mailed to Salesroom
• On-line ordering for cheese, beef jerky, and
  poinsettias

36
Developing the Tech Farm Salesroom Web-Site
continued

• Directions to the store
• History
• FAQs
• Mailing List
• Contact Information
• Special Orders / Product Information

37
Features of the Tech Farm Salesroom Web-Site

• Site Consistency (color and feel)
• Meta tags the words search engines use in
  ranking sites are encoded here
• Search feature forthcoming
• Text and graphic navigation menus
• Attention to graphic size and loading speed

38
On-line Order Considerations

• Which of Techs products are feasible for on-line
  ordering?
• Cheese, Beef Jerky, Poinsettias
• What forms of payment to accept?
• Credit/debit cards, checks, cash
• Process payment on-line using an electronic
  merchant account or manually using existing
  credit card machine?

39
On-line Order Considerations continued

• Security issues SSL, Encryption
• Transaction history vs. privacy concerns
• An out-of-the-can shopping cart
• Deciding who responds to on-line orders
• Dairy Products Manager or Salesroom personnel
• Order fulfillment and inventory control

40
Thank You!!

• Are there any questions?