HTML cơ bản - p 23 pptx

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 temp

204 Chapter 4: Using HTML

solicitations—come from and what tools are used to create them The 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 The 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 The section being edited

3 Spammers do not use commercial email marketing services They use custom spamming software that

directly connects to outgoing email servers Such spamming software 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

HTML Email 205

appears in the center of Figure 4.23 Instead of a typical toolbar, Constant

Contact provides a tool palette in the left 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

206 Chapter 4: Using HTML

Figure 4.25: Editing the CSS style sheet for an HTML email message in Constant

Contact

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 pcustom-ersonal profile information have a means

for entering both content and HTML markup These services vary in

the type of online editor they provide and the range of HTML markup

allowed

. Blogging software lets you create complete websites without any

knowl-edge of HTML However, knowlknowl-edge 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 different email clients makes

it difficult and impractical to compose messages directly with HTML

markup Email marketing services such as Constant Contact simplify the

process for commercial email senders

Building Websites

Development Approaches

Websites

Organization and Navigation

Page Head Information

Search Engine Optimization

Avoiding Common Mistakes

C h a p t e r

In 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 There are, of

course, different 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

After 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 offered 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 This chapter explores the subjects of page construction and website

navigation, with examples showing a variety of techniques to achieve different

5

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?

The simple answer is that planning pays off 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?

The 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 fit for your needs These 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

Therefore, 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

Development Approaches 211

The 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 files

Conte nt or S e rv iCe S ite ?

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 files is feasible and,

in many ways, a lot simpler This 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 different from offline

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 This is a critical distinction Running a site that offers 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 affiliate networks And

a content website can sell products by offloading the payment and fulfillment

212 Chapter 5: Building Websites

StatiC or Dy na m iC Conte nt ?

You can maintain a public website in one of two ways: as a collection of

HTML, CSS, and JavaScript files on a remote server or as data in a content

management system (CMS) that generates pages on demand The former

requires the tools to download, edit, and upload files Typically a web

devel-oper maintains a complete copy of a website on a local computer, editing and

uploading changes as required There are many good software 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 software 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 docuele-ments 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 codtweak-ing is necessary until you need a new

page type

Content flow for a website is like cash flow to a business For any given website, a proper amount of content flow will provide the best return on the

time and money you spend creating and managing that content Too much

content flow consumes management resources and may discourage potential

visitors who scan through search results, looking for a simple answer Too

little content flow, 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 often 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 offer 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

ta rg et au Di e nCe

Who will visit this website, and how will they find out about it? This 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

Development Approaches 213

so that your target audience can find it easily An optimized site knows what

its target audience is searching for and is constructed accordingly Headings,

links, images, and even filenames are labeled incorporating keywords that

have significance 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 significant 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 http://www.twitter.com and an alternative

ver-sion at http://m.twitter.com for mobile users

mon e y

Money makes the world go ’round If revenue generation is your website’s

purpose, your planning should consider the five 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 traffic to affiliates