MRKT10028 Web Marketing,

Fall 2009
Week #4
Web Site Development, Pt
1

Getting a Web Site Started

Site developers need to take many steps

before they can begin to build a site
It begins with an idea

Why are we building the site? (What is its scope?)

What is its purpose?
What are we good at?
Whats our message?
Who is our audience?
What do they want/expect?

MRKT10028 Web Marketing, Fall

Getting a Web Site Started

Once the concept is clear, establish the objectives of the

site. Will it be:

To generate direct revenue through e-commerce

capabilities?
To generate indirect revenue by enticing visitors to contact
the company and engage in a business relationship?
To build brand recognition (which ultimately leads to
generating revenue)?
To generate advertising revenue?
To bring together like-minded people?
To allow for the expression of opinions?
To share ones creative talents or be entertained?
To provide information?
Etc.

MRKT10028 Web Marketing, Fall

Getting a Web Site Started

Next, conduct a thorough needs assessment. Typical skills

and resources include:
Content development
Graphic design
Programming
Product inventory
Site hosting
Marketing
These resources cost money
The level of financial resources needed depends on the
complexity of the overall idea for the site and the depth of
programming required (more skill reqd = more $$$ needed)
A proposal and/or budget are generally prepared for review

MRKT10028 Web Marketing, Fall

Understanding the Audience

In order to develop a successful Web site, you need to

understand:

Your potential audience (your target market)

The audience most likely to visit the site and consume / use your
products or services

What does the audience want?

What will the audience respond to?
What will make the audience take action?

This requires a detailed market analysis

This information is included in the online marketing strategy
(the strategy that the company employs for gaining more
customers and revenue using online methods)
Read the Interview With Lee Rainie (Case Study, Page 268271 for insights into how people use the web)

MRKT10028 Web Marketing, Fall

Understanding the Audience

Target markets are defined by demographic and

psychographic data:

Demographic data provides information by standard and

specific population characteristics, such as age, marital status,

gender, race, and religion (usually secondary, quantitative data)
Psychographic data defines audiences by personality and
lifestyle characteristics, such as types of hobbies, recreational
sports played, hours per week spent online, and
shopping/spending habits (generally primary, qualitative data)

There are any number of methods for collecting this data

(focus groups, phone or in-person interviews, surveys, etc.)
With this information, you can segment your market and
target your ideal customer by designing a site that meets
their needs (see Online Marketers Segmentation Guide,
linked from the LearningPlan)

MRKT10028 Web Marketing, Fall

Development Decisions

Businesses can handle site development one

of two ways:
Internally by having their own (experienced, skilled)
employees create the site
Externally, by hiring another firm to build it for them

There are pros and cons associated with both

in-house development and outsourced
development including time to develop, costs,
expertise, professionalism, control, etc. (see
pg. 272 for a full list)

MRKT10028 Web Marketing, Fall

Information and Interaction Design

Information design (architecture) is the term used to

describe how information is laid out on a web site

The sites purpose must be clear on the homepage

Main content sections should flow from the home page

(and be accessible from every main section page for

consistency)
Secondary pages (sub-sections) should flow from related
main content pages
Ideally, your audience profiling would include usability
analysis (what would people want from your web site
and where would they expect to find information?)

Design around your audiences expectations/needs, NOT

around your companys organization / wants

Its not about YOU, its about THEM!

MRKT10028 Web Marketing, Fall

Information and Interaction Design

Interaction design is how users will navigate the site

Web sites are non-linear (users can go anywhere from

anywhere even to someone elses site!)

Navigation and hierarchy (architecture) must make finding
information easy for site visitors
Navigation must serve information in such a way that visitors
are led to pages that you most want them to view

Navigation is not simply links from one page to another, but

the specific and planned organization of links that provide
the organizational structure of the site
Navigation can be provided through a number of different
methods; links are usually text and/or graphic buttons

Generally sites use buttons in one area (top/left) and duplicate

them with text links at the bottom

Never try to surprise your users by using unclear navigational
clues (mystery meat navigation

MRKT10028 Web Marketing, Fall

Navigation Schematics (Flowcharts)

Start with a schematic that shows how the

content of a site will be organized and broken
down into tiers
Once established, the navigation should remain
exactly the same on all pages, to avoid confusion
Within each category, other topic-related pages
(known as the second tier of the site) may be
required
Lower tiers of a site are usually accessed through a
separate navigation system for each category, or
as drop down items from the main navigation

MRKT10028 Web Marketing, Fall

10

Navigation Schematics (Flowcharts)

A basic schematic that shows the categories of information

that are directly accessible from the Home page
Note that the home page is its own top level tier and
main content flows down from it

MRKT10028 Web Marketing, Fall

11

Navigation Schematics (Flowcharts)

The schematic has expanded to show the pages that are accessible
from each category. These are second tier pages; navigation to them
would be accessible only from their parent page

MRKT10028 Web Marketing, Fall

12

Samples of Navigation in Different

Sites

Main content is always available through consistent navigation

(usually at the top) on each (main) page; secondary navigation
generally appears as a drop down list or side navigation bar on
parent pages

MRKT10028 Web Marketing, Fall

13

Other Navigation Options

Search engines invite users to type in a word or phrase that they wish
to search for within a site

You can have a programmer write a search engine for your site or pay a site
like Google for the privilege of piggy backing your site search on their
servers using their tools

Site maps re-create the original schematic on the site (like a table of
contents) of the site must be updated whenever a site changes
A tag cloud is a collection of tags (or keywords) that are popular
among users of social networking and social bookmarking sites (but
not popular among users!)

See Flickr tag cloud: http://www.flickr.com/photos/tags/

Breadcrumbs are an aid to determining ones location within the site,

by showing the path of links the visitor took to get to the page they
are on (not navigation per se, but helpers for where you came from
and how to get back)

Mohawk uses breadcrumbs on their second and subsequent level web

pages

MRKT10028 Web Marketing, Fall

14

Laying Out Your Pages

Successful site and page layout

accomplishes very specific goals:
Makes the purpose(s) of the site clear
Promotes the brand
Provides easy access to information
Leads the user to specific areas of interest
or areas that you want them to see
Provides an attractive, aesthetically
pleasing environment for the user

MRKT10028 Web Marketing, Fall

15

Laying Out Your Pages

Sites will typically have different layouts for the home page
and for all second tier pages

Sites tend to be more graphic heavy on the home page, where

the pages need to catch the users eye and entice them to
browse further
In the lower tiers, pages tend to be more copy or content heavy
Oftentimes, detail pages (product descriptions, for example)
have their own (third) design/layout
Consistency is key do NOT confuse the user by changing
things frequently!!!
Do not trick the user with confusing navigation or inconsistent
navigation (KISS)

Learn good design by studying bad design at

www.webpagesthatsuck.com

MRKT10028 Web Marketing, Fall

16

Home Page vs. Second Tier Page

MRKT10028 Web Marketing, Fall

17

Page Layout (contd)

In developing the layout, developers often try to design sites for

the lowest common denominatorthe worst viewing conditions
(old monitors, low resolution, old browsers, outdated operating
systems, slow connections, etc.) that could reasonably be expected

If it doesnt load on a dial-up connection (54.4kbps) in under 10

seconds, you lose your audience

Developers need to put important information above the fold

where any page might be cut off by the bottom of the browser
window

The area above the fold is considered the most valuable real estate
on the site
In a perfect world all web content would be visible without scrolling!

If you have too much to say on one page, consider sub-dividing content

into multiple pages

The average user spends 3 seconds glancing at a page and generally they
scan rather than read

MRKT10028 Web Marketing, Fall

18

Content Development

Content is king

People go to a web site to accomplish something; I.e., to

find information and/or research and/or buy something

All information presented on the site must support the brand
message
Information for a web site may be taken from (existing) print
copy, may be written fresh, and/or may be partially
generated by user comments (testimonials, forums, etc.)
SPELLING AND/OR GRAMMAR ERRORS ARE UNACCEPTABLE!
Text content is best presented in (very) short paragraphs and
bulleted (or numbered, if in order) lists
Imagery (graphics) are used to support/explain the text
Users make a decision about whether to continue viewing a site
in less than 10 seconds

MRKT10028 Web Marketing, Fall

19

Graphic Elements

While styles change, all Web-based graphic design elements share the
same commonalities:

Graphics are typically displayed in one of two bitmap formats

.jpg (joint photographic expert group) - can use millions of colors to display

each image; they cannot be animated; they cannot be transparent; generally

photographs; uses lossy compression (when you export an image as .jpg you
lose some of the quality)
.gif (graphics interchange format) - far less (solid) colors; can be transparent
and can be animated; uses lossless compression (no loss of quality during
export)

All images display at 72 pixels (dots) per inch on computer screens (vs.

300+ for print)

All web-based images are a mix of R(ed) G(reen) and B(lue)
All images should be resized to fit their purpose (the smaller the physical
width/height, the smaller the file) and optimized (exported as .gif or .jpg)
for use on the web (ideally .jpg files are <50kb and .gif files are <5kb in
size)
Animated Flash elements are created using vector illustrations; Flash is not
covered in this course

MRKT10028 Web Marketing, Fall

20

Summary

All sites begin with an idea

You must know the objectives of the site (WHY?????)
Understanding the audience is vital for both the site and the
brand
Marketers have several tools for collecting market data on a
specific audience, which is defined by the demographic and
psychographic traits its members share in common

Segmentation and targeting is key to a sites success

Sites can either be developed in-house or by hiring a third

party developer
Navigation needs to be planned in advance and be consistent
throughout the site
Creating a page layout that fully engages site visitors is
similarly important, as is developing appropriate content

MRKT10028 Web Marketing, Fall

21

Homework (before Fridays lab)

Read Chapter 8 in the text and the handout on 12 Web Site Decisions Your
Organization Will Need To Make (linked from the LearningPlan)
Study all the Review Questions (pg 293-296) except #8, 9, 11, 12, 13 for the Quick
Quiz on Friday (the first THREE minutes of the class please be on time. Note that
any changes to answers will result in the question being marked as wrong. Take the
time to read and consider each question BEFORE you answer it!)
Thoroughly familiarize yourself with the RapidsTransit text document (linked from
the LearningPlan) then
Draw a rough draft of a navigation schematic (flowchart of information architecture pages
and flowof information on the site) based on the content (where do you think things should
go and how should content be organized?) A consensus of ideas will be used to develop a
final flowchart for our site on Friday.

Review/evaluate the three main competitors web sites (see the LearningPlan) for
ideas, insights into your potential audience, etc. (We will not be doing the target
market analysis well assume its already been done and we know who our audience
is and what they want!)
Lab on Friday is mandatory attendance (5 marks for showing up and completing
the follow me tutorial, which will be used next week and the week after). If you
dont attend, you must catch up with (and obtain working files from) another student.
You wont be able to do follow-up labs without the files and the instructor will NOT
provide them to you.

MRKT10028 Web Marketing, Fall

22