+ All Categories
Home > Documents > Planning Guide Part Three

Planning Guide Part Three

Date post: 30-May-2018
Category:
Upload: tim-stockton
View: 214 times
Download: 0 times
Share this document with a friend
54
8/14/2019 Planning Guide Part Three http://slidepdf.com/reader/full/planning-guide-part-three 1/54 This is part three of the four-part training for Web Ministry 101. In part one, we covered the first seven steps to developing an effective Web ministry by considering how to access the power of the Internet. In part two, we shared steps 8–12, which outline the basic material, human, and financial resources you will need to develop a powerful Web ministry, including the basic website design and hosting options available to you. In this third part of the training, we will introduce the concept of developing a user-centered website as your primary tool for Web ministry. Our goals for this part of the training are to: Create or select an engaging design that is user-centered Develop a site map to organize the various sections and subpages of your website Understand and implement a user-centered website navigation strategy Gather and prepare content, graphics, and photographs to present a dynamic, user- centered website Develop content protocols Protect users and members privacy The main question we want to answer in today’s training is, “How can you create a user-centered website that fulfills your Web ministry goals?” In particular, we want to empower you to use creative design and site navigation to make your website easy to use and to present content that meets the needs of your users. First, let’s define what we mean by user-centered design. Many organizations and companies launch websites from their own perspectives. In other words, they decide what to put on their websites based upon what they think people need or want. As we explored in part one of this training, we believe an effective Web ministry carefully determines Ho Ho w can y w can y ou cr ou crea ea te a te a user user -center -centered w ed website bsite tha tha t fulfills y t fulfills y our our Web ministr ministry g y goals? oals? 58 58 PartThree: De De v v elopingaUser elopingaUser -Center -Center ed ed W W e e bsite bsite Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website © 2006 United Methodist Communications
Transcript
Page 1: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 1/54

This is part three of the four-part training for Web Ministry

101. In part one, we covered the first seven steps to

developing an effective Web ministry by considering how

to access the power of the Internet. In part two, we shared

steps 8–12, which outline the basic material, human, and

financial resources you will need to develop a powerful

Web ministry, including the basic website design and

hosting options available to you. In this third part of the

training, we will introduce the concept of developing a

user-centered website as your primary tool for Web

ministry. Our goals for this part of the training are to:

• Create or select an engaging design that is

user-centered

• Develop a site map to organize the various

sections and subpages of your website

• Understand and implement a user-centered

website navigation strategy

• Gather and prepare content, graphics, and

photographs to present a dynamic, user-

centered website• Develop content protocols

• Protect users and members privacy

The main question we want to answer in today’s training

is, “How can you create a user-centered website that

fulfills your Web ministry goals?” In particular, we want to

empower you to use creative design and site navigation to

make your website easy to use and to present content that

meets the needs of your users.

First, let’s define what we mean by user-centered design.Many organizations and companies launch websites from

their own perspectives. In other words, they decide what

to put on their websites based upon what they think people

need or want. As we explored in part one of this training,

we believe an effective Web ministry carefully determines

HoHow can yw can you cr ou cr eaeate ate auser user -center -center ed wed weebsitebsitethathat fulfills yt fulfills your our WWeebb

ministr ministr y gy goals?oals?

5858

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 2: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 2/54

what the user or visitor to your site actually needs and

wants. We then allow these findings to drive the

development and design of the website. Our primary

considerations for a user-centered design are ease of use,

content, performance, trustworthiness, and overall user 

satisfaction. As a result, we want to insure that the

usefulness of our websites provide relevant information

and opportunities that match the users’ needs.

With regard to design, a user-centered website is visually

appealing and engaging without being too busy or 

cluttered. Likewise, the design or look of your website

should reflect the personality or message of your church.

If you are planning to use E-zekiel or another template-

based website design tool, you will want to review all the

possibilities and test a few with your Web ministry team

and stakeholders before making your final choice. If you

are designing a website from scratch, either in-house or 

with a website development consultant or company, be

sure to create two or three different designs to share with

your team and stakeholders and get their feedback beforemaking a final decision.

With some basic understanding of user-centered design,

it’s time to create a unique image and design for your 

church’s website. Even if you are using a template-based

design service, you can create a unique image by using a

logo or graphic that is specific to your church’s personality,

ministry, and mission. For many local churches, the United

Methodist insignia, the Cross and Flame, is their primary

logo. Use of The United Methodist Cross and Flame is by

permission only. It is a registered trademark of The UnitedMethodist Church and, as such, is a protected copyright of 

the Church. While you are free to use the Cross and

Flame on your website, you will want to review the

guidelines for using the insignia and make sure you

represent the Cross and Flame appropriately on your 

Step #13:Create a Unique Image

and Design

5959

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 3: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 3/54

website. To view the Cross and Flame guidelines, visit the

website of the General Council on Finance and

 Administration of The United Methodist Church.

Many churches, in addition to displaying the Cross and

Flame, have developed a unique image to reflect the

ministry and mission of their church. If your church has

already created something like this, you should consider 

how you will use it in your website design. It is not

necessary to create a unique image for your local church;

however, if this is something you are considering as a part

of your overall website design, be sure to create an image

that can be used throughout your church’s ministry and

not just for your website. As a result, you will want to

involve more than just your Web ministry team in the

process of creating a unique image for your church. On

pages 73–75 of this Guide, we offer a few samples of 

unique images developed by local United Methodist

churches.

With or without a unique image, you still have severalchoices to make with regard to the design of your website,

even if you are selecting the template-based design

option. The first major decision is color. Color is a very

important decision because it immediately communicates

a message to the user as soon as he or she accesses

your website. The exact same design can say something

very different if it is represented in red versus pink. Even

without a unique image, color can give your website a

custom look and feel.

While you are free to choose any color of the rainbow,keep in mind that not every browser will represent that

color accurately. Therefore, we encourage you to select

what are called websafe colors. Chances are you will be

able to find the color you are looking for in the websafe

palette. If you do choose a color outside this palette, you

6060

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 4: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 4/54

will be able to make it display accurately in all browsers by

saving it as an image or graphic. A website designer will

be able to create this for you as a part of the overall

website architecture. With E-zekiel and other template-

based design packages, you will be able to select any

websafe color from the palette or import a saved graphic

or image you have created. See page 76 of this Guide for 

links to websafe color guides and exciting color palette

ideas.

The next decision to make with regard to design is the text

style or font you will use. Again, there are a few universal

fonts that represent well in most browsers. These include

  Arial, Times New Roman, and Verdana or similar font

families. A complete list of websafe fonts is available on

page 77 of this Guide. Most churches, however, will want

to display a custom or unique font at least for headings. In

this case, we recommend that you save these custom text

items as graphics instead of trying to select the font style

from the drop-down menu. This way, the graphic will truly

represent the exact font in every browser. We do notrecommend converting all text to graphics for your 

website. This will greatly increase the time it takes to

display each page on your site; and unless you provide

descriptive alternate text for each graphic, your content

saved as a graphic will not be searchable by Google or 

other search engines. Therefore, we recommend that you

select one of the websafe fonts for the body text.

In addition to choosing a text or font style, you will also

want to consider the size of the font. We recommend using

a font size of 10 or 12 point for body text. This is easilyreadable for most users. Likewise, we would recommend

that your title or header fonts are 18 to 24 points; however,

you have a lot more flexibility for these when designing

your site. In particular, you want the title or heading to be

6161

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 5: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 5/54

larger than the body text so that users immediately know

what they are reading about and can decide at a glance if 

this is the information they are looking for.

The next design choice you want to make is regarding

photographs and graphics. First, let’s talk about what

these are and how they differ from one another. A

photograph, as you know, is taken with a camera. These

pictures can be converted to a digital format and used on

your website. Graphics are things like logos, clip art, and

line drawings. They typically contain only a few colors or 

variations on one color, as with a grayscale or black and

white image.

Photographs and graphics can add a unique look and feel

to your website even with the template-based design

option. It is a good idea to create a library of photographs

and graphics that you may use on your website. In

addition, there are many photographs and graphics

available through United Methodist Communications and

other United Methodist boards and agencies to representa myriad of ministries. Keep in mind, though, that some

photographs and graphics are copyrighted. Make sure you

have the appropriate permissions to display these images

on your website. If you have any doubt, err on the side of 

not using them until you know for sure that you have

permission to display them. Creating or selecting a design

that represents the unique image or personality of your 

church is essential to developing an effective user-

centered website. This design includes color; a logo or 

unique image; font style and size; and other photographs

and graphics. All of these communicate seamlessly to theuser who you are and what you are about.

Now it’s time to decide how these design elements are

displayed on the webpage. Let’s start with the first thing a

user will see when he or she accesses your website: the

Step #14:Create a Welcoming

Home Page

6262

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 6: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 6/54

home page. Your home page is the portal to the rest of 

your site. It is like the front door of your church meant to

be welcoming and lead the user to all the ministry

opportunities available upon entering. In addition, your 

home page should showcase the latest ministry news for 

your church so that frequent users can immediately see

what’s changed since their last visit.

Key to developing a user-centered design for your home

page is the navigation menu. The site navigation menu is

the number one element that can make or break your 

user-centered website design. If users cannot locate

information quickly and easily, they will become frustrated

and leave your site disappointed.

Many home pages are designed to look different than the

rest of the main sections and subpages of a website. The

home page, generally, serves more as the title page and

table of contents than as the answer to every user’s

questions and needs. As such, it is usually crisp and clean

with the site navigation as the prominent feature so theuser can quickly get to the information he or she wants to

find. On pages 78–82 of this Guide we offer several

examples of welcoming home pages from local United

Methodist church websites.

One way to outline your websites navigation menu is to

create a site map. This is the blueprint or road map for 

your website and provides a clear picture of how pages

are linked together and how they relate to the whole

website.

From your website’s home page, users should be able to

go directly to any of your main sections with one mouse

click. These sections, then, must have a direct link from

your home page. Therefore, you will want to design your 

Step #15:Create a Site Map and

Navigation Tools

6363

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 7: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 7/54

website to include the main sections of your ministry in the

navigation menu of the home page. As your create your 

site map, these main sections would be the first tier under 

the home page.

There are certain main sections we recommend you

include in the first tier of your church’s website. If you are

using E-zekiel as your website design and hosting service,

every website in their template-based design will start with

four sections in the first tier. These include Events,

Contact Us, Site Map, and Home. In addition, we

recommend adding, at a minimum, About Us, Worship,

and Links. If you have other ministry areas, such as

Christian Education, Missions, or Youth, we recommend

that you consider how these will be listed as a part of your 

site’s main sections, or if they will form the second tier and

fall under one of your first tier sections as subpages. On

pages 83–85 of this Guide, we offer several examples of 

site maps and navigation tools to make your website user-

centered.

In addition, anything on your home page should provide a

direct link to the rest of the story or more information. Most

home pages contain some feature items in the body of the

page. These would be the most relevant, important, or up-

to-date displays of information that you know the user is

looking for. Within the body, you can embed a hyperlink

that takes the user directly to this information. Generally,

what you display on the home page is a teaser to the rest

of the information. Since most users skim or scan pages

for information rather than read everything word for word,

teasers should contain the essence of the information anddirect the user to the rest with just one mouse click.

Once a user leaves your home page, he or she should

always know where he or she is within your site. To

accomplish this, we recommend using what are called

6464

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 8: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 8/54

breadcrumbs. Breadcrumbs tell the user, “You are here,”

and display the trail that has led to this point. This way, a

user can return easily to a previous location without having

to use the “back” button in the browser window. Likewise,

breadcrumbs help users to see how pages are linked so

they can stay connected to the main sections of your 

website. Finally, breadcrumbs help the user to find his or 

her way back home.

In addition to using breadcrumbs, each page of your site

should contain the site navigation menu. If your pages

extend beyond the bottom of the browser’s window, we

recommend that you add the navigation menu to the

bottom of the page, too. This way, if a user is scrolling

down your page, he or she does not have to scroll back to

the top in order to move to a section of your site.

In addition to a design for your website’s home page, you

will want to develop a design for the main sections of your 

website. This design will have some of the same

components of the home page in terms of color, image or logo, font style and size, and photographs or graphics.

But, these may be arranged differently to allow for more

space or prominence for the information contained on

these pages. As with the home page, the main sections

should include easy navigation.

From your main sections, you may have links to

subpages. These subpages may have the same or similar 

design as the main sections. What makes them different

from the home page and main sections is that they will not

be a part of the navigation menu of the website unless youuse drop-down or expanded navigation tools. Some

template-based designs will not support drop-down or 

expanded navigation. In this case, you will want to use

hyperlinks to direct users to these subpages. You would

6565

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Step #16:Create Main Sections

and Subpages

Page 9: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 9/54

still include these subpages in the breadcrumbs. See

pages 86–89 of this Guide for examples of main section

and subpage designs based upon the home pages shared

on pages 78–82 in Step #14.

So far, we have considered options for design with regard

to a unique image or logo, color, font, photographs, and

graphics. Next, we explored the different functions of a

home page, main sections, and subpages and shared the

importance of creating a site map. With the site map, we

considered the prominence and consistency of site

navigation menu and the use of breadcrumbs.

Incorporating these essential elements into your website

will ensure a highly effective, user-centered website.

Now it’s time to populate or add content to your site.

Working from your site map, which outlines the different

sections and subpages of your website, you will want to

gather and prepare content to form the body text for each

page. Most of this content will come from existing printed

documents, such as brochures, flyers, and newslettersthat your church has already produced as well as from the

staff members and volunteers who work directly with the

program or ministry areas of your church.

If you are relying on existing print documents, you will

want to edit these for the Web versus copying and pasting

them into the body of your pages. Generally, visitors to

your website will skim your pages to find the information

they are looking for. Therefore, it is important to share the

essential information in one to two sentences versus one

to two paragraphs. As a result, you will need to condenseany existing print documents by extracting the most

important points and presenting each of these in clear and

concise, short sentences that visitors can skim in order to

find what they are looking for. These one or two clear and

concise sentences are often referred to as the teaser.

6666

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Step #17:Populate Your Website with

Engaging Content

Page 10: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 10/54

 Again, teasers allow users to quickly and easily skim the

page and click for more information if they’re interested.

On page 90 of this Guide, we offer one example of a

website that uses teasers on its home page to entice

visitors to click and read more.

With pages that present a lot of content, be sure to

organize the information so the visitor does not have to

work too hard to understand the information. You can

accomplish this by using clear headings, subheadings,

and bulleted lists. If the information is not organized well

or is too hard to follow, visitors will stop reading and move

on to something else. Keep in mind that you want the

content on your website to pull in and lock users, to inform

and educate them, and to offer answers to their questions.

Page 91 of this Guide provides one example of a local

United Methodist church website that contains a lot of 

information that is organized well using subheadings.

If there are print documents that you want to make

available, as is, through your website, such as bulletins,brochures, or flyers, you can save them as portable

document format or PDFs that can be downloaded by the

user and opened, read, and printed using the free

software, Adobe Acrobat Reader. To create a PDF of an

existing document, you will need Adobe Acrobat software,

which can be purchased from TechShop at a significant

savings over retail. This software will enable you to

convert existing documents into PDFs as well as create

fill-in forms that users can download, complete, and email

back to you. If you use a Macintosh computer, you can

create a PDF of any document by selecting this optionwhen you print. Instead of the document printing on paper,

the document will be saved in PDF as a new file. However,

you cannot create fill-in forms with this same feature. You

will need the complete Adobe Acrobat software to

6767

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 11: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 11/54

accomplish this.

When you provide PDFs on your webpages, we suggest

that you always alert users that by clicking on a link to a

PDF they will be opening the document in a new broswer 

window or downloading the document directly to their 

computer. Some PDFs with many pages and graphics can

easily be 1 MB or larger. This can mean a very long

download time for some users, especially those using dial-

up connections to the Internet. When listing a link to a

PDF, let the user know by placing PDF and its size in

parentheses next to the link. See pages 92–93 for more

information about using Adobe Acrobat Reader, creating

PDFs, and other content resources.

Finally, with regard to the content on your website, you will

want to establish some protocols or guidelines for how this

information will be updated and how new content will be

prepared. Whether you have one person or many people

contributing content for your site, maintaining some basic

protocols will help to keep the information consistent

throughout your site. In particular, you will want to decidehow content should be delivered to the person responsible

for posting it to your site. Should the information be in

electronic form using Microsoft Word or another word

processing program? Should it be delivered on disk or 

sent via email? Should it be in print form alone or in

addition to the electronic format? Answering these

questions and developing some basic protocols will save

valuable time for the person preparing and posting the

content.

Likewise, you will want to provide a written protocol for how body text or content, headings and subheadings are

displayed on your website. These are commonly referred

to as style guides or stylesheets. This will enable every

page to look the same when it comes to the words

displayed on the screen, and it ensures a clean,

6868

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Step #18:Develop Content Protocols

Page 12: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 12/54

uncluttered, and consistent presentation to your users.

Sample styles guides and content protocols are provided

on pages 94–100 of this Guide, and we encourage you to

review these with your Web ministry team, revise or adapt

them for your use, and implement them with your website.

Earlier in this session, we talked about collecting

photographs and graphics to use as a part of your 

website’s design. Some of these may appear on every

page of your site depending upon their use as a part of 

your site’s overall design. In addition, you may select other 

photographs and graphics to enhance the information or 

content you offer on each webpage. For example, if your 

webpage contains information about United Methodist

Women, you may choose to use the logo next to the

information. This visual cue will immediately catch the eye

of a user looking for this type of information. Remember to

get copyright permissions for any photographs or graphics

you are borrowing from others and be sure that you

understand the rights and permissions associated with

displaying these images on your website.

  After you have selected appropriate photographs and

graphics, you must prepare them for the World Wide Web.

This means that they must be in a digital format that can

be viewed easily on your webpages. If you are working

from a printed photograph or graphic and cannot access a

digital version of it, you will have to convert it into a digital

format. Using a scanner connected to your computer,

digitize the image at a minimum of 200 dots per inch. Save

the digitized photograph as a JPEG or the graphic as a

GIF. These are the most appropriate formats for the twomain types of images displayed over the Internet.

If you have the photograph or graphic already in digital

form or have scanned and saved it as we just discussed,

the next step is to edit the image using one of many

6969

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Step #19:Add Photographs

and Graphicsto Enhance Content

Page 13: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 13/54

image-editing software programs. From the image-editing

program, make the following adjustments to your 

photograph or graphic:

1. Change it to RGB color, if necessary.

2. Crop the image as desired.

3. Change the resolution to 72 dpi and constrain

proportions.

4. Adjust the width or height to the exact pixels

needed to fill the space on your webpage.

5. Save the image in the proper format.

Now you’re ready to insert the photograph or graphic into

your webpage. For more information on converting

photographs and graphics for the World Wide Web, as

well as links to United Methodist sites with photographs

and graphics to download, see pages 101–102 of this

Guide.

Let’s take a few minutes now to talk about terms of use

and privacy policies for your website. You may havenoticed these when you visited other sites. Generally,

users don’t take the time to view these, but it is good idea

to post them for your own protection. Basically, you are

telling visitors to your website what its intended use is and

how you will protect their privacy if they share any

personal information with you. In addition, there are

Federal regulations governing your responsibility when it

comes to use of your website by children.

In general, the terms of use and privacy policies are

presented clearly and conspicuously, usually by a link atthe bottom of the home page and about us page, at a

minimum, or a link at the bottom of each page. When

users access these page, they learn what information you

may collect from them, such as email addresses, let them

choose how that information is used, how you will protect

their personal information, and how you may use it if they

7070

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Step #20:Protect Users

and Members Privacy

Page 14: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 14/54

give you permission. Always include a way for users to opt

out of sharing any personal information but still have

access to your site’s information. Sample “Terms of Use”

and “Privacy Policies” from local United Methodist church

websites can be found on pages 103–104 of this Guide.

We recommend that you seek legal advice when crafting

your own “Terms of Use” and “Privacy Policy” statements

to be sure they are legally sound and that you understand

your liability and responsibility.

With regard to children, you must obtain parental

permission before collecting any data from children. This

includes providing parents with notice of your information

practices, obtaining verifiable parental consent before

collecting a child’s personal information with limited

exceptions, giving parents a choice of whether their child’s

information will be disclosed to third parties, providing

parents access to their child’s personal information and

allowing them to review it and/or have it deleted, giving

parents the opportunity to prevent further use or collection

of information, not requiring a child to provide moreinformation than is reasonably necessary to participate in

an activity, and maintaining the confidentiality, security,

and integrity of information collected from children. For 

more information and a link to the Federal guidelines, see

page 105 of this Guide.

While this may seem like a lot to consider, it is essential to

preserving the safety of children who use the Internet, and

it is in direct compliance with our Church’s commitment to

providing Safe Sanctuaries for Children and Youth, which

extends into cyberspace when your church becomes apart of the World Wide Web.

In addition to considering the privacy protection of users,

you will want to preserve the privacy of your members. In

particular, you will want to err on the side of caution

7171

Part Three:DeDevveloping a User eloping a User -Center -Center ededWWeebsitebsite

Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 15: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 15/54

whenever you list a person’s name, email address, or 

place names with photographs. Generally, with regard to

staff, there is a viable reason for listing names and even

email addresses or telephone numbers. When you do list

email addresses, it is a good idea to disguise these. The

reason for disguising email addresses is that “spiders”

crawl billions of pages on the Internet looking for the “@”

sign. They capture all the characters that precede and

follow the “@” sign as an email address and then use this

to send SPAM to you. There are some simple ways to

prevent this, and we offer a few easy-to-follow instructions

on pages 106–107 of this Guide.

With regard to volunteers and members, you will want to

obtain their permission before listing their names, email

addresses, or telephone numbers. If you do list names, we

recommend first names with last initials versus displaying

a person’s full name. Not everyone who visits your website

will have the best interest of your volunteers and members

foremost in their minds. And, some will siphon this

valuable information for personal gain.

Likewise, when displaying photographs of people, make

sure you have their permission first; and again, only list

first name and last initial at the most when identifying

people in pictures. With regard to photographs of children,

any picture in which a child’s face is clearly visible must

have parental permission before posting to your website.

We recommend that you never include any name or other 

identifying information with any picture of a child or 

children. On pages 108–111 of this Guide, we offer sample

release forms for gaining permission of volunteers andmembers regarding use of their information and image on

your website. We recommend that you seek legal advice

when crafting your own release forms to be sure they are

legally sound and that you understand your liability and

responsibility.

7272

PartThree:Accessing the I Accessing the Inter net f net f or Ef or Ef f f ectiectivveeWWeeb Ministr b Ministr yy

Web Ministry 101 Planning Guide Part One: Accessing the Power of the Internet for Effective We Ministry© 2006 United Methodist Communications

Page 16: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 16/54

Step #13:Cr Cr eaeate a Unique Imate a Unique Imagge and Designe and Design

7373Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Even if you are using a template-based design service, you can create a unique image by using a logo or 

graphic that is specific to your church’s personality, ministry, and mission. For many local churches, the

United Methodist insignia, the Cross and Flame, is their primary logo. Use of The United Methodist Cross

and Flame is by permission only. It is a registered trademark of The United Methodist Church and, as such,

is a protected copyright of the Church. While you are free to use the Cross and Flame on your website, you

will want to review the guidelines for using the insignia and make sure you represent the Cross and Flame

appropriately on your website. To view the Cross and Flame guidelines, visit the website of the General

Council on Finance and Administration of The United Methodist Church.

Many churches, in addition to displaying the Cross and Flame, have developed a unique image to reflect the

ministry and mission of their church. If your church has already created something like this, you should

consider how you will use it on your website. It is not necessary to create a unique image for your local

church; however, if this is something you are considering as a part of your overall website design, be sure

to create an image that can be used throughout your church’s ministry and not just for your website. As a

result, you will want to involve more than just your Web ministry team in the process of creating a unique

image for your church.

Represented here are examples of unique images created by local United Methodist churches for use on

their websites. By clicking on the unique image, you can be directed to this church’s website.

Epworth United Methodist Church

Indianapolis IN

epworthindy.orgGood Shepherd United Methodist Church

Indianapolis IN

gsumcindy.org

Page 17: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 17/54

Step #13:Cr Cr eaeate a Unique Imate a Unique Imagge and Designe and Design

7474Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Central United Methodist ChurchSouth Bend IN

centralnow.org

Castleton United Methodist Church

Indianapolis IN

castletonumc.org

Horizons of Faith United Methodist Church

Indiana

hof-umc.org

Huntertown United Methodist Church

Huntertown IN

huntertownchurch.org

Faithpoint United Methodist Church

Floyds Knobs IN

faithpointchurch.org

Page 18: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 18/54

Step #13:Cr Cr eaeate a Unique Imate a Unique Imagge and Designe and Design

7575Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

 Avon United Methodist Church

 Avon IN

avonumc.com

Mission Bell United Methodist Church

Glendale AZ

achurchwithoutwalls.org

Clay United Methodist Church

South Bend IN

claychurch.com

Cove United Methodist Church

Hampton Cove AL

covechurch.com

Page 19: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 19/54

Step #13:Cr Cr eaeate a Unique Imate a Unique Imagge and Designe and Design

7676Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

General Guidelines for Color There are four general guidelines to be considered when designing webpages:

• Design in black and white, adding color for emphasis.

• Color should never be the only visual cue for anything.

• Distinguish between features that a user must be able to see in order to use the webpage and

those that would be nice to see.

• Test whether color contrast is sufficient to be read by people with color deficiencies or by those

with low-resolution monitors, print pages on a black and white printer (with backgrounds and

colors appearing in grayscale).

Sufficient contrast for reading is a key factor when considering accessible colors on webpages. Therefore,

particular color combinations to be avoided are red-green, green-yellow, and blue-yellow.

Websafe ColorsTo ensure cross-platform consistency in color scheme, it is recommended that webpages be designed only

with the 216 common websafe colors. Websafe colors are also referred to as the websafe color palette,

dither-free colors, and 6x6x6 colors. Despite the multiple terminology, the colors and hexadecimal codes are

the same. Visit these websites for charts of the websafe palette as well as some interactive tools for 

determining the best colors and combinations of color for your website.

• Rich-in-Style, includes a colorizer that lets you select a background color and shows you what

all the other colors would look like against this background color. Good for selecting the right

combination of background and font colors.

• Cloford, websafe colors by hexadecimal number or  websafe colors by name

• Well-Styled, an interactive site that allows you to select a color from the websafe palette and

see some of the exciting color combinations you can use

• Web Developers, three-color combinations using websafe colors

NOTE: At the time of publication, all links were active. If links become broken, inactive, or redirect to another website, please

inform us by sending an email to [email protected]. Website URLs provided in this Guide are for example only, and

UMCom is not responsible for the content management of these sites. Furthermore, the listing of these websites does not

represent an endorsement by UMCom unless otherwise stated in the Guide.

Page 20: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 20/54

Step #13:Cr Cr eaeate a Unique Imate a Unique Imagge and Designe and Design

7777Web Ministry 101 Planning Guide Part One: Accessing the Power of the Internet for Effective We Ministry© 2006 United Methodist Communications

Websafe Text or Font StylesThere are a few universal fonts that represent well in most browsers. In addition to choosing a text or font

style, you will also want to consider the size of the font. We recommend using a font size of 10 or 12 point

for body text. This is easily readable for most users. Likewise, we would recommend that your title or header 

fonts are 18 to 24 points; however, you have a lot more flexibility for these when designing your site. In

particular, you want the title or heading to be larger than the body text so that users immediately know what

they are reading about and can decide at a glance if this is the information they are looking for. Here are

examples of websafe text or font styles in 12 point body text and 24 point header text:

 Arial 12 point

 Arial 24 point

Courier New 12 point

Courier New 24 point

Geneva 12 point

Geneva 24 point

Georgia 12 point

Georgia 24 point

Helvetica 12 point

Helvetica 24 point

Times New Roman 12 point

Times New Roman 24 point

Verdana 12 point

Verdana 24 point

Page 21: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 21/54

Step #14:Cr Cr eaeate ate aWWelcoming Home Pelcoming Home Paaggee

7878Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Your home page is the portal to the rest of your site. It is like the front door of your church meant to be

welcoming and lead the user to all the ministry opportunities available upon entering. In addition, your home

page should showcase the latest ministry news for your church so that frequent users can immediately see

what’s changed since their last visit.

Many home pages are designed to look different than the rest of the main sections and subpages of a

website. The home page, generally, serves more as the title page and table of contents than as the answer 

to every user’s questions and needs. As such, it is usually crisp and clean with the site navigation menu as

the prominent feature so the user can quickly get to the information he or she wants to find. Here are a few

examples of welcoming home pages from local United Methodist church websites. To visit the website for 

each of these examples, simply click on the home page to be redirected to the site.

Page 22: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 22/54

Step #14:Cr Cr eaeate ate aWWelcoming Home Pelcoming Home Paaggee

7979Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 23: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 23/54

Step #14:Cr Cr eaeate ate aWWelcoming Home Pelcoming Home Paaggee

8080Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 24: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 24/54

Step #14:Cr Cr eaeate ate aWWelcoming Home Pelcoming Home Paaggee

8181Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 25: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 25/54

Step #14:Cr Cr eaeate ate aWWelcoming Home Pelcoming Home Paaggee

8282Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page 26: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 26/54

Step #15:Cr Cr eaeate a Site Mate a Site Map and Nap and NavigvigaationtionTToolsools

8383Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

One way to outline your websites navigation menu is to create a site map. This is the blueprint or road map

for your website and provides a clear picture of how pages are linked together and how they relate to the

whole website. From your website’s home page, users should be able to go directly to any of your main

sections with one mouse click. These sections, then, must have a direct link from your home page.

Therefore, you will want to design your website to include the main sections of your ministry in the navigation

menu of the home page. As you create your site map, these main sections would be the first tier under the

home page.

There are certain main sections we recommend you include in the first tier of your church’s website. If you

are using E-zekiel as your website design and hosting service, every website in their template-based design

will start with four sections in the first tier. These include:

• Events

• Contact Us

• Site Map

• Home

In addition, we recommend adding, at a minimum:

• About Us

• Worship• Links

If you have other ministry areas, such as Christian Education, Missions, or Youth, we recommend that you

consider how these will be listed as a part of your site’s main sections, or if they will form the second tier and

fall under one of your first tier sections as subpages. Shown below is a sample site map from an actual local

United Methodist church website.

Page 27: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 27/54

Step #15:Cr Cr eaeate a Site Mate a Site Map and Nap and NavigvigaationtionTToolsools

8484Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

In addition, anything on your home page should provide a direct link to the rest of the story or more

information. Most home pages contain some feature items in the body of the page. These would be the most

relevant, important, or up-to-date displays of information that you know the user is looking for. Within the

body, you can embed a hyperlink that takes the user directly to this information. Generally, what you display

on the home page is a teaser to the rest of the information. Since most users skim or scan pages for 

information rather than read everything word for word, teasers should contain the essence of the information

and direct the user to the rest with just one mouse click.

Once a user leaves your home page, he or she should always know where he or she is within your site. To

accomplish this, we recommend using what are called breadcrumbs. Breadcrumbs tell the user, “You are

here,” and display the trail that has led to this point. This way, a user can return easily to a previous location

without having to use the “back” button in the browser window. Likewise, breadcrumbs help users to see how

pages are linked so they can stay connected to the main pages or sections of your website. Finally,

breadcrumbs help the user to find his or her way back home. Shown below is an actual webpage from a local

United Methodist church website displaying a breadcrumbs trail. To view this website online, simply click on

the sample image.

Page 28: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 28/54

Step #15:Cr Cr eaeate a Site Mate a Site Map and Nap and NavigvigaationtionTToolsools

8585Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

In addition to using breadcrumbs, each page of your site should contain the site navigation menu. If your 

pages extend beyond the bottom of the browser’s window, we recommend that you add the navigation menu

to the bottom of the page, too. This way, if a user is scrolling down your page, he or she does not have to

scroll back to the top in order to move to a section of your site. Shown below is an actual United Methodist

church website that uses a conspicuously located navigation menu at the top and bottom of the page. To

view this website online, simply click on the sample image.

Page 29: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 29/54

Step #16:Cr Cr eaeate Main Sections and Subpate Main Sections and Subpaggeses

8686Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

In addition to a design for your website’s home page, you will want to develop a design for the main sections

of your website. This design will have some of the same components of the home page in terms of color,

image or logo, font style and size, and photographs or graphics. But, these may be arranged differently to

allow for more space or prominence for the information contained on these pages. As with the home page,

the main sections should include easy navigation. Shown below are examples of the home pages shared in

Step #14 alongside a main section page from the same website to demonstrate how these United Methodist

church websites make use of the same design elements from the home page to the main section pages. To

view the entire website featured, simply click on the sample image.

HOME PAGE

Gracepoint United Methodist Church

MAIN SECTION PAGE

Gracepoint United Methodist Church

Page 30: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 30/54

Step #16:Cr Cr eaeate Main Sections and Subpate Main Sections and Subpaggeses

8787Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

HOME PAGECoronado Community United Methodist Church

MAIN SECTION PAGECoronado Community United Methodist Church

HOME PAGESt. Mark United Methodist Church

MAIN SECTION PAGESt. Mark United Methodist Church

Page 31: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 31/54

MAIN SECTION PAGEEpworth United Methodist Church

Step #16:Cr Cr eaeate Main Sections and Subpate Main Sections and Subpaggeses

8888Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

HOME PAGEEpworth United Methodist Church

HOME PAGE

First United Methodist Church

MAIN SECTION PAGEFirst United Methodist Church

Page 32: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 32/54

Step #16:Cr Cr eaeate Main Sections and Subpate Main Sections and Subpaggeses

8989Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

From your main sections, you may have links to subpages. These subpages may have the same or similar 

design as the main sections. What makes them different from the home page and main sections or pages is

that they will not be a part of the main navigation of the website unless you use drop-down or expanded

navigation tools. Some template-based designs will not support drop-down or expanded navigation. In this

case, you will want to use hyperlinks to direct or point users to these subpages. Shown below is an example

of how one local United Methodist Church uses the same design elements configured differently on each of 

the home, main section, and subpages. To view this website, simply click on the sample image.

HOME PAGECoronado Community United Methodist Church

MAIN SECTION PAGECoronado Community United Methodist Church

SUBPAGECoronado Community United Methodist Church

Page 33: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 33/54

Step #17:PPopulaopulateteYYour our WWeebsite with Engbsite with Engaaging Contentging Content

9090Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Working from your site map, which outlines the different sections and subpages of your website, you will

want to gather and prepare content to form the body text for each page. Most of this content will come from

existing printed documents, such as brochures, flyers, and newsletters that your church has already

produced as well as from the staff members and volunteers who work directly with the program or ministry

areas of your church.

If you are relying on existing print documents, you will want to edit these for the Web versus copying and

pasting them into the body of your pages. Generally, visitors to your website will skim your pages to find the

information they are looking for. Therefore, it is important to share the essential information in one to two

sentences versus one to two paragraphs. As a result, you will need to condense any existing print documents

by extracting the most important points and presenting each of these in clear and concise, short sentences

that visitors can skim in order to find what they are looking for. These one or two clear and concise sentences

are often referred to as the “teaser.” Again, teasers allow users to quickly and easily skim the page and click

for more information if they’re interested. Shown below is an example of how one local United Methodist

church website uses teasers on its home page to entice visitors to click and read more. To visit this church’s

website, simply click on the sample image.

Teaser on home page links to the rest of the story on the About Us page.

Page 34: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 34/54

Step #17:PPopulaopulateteYYour our WWeebsite with Engbsite with Engaaging Contentging Content

9191Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

With pages that present a lot of content, be sure to organize the information so the visitor does not have to

work too hard to understand the information. You can accomplish this by using clear headings, subheadings,

and bulleted lists. If the information is not organized well or is too hard to follow, visitors will stop reading and

move on to something else. Keep in mind that you want the content on your website to pull in and lock users,

to inform and educate them, and to offer answers to their questions. Shown below is an example from a local

United Methodist church website that has a lot of information on one page but organizes it well using

subheadings. To visit this church’s website, simply click on the sample image.

Page 35: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 35/54

Step #17:PPopulaopulateteYYour our WWeebsite with Engbsite with Engaaging Contentging Content

9292Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

If there are print documents that you want to make available, as is, through your website, such as bulletins,

brochures, or flyers, you can save them in a portable document format or PDF so these files can be

downloaded by the user and opened, read, and printed using the free software, Adobe Acrobat Reader. To

create a PDF of an existing document, you will need Adobe Acrobat software, which can be purchased from

TechShop at a significant savings over retail. This software will enable you to convert existing documents

into PDFs as well as create fill-in forms that users can download, complete, and email back to you. To learn

more about how to create PDFs using Adobe Acrobat, visit the   Adobe website. If you use a Macintosh

computer, you can create a PDF of any document by selecting this option when you print. Instead of the

document printing on paper, the document will be saved in PDF as a new file. However, you cannot create

fill-in forms with this same feature. You will need the complete Adobe Acrobat software to accomplish this.

When providing PDFs on your webpages, we suggest that you always alert users that by clicking on a link

to a PDF they will be opening a new browser window or downloading the document directly to their 

computers. Some PDFs with many pages and graphics can easily be 1 MB or larger. This can mean a very

long download time for some users, especially those using dial-up connections to the Internet. When listing

a link to a PDF, let the user know by placing PDF and its size in parentheses next to the link. Shown below

is an example of how one local United Methodist church website displays links to its PDFs for its weekly

worship bulletins. To visit this church’s website, simply click on the sample image.

Page 36: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 36/54

Step #17:PPopulaopulateteYYour our WWeebsite with Engbsite with Engaaging Contentging Content

9393Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

The website example on the previous page provides simple instructions for how to download the PDFs and

provides a link to the free Adobe Acrobat Reader software. It also lists the size of each PDF in parentheses

after the document’s name. Listed below is the link to the Adobe Acrobat Reader software for downloading

this free resource. You can also copy the “Get Adobe Reader” graphic from the Adobe webpage and save it

to your computer for use on your own website.

To download the free Adobe Acrobat Reader software, visit the Adobe website by clicking the “Get Adobe

Reader” graphic.

Page 37: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 37/54

Step #18:DeDevvelop Content Pr elop Content Pr otocolsotocols

9494Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

You will want to establish some protocols or guidelines for how content will be updated and how new content

will be prepared for use on your church’s website. Whether you have one person or many people contributing

content for your site, maintaining some basic protocols will help to keep the information consistent

throughout your site. In particular, you will want to decide how content should be delivered to the person

responsible for posting it to your site.

1. Should the information be in electronic form using Microsoft Word or another word processing

program?

2. Should it be delivered on disk or sent via email?

3. Should it be in print form alone or in addition to the electronic format?

 Answering these questions and developing some basic protocols will save valuable time for the person

preparing and posting the content.

Likewise, you will want to provide a written protocol for how body text or content, headings and subheadings

are displayed on your website. These are commonly referred to as style guides or stylesheets. This will

enable every page to look the same when it comes to the words displayed on the screen, and it ensures a

clean, uncluttered, and consistent presentation to your users. On the next few pages, we offer suggestions

and examples for selecting and setting the style of your website’s content. And, we provide a simple checklistfor creating your own website content style guide.

Page 38: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 38/54

Step #18:DeDevvelop Content Pr elop Content Pr otocolsotocols

The primary components of text style on a webpage are font, size, and style; paragraph alignment, spacing,

and indentation. First, let’s outline the choices you will need to make.

FontThis is the name of the font you will use for each element of content on your website. Remember to select

a websafe font from the list on page 77. If you want to use another font, consider creating the text as a

graphic so that the font will display the same in every browser.

Size

This is the point size you select for the text. It is fairly easy for most viewers to read a font size of 10–12 pointdepending upon the font you choose. Most body text is 10 or 12 point, and most headings are 14 point or 

higher. Generally speaking, you will use four, five, or more text sizes depending upon their function. Consider 

this example as a basic guide to setting text size.

9595Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Page Title, 36 pt

Subtitle, 24 ptHeading, 18 pt

Subheading, 14 pt

Body Text, 12 pt

Caption, 10 pt

Page 39: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 39/54

Step #18:DeDevvelop Content Pr elop Content Pr otocolsotocols

9696Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

StyleThe style of your font refers to any emphasis you select to set the text apart from other text. These emphases

include:

• Plain—this is plain text

• Bold—the is bold text• Italic—this is italic text 

• Underline—this is underline text

• All Caps—THIS IS ALL CAPS TEXT

• Small Caps—THIS IS SMALL CAPS TEXT

• Shadow—this is shadow textthis is shadow text

• Outline—this is outline text

• Superscript—this is superscript text

• Subscript—this is subscript text

There are a few rules regarding style or text emphasis that apply to the Internet. Keep these in mind as you

develop your website’s content.

1. Do not use underline unless the word or phrase is a hyperlink.

2. Use italics sparingly as these are hard to read. Instead, use bold text for emphasis.3. ALL CAPS should be used sparingly for headings and titles. It should not be used for body text

because it is harder to read than lowercase text.

4. Shadow and outline should only be used for headings or titles, and then sparingly. They are

more difficult to read than plain text.

Color Your choices regarding color should flow from the color palette you have selected for your website. Be sure

to test the readability of your text against light and dark backgrounds. And, remember to select websafe

colors for your website. See the resources regarding websafe colors on page 76.

AlignmentYou have four choices for the alignment of text: Left, Right, Center, Fully Justified. Left alignment justifies the

text on the left margin and leaves the text at the right margin jagged. This is a sample of left alignment of 

text:

Page 40: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 40/54

Step #18:DeDevvelop Content Pr elop Content Pr otocolsotocols

9797Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla fringilla, leo ac blandit

facilisis, pede justo pharetra quam, non consectetuer nibh dui eget nulla. Vestibulum nisi.

Etiam fringilla. Mauris est mi, mattis in, malesuada vel, nonummy vitae, leo.

Right alignment justifies the text on the right margin leaves the text on the left margin jagged. This is a

sample of right alignment of text:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla fringilla, leo ac blandit

facilisis, pede justo pharetra quam, non consectetuer nibh dui eget nulla. Vestibulum nisi.

Etiam fringilla. Mauris est mi, mattis in, malesuada vel, nonummy vitae, leo.

Center alignment centers the text between the left and right margin. This is a sample of center alignment of 

text:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla fringilla, leo ac blandit

facilisis, pede justo pharetra quam, non consectetuer nibh dui eget nulla. Vestibulum nisi.

Etiam fringilla. Mauris est mi, mattis in, malesuada vel, nonummy vitae, leo.

Fully justified alignment justifies the text at the left and right margins so neither is jagged. This is a sample

of fully justified text:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla fringilla, leo ac blandit

facilisis, pede justo pharetra quam, non consectetuer nibh dui eget nulla. Vestibulum nisi.

Etiam fringilla. Mauris est mi, mattis in, malesuada vel, nonummy vitae, leo.

SpacingSpacing of text between words, at the end of sentences, between lines, and between paragraphs must also

be decided to maintain consistency throughout your website. Here are a few general rules for determining

spacing for your website:

1. Use one space between words and after a period. If you are using numbered or bulleted lists,

either use the “tab” feature to indent each item in the list at the same place, or determine if youwill use 1 or 2 spaces after the number or bullet to maintain consistency.

2. Select one, one and a half, or two lines spaces between lines. Be consistent throughout your 

website with regard to body text, in particular.

Page 41: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 41/54

Step #18:DeDevvelop Content Pr elop Content Pr otocolsotocols

9898Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

3. Generally, using a line space between paragraphs creates a nicer look and is easier for readers

to follow when there is a lot of text on the page. If you use a line space between paragraphs,

then do not indent paragraphs. See the difference between using a line space and not

indentation versus no line space and indentation looks like this ...

Line spacing between paragraphs, no indentation of paragraphs:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla fringilla, leo ac

blandit facilisis, pede justo pharetra quam, non consectetuer nibh dui eget nulla.

Vestibulum nisi. Etiam fringilla. Mauris est mi, mattis in, malesuada vel, nonummy

vitae, leo.

Suspendisse pretium. In orci nisi, gravida vel, lacinia vel, iaculis quis, lectus. Nunc

mattis ligula. Integer congue massa eu ligula. Nunc non libero.

No line space between paragraphs, 0.25” indentation of first line of each paragraph:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla fringilla, leo ac

blandit facilisis, pede justo pharetra quam, non consectetuer nibh dui eget nulla.

Vestibulum nisi. Etiam fringilla. Mauris est mi, mattis in, malesuada vel, nonummy

vitae, leo.Suspendisse pretium. In orci nisi, gravida vel, lacinia vel, iaculis quis, lectus.

Nunc mattis ligula. Integer congue massa eu ligula. Nunc non libero.

IndentationIn general, you will want to indent the first line of each paragraph if you do not use a line space between

paragraphs (see examples above). You should indent 0.25” to optimize space. Likewise, indent any lists

using the automatic features when available. This keeps all items in the list indented the same and lined up

nicely as you look down the page.

Other Be sure to include any other specific details about the characteristics or attributes of each type of text on

your website.

Page 42: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 42/54

Step #18:DeDevvelop Content Pr elop Content Pr otocolsotocols

9999Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Website Style Guide WorksheetUse the worksheet below to develop a style guide for your website’s content.

Page TitleThis is the title of the page. Every page should have a title. It is the first thing users look for when browsing

your website. They use it to figure out what the page is about, and search engines us it to direct users to

your page when they “google” information. See Step #23 for more information on page titles and how they

are used by search engines.

Font Size Style Color Alignment Spacing Indentation

Other:

Font Size Style Color Alignment Spacing Indentation

Other:

SubtitleIf needed, a sub-title would typically display with the title, only a little smaller in size, but usually in the same

font style.

Font Size Style Color Alignment Spacing Indentation

Other:

HeadingThe heading is used to separate large chunks of information and to separate different types of information

on the same webpage.

Page 43: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 43/54

Step #18:DeDevvelop Content Pr elop Content Pr otocolsotocols

100100Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Font Size Style Color Alignment Spacing Indentation

Other:

SubheadingIf needed, a sub-heading would follow the heading, only a bit smaller, and usually in the same font style. It

serves to further divide information on the same webpage.

Font Size Style Color Alignment Spacing Indentation

Other:

Body TextBody text is what most of the words on your webpage will be, so select a readable font type and size, and

limit the style and color variations.

Font Size Style Color Alignment Spacing Indentation

Other:

CaptionThe caption text is very small, but still readable. It is used to put captions under pictures, display the

breadcrumbs trail, and display the navigation menu at the bottom of the page.

You may have other text styles to consider, such as navigation buttons or menus. Use the same type of 

worksheet for each type of text style in order to maintain consistency from page to page within your website.

Page 44: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 44/54

Step #19:AdAdd Photod Photoggr r aaphs and Gr phs and Gr aaphics to Enhance Contentphics to Enhance Content

101101Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

 After you have selected appropriate photographs and graphics, you must prepare them for the World Wide

Web. This means that they must be in a digital format that can be viewed easily on your webpages. If you

are working from a printed photograph or graphic and cannot access a digital version of it, you will have to

convert it into a digital format. Using a scanner connected to your computer, digitize the image at a minimum

of 200 dots per inch. Save the digitized photograph as a JPEG or the graphic as a GIF. These are the most

appropriate formats for the two main types of images displayed over the Internet.

If you have the photograph or graphic already in digital form or have scanned and saved it as we just

discussed, the next step is to edit the image using one of many image-editing software programs. From the

image-editing program, make the following adjustments to your graphic or photograph:

1. Change it to RGB color, if necessary.

2. Crop the image as desired.

3. Change the resolution to 72 dpi and constrain proportions

4. Adjust the width or height to the exact pixels needed to fill the space on your webpage.

5. Save the image in the proper format, JPEG for photographs and GIF for graphics.

Image-Editing Software ProgramsSome of the more popular and widely used image-editing software programs are listed below. Remember to

check with TechShop before purchasing any of these software programs as you may be able to save a lot

of money by making your purchase with them instead of paying retail for the same product.

• Adobe Photoshop CS, ImageReady, and Element

• Corel Paint Shop, Photo-Paint, and Painter 

• Fireworks

• Jasc Paint Shop Pro

• Microsoft Paint

• Ulead Photo Impact

If you don’t have a digital camera, you can have the pictures from a regular camera developed onto a CD.

Then, you can import the photographs from the CD onto your computer and edit them in your image-editing

software program.

Page 45: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 45/54

Step #19:AdAdd Photod Photoggr r aaphs and Gr phs and Gr aaphics to Enhance Contentphics to Enhance Content

102102Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Here are links to several United Methodist Church websites where you can download denominational

graphics, photographs of mission and ministry, and other exciting and engaging images to add to your 

church’s website. Simply click on the area you want to explore. You will be redirected to a page on a United

Methodist Church board or agency website. From there, you can view and download the graphics, logos,

and photographs you want to display on your church’s website.

Logos and Graphics

• Igniting Ministries

• The United Methodist Church Cross and Flame

• Other Ministry Graphics of The United Methodist Church

• Other Organizational Graphics of The United Methodist Church

Photographs

• General Board of Global Ministries, mission photographs

• United Methodist Committee on Relief (UMCOR)

• United Methodist News Service (UMNS)

Page 46: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 46/54

Step #20:Pr Pr otect User otect User s and Member s and Member s Pris Privvacacyy

103103Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

In general, the “Terms of Use” and “Privacy Policy” statements are presented clearly and conspicuously,

usually by a link at the bottom of the home page and About Us page, at a minimum, or a link at the bottom

of each page. When users access this page, they learn what information you may collect from them, such

as email addresses, let them choose how that information is used, how you will protect their personal

information, and how you may use it if they give you permission. Always include a way for users to opt ou”

of sharing any personal information but still have access to your site’s information. Listed below are the basic

components of “Terms of Use” and “Privacy Policy” statements as well as links to examples of these from

local United Methodist church websites and other non-profit organizations.

Terms of UseThe purpose of a “Terms of Use” statement for your website is to display clearly and concisely what your 

expectations are of the user. In general, these terms of use include:

• An agreement between the user and the website’s agent (local church)

• Recognition of changes to the “Terms of Use”

• Links to Third Party Sites

• Unlawful or Prohibited Use

• Use of Communication Services

• Liability Disclaimer 

• Termination and/or Access Restriction

• Copyright and Trademark Notices

Visit these websites to view actual “Terms of Use” statements displayed on local United Methodist church

websites and other non-profit organizations.

• College Avenue United Methodist Church, Muncie IN

• Saint James United Methodist Church, Alpharetta GA (PDF 96 KB)

• West Des Moines United Methodist Church, Des Moines IA

Privacy PolicyThe purpose of the Privacy Policy is to state clearly and concisely how the website’s agent (local church) will

protect any personal information collected from users of the website. The basic components of this statement

are:

• Collection of Personal Information

• Use of Personal Information

Page 47: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 47/54

Step #20:Pr Pr otect User otect User s and Member s and Member s Pris Privvacacyy

104104Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

• Use of Cookies

• Security of Personal Information

• Change to the Privacy Policy Statement

• Contact Information

Visit these websites to view actual “Privacy Policy” statements displayed on local United Methodist church

websites and other non-profit organizations.

• College Avenue United Methodist Church, Muncie IN

• Saint James United Methodist Church, Alpharetta GA (PDF 96 KB)

• Saint Mark United Methodist Church, Atlanta GA

• West Des Moines United Methodist Church, Des Moines IA

NOTE: We recommend that you seek legal advice when crafting your own “Terms of Use” and “Privacy

Policy” statements to be sure they are legally sound and that you understand your liability and responsibility.

Page 48: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 48/54

Step #20:Pr Pr otect User otect User s and Member s and Member s Pris Privvacacyy

105105Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Protecting Children’s PrivacyWith regard to children, you must obtain parental permission before collecting any data from children. This

includes:

• Providing parents with notice of your information practices

• Obtaining verifiable parental consent before collecting a child’s personal information with limited

exceptions

• Giving parents a choice of whether their child’s information will be disclosed to third parties

• Providing parents access to their child’s personal information and allowing them to review it

and/or have it deleted

• Giving parents the opportunity to prevent further use or collection of information

• Not requiring a child to provide more information than is reasonably necessary to participate in

an activity

• Maintaining the confidentiality, security, and integrity of information collected from children

To review the complete Federal guidelines, link to the Children’s Online Privacy Protection Act (COPPA).

While this may seem like a lot to consider, it is essential to preserving the safety of children who use the

Internet, and it is in direct compliance with our Church’s commitment to providing Safe Sanctuaries for 

Children and Youth, which extends into cyberspace when your church becomes a part of the World Wide

Web. Visit the General Board of Discipleship website for more information on Safe Sanctuaries.

Page 49: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 49/54

Step #20:Pr Pr otect User otect User s and Member s and Member s Pris Privvacacyy

106106Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Solutions to Eliminating Email Spiders (SPAM)

Email Spiders or SPAM search websites to detect email addresses by looking for the “@” symbol. To avoid

having your email addresses pirated, take one or more of the following steps.

1. Encode the email address using obscuring text. For example, use this HTML text for 

[email protected]

<ahref="&#109;&#97;&#105;&#108;&#116;&#111;:&#105;&#110;&#102;&#111;&#64;&#102;&#

105;&#114;&#115;&#116;&#117;&#109;&#99;&#46;&#111;&#114;&#103;">&#105;&#110;&#10

2;&#111;&#64;&#102;&#105;&#114;&#115;&#116;&#117;&#109;&#99;&#46;&#111;&#114;&#10

3;</a>

Simply highlight the “[email protected]” that appears in your HTML code and replace it with the

lines of obscured text above. In the browser, it will appear as a regular email address hyperlink;

but because it is obscured, it cannot be pirated by email spider programs.

To encode other email addresses, use one of the two “Obscuring Text” online programs listed

below to convert text to encoded HTML.

2. Add a subject line, such as “Website Email,” to each email link by providing the additional HTMLcode as follows:

<ahref="&#109;&#97;&#105;&#108;&#116;&#111;:&#105;&#110;&#102;&#111;&#64;&#102;&#

105;&#114;&#115;&#116;&#117;&#109;&#99;&#46;&#111;&#114;&#103;?subject=&#87;&#101

;&#98;&#115;&#105;&#116;&#101;&#32;&#69;&#109;&#97;&#105;&#108;" title=""></a>

By adding a subject line, which automatically pastes into any email coming from your website

email hyperlink, you will immediately be able to identify the source of these emails versus SPAM

or email spiders. Note: “Website Email” can be changed to any identifier you choose; however,

while spaces between words is acceptable, do not include any other symbols, dashes, etc. Use

only alphanumeric symbols (letters and/or numbers).

Page 50: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 50/54

Step #20:Pr Pr otect User otect User s and Member s and Member s Pris Privvacacyy

107107Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

3. Use JavaScript to protect your email addresses. The JavaScript for [email protected] would be:

<p>You can contact our Church Office here:

<script language="javascript"> <!--

user = "info";

site = "firstumc.org";

document.write('<a href=\"mailto:' + user + '@' + site + '\">');

document.write(user + '@' + site + '</a>');

//-->

</script>

Note: The phrase on line one, “You can contact our Church Office here:” can be changed to any

appropriate message, such as “Contact Us:”, etc.

4. Cloak the email address altogether by:

a. Embedding the hyperlink into a “Contact Us” instead of listing the actual email address.

For example, instead of “Send an email to: [email protected]” simply attach the

hyperlink to the words “Contact Us.”

b. Representing the email address as a graphic. While this is the only 100% safeguardagainst email spiders (SPAM), it requires that the user actually type your email address

into his/her email program. The graphic is not a hyperlink; however, it could be by using

the same steps as letter “a” above.

Basic Information and Prevention:

• Codeode

• Net Mechanic, “Hide from Spiders” and “More Useless MAILTO Links”

• Online Tutorials

• SPAM Links

• Federal Trade Commission

Obscuring Text:

•  About.com

• Enigma

Page 51: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 51/54

Step #20:Pr Pr otect User otect User s and Member s and Member s Pris Privvacacyy

108108Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Sample Media Release Form #1

I, ____________________________________________________________, do hereby give (insert name

of church), its assigns, licensees, and legal representatives the irrevocable right to use my picture, portrait

or photograph in all forms media and in all manner, for the advertising, trade or in any other lawful purpose

for 

the exclusive benefit of (insert name of church).

I hereby forever waive any right to inspect or approve the finished product, including but not limited to, written

copy and/or image in print or in electronic form, including posting on the church’s website, which may be

created in connection therewith.

I am eighteen (18) years of age or older. I understand that (insert name of church) cannot control the

unauthorized use by persons other than (insert name of church) of my image once such image is published.

 Any claim I may have concerning unauthorized publication of my image must be pursued by me against the

unauthorized user. (Insert name of church) disclaims any responsibility for such unauthorized use of my

published image. I have had sufficient time to review and seek explanation of the provisions contained

above. I have carefully read and understand this Release and Waiver, and I agree to be bound by it. I

voluntarily and irrevocably give my consent and agree to this Release and Waiver.

Executed this _________________day of ___________________________________, 20_____________.

Printed Name:__________________________________________________________________________

 Address______________________________________________________________________________

City____________________________________ State_______________ Zip Code___________________

Phone Number___________________________ Email_________________________________________

Signature_____________________________________________________________________________

Witness_______________________________________________________________________________

Note: If named person is under the age of 18, his/her parent or legal guardian must sign the following 

Page 52: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 52/54

Step #20:Pr Pr otect User otect User s and Member s and Member s Pris Privvacacyy

109109Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Consent Form (continued on next page).

Sample Addendum to Media Release Form #1Parental Consent for Minors (under age 18)

I, _____________________________________________, am the parent or legal guardian of the person

listed above. I have read and understand the provisions of this document. I consent to this person

participating as described above, and I fully enter into and agree to the above Release and Waiver and

forever waive any rights therefrom.

Printed Name:__________________________________________________________________________

 Address______________________________________________________________________________

City____________________________________ State_______________ Zip Code___________________

Phone Number___________________________ Email_________________________________________

Signature_____________________________________________________________________________

Witness_______________________________________________________________________________

NOTE: We recommend that you seek legal advice when crafting your own release forms to be sure theyare legally sound and that you understand your liability and responsibility.

Page 53: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 53/54

Step #20:Pr Pr otect User otect User s and Member s and Member s Pris Privvacacyy

110110Web Ministry 101 Planning Guide Part Three: Developing a User-Centered Website© 2006 United Methodist Communications

Sample Media Release Form #2

I, ___________________________________________, grant permission to (insert church name) and its

subordinates, to use my name and/or photographs for use in (insert church name) publications such as

recruiting brochures, newsletters, and magazines, and to use my name/and or photographs on display

boards, and to use my name and/or photographs in electronic versions of the same publications or on the

(insert church name) website or other electronic forms or media.

I hereby waive any right to inspect or approve the finished photographs or printed or electronic matter that

may be used in conjunction with them now or in the future, whether that use is known to me or unknown,

and I waive any right to royalties or other compensation arising from or related to the use of the photograph.

I hereby agree to release, defend, and hold harmless (insert church name) and subordinates, including any

firm publishing and/or distributing the finished product in whole or in part, whether on paper or via electronic

media, from and against any claims, damages or liability arising from or related to the use of the

photographs, including but not limited to any misuse, distortion, blurring, alteration, optical illusion or use in

composite form, either intentionally or otherwise, that may occur or be produced in taking, processing,

reduction or production of the finished product, its publication or distribution.

Please check one of the following:

 _____I am 18 years of age or older and I am competent to contract in my own name. I have read this release

before signing below, and I fully understand the contents, meaning, and impact of this release. I understand

that I am free to address any specific questions regarding this release by submitting those questions in

writing prior to signing, and I agree that my failure to do so will be interpreted as a free and knowledgeable

acceptance of the terms of this release.

 _____I am the parent or legal guardian of the above named child. I have read this release before signing

below, and I fully understand the contents, meaning and impact of this release. I understand that I am free

to address any specific questions regarding this release by submitting those questions in writing prior to

signing, and I agree that my failure to do so will be interpreted as a free and knowledgeable acceptance of 

the terms of this release.

continued on the next page

Page 54: Planning Guide Part Three

8/14/2019 Planning Guide Part Three

http://slidepdf.com/reader/full/planning-guide-part-three 54/54

Step #20:Pr Pr otect User otect User s and Member s and Member s Pris Privvacacyy

Executed this _________________day of ___________________________________, 20_____________.

Signature of self (if 18 years of age or older )___________________________________________________

Signature of Parent/Guardian (if named is under 18 years of age)__________________________________

 Address______________________________________________________________________________

City____________________________________ State_______________ Zip Code___________________

Phone Number___________________________ Email_________________________________________

Witness_______________________________________________________________________________

NOTE: We recommend that you seek legal advice when crafting your own release forms to be sure they

are legally sound and that you understand your liability and responsibility.


Recommended