Understanding Web Marketing and Design Concepts
Instructor: Steve Bogdanoff
Web Designer / Owner
Web Desert Design
Introduction to the Web
The World Wide Web was invented in 1989
is a general term for the formal
that define and describe aspects of the
. In recent years, the term has been more frequently associated
with the trend of endorsing a set of standardized
, and a philosophy of
and development that
When a website or web page is described as complying with web
standards, it usually means that the site or page has valid or nearly valid
. The HTML should also meet
World Wide Web Consortium
) is the main
World Wide Web
(abbreviated WWW or
W3). It is arranged as a
where member organizations
time staff for the purpose of working
together in the
development of standards for the
World Wide Web
. As of June 2009, the
W3C had 388 members.
The only thing you need to know is that web standards
are crucial for your
website to op
<!DOCTYPE html PUBLIC "
//W3C//DTD XHTML 1.0 Transitional//EN"
Why have a website?
It's the best advertising medium available today
. A professional website
provides world wide exposure of your business for a small initial
investment, when compared to other forms of advertising.
Even if your business is local, you can be sure that more of your
customers will use the Internet to search
for products and services in their
Your website can provide unlimited information about your company: your
hours of operation, locations, and your products and services. Information
can be tailored to your target audience and changed as regular
ly as your
business grows. (Your target audience chooses to browse your website
because it is interested in your products and services)
Your website is a permanent promotional tool and provides your
customers with easy, 24
hour access to your company whene
need it. It saves them time when they're gathering information: no waiting
in lines or being put on hold. They can get quick answers to their
questions, at their convenience.
Your website is a powerful market research tool. Through e
mail and on
in forms, you can quickly identify new customers and the products
and services they're looking for.
Your website can save you time and money by handling some of your
administrative functions online such as membership, event or class
and taking and processing orders, to name a few.
Where do I start?
Select a domain
What’s available. Who owns a domain name that you are
interested in, and when does it expire?
Select a host
Select a hosting plan
You’re just starting out, so go with the cheapest plan available. You can
always upgrade later. FYI
I’ve never had to upgrade.
Designing your website
a) First consider your market
Who is my target audience?
t audience is the group of people no matter the size that has
the highest chance of purchasing or hiring you for your services. To find
out who your target audience is you just need to ask yourself who is most
likely to buy your product. Important factors
of defining the target
audience include age, gender, location, needs, buying history, income
and experience navigating the web. The target audience should have no
problems understanding or navigating your website. They should have
clear direction on what t
o click to get to the products / services they are
the most interested in the quickest.
Don’t design your site for yourself, design for the customer. You may
NOT be your website’s target audience!
How can I tailor the site to reach that audience?
into account the characteristics of the audience will allow an
effective website to be created that will deliver the desired content to the
target audience. Website design is a process. It should be planned out
and executed with care. By planning the proce
ss it will make it simple and
it will get results.
You can also ask your customers what they want, what they would like to
see, what things interest them, and what sites they visit. Look at
competitor websites and see what they are doing. Market test some
designs on your audience and get their feedback.
What information can I put up on my site that is relevant?
That depends on your purpose for having a website. Some information
may include your product, your demographic, special offers, and your bio,
to name a few. One thing that you must always include is fresh
What are the goals for my site?
Many of the website packages that web designers sell don't work. Some
website design companies do not hesitate to sell you a failing website and
you with a dud. How can you protect yourself? Before you spend
money on a website,
you must set goals outlining exactly what your
website must accomplish
. You can not expect your website design
company to build you a site that works without your guidance.
You must clearly identify the goals of your website, and hold your website
designer to these goals. If you are designing your website yourself, hold
yourself to your goals.
A good goal ties directly to customer's needs and
r company from your competitor.
My website should
answer the top questions
my customers will ask.
unambiguously state what my company does.
My website should be
each page should be
My website should c
ontain industry and product specific information
demonstrating my expertise
and explaining my products and my
The text on my website should
contain all of my critical keywords
at least once so that Google can index them.
My website should contai
n all of the
Keyword, Description, and Heading
that Google uses.
A poor goal is one that is prone to different points of view,
highly subjective, and does nothing to differentiate you from your
competitors. For e
xample, goals such as...
My website should look attractive
. One viewer’s beauty is another's
My website should be easy to use
. That all depends on what you
consider easy to use.
My website should turn up high in Google
. This is easier said than
done. Your focus should be to have all the appropriate HTML tags
used for your website and make sure your site text contains your
b) Design does matter
Do’s and Don’ts
No matter how attractive a site's design, if it isn't practical, i
t's not doing its
job. Design for the screen involves a new set of requirements to deal with
and pitfalls to avoid.
Some Important things to remember when designing your site:
Keep graphics files small.
For the most efficient files, you must use
file type. Here's the simple rule for deciding which format to
If your graphics have
colors, save them as JPG files.
If your graphics have
colors, choose GIF.
When using GIF, try optimized palettes that contain only the colors
an cut file sizes in half.
Use only the resolution you need. Computer screen displays have an
average resolution of 96 dpi (dots per inch) for Windows, 72 dpi for
the Mac. This means your graphics should be saved at a resolution
than 96 dpi.
Keep text files small.
Text files rarely need to be longer than 10K.
Instead, they should be broken into logical chunks and linked. If a
home page doesn't load quickly, visitors can lose interest and jump
Design for easy reading.
readability for style. Make your
backgrounds as light as possible (white or pastels
just make sure
they use "Web
safe" nondithered colors). If you use a background
image, keep the action on the side, out of the way of the text, or make
it very light, low c
ontrast, and nondithered.
Use "ALT" tags on graphics.
ALT text appears
does, or in place of the graphic for users who have turned graphics off
for speed. If you don't use ALT text, then users may just see a bunch
of boxes with no explan
ation of what they are. This is extremely
important, and easy to add. If you're using a graphic in place of a
paragraph or more of text, type the same text into the ALT box
long blocks of text will appear in the browser so people can read it
e graphic downloads.
Include contact information on
It's important to include
your company name, e
mail address, and your phone
on every page
You may also want to include your address. If you don't want people
calling, just exclude your phone
Why is this important? Because people often save pages to disk, or
print them. If you don't include this information, chances are they
won't be able to contact you, or find your site again to get that contact
Keep your site fresh.
ike printed matter, a Website is not a one
one. Be prepared to update your site, at
least once a month, adding new information, discarding anything out
The Web is no place for skimpy "capsule" information.
The more detail you provide, the more of a service you offer, and the
more reason you give people to visit your site.
Be backward compatible.
Using cutting edge technology can
exclude readers. Many if not most users will be
so don't shut them out. Test your site on all of the
popular browsers to make sure it looks the same for all viewers.
Here are a few Don’ts to remember:
use too many animations, especially on pages with content
you want people to read. While animati
ons are effective in drawing
attention, users find them annoying and distracting when they are
trying to read the text on the page. Even one looping animation can
be an annoyance to some people. A whole page of spinning and
flashing is a disaster.
se “Under Construction” signs. In particular, don’t make
struction” pages that appear after a user clicks on the link.
If your site or section isn’t ready, simply don’t post it. Although you
may intend to show that you have information that will
soon, “Under Construction” signs and other placeholders just make it
look like you don’t have your act together. Providing links that go
nowhere is a waste of your visitors’ time and patience. An alternative
is to include a Coming Soon sectio
n on the home page that explains
what you are planning for the site without the dead
set type in all capital letters. All capital letters are harder to
read than upper
and lowercase letters. In addition, it makes it look
like you’re shou
ting your message.
make graphics that look like buttons but don’t link to anything.
It’s confusing and frustrating to the user.
automatically use white type on dark backgrounds, particularly
for large amounts of small text. The contrast is to
o high and it can be
able to read. Better to choose a very light shade instead,
such as a light gray against black, or a very pale blue against dark
blue. The text will still be clear, and the slightly lower contrast is
gentler on the eyes, makin
g your page look less glar
The good, the bad and the ugly
Here are some examples:
Good, but some text is out of date (i.e.
(Can’t find the specs of the laptops
all flash so lots of download time)
(Can you find Billy’s tour dates?)
The American Marketing Association (AMA) defines a brand as a "na
sign, symbol or design, or a combination of them intended to identify the goods
and services of one seller or group of sellers and to differentiate them from those
of other sellers.”
The objectives that a good brand will achieve include:
ing the message clearly
Confirming your credibility
Connecting your target prospects emotionally
Motivating the buyer
Securing User Loyalty
To succeed in branding you must understand the needs and wants of your
customers and prospects. You do this by inte
grating your brand strategies
through your company at every point of public contact.
Your brand resides within the hearts and minds of customers, clients, and
prospects. It is the sum total of their experiences and perceptions, some of which
you can influe
nce, and some that you cannot.
is a graphical element (
together with its
(a uniquely set and arranged
) form a
. Typically, a logo's design is for immediate
recognition. The logo is one aspect of a company's commercial
economic or academic entity, and its shapes, colors, fonts, and images usually
are different from others in a similar market. Logos are also used to identify
organizations and other non
eat logos” in google images
Search “bad logos” in google images
Browser compatible fonts
which fonts to use on websites?
One of the variables in website design is the availability of fonts on a visitor's
. For example, you would have instructed the text on your web pages to
be displayed in MS Comic Sans, but if your visitor does not have
this font, the
browser uses the default font. This messe
s the overall design of the web page,
which you so meticulously created.
To overcome such system inconsistencies, it's advisable to use a set of fonts that
will determine, on a priority basis, which font are used.
Common Fonts of Website Design:
rial Black, Comic Sans, Courier New, Georgia, Impact, Lucida Console,
Times New Roman are used fonts in
. Verdana (Sans Serif) a
new typeface released in 1996 has the most commonly used font in the web
world. These fonts are easily readable o
n computer screens with low resolutions.
serif vs. serif
When using fonts on screen, it is important to understand the differences
between serif and sans
serif fonts. Serif fonts are the fonts that have little tails
fonts like Times, for example. San
serif fonts, such as Arial and Verdana, lack
these tails. Due to the effects of anti
aliasing, it is important to try to avoid using
serif fonts for on
screen use whenever possible. If they are to be used, they
should be used at a size large enough to av
oid the pixels’ tendency to blur
serif fonts also tend to retain their visual appeal across different
platforms and browsers.
Size of Fonts in Text:
There is no specific best font size in website design. The
user is able to adjust sizes acco
rding to their requirements using relative units
such as percentage or EM (external CSS file). Generally, the visitors face trouble
to read small fonts. It is wise to use big fonts as they easily seen, read, and found
by visitors. However, there are except
ions, as many websites are opting for small
font size. With the help of CSS file the heading, sub
heading, body text and
other text elements is used in different font sizes according to need. Suggested
10px or 12px
14px, 16px or 18px
12px or 14px
8px, 9px or 10px
Note: If you are targeting the elderly you will want larger font sizes and more
friendly pages than if you are targeting corporate executives.
Brands can be on a business level, like the name of your business, or on a
product and service level. An excellent example would be Apple
which is a
and Apple has individual brands, like iPhone and iPod.
Those brands are indelibl
e in our minds because of extensive branding strategies
by Apple. Is your business and product line branded as strongly? Your business
should be branded strongly.
Here are the 5 levels of brand recognition and how you can build your
business to improve it:
If someone associates your brand with something negative,
they will purposely avoid your product. Have you ever experienced bad
service somewhere and swore you'd never return to that chain? Have any of
your customers said that about your
business? Create a logo and slogan that
is filled with great benefits to your customer and put that on everything. If
public opinion is turning against you or your product, launch a campaign to
This is where your customers
recognize your brand, probably because it is not clearly differentiated from
competitors. Boldly state your product’s or service's benefits. Always include
the full trademark name whenever you refer to your product. Be willing to
names for your products or services, just like you've done for
your own business. Find the differences in value between your product and
your competitors and highlight that difference mercilessly.
This is a good stage to aim for if you d
on't have any
recognition at all. Brand recognition will help people lean toward your product
when given the choice between your product and one they have never heard
of. At the same time, though remember that your competitors are also
working on brand rec
ognition, which means their brand could be more
recognizable. Continue to differentiate yourself and be sure to add value to
your product in order to get to the next stage.
This is where customers
given a choice between two
l choose yours over someone else's. It often is the result of a
sense of differentiation and that your product or service uniquely serves their
needs. As well, you can be sure that any value
added products or services
you include help them to choose yours
over your competitors.
This is where customers will choose your brand time and time
again, even if they experience the occasional poor service or if another
product comes along that seems to be better suited to their needs. To
loyalty, you need to provide a product that is highly
differentiated, with plenty of value added, but also you need to offer them
remarkable service at a level they will not get anywhere else. Providing this
level of service will ensure that they will nev
Make it a point to start branding right away. Your new business should be
branded from Day One, and the products or services you offer can be branded
as well. If you have a few services, consider packaging them together as one
package and brand
ing that package.
d) Video and Audio Integration (Flash)
Flash is vector animation software, originally designed to create animations for
display on web pages. Vector graphics are ideal for the web because they are so
Sometimes Flash i
s a portion of an html web page, and sometimes a web page is
made entirely of Flash. Either way, Flash files are called "Flash movies". These
are special .swf (“ShockWave Flash”) format files that beam to your web browser
screen as you watch them.
re two different video file formats defined by Adobe Systems and
supported in Adobe Flash Player:
. The audio and video data within
FLV files are encoded in the same way as they are within SWF files. The latter
format is based on the
ISO base media file format
and is supported
starting with Flash Player 9 update 3.
Flash Video is viewable on most operating systems, via the widely available
Adobe Flash Player and
, or one of several third
commerce is the online transaction of business, featuring linked com
systems of the vendor, host, and buyer. Electronic transactions involve the
transfer of ownership or rights to use a good or service. Most people are
familiar with business
consumer electronic business (B2C). Common
illustrations include Amazon.co
m, llbean.com, CompUSA.com, travelocity.com,
commerce can be divided into:
tailing or "virtual storefronts" on Websites with online catalogs, sometimes
gathered into a "virtual mall"
The gathering and use of demographic data through Web
Electronic Data Interchange (EDI), the business
business exchange of
mail and fax and their use as media for reaching prospects and
established customers (for example, with newsletters)
business buying and selling (B2B)
ommerce gives you the ability to accept payment over the Internet, by either
credit card or electronic checks. Through E
commerce, you can sell products or
services instantly to anyone in the world without having to constantly monitor
t Management System (CMS)
A content management system (CMS) is software that keeps track of every piece
of content on your Website, much like your local public library keeps track of
books and stores them. Content can be simple text, photos, music, video,
documents, or just about anything you can think of. A major advantage of using a
CMS is that it requires almost no technical skill or knowledge to manage.
Because the CMS manages all your content, you don't have to.
Many hosting companies will help you se
t up your content management system.
Web content management systems are typically broken down into several
Software as a service (SaaS)*:
My Managed CMS
Nstein WCM by
, and others
, Cookie Jar, Microsoft
, PaperThin, Ingeniux, Terapad,
, Logical CMS and others
*Software as a Service
, typically pronounced 'sass') is a model of
licenses an application to
customers for use as a
. SaaS software vendors may
host the application on their own
or download the application
to the consumer device, disabling i
t after use or after the on
contract expires. The on
demand function may be handled internally to
share licenses within a firm or by a third
application service provider
(ASP) sharing licenses between firms.
Search Engine Optimization (SEO)
Search Engine Optimization (SEO) is often considered the more technical part of
Web marketing. This is true because SEO does help in the promotion of sites
and at the same time
it requires some technical knowledge
at least familiarity
with basic HTML. SEO is sometimes also called SEO copyrighting because most
of the techniques that are used to promote sites in search engines deal with text.
Generally, SEO can be defined as the
activity of optimizing Web pages or whole
sites in order to make them more search engine
friendly, thus getting higher
positions in search results.
One of the basic truths in SEO is that even if you do all the things that are
necessary to do, this does not
automatically guarantee you top ratings but if you
neglect basic rules, this certainly will not go unnoticed. Also, if you set realistic
i.e. to get into the top 30 results in Google for a particular keyword, rather
than be the number one for 10 k
eywords in 5 search engines, you will feel
happier and more satisfied with your results.
Search Engine Submission
The top three search engines are:
Once your website has been submitted to the top search engines they may
everal weeks, or even months to actually spider* and list your website in
their directory. How fast your website is listed depends on each individual search
engines database update schedule. There are third
party companies that
specialize in helping you ge
t placed high on the search engine chain, though I do
not know their rate of effectiveness.
*What’s the web without spiders?
A spider is a
that automatically fetches
. Spiders are used to
feed pages to
. It's called a spider because it
. Another term for these programs is
. Because most
to other pages, a spider
can start almost anywhere. As soon as it
sees a link to another page, it goes off and fetches it.
Blog vs. website
First of all, I need to make this ultra clear …
a blog IS a website
n fact, I want
to take that a stage further and say that blogs are
. You can
have pages on a blog and, with some of the great blog software on the market
today, it can sometimes be difficult to tell some blogs and websites apart.
is short for
, and is a frequently updated website consisting of
blog posts, or entries (more often than not, dated entries) that are arranged in
chronological order. So when a reader comes to your blog, they see your
most recent article or
Search engines can have an easier time inventorying blog sites because blogs
are regularly updated and rich with text.
As an extension of/addition to your website
If you already have a website, you may want to start a blog to compliment your
site. I believe that, if you do it right, the more you have on the web pertaining to
your company, business or service, the better.
Website Maintenance refers to changes made to your website after the initial
design. Keeping a website up
date is essential in having repeat visitors to your
site. Updating the site with sales, newsletters, press releases, financial figures
and links are all examples of Website Maintenance.