2lesson 2: web development teams...2lesson 2: web development teams objectives by the end of this...

19
2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of a Web designer or Web development team member. ¬ 1.1.2: Develop and update your Web design portfolio with demonstration pages and sites. ¬ 1.1.3: Define the collaborative nature of a Web development project. ¬ 1.1.13: Identify Web site characteristics (e.g., interactivity, navigation, database integration) and the project resources they require. ¬ 4.4.7: Identify elements of a successful Web marketing campaign (e.g., working with marketing team members to determine audience and central message, creating HTML e-mail messages with images, scheduling Webcasts).

Upload: others

Post on 04-Jul-2020

1 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to:

¬ 1.1.1: Identify job responsibilities and tasks of a Web designer or Web development team member.

¬ 1.1.2: Develop and update your Web design portfolio with demonstration pages and sites.

¬ 1.1.3: Define the collaborative nature of a Web development project.

¬ 1.1.13: Identify Web site characteristics (e.g., interactivity, navigation, database integration) and the project resources they require.

¬ 4.4.7: Identify elements of a successful Web marketing campaign (e.g., working with marketing team members to determine audience and central message, creating HTML e-mail messages with images, scheduling Webcasts).

Page 2: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

2-2 Web Design Specialist

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Pre-Assessment Questions

1. List at least three areas of expertise that should be represented in a well-rounded Web development team.

2. Which of the following is least likely to be part of the job description of a Web designer?

a. Web graphics creation b. XHTML coding c. Server configuration d. Quality assurance and testing

3. An intranet is:

a. a very small Web site on the Internet. b. a small network hosted within an organization's office. c. a Web site that is accessible only to an organization's internal members. d. a Web site that is accessible only to an organization's internal members and

selected external partners.

Page 3: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

Lesson 2: Web Development Teams 2-3

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Web Teams and Tasks The concept of teams in the workplace is not new. However, only recently have teams been used to develop Web projects. In earlier Web development models, one person was often responsible for the development of an entire Web project. A common reason for the one-person Web department was the lack of common knowledge about Web technology. In addition to the limited knowledge pool, management often displayed uncertainty and a lack of commitment to allocate resources to Web development.

This situation has changed. Organizations worldwide know the need for Web-enabling technologies. Design and engineering teams are now regularly used for Web projects.

Depending on the phase of development in a Web project, various skill sets are needed on a team. For example, marketing and writing professionals are more likely to be involved in Web development during the early phases, when the site's message is being crafted. When this work is done, Web designers, programmers and people with other technical skills will implement various components of the site. The team approach to Web development is critical to create a well-rounded design and a functional Web site.

Nature of Web teams In print or software design, the members of a team may be the same over the course of many projects. In Web development, however, the team's composition often fluctuates from one project to the next, depending on the skills required. Also, Web teams are frequently dispersed geographically. It is not uncommon for some members of a Web project team never to meet in person.

Composition of Web teams Although Web development projects vary, and one person may serve several roles, a Web project team will typically have people performing each of the following jobs:

• Project management — The project manager is involved with the project from start to finish. He or she is in charge of determining and documenting the requirements of a project, creating specifications for the project, assembling a team, and ensuring that the project stays on schedule and on budget.

• Information architecture — The information architect is responsible for translating customer requirements into a blueprint for site development. This may include planning the site's navigation and determining whether database integration is needed.

• Graphic design — The job of the graphic designer is to create a consistent and visually appealing look for a Web site. Graphic designers may also create Flash animations or design user interfaces for Web applications.

• Information technology — This group includes people with the more technical jobs involved in Web development, such as programmers, database administrators and networking professionals. The technologies these people enable in the site make it the interactive medium that it is.

• Marketing — Marketing professionals are responsible for developing the strategy for communicating a company's message, image and brand identity. As such, they are often involved in developing the site's look and feel, as well as its content.

NOTE: Do you think a team

approach is

necessary for all

Web projects?

Consider a small

business, for

example. What if

the team resources

are not readily

available, as they

are at a larger

company?

NOTE: Name other types of

projects in which

you have

participated that

benefited from

using a team

approach. What

projects might not

benefit from a team

approach?

OBJECTIVE 1.1.3: Web project

collaboration

OBJECTIVE 1.1.13: Site

characteristics and

resources

NOTE: Which of these

areas of expertise

do you think you

could best

contribute to if you

participated in a

Web development

team?

Page 4: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

2-4 Web Design Specialist

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

• Writing and editing — These professionals are responsible for writing, editing and proofreading the content on the Web site. Web site content requires concise information and adherence to a consistent style that appropriately reflects the company's desired message, tone and image.

The personnel and resources required for a project depends on the characteristics of the Web site that will be built. If the project requires database integration, for example, then a database administrator must be part of the team. If the project has complex information organization needs, then an information architect should be involved. Depending on the type of interactivity the project requires, the project team may need programmers or graphic designers with specialized skills.

Web designer's job role No one can possibly be an expert in every aspect of Web development. As a result, the trend in Web development jobs is toward specialization. The primary job of a Web designer is usually to design a visually appealing Web site that satisfies the requirements specified by the project manager or client.

Depending on the organization, however, the job description of a Web designer will vary widely. Web designers are often still expected to have a very wide range of skills. The skills required of a Web designer may include any combination of the following:

• Web site planning based on management or client goals and priorities

• Web graphics design

• Site structuring and navigation scheme design

• XHTML coding

• Programming and scripting languages coding

• Customer service and client relations

• Web site testing, troubleshooting and debugging

Web Project Management Although it is ideal to have an experienced project manager assigned to every Web development project, this is not always practical. Many Web designers, especially at smaller companies or on small teams, must perform project management tasks in addition to their Web design responsibilities.

The project manager's job is to understand the requirements for building and maintaining the site, to evaluate his or her organization's available resources, and to use those resources as efficiently as possible so that the project can progress smoothly.

Web sites are complex entities requiring the management of many technological and human resources. As with any complex system, your goal as a project manager is not to become an expert in all components of the system, but rather to creatively manage the resources that enable your Web site. The Web professionals on your development team each have different skill sets that serve different areas of Web development. Generally, a Web development team contains the skill disciplines illustrated in Figure 2-1.

OBJECTIVE 1.1.1: Web

development job

tasks

NOTE: Is project

management

(managing people,

resources,

production and

maintenance of a

site) what you see

yourself doing after

completing this

course? Can you

imagine yourself

performing all the

tasks in the skill

disciplines listed

here?

Page 5: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

Lesson 2: Web Development Teams 2-5

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Management Technical Creative

Web Design Team

Figure 2-1: Skills contributing to Web design teams

Each professional brings a different skill set to the project. Project management is an exercise in bringing the right people and technologies together to achieve the desired result.

Because we deal with finite resources and limited skill sets in the real world, project management is more an art than a science. It is an art that requires you to make the best product possible with the limited resources available to you.

Pace of Web development Web development projects generally proceed at a frantic pace. Evolving technologies, changes in project teams and fierce market competition all contribute to the need for rapid development, changing requirements and regular updating of Web sites. Web projects are notorious for requiring late-night pushes to finish.

However, Web projects do not need to be chaotic. Proper planning, communication and organization can substantially increase a project manager's ability to properly estimate the time and resources required for a project, and can increase the Web team's ability to complete projects on time and within budget.

Benefits of Web development methodologies Most Web development teams use some sort of system, or methodology, for handling projects. A methodology usually specifies the steps and the order of steps that a project team will take to implement a project from its earliest stages through to completion.

Numerous standardized methodologies have been created for software development and other engineering disciplines. These range from informal ideas about better ways to work, to rigid systems that seek to regulate the entire process in hopes of making the process completely predictable.

Web teams — especially small teams — usually follow a less formal and often in-house set of processes rather than subscribing to a rigid system. Even a basic list of steps and a general set of guidelines for a project's progress from start to finish can result in great improvements for most Web teams. Following are some advantages of establishing a basic process methodology for your Web development projects:

• Quality and deadlines can be more closely managed, because each step of the process has a specific goal and timeline.

• Duplication of effort is reduced, and processes become more efficient. Each person on the team knows his or her job, and the expectations and goals at each point in the process.

Page 6: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

2-6 Web Design Specialist

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

• Planning and thoughtfulness are encouraged, which generally results in less stress for everyone involved in the project.

Later lessons will discuss in greater detail the steps involved in a typical Web development project.

Web Project Collaboration Because of the fast-paced and evolving nature of Web development, it is important that Web teams have methods for sharing information among themselves, as well as with all project stakeholders.

The most basic collaboration tools for Web teams are e-mail, meetings and telephone calls. Although these may suffice for many projects, each one fails to address some important aspects of team collaboration. For example, telephone calls do not allow participants to share files. Meetings are helpful for planning and tracking progress, but are not an arena in which team members can accomplish work. E-mail works well for exchanging files, but real-time communication is important in some situations. Other collaboration tools feature combinations of these capabilities that may prove more useful. Examples of additional Web team collaboration tools include:

• Intranets.

• Wiki sites.

• Online conferencing.

• Instant messaging.

Intranets An intranet is a Web site that can only be accessed from within a company's network by internal employees. Intranets are frequently used by management to share information (such as company policies and employee directories) with employees. Intranets are also often used for sharing information among internal project team members.

Examples of information that could be stored on a company's intranet to improve collaboration among Web development team members include:

• A library, or repository, of frequently used images, fonts and pieces of code.

• Key documents associated with each project, such as the project timeline, client requirements and technical specifications.

• Links to Web addresses associated with each project, such as the test site.

Wiki sites A Wiki site is a collaborative Web site that can be easily modified by anyone with access to it. A Wiki site uses specialized Web-based software (called Wiki software) that allows any visitor to update the site using a Web browser. Specific pages of a Wiki can be locked down while leaving others available for public or permitted editing. A Wiki can be used to create an information repository or portal.

The word wiki comes from the Hawaiian phrase "wiki wiki," which means "very quick."

OBJECTIVE 1.1.3: Web project

collaboration

NOTE: Consider the

shortcomings of

e-mail, meetings

and telephone

collaboration. Can

you think of

instances in which

one of the

additional

collaboration tools

listed here would be

useful?

Wiki site A collaborative

Web site that uses

Web-based Wiki

software to allow

visitors to update

the site using only a

browser. Useful for

team collaboration,

information

repositories and

portals.

Page 7: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

Lesson 2: Web Development Teams 2-7

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Many Web development and software development teams use Wiki sites to create and maintain documentation related to projects, or to easily share and archive information for future use.

Figure 2-2 shows a popular publicly accessible Wiki site named Wiki Wiki Web (http://c2.com/cgi/wiki?WikiWikiWeb).

Figure 2-2: Wiki Wiki Web site

Figure 2-3 shows the editing interface for this same Wiki page. Notice that Wiki pages use their own language to indicate formatting for text. Wiki pages are hyperlinked using WikiWords. A WikiWord is simply two or more words, each capitalized and typed together without spaces between them. The Wiki software translates a WikiWord into a link to a new page. In this way, Wiki sites can be built quickly and hyperlinks can be created between pages very easily.

Page 8: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

2-8 Web Design Specialist

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Figure 2-3: Editing interface for Wiki page

Following are other examples of Wiki sites and vendors offering Wiki software:

• Wikipedia (www.wikipedia.org)

• OpenFacts (http://openfacts.berlios.de/index-en.phtml?title=Main_Page)

• MemoryAlpha (http://memory-alpha.org/en/wiki/Main_Page)

• Open Wiki (www.openwiki.com)

• Wiki Base (http://c2.com/cgi/wiki?WikiBase)

• Wiki Choicetree (http://c2.com/cgi/wiki?WikiChoicetree)

Online conferencing Online conferencing allows groups of people who work at different locations to have virtual "face-to-face" meetings without traveling. Some of the capabilities of online conferencing applications include:

• Video conferencing.

• Program sharing.

• Remote control (in which one person controls other computers remotely).

• Virtual whiteboard.

• Voice and text chat.

Page 9: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

Lesson 2: Web Development Teams 2-9

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Instant messaging Instant messaging (IM) has become a very common tool among Web and software development teams. IM allows the user to quickly ask a teammate a question or provide a brief response in real time, generally without causing too much of an interruption for either person.

Instant messaging applications can also be used to have text conferences between more than two people, and may include video and voice capabilities as well. IM is a useful tool when used correctly and with consideration. The key is to use it sparingly and to know when another form of communication, such as e-mail or a phone call, is more appropriate.

Your Web Design Portfolio A Web design portfolio is a single Web location that allows you to show off your best work to friends, family or potential employers. It is also a helpful tool for tracking your own progress as a Web designer.

As with any Web site, it is important to consider the purpose and goal of your portfolio while you are designing it. The purpose of a portfolio is to demonstrate your Web design skills and display your work. The goal is generally to impress your visitors — often people who may decide to hire you.

Web portfolio contents Considering the purpose and goal of your Web design portfolio, you should make sure that it is attractive, easy to use, and up to date. Consider including the following items in your Web portfolio:

• Your résumé

• Samples of graphics you have created

• Links to Web pages or sites you have designed or contributed to

• Demonstrations or samples of any other relevant special skills you want to emphasize, such as drawing or painting, programming, photography, or print design

Portfolio content to avoid Your portfolio should be crafted to impress and delight your visitors, but it must also be accurate. Do not link to sites that you have not contributed to or that you did very little work on, unless you have a good reason and you explain it. For example, if you designed a banner ad that is currently appearing on CNN.com, do not just link to CNN.com from your portfolio. Instead, create and link to a separate page that contains the banner ad, and state the fact that the ad appears on CNN.com. If you must link to a site for which you cannot take credit, include a statement with the link describing the work you did on that site.

Also consider the quality of the work you make available. Works in progress or rough draft versions may not be the best work for you to show off, unless you have a specific reason to provide examples of your creation process. Clearly label any older work meant to demonstrate a "before and after" process.

instant messaging (IM) A computer-based

method of

communication in

which users can

type and view

messages sent to

one or more

recipients, and view

the responses

immediately.

OBJECTIVE 1.1.2: Web design

portfolio

Page 10: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

2-10 Web Design Specialist

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Updating your portfolio After you create your portfolio, it is very important to maintain it regularly. Be sure to update your portfolio as quickly as possible when anything on it changes. Unlike a printed résumé, your online portfolio is always available, and visitors expect it to be current and accurate. Any inaccurate or outdated information can be seen by visitors who assume it to be current.

You should also perform regular updates to your portfolio to add new sites and remove old ones. Consider that a site, graphic or other design that reflected well upon your skills five years ago may not impress anyone today.

In the following lab, you will create a basic Web design portfolio page to which you can add as you develop more pages. Suppose you are interviewing for a job on a Web development team at a large company, and the hiring manager asks to see samples of your work. Rather than providing verbal descriptions of your designs or printouts of various pages, you can provide a single Web address that houses live samples of all your best work. The hiring manager can peruse your designs during the interview or at her convenience. A Web portfolio also allows you to provide samples of your skills when applying for a job, before hiring managers choose whom they will invite for interviews. This preview of your work may win you an interview and an advantage over other applicants for the job.

Lab 2-1: Creating a Web portfolio

In this lab, you will begin creating a basic Web design portfolio. This site will serve as a central online location from which you can link your best Web work.

1. From the C:\CIW\Web_Dsgn_Spec\LabFiles\Lesson01\Lab_1-1\ folder, copy the XHTML document you created in the previous lesson's Lab 1-1 (CIWskills.htm) plus the related image files, and save them to your C:\CIW\Web_Dsgn_Spec\LabFiles\ Lesson02\Lab_2-1 folder.

2. From the \Lesson01\OptLab_1-1\ folder, copy the XHTML document you created in the previous lesson's Optional Lab 1-1 (MyResume.htm) plus the related image file, and save it to your Lesson02\Lab_2-1 folder.

Note: Completed example versions of these files (CIWskills[completed].htm and Resume.htm), along with the related image files, are provided in the \Lesson02\Lab_2-1\Completed\ folder. You can use these files for this lab if you did not create your own files in the earlier labs. However, you should use your own personalized versions of these pages if you completed them.

3. Notepad: Use a text editor to create a new XHTML document. Save the document as MyPortfolio.htm to your C:\CIW\Web_Dsgn_Spec\LabFiles\Lesson02\Lab_2-1 folder.

4. Create a structure for the page using the basic XHTML elements.

5. Use your name as the title and as an <h1> header on the page.

6. Add an <h2> heading that reads Web Design Portfolio.

Page 11: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

Lesson 2: Web Development Teams 2-11

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

7. Create links from this page to CIWskills.htm and MyResume.htm (the XHTML documents you created in the previous lesson and copied to the \Lesson02\Lab_2-1 folder in Steps 1 and 2). Provide a short description of each document to which you link.

Note: Always be sure to use the correct syntax when creating hyperlinks to other pages. If you reference files by different names, or directory locations other than the same folder in which you save this page, you must adjust your hyperlink syntax accordingly.

8. Save MyPortfolio.htm.

9. Browser: Open the file MyPortfolio.htm in your browser. Figure 2-4 shows an example of how your portfolio page might look at this point.

Figure 2-4: Simple Web design portfolio

10. Browser: Test the hyperlinks to your résumé and to the CIW Skills page to be sure they work properly. Do both documents appear as they should? If they do not appear, check that you have entered the correct file names, and that the link syntax is correct for each file's directory location. Do the images appear in each document? Remember that any image files used in a page must also reside at the same location as the XHTML file.

11. Notepad: Compare the code you wrote to the example code used to create the portfolio page shown in the preceding figure. The example code is provided in the file Portfolio(completed).htm in the C:\CIW\Web_Dsgn_Spec\LabFiles\ Lesson02\Lab_2-1\Completed\ folder. Following is the Portfolio(completed).htm code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

Page 12: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

2-12 Web Design Specialist

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

<head> <title> Samson P. Lang </title> </head> <body> <h1> Samson P. Lang </h1> <h2> Web Design Portfolio </h2> <p/> <ul> <li> <a href="Resume.htm"> My Resume </a> </li> <li>A Basic Web Page: <a href="CIWskills(completed).htm"> CIW Skills </a> </li> </ul> </body> </html>

12. Now that you have a basic and functioning Web portfolio page, make it your own. Add graphics, use different fonts and colors, and add other information about yourself. Personalize your portfolio to express your skills, design sensibilities, personality and professionalism.

Your Web Design Business Whether you are an entrepreneur, a freelance contractor, or part of a corporate Web design team, the success of your Web design business is rooted in your firm understanding of the skills and knowledge required, your diligence in planning and execution, and your willingness to keep your skills up to date.

Throughout this course, you will learn skills and practices that will allow you to expertly perform Web design tasks. This section provides a brief introduction to the purpose of Web design, the nature of good and bad Web sites, and the importance of good writing skills.

Business sense Before you ever type a tag, you should understand that a Web site is part of a business's marketing effort. Marketing is essentially presenting your product to potential customers in such a way that they want to buy it, and they want to buy it from you instead of from someone else.

A Web site should communicate your client's central message. The central message informs the audience about the purpose of the Web site (and the purpose of the business or individual to whom the site belongs). For example, the central message of Staples (www.staples.com) is that the company is an office-supply retailer. The central message of the Shark Foundation (www.shark.ch/) is that the organization is a scientific research and preservation foundation dedicated to the protection and study of sharks.

The purpose of your job as a Web designer is to effectively communicate your client's central message.

Know your client and your focus To design an effective Web site, you must determine what your client needs. A client may come to you with an idea of what he wants his Web site to say, but you should clearly understand the client's central message before you begin your work.

Page 13: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

Lesson 2: Web Development Teams 2-13

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

You will need to apply listening and discernment skills in order to clarify the central message in your own mind. Listen carefully to what the client says, apply your own good judgment and common sense, and if necessary, help the client verbalize his goals for the Web site. If you are still unsure about the central message, attend a focus group or work closely with members of the marketing or sales teams to get a clear understanding of what the Web site needs to communicate.

After you have outlined the specific goals of the Web site, you should determine how success will be measured and evaluated.

Know your audience In order to make a Web site useful to visitors, you must know who the visitors are: How do they find what they want? What stimulates their interest? How do they like to interact?

You must identify the type of visitors you are trying to reach. For example, are you marketing snowboards to teenagers and young adults, computer hardware to IT professionals, or health care options to the elderly?

After you have identified the type of visitor to whom you are marketing, you must keep that visitor in mind as you design your site so that your site will be appealing and useful to him. For example, a Web-savvy business professional might demand a well-designed site that offers search capabilities and a streamlined online checkout process. A visitor with an IT background might prefer a site that offers online chat with a customer service representative or that provides user forums and newsletters.

On the other hand, many older people are somewhat uncomfortable using the Internet and distrustful of online payment processing. They may prefer to speak to a customer service representative via telephone, and therefore will want to see telephone numbers as part of the contact information on the site.

The good, the bad and the ugly Throughout this course you will learn the principles of effective design, including the use of font, color, spacing, graphics and other elements. Your understanding of flow and how the eye moves across the page will help you lay out pages that capture interest and move users to the places you want them to go (whether that be to a page where they can place an online order to or a page where they can find contact information).

This section provides a brief overview of what makes a Web site good, or not so good.

Good design: Fast and easy You have little space and time to convince visitors that they want what you have. Essentially, visitors look for a summary of what the site is about, and they want to find it quickly and easily.

Visitors do not read Web pages — they scan them, picking out individual words and sentences. To help a visitor "get" the central message quickly, many designers structure page text so that it is easy for visitors to scan. Highlighted keywords, meaningful subheadings and bulleted lists are ways to capture visitors' attention and help them find the information they are looking for.

To capture a visitor's interest, a good designer conveys the central message in the first two paragraphs of the page and makes sure that all subheadings, paragraphs and bullet points start with information-carrying words that users will notice as they scan the page.

Page 14: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

2-14 Web Design Specialist

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Effectively designed pages:

• Feature crisp, concise text (limiting the word count to half of what would be used in conventional writing).

• Include one idea per paragraph.

• Include search engine keywords in the main portions of text.

• Convey the central message using the inverted-pyramid writing style (that is, the conclusion is presented at the top of the page, followed by supporting information).

Simplicity Although a stunning Web site may draw in visitors initially, a Web site that is simple to use will keep users coming back.

Navigating a Web site should be easy. Each page should include a navigation bar directing users to major parts of the site. The site should provide multiple ways to navigate back to the home page so that users can start over if they get lost.

Bad design: Poorly planned navigation Although a great deal of the criteria for evaluating a Web site is subjective, there are some elements that simply make a Web site bad. Poorly planned or insufficient navigation is one of them. If a visitor gets lost while trying to navigate your site, or while trying to make an online purchase or locate your store hours, he may simply leave and not return.

Another element that can render your site ineffective or unappealing is meaningless text. The use of a promotional writing style that makes exaggerated claims (e.g., "The hottest deals ever!"), should be avoided, as it forces users to hunt for the facts.

Ugly Web sites It is worth mentioning that there are a number of ugly yet highly successful Web sites. Although this seems to go against the principles of good Web design, consider the type of marketing message these sites convey: You can trust us. We are a small business and we concentrate our efforts on customer service, not on marketing and developing a snazzy Web site.

The unpolished appearance of a Web site can make people feel as if they are interacting with real individuals — Henry the shoemaker, or Joe the garage mechanic — as opposed to dealing with an impersonal corporation with a slick Web presence. The perception here is you may not be able to trust an impersonal Web site, but you can trust a "real" person.

The success of this approach depends upon the target audience. Web-savvy visitors would most likely be unimpressed with a simplistic site, but a large population of Internet novices might find a certain level of comfort dealing with Joe the mechanic, who knows he has to have a Web site but really knows very little about all this Internet stuff.

Here the perception is that Joe and his Web site visitor share a common ground — they both have to use the Internet (Joe to find customers, and the site visitors to find a mechanic), but all Joe is really interested in is repairing cars, and all his visitors are interested in is finding a trustworthy person who can repair their brakes and mufflers.

Writing The importance of good writing skills in Web design cannot be overstated. After all, your Web pages should engage your audience in a conversation and should communicate, inform, and even lead visitors to take action (such as ordering a product).

NOTE: If time permits, visit

www.webpages thatsuck.com to

view some

examples of bad

Web sites. Despite

the somewhat

inappropriate

name, this site

provides valuable

lessons for anyone

learning about Web

design.

Page 15: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

Lesson 2: Web Development Teams 2-15

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Effective wording To be an efficient and successful Web designer, you must be able to use words effectively. The wording on your pages (or in your HTML e-mail messages) communicates your company's central message. Do not waste the user's time. Use words that carry information and communicate efficiently.

Words are labels and can be more effective than icons for site navigation. Words in navigation allow visitors to see where they are, where they can go and what they can do.

If your writing skills are not as good as they should be, ask one or two team members (perhaps from the Editing or Marketing departments) who possess excellent writing and communication skills to review and edit your copy before you post it to the Web site.

E-mail marketing campaigns Many companies engage in HTML e-mail marketing campaigns, and this responsibility may fall to you as a Web designer. An HTML e-mail marketing message is more than merely an e-mail message sent in HTML format. Like any marketing piece, an e-mail marketing message must convey the central message quickly and concisely. It must also be well formatted and make an impact.

To achieve the desired impact, your e-mail marketing piece should adhere to the following guidelines:

• It should be brief. Try to keep the message to 60 words or fewer.

• It should be aimed at a specific target. Are you marketing an iPod to college students, or a Mercedes Benz to corporate executives? The language and writing style of your message should be geared toward your target audience.

• It should be professional. Make sure to run it through a spelling and grammar check before you send it.

• It should be properly formatted. That is, it should include the following elements:

o Date and time. Most marketing pieces are time-sensitive, so the recipient needs to know the age of the message.

o Greeting.

o Central message in a pithy, well-written statement. While it is acceptable and often appropriate to include an image, your message should not rely solely on the image for relaying a message because most e-mail clients block images unless the recipient specifically opts to display them.

o Action item. The marketing piece is sent for the purpose of eliciting a particular response (such as purchasing an item during a sales event or reserving a seat for a lecture). Tell the recipient what action is required.

o A hyperlink to more details and information.

o Contact information. Providing a name and an e-mail address and/or phone number conveys a message of trust and makes the message more personal.

o An opt-out clause. The courtesy of allowing your recipients to opt out of future mailings demonstrates that you value their time.

OBJECTIVE 4.4.7: Web

marketing

campaigns

Page 16: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

2-16 Web Design Specialist

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

As part of a marketing campaign, your company may provide Webcasts so that customers can get more information about a product or upcoming event. A Webcast is an audio and/or video file that is distributed over the Internet using streaming media technology.

If you want to invite your customers to a Webcast, you will need to include the pertinent details in your e-mail marketing piece. These details include:

• The URL where the Webcast is available and the timeframe during which it is available.

• Simple instructions for accessing and viewing/downloading the Webcast. You might also want to include a toll-free telephone number users can call for technical assistance with viewing the Webcast, if your company provides such resources.

• Minimum system and browser requirements, including any required plug-ins, and links for obtaining the plug-ins.

• Details about any information that will be requested from Webcast participants, such as a user name. You should explain what data will be collected and how it will be used.

At all times, you should keep the process as simple and user-friendly as possible.

Keeping your skills up to date Web technology is always evolving, and it is important that you keep your skills up to date. Taking the time to truly learn your craft and learn how to use the available tools is a good start. Web design, however, is a continual process of learning. Keep an open mind and be willing to learn new styles and techniques.

Here are a few ways you can stay apprised of current trends and technologies:

• Subscribe to an industry newsletter or magazine.

• Subscribe to a few high-quality news feeds or visit sites that focus on the latest industry news.

• Build a network of other skilled professionals with whom can you can share knowledge, or join a forum.

• Frequent successful Web sites, try to discern what makes them successful, and look for ways to apply similar techniques to your own sites and pages.

Page 17: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

Lesson 2: Web Development Teams 2-17

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Case Study Herding Cats Everyone in the staff meeting agreed the idea was great. Cat's Meow Pet Store would create a mini Web site to promote its spring kitten sale, which would start in two weeks. As the company's only Web technician, Carmen tried to ask questions, but the VP leading the meeting dismissed the topic, saying, "You are the Webmaster, Carmen, just go for it."

Raj from marketing told Carmen to let him know how he could help. When Carmen followed up with him later, however, Raj said he did not have time to talk about it but he could review Carmen's designs. Jeanne, the graphic artist from advertising, was not at the staff meeting, and had heard nothing about the mini site when Carmen asked her for graphics. Jeanne was so busy designing the newspaper inserts for the next month that she could not help Carmen anyway.

Shirley, the office administrator, asked Carmen how the Web site was coming along. When Carmen said she had made very little progress, Shirley offered to help. She recruited Jonas, the VP's executive assistant, to help write some text for the Web pages, and Shirley herself volunteered to take digital photos of some kittens that would be for sale. Carmen was relieved to have some help and began setting up some Web pages.

By the end of the week, Carmen had designed some page layouts and was ready to incorporate content. Shirley provided some digital photos, but the photos were mostly poor quality and large file sizes. Jonas had written a few lines of text for the site, but he was busy performing his own duties and could not contribute more. Raj from marketing looked at Carmen's page designs and asked if this was all she had. He pointed out that the designs did not really match the company's usual look and feel, then he was called away to an appointment. Jeanne, the graphic artist, said, "What Web site?"

At the next staff meeting, the VP asked about the kitten sale Web site. Carmen said she had made little progress and did not have enough resources. The VP frowned and said, "But Carmen, you are the Webmaster. Just go for it. What resources could you need?"

* * *

Consider this scenario and answer the following questions.

• In what ways does this scenario demonstrate the importance of project management? Methodologies? Team-based development?

• How could Carmen have served as a better project manager for this Web development project? Who else might have been an appropriate project manager?

• The pace of a Web development project is often frantic. Can you think of ways that a Web professional such as Carmen could "just go for it" and quickly develop a basic but acceptable site in a situation where resources are tightly limited?

• In some companies, an individual Web development professional may be responsible for serving many roles and performing multiple tasks in Web development. How might a Web site benefit from this situation? How does it suffer?

Page 18: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

2-18 Web Design Specialist

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Lesson Summary

Application project Developing a good Web site requires skills that extend far beyond technology. For a Web development project to succeed, you need people with expertise in management, visual design, writing, marketing and technology, as well as people who can observe, analyze, plan, empathize and think creatively about possibilities from a variety of perspectives.

How many of these skills do you think you could contribute to a Web team, and which ones?

If time permits, try this activity with a group of friends. Suppose that this group of people will form a Web development team. Determine who can contribute which required skills to the team. Be sure to note who can contribute more than one skill and what all those skills are. Allow team members to advise the group about any skills they possess that are not specified in this lesson but that they think might be useful to a Web project. The team can decide whether to include any such skills.

Now analyze the list of skills you have covered by your team. Which skills are more commonly available on your team? Which skills are in short supply?

Now suppose your company just reduced funding to your Web development project, and you have to reduce your team by one member…by two members…by three members. If your remaining team members are required to contribute two or three separate skills to the project, which skills become more important to retain? Consider this activity when making decisions about the skills you want to use in your work and the skills you want to acquire as you pursue a career in Web development.

Skills review In this lesson, you learned about team-based Web development and the various skills that need to be present in a well-rounded Web team. You learned about the wide range of skills that a Web designer is expected to possess, and about the importance of project management and Web development methodologies. You also saw examples of collaboration tools that can help make your team more productive and efficient. Finally, you learned about Web design portfolios and you began the process of building your own.

Now that you have completed this lesson, you should be able to:

9 1.1.1: Identify job responsibilities and tasks of a Web designer or Web development team member.

9 1.1.2: Develop and update your Web design portfolio with demonstration pages and sites.

9 1.1.3: Define the collaborative nature of a Web development project.

9 1.1.13: Identify Web site characteristics (e.g., interactivity, navigation, database integration) and the project resources they require.

9 4.4.7: Identify elements of a successful Web marketing campaign (e.g., working with marketing team members to determine audience and central message, creating HTML e-mail messages with images, scheduling Webcasts).

Page 19: 2Lesson 2: Web Development Teams...2Lesson 2: Web Development Teams Objectives By the end of this lesson, you will be able to: ¬ 1.1.1: Identify job responsibilities and tasks of

Lesson 2: Web Development Teams 2-19

© 2013 Certification Partners, LLC — All Rights Reserved Version 1.1

Lesson 2 Review

1. Why does the composition of a Web team often change from one project to the next?

2. Name some of the tools that make it possible for Web teams to be geographically disbursed and still work closely together.

3. What Web development team member is responsible for gathering client requirements and managing resources?

4. What Web development team member converts requirements into a blueprint for the development of the Web site?

5. What are the goals of a Web development methodology?