Web Site Development Life Cycle

In the traditional “waterfall” model of system development, each phase must be completed before a subsequent phase can commence. Although web development is not generally as straightforward as this diagram makes it look, we still need to understand each phase individually before we can understand how they fit together for a web design project.

development-life-cycle

Feasibility

  1. Purpose

    Deciding whether a web site is needed, or whether an existing web as interviewing the organization’s site needs modification. If “yes” determining rough costs and benefits.

  2. Principal Tools

    Fact-gathering techniques such as interviewing the organization’s management and proposed visitors.

    Cost-benefit analysis that ascertains whether the benefits are worth the associated costs.

Analysis

  1. Purpose

    Determining the purpose, target audience, and proposed content and functionality for the entire site. In short, deciding what is needed.

  2. Principal Tools

    Fact-gathering techniques.

    Cost-benefit analysis.

    Preliminary site architecture models.

Design

  1. Purpose

    Designing a site (both organizationally and visually) that fulfills the requirements determined in the analysis phase. In short, creating a “how” that provides the “what” from the analysis phase.

  2. Principal Tools

    Site architecture models.

    HTML, CSS, JavaScript, and integrated web development environments (such as Adobe Dreamweaver) for site prototyping.

    Image editors such as Adobe Photoshop or Fireworks for creating site graphics.

Construction and Testing

  1. Purpose

    Building and testing the web site. (Note that construction and testing can’t be separated into independent phases, since testing should begin as soon as the first few lines of code are written. That way, problems are identified early in the process, rather than at the end when the entire site might end up needing major modifications to correct those problems.)

  2. Principal Tools

    HTML, CSS, JavaScript, and integrated web development environments (such as Adobe Dreamweaver) for site prototyping.

    Image editors such as Adobe Photoshop or Fireworks for creating site graphics.

    Accessibility validators.

    Live testing with prospective visitors.

Launch

  1. Purpose

    Uploading the site to the server, performing final site-wide tests, and bringing the site live.

  2. Principal Tools

    FTP or its equivalent.

Maintenance

  1. Purpose

    Repairing, upgrading, and overhauling the system as necessary.

  2. Principal Tools

    All of the tools mentioned in the prior phases.

Yes, we do still follow the waterfall model for the high-level process of web design; most of the overall site analysis and design is indeed done before much construction begins. But the construction and testing phase also includes tasks normally included in the independent analysis and design phases. This is because much of the analysis and design for individual pages is deferred until the construction and testing phase for those pages, since every page has unique requirements that often can’t be ascertained until it’s under construction.

The result is that each page requires its own miniature life cycle.

Each page is represented by a concentric circle, and each page progresses through its own analysis, design, and construction and testing phases. Now, all of the phases are tightly coupled with all of the other phases. Thus, to put a fine technical sheen on it, building a web site is iterative and recursive instead of rigidly sequential.

The iterative nature of web site construction also means that sometimes we need to revisit a page that we thought we had already completed. As a result, we often move backward, not just forward. For instance, several pages might be so closely related that none of them can be finalized until all of them are finalized, as would be the case with the multiple pages of a shopping-cart application. All in all, creating a web site is indeed a spiraling, reiterative process.

Translations

Dutch (language by Johanne Teerink)
Serbo-Croatian (language by Anja Skrba)

There have been 4 comments | Subscribe to Comments | Jump to Form »

Brian Cray

Really good article here. I always appreciate articles that take a strategic approach to website design. Cheers!

1

Mert TOL

@ Brian Cray :

Really good article here. I always appreciate articles that take a strategic approach to website design. Cheers!

Thank you Brian, I’m glad to you liked this article. See you around!

2

Sindhoo

You done great job. Its really very helpful thanks a lot.

3

Anthony

Im taking a project development class and I came across this article, all I got to say is…THANK YOU. This has helped me understand the Waterfall model a whole lot more. It gives more insight on the more important stuff reguarding the model. Thanks.

4

Post Comment on This Article

Your e-mail address won't be published. If you simply add some value to the original post and stay on the topic, your comment will be approved.

You can use Textile parameters on your comments. For example: _italic_ *bold* bq. quated text "link text":URL — Get your own picture next to your comment with a Gravatar account.