The document outlines the website development process, highlighting essential stages such as planning, design, construction, and maintenance. It emphasizes the importance of understanding the user's perspective and adhering to design conventions for effective website functionality. Furthermore, it provides practical tips on organizing files, using web design tools, and utilizing various web development languages.

1. introduction why examples
Website Development
by
by
Dr. Preeti
Dr. Preeti

2. introduction why examples
• Involves the following Stages
– Site definition and planning
– Information architecture
– Site design
– Site construction
– Site marketing
– Tracking and maintenance
The Website Development Process

3. introduction why examples
What is a Web site?
A web site is:
A web site is:
• a presentation tool;
• a way to communicate;
• a learning tool;
• a teaching tool;
• a marketing important
tool;

4. introduction why examples
Step 1
• Think!
– Before you do anything else, you need to
spend time thinking about the 4w’s.
• What is the purpose of the web page/site?
• Who is your target audience?
• What will bring your audience back?
• Where will your audience be using the site?

5. introduction why examples
Step 2:Follow The Rules
– To create a we site you must follow theses rules:
• Rule 1:
Rule 1: YOU are NOT the USER.
YOU are NOT the USER.
– What you understand is not what a user will understand; ask the
users to design the site the way they want.
• Rule 2:
Rule 2: USERS are NOT PROFESIONALS
USERS are NOT PROFESIONALS
– Users will not think carefully about the new added features in the
Web site without your directions.
• Rule 3:
Rule 3: Give the common user a little control
Give the common user a little control
– Allow the user some choices and the ability to control color and
themes on their accounts.

6. introduction why examples
Step 2:Follow The Rules
Rule 4:
Rule 4: Make sure the visual contents of a site relates to its function.
Make sure the visual contents of a site relates to its function.
 A nice-looking design must enforce the website functionality
Rule 5:
Rule 5: Respect GUI and Web interface conventions.
Respect GUI and Web interface conventions.
 Designers need to respect conventions of navigation choices,
navigation placement, colors, and so on.
Rule 6:
Rule 6: Know and respect the Web and Internet medium constraints.
Know and respect the Web and Internet medium constraints.
• Don’t ignore the differences in the emerging Web medium, color
reproduction, bandwidth limitations, and so on.

7. introduction why examples
Step 3
• Go on a Roundup.
– Locate images, files, animations, etc. that you
might use and place them in your www directory.
It is important that all files be in the same folder.
It is important that all files be in the same folder.
– If you are going to work at home or some place
other than the university computer lab, create a
www directory on the hard drive, USB drive or
whatever.

8. introduction why examples
Step 4
• Open Website designing tools like
Dreamweaver , FrontPage , SeaMonkey
Dreamweaver , FrontPage , SeaMonkey,…and
start designing your web pages.
• Save your work often!!!!!!!!
– Typically we name the home page in a web site
“index.html
index.html”

9. introduction why examples
Some Things to Remember
• You do not have the layout control in a web editor that you do
in Word or PowerPoint.
• Therefore, the web designers used tables
tables to control the layout
out of their pages. If you set the borders of the table to 0
width, you can't see the outline of the tables in the web
browser.
You will get very frustrated if
You will get very frustrated if
you try to design a web page
you try to design a web page
without tables.
without tables. Your graphics will
Your graphics will
not appear where you want them.
not appear where you want them.

10. introduction why examples
Note:
Note:
Naming Web Files:
• Use all lower case (it will be easier to communicate the URL to
others if it is all lower case).
• DO NOT have spaces in file names (some old browsers cannot
handle spaces. You should rename graphic files if they have
spaces)
• Try to keep file names as short as possible (this prevents
errors in typing in URLs)
• URL(Universal Resource Locator)= Site Address
ex: URL of hotmail is : www.hotmail.com

11. introduction why examples
Types of Web Pages
Any web site composed from a set of web pages:
Some of those pages are static (abstract) pages
static (abstract) pages while other pages are
dynamics (proactive) pages.
dynamics (proactive) pages.
A dynamic page that will
take user name and
password and check it to
allow login.
A static page with no
interaction that user will
only read and close if.

12. introduction why examples
Web Development Languages & Tools
1. HTML
HTML/DHTML/XHTML
2. Java
3. Web Design Tools e.g. Frontpage
Frontpage, Dreamweaver.
3. Scripting Languages e.g. VBScript, Javascript
4. Cascading Style Sheets
5. XML
6. …more!!!
12

13. introduction why examples
Let’s go to build a website
• Use pre-designed templates.
• Download lovely icons, backgrounds and images from the internet.
• Use pre-programmed scripts.