ptg
204 Chapter 4: Using HTML
solicitations—come from and what tools are used to create them. e answer
is: from email marketing services.
3
Constant Contact is one of the more popular email marketing services. A
Constant Contact customer creates and maintains a database of email recipi-
ents with the service and composes formatted emails using Constant Contact’s
web-based editor and online templates. Constant Contact charges a monthly
fee for its service based on the number of recipient email addresses.
Constant Contact’s approach is to build an email as a series of sections or
blocks. Rather than bringing the entire email message into the editor, only
one block is edited at a time. e editor has many of the same features as other
WYSIWYG editors, including a button for directly editing a block’s HTML
content. Figure 4.23 shows the beginning of the editing process for a newslet-
ter, with the introductory paragraph being edited. e section being edited
3. Spammers do not use commercial email marketing services. ey use custom spamming soware that
directly connects to outgoing email servers. Such spamming soware is installed by Internet worms and
other malware on the ordinary computers of unsuspecting users.
Figure 4.23: Editing an HTML email using Constant Contact
From the Library of Wow! eBook
ptg
HTML Email 205
appears in the center of Figure 4.23. Instead of a typical toolbar, Constant
Contact provides a tool palette in the le sidebar. At the bottom of that palette,
the button that activates HTML editing mode is circled.
HTML editing mode exposes the HTML source of your email. Like most
generated HTML, the code is a bit dense. It includes Constant Contact’s
special tags for inserting the recipient’s name and other mail-merge features.
To work with the HTML, it is useful to copy the source code into a dedicated
HTML editor and then paste it back into Constant Contact when done. It

is also useful to download Constant Contact’s Code View Users Guide and
become familiar with its special tags and features. Figure 4.24 shows HTML
editing mode in action.
Figure 4.24: Using HTML Code View mode of Constant Contact’s editor
In addition to allowing you to directly edit the HTML source code of an
email message, Constant Contact lets you directly edit the CSS style sheet
that controls the presentation of the email message. e style sheet contains
many predened CSS classes specic to the template chosen for the message.
ese classes can be modied and added to as required. Figure 4.25 shows
the CSS style sheet editor with the classes dened for Constant Contact’s
basictemplate.
From the Library of Wow! eBook
ptg
206 Chapter 4: Using HTML
Figure 4.25: Editing the CSS style sheet for an HTML email message in Constant
Contact
From the Library of Wow! eBook
ptg
Summary 207
Summary
Here are the important points to remember from this chapter:
.
Many services on the Web that allow users, subscribers, and custom-
ers to create content or edit personal prole information have a means
for entering both content and HTML markup. ese services vary in
the type of online editor they provide and the range of HTML markup
allowed.
.
Blogging soware lets you create complete websites without any knowl-
edge of HTML. However, knowledge of HTML and a good HTML editor

will enable you to create better websites.
.
Many websites have created their own markup languages that mix a sub-
set of HTML with proprietary tags for features unique to their service.
Wikipedia is an example of such a service.
.
Varying HTML support among the many dierent email clients makes
it dicult and impractical to compose messages directly with HTML
markup. Email marketing services such as Constant Contact simplify the
process for commercial email senders.
From the Library of Wow! eBook
ptg
Building
Websites
Development Approaches
Websites
Organization and Navigation
Page Head Information
Search Engine Optimization
Avoiding Common Mistakes
From the Library of Wow! eBook
ptg
C h a p t e r
209
I
n the preceding chapter we looked at a number of ways to use HTML to
create content for use with various web services. In this chapter, we will
concentrate on creating complete, stand-alone websites. ere are, of
course, dierent approaches to this end, and it always helps to spend time up
front to analyze the requirements of the new website and the context in which

it will operate.
Aer you have chosen an appropriate development approach, you can build
a framework for your website that will accommodate the web pages and other
resources that will be oered to site visitors. You can rough out each type of
web page, marking up the semantics in HTML, applying layout and styles
with CSS, and adding behaviors with JavaScript and other client-side scripting
languages. is chapter explores the subjects of page construction and website
navigation, with examples showing a variety of techniques to achieve dierent
design objectives.
Finally, this chapter includes a section on Search Engine Optimization
(SEO) and oers some tips for avoiding common mistakes.
Development Approaches
e rst questions to ask when you’re thinking about creating a website are
What is the purpose of the website? What will it accomplish? Does a website
have to be built to accomplish that purpose? Presumably, you have some con-
tent you would like to share with the world, and the choice of using the Web as
5
From the Library of Wow! eBook
ptg
210 Chapter 5: Building Websites
your distribution channel may seem obvious because of its reach and low cost.
So why not just create pages with that content and glue them together with
embedded links and menus?
e simple answer is that planning pays o. Even if you want to cre-
ate a straightforward site that explores your passion for peanut varieties or
employee pension plans, taking the time to write a business plan will help you
organize your thoughts. As Albert Einstein said, “If you can’t explain it simply,
you don’t understand it well enough.” At the very least, writing down your
reasons for creating the website and what you are attempting to accomplish
can serve as the raw content for the site’s “About” page.

More important, the exercise of writing down your goals and expectations
will provide the foundation for many of the decisions you will have to make as
you go through the process. Here are some important considerations:
.
Will this be a content site or a service site?
.
Will the content on the site be static or dynamic?
.
Who will be visiting the website, and why?
.
Is the website intended to generate revenue?
.
How will the website grow in the coming months and years?
e answers to these questions will guide your development approach. It is
a choice between building and managing your own website versus using a web
service to deliver your content. Each approach has its strengths and weak-
nesses, and you need to be familiar with the various options for establishing
an online presence. Perhaps a Facebook page, Yahoo! store, or Ning site would
be a better t for your needs. ese services exist for a reason: to help people
get started in online publishing by taking care of the technical details while
they concentrate on learning what to do with the content. At the same time,
online services limit what you can do on the Web. You are constrained by
somebody else’s design concepts. Also, your search engine ranking usually is
lower because your website is seen as a client of some other organization, not
as a publication of its own.
erefore, this chapter assumes that you have chosen to run your own web-
site. Usually this means having an account with a web-hosting company and
registering one or more domain names. Or possibly you have access to a web
host through your organization or school. You can run a web server on just
about any computer, even a laptop, connected to the Internet.

From the Library of Wow! eBook
ptg
Development Approaches 211
e next consideration is whether your website will need a content manage-
ment system to dynamically generate the web pages or whether your concepts
can be realized with a structure of hyperlinked les.
Content or ServiCe Site ?
Perhaps the primary purpose of your site is to provide content to people,
without restrictions and without any interaction from visitors. In that case,
building and maintaining the site as a collection of HTML les is feasible and,
in many ways, a lot simpler. is type of site includes photo galleries, fan sites,
restaurant sites, sites covering issues and events, and the websites of many
governments. Running a content site is not that much dierent from oine
publishing. It is just easier and cheaper to use bits of data rather than atoms of
ink and paper. A content site can connect with other websites and services for
supplementary content such as news feeds, map and calendar widgets, and so
on, but, basically, it doesn’t matter if the visitor is a dog.
On the other hand, if your intention is to interact with your website’s visi-
tors, solicit their input, or provide a service to which they may subscribe, you
have a service website. is is a critical distinction. Running a site that oers a
service or product means that you have many of the same responsibilities (and
challenges) as running a business, including production, marketing, sales, and,
most important, customer service. Running any kind of business is hard work.
It is true that you can run an online business from your kitchen table in your
pajamas, but this means that you are only at work from the time you get up in
the morning to the time you go to bed at night.
Most websites fall somewhere in between these two poles. A website that
primarily delivers content can handle interaction with visitors using email and
can carry advertising using third-party ad services and aliate networks. And
a content website can sell products by ooading the payment and fulllment

aspects to third-party services. Running a top-end service website, on the
other hand, requires managing a mix of technologies, including databases and
network administration.
It is important to know where your planned website sits on this continuum.
You need to understand whether your website is an informational content
site or an online business to plan for building and launching the website and
achieving your goals.
From the Library of Wow! eBook
ptg
212 Chapter 5: Building Websites
StatiC or DynamiC Content?
You can maintain a public website in one of two ways: as a collection of
HTML, CSS, and JavaScript les on a remote server or as data in a content
management system (CMS) that generates pages on demand. e former
requires the tools to download, edit, and upload les. Typically a web devel-
oper maintains a complete copy of a website on a local computer, editing and
uploading changes as required. ere are many good soware applications for
managing websites in this manner, from basic HTML text editors to sophisti-
cated integrated development environments (IDEs) that combine FTP, editing,
and project management functions in a single soware program.
A CMS makes sense if the content has a steady stream of additions,
changes, and deletions, with very little need to change the basic structural ele-
ments of the HTML documents. A CMS also makes sense if content needs to
be searchable or if the same content appears on multiple pages. A web browser
is all you need to maintain a CMS-based website, with some occasional tweak-
ing of CSS stylesheets. No HTML coding is necessary until you need a new
page type.
Content ow for a website is like cash ow to a business. For any given
website, a proper amount of content ow will provide the best return on the
time and money you spend creating and managing that content. Too much

content ow consumes management resources and may discourage potential
visitors who scan through search results, looking for a simple answer. Too
little content ow, and a website will die from boredom. Even the robots will
get bored if nothing changes. A search engine such as Google’s will give a
website a higher ranking and visit it more oen if it senses fresh content. If you
want visitors to bookmark your site or forward your URL to their friends and
associates, your site must feature new content on a regular basis that meets or
exceeds the expectations of your target audience.
Of course, content is not everything. If two websites oer equivalent
content, the site with the better design will win. Better design encompasses a
harmonious combination of graphic elements, information architecture, and
interactive function. You have much more control over all these design ele-
ments when you run your own website than when you use a CMS.
target auDienCe
Who will visit this website, and how will they nd out about it? is is a mar-
keting question, but it does have technical implications. Search Engine Opti-
mization (SEO) is the practice of making a website friendly to search robots
From the Library of Wow! eBook
ptg
Development Approaches 213
so that your target audience can nd it easily. An optimized site knows what
its target audience is searching for and is constructed accordingly. Headings,
links, images, and even lenames are labeled incorporating keywords that
have signicance to the target audience.
Other issues depend on the target audience. If the website’s content is
intended for an international audience, the planning should include the
provision of foreign-language translations of key web pages. Other standards
may exist, depending on the website’s purpose and intended audience. Some
published websites may be subject to the requirements of the Americans with
Disabilities Act and other national laws.

Perhaps you expect that a signicant proportion of the site’s visitors will be
people using browsers on mobile devices. If so, either the site’s layout needs
to take into account how those browsers will display the web pages, or the
server should do browser detection and provide alternative formatting for
less- capable browsers. Twitter is a good example of a website that provides a
PC-based browser version at and an alternative ver-
sion at for mobile users.
money
Money makes the world go ’round. If revenue generation is your website’s
purpose, your planning should consider the ve direct ways in which a website
can make money:
.
Selling a product
.
Providing a service to paying subscribers
.
Selling space on your website to advertisers
.
Earning referral fees by directing trac to aliates
.
Accepting donations
All of these tasks can occur on the same site, but each technique has implica-
tions for the website design and development approach. Money adds another
dimension to the planning. Any website that receives money from product
sales, paid subscriptions, and donations should have pages explaining the
terms of service and your organization’s privacy policy. ese considerations
are less important with advertising sales and aliate royalties, because those
relationships are business-to-business. e question is whether to build the
capabilities into your own website or to use third-party services to handle pay-
ments, product catalogs, subscribers, and advertisers.

From the Library of Wow! eBook