Web Development Process
Website Life Cycle
Design: This is the initial planning phase, which includes several sub-steps.
Implementation: This involves creating the actual website.
Maintenance: This is an ongoing process of updating information and ensuring the website
remains current. The website requires continuous monitoring.
Revision: At some point, the website may need to be redesigned and reimplemented, leading
back into the maintenance cycle.
Phase One: Design - Basic Steps
1. Define the Goal:
The website needs a clear purpose.
State the goal explicitly, starting with "The goal of this website is/will be to..."
1. Set the Scope:
Define the boundaries of the project.
Specify what the website will include and, more importantly, what it will not include.
Example: "Students will use this site as a portal for all information and resources for class."
1. Identify the Target Audience:
Determine the primary target audience.
Consider secondary and tertiary audiences.
The target audience influences the content and design of the website.
Example: Primary audience - Students enrolled in CSIS 1664.
A website for a creche will have a different target audience and feel than a website for a
commercial bank.
1. Identify Content Items and Sources:
Brainstorm all possible content items (small pieces of information).
Analyze and filter the brainstorm list, deciding what to include and exclude based on the
scope.
Group the remaining content items into categories.
Determine the source of each content item (existing electronic format, needs to be written,
available on the internet).
Distinguish between text and images/visuals.
For images, consider taking your own pictures to avoid copyright issues.
1. Develop a Sitemap:
Illustrate how the pages will be connected and navigated.
Focus on making information easily accessible.
Structure Types:
1. Create a Sketch/Wireframe:
Create a basic layout visualizing the design of critical pages.
Linear: Pages must be visited in a specific order. Suitable for step-by-step instructions.
Hierarchical: From the homepage, you can go to various pages, but from those pages, you
must return to the homepage to navigate to other sections.
Mixed: Combines hierarchical and linear structures.
Network: Many pages link to other pages in a non-regular way. Common for large sites like
news portals.
Web-like: From the homepage, you can navigate to all other pages, and from those pages,
you can navigate to any other page.
Focus on a common look and feel across pages.
The homepage may differ slightly.
1. Create Critical Pages:
Develop page templates containing elements common to all pages (navigation, logo, footer).
Create a prototype with placeholder content (e.g., lorem ipsum text).
Present the prototype to the client for approval.
Once approved, start actual website creation.
Practical 1 Worksheet
Rename the document: practical1_surname_initials.docx
Questions:
1. Initials, surname, and student number.
2. Website Design:
Topic/Subject of your website.
Purpose/Goal of your website ("The goal or purpose of this website will be to...").
Personal reason for developing the website.
Primary and secondary target audiences.
List of all possible content items (use strike-through font for items to be excluded).
Group content items into six categories/pages (content items must come from the list in 2.5,
page topic cannot be an item from 2.5).
Text Content Sources: What do you already have, what will you have to write, what will you get
from the web?
Image/Visual Resource Sources: What do you already have, what will you have to create, what
will you get from the web?
1. Website Structure:
Which structure will you use (homepage + six pages)?
Why?
Diagram of the sitemap (can be drawn using shapes in MS Word, Google Drawings, or hand-
drawn and photographed).
1. Search Exercise:
Search engine used.
Exact search terms used.
Screen capture of the search engine's result page.
For the first three non-sponsored links: Website Name, URL, Relevance (percentage-wise).
Reflection: What did you learn from the search exercise? What new ideas did you get for your
website?
Submission: Submit the completed Word document on Blackboard.
Important Notes
Attendance is compulsory. Sign the attendance register only after the demonstrator checks
your work.
If you leave before signing, you will receive a zero.
No class on Thursday due to a conference.
Prepare for Monday's class by watching the provided videos for Lecture 1 and Lecture 2 of
Unit 2.
