Lesson 1

The term "Website Development Process Model" isn't as widely used as other terms like "website development lifecycle" or "web development methodology," but the concept definitely exists. It essentially refers to a structured approach for building websites, outlining the various stages and activities involved.
Here is why you might not encounter the exact term often:

• Variety of terms: The web development world uses a range of established terms to describe the overall process, like SDLC (Software Development Life Cycle), web dev methodology, or simply "website development process." "Website Development Process Model" might be used in specific contexts or by certain organizations.
• Focus on specific methodologies: Many popular web development methodologies, like Agile, Waterfall, or Lean, already define their own process models. These methodologies often have dedicated names and are widely recognized, overshadowing the generic "Website Development Process Model" term.

However, regardless of the terminology, the core idea remains the same: having a defined framework for website development. This framework typically involves stages like:

1. Planning and discovery: Defining goals, target audience, and website features.
2. Information architecture and Wireframing: Creating sitemaps, user flows, and low-fidelity layouts.
3. Design: Visualizing the website's look and feel, including branding and user interface.
4. Content creation and assembly: Writing, editing, and optimizing website content.
5. Development: Coding the website using chosen technologies and frameworks.
6. Testing and review: Ensuring functionality, responsiveness, and cross-browser compatibility.
7. Deployment and launch: Making the website live and accessible to users.
8. Maintenance and updates: Ongoing monitoring, bug fixing, and feature enhancements.

While you might not hear "Website Development Process Model" frequently, the concept itself is very much alive and well in the web development world. It's just that different people and organizations might use different terms to describe it.

By now you should be comfortable using the Web Interaction Model as a means for describing the complex dynamics that occur during a Web transaction. But who enables these dynamics? How does a Web site get built? This module focus shifts to the Web design process by introducing you to the Website Development Process Model, a framework for overseeing the successful design and development of a Web site project. Although it is not the only model for website development, it is one that can help you understand how a design team can plan and account for the complexities of a Web site development project.
You will probably recognize a lot of the terminology used by this process model. As with so many aspects of the Web, the development process is constantly changing, and changing at a rate faster than new language can be invented. So, the terminology is a hybrid of terms from various fields, including

1. advertising,
2. marketing,
3. software development, and
4. publishing.

The terms in this course reflect current usage by Web development professionals.

By the end of this module, you will be able to:

1. Define the six phases of the Web site development process
2. Define the key elements of the process
3. Define the role categories and how they are associated with specific jobs
4. Describe how specific tasks are organized
5. Describe how activities map to achieving specific objectives

The next lesson defines the six phases of the Web site development process.

Designers have been using grids for alignment and content organization since the early days of graphic design, and grid systems have become a useful tool for web designers as well.
A grid is an invisible foundation that divides the page into equal units that can be used to determine where columns, headlines, images, and so on, should fall. Sticking to grid units not only ensures that your content will be proportional, but it can make design decisions go more quickly. Many CSS grid frameworks have emerged to help streamline the design and development process. Perhaps the most well known is the 960 Grid System (960.gs), which divides a 960-pixel-wide page into either 12- or 16-column units.

1. Blueprint (www.blueprintcss.org) and
2. BlueTrip (bluetrip.org)

are based on similar fixed-width grids.
With the emergence of mobile, we are beginning to see responsive grid systems, including

1. the 1140 CSS Grid (cssgrid.net),
2. Skeleton (getskeleton.com), and
3. Bootstrap from Twitter (twitter.github.com/bootstrap).

This is a short reference of the CSS frameworks available as of this writing, and this list is the tip of the iceberg.
Conduct a web search to find the latest CSS Frameworks. Using a framework requires solid HTML, Javascript and CSS comprehension, but once you have a solid understanding, they may save you time. The downside is that the code tends to be more bloated than when designed from scratch, and you may be downloading more files than necessary. For this reason, some designers use frameworks to speed up the design process but create custom code for the final site production.