SlideShare a Scribd company logo
Web Designing Kit
The Web Site Design and Development Process
• There are numerous steps in the web site design and development
process. From gathering initial information, to the creation of your web
site, and finally to maintenance to keep your web site up to date and
current.
• Information Gathering

• Planning
• Design
• Development
• Testing and Delivery
• Maintenance
Phase One: Information Gathering






The first step in designing a successful web site is to gather information.
Many things need to be taken into consideration when the look and feel
of your site is created.
This first step is actually the most important one, as it involves a solid
understanding of the company it is created for.
It is important that web designer start off by asking a lot of questions to
help them understand your business and your needs in a web site.
Certain things to consider are:
•

Purpose
What is the purpose of the site? Do you want to provide information, promote a
service, sell a product… ?

•

Goals
What do you hope to accomplish by building this web site? Two of the more
common goals are either to make money or share information.

•

Target Audience
Is there a specific group of people that will help you reach your goals? It is helpful
to picture the “ideal” person you want to visit your web site. Consider their age,
sex or interests – this will later help determine the best design style for your site.

•

Content
What kind of information will the target audience be looking for on your site? Are
they looking for specific information, a particular product or service, online
ordering…?
Phase Two: Planning

Using the information gathered from phase one, it is time to put
together a plan for your web site. This is the point where a site map is
developed.

The site map is a list of all main topic areas of the site, as well as subtopics, if applicable.
 This serves as a guide as to what content will be on the site, and is
essential to developing a consistent, easy to understand navigational
system. The end-user of the web site – aka your customer – must be kept

in mind when designing your site.
 These are, after all, the people who will be learning about your service or
buying your product. A good user interface creates an easy to navigate
web site, and is the basis for this.
 During the planning phase, your web designer will also help you decide

what technologies should be implemented. Elements such as interactive
forms, ecommerce, flash, etc. are discussed when planning your web site.
Phase Three: Design

•

Drawing from the information gathered up to this point, it’s time to determine
the look and feel of your site.

•

Target audience is one of the key factors taken into consideration. A site aimed at
teenagers, for example, will look much different than one meant for a financial

institution. As part of the design phase, it is also important to incorporate
elements such as the company logo or colors to help strengthen the identity of
your company on the web site.
•

Your web designer will create one or more prototype designs for your web site. This is
typically a .jpg image of what the final design will look like. Often times you will be sent an
email with the mock-ups for your web site, while other designers take it a step further by
giving you access to a secure area of their web site meant for customers to view work in
progress.

•

Either way, your designer should allow you to view your project throughout the design and
development stages. The most important reason for this is that it gives you the opportunity
to express your likes and dislikes on the site design.

•

In this phase, communication between both you and your designer is crucial to ensure that
the final web site will match your needs and taste. It is important that you work closely
with your designer, exchanging ideas, until you arrive at the final design for your web site.

•

Then development can begin…
Phase Four: Development

•

The developmental stage is the point where the web site itself is created. At this time, your
web designer will take all of the individual graphic elements from the prototype and use
them to create the actual, functional site.

•

This is typically done by first developing the home page, followed by a “shell” for the
interior pages. The shell serves as a template for the content pages of your site, as it

contains the main navigational structure for the web site. Once the shell has been created,
your designer will take your content and distribute it throughout the site, in the
appropriate areas.
• Elements such as interactive contact forms, flash animations or
ecommerce shopping carts are implemented and made functional during
this phase, as well.
• This entire time, your designer should continue to make your in-progress
web site available to you for viewing, so that you can suggest any
additional changes or corrections you would like to have done.
• On the technical front, a successful web site requires an understanding of

front-end web development. This involves writing valid XHTML / CSS code
that complies to current web standards, maximizing functionality, as well
as accessibility for as large an audience as possible.
• This is tested in the next phase…
Phase Five: Testing and Delivery

•

At this point, your web designer will attend to the final details and test your web
site. They will test things such as the complete functionality of forms or other
scripts, as well last testing for last minute compatibility issues (viewing differences
between different web browsers), ensuring that your web site is optimized to be
viewed properly in the most recent browser versions.
•

A good web designer is one who is well versed in current standards for web site design and
development. The basic technologies currently used are XHTML and CSS (Cascading Style
Sheets). As part of testing, your designer should check to be sure that all of the code written
for your web site validates. Valid code means that your site meets the current web
development standards – this is helpful when checking for issues such as cross-browser

compatibility as mentioned above.
•

Once you give your web designer final approval, it is time to deliver the site. An FTP (File
Transfer Protocol) program is used to upload the web site files to your server. Most web
designers offer domain name registration and web hosting services as well. Once these

accounts have been setup, and your web site uploaded to the server, the site should be put
through one last run-through. This is just precautionary, to confirm that all files have been
uploaded correctly, and that the site continues to be fully functional.
•

This marks the official launch of your site, as it is now viewable to the public.
Phase Six: Maintenance

• The development of your web site is not necessarily over, though. One
way to bring repeat visitors to your site is to offer new content or
products on a regular basis. Most web designers will be more than happy
to continue working together with you, to update the information on
your web site. Many designers offer maintenance packages at reduced
rates, based on how often you anticipate making changes or additions to
your web site.
•

If you prefer to be more hands on, and update your own content, there is something

called a CMS (Content Management System) that can be implemented to your web site.
This is something that would be decided upon during the Planning stage. With a CMS,
your designer will utilize online software to develop a database driven site for you.
•

A web site driven by a CMS gives you the ability to edit the content areas of the web

site yourself. You are given access to a back-end administrative area, where you can use
an online text editor (similar to a mini version of Microsoft Word). You’ll be able to edit
existing content this way, or if you are feeling more adventurous, you can even add new
pages and content yourself. The possibilities are endless!

•

It’s really up to you as far as how comfortable you feel as far as updating your own web
site. Some people prefer to have all the control so that they can make updates to their
own web site the minute they decide to do so. Others prefer to hand off the web site
entirely, as they have enough tasks on-hand that are more important for them to
handle directly.
• That’s where the help of a your web designer comes in, once again, as
they can take over the web site maintenance for you – one less thing for
you to do is always a good thing in these busy times!
• Other maintenance type items include SEO (Search Engine Optimization)
and SES (Search Engine Submission). This is the optimization of you web
site with elements such as title, description and keyword tags which help
your web site achieve higher rankings in the search engines. The
previously mentioned code validation is something that plays a vital role in
SEO, as well.
• There are a lot of details involved in optimizing and submitting your web
site to the search engines – enough to warrant it’s own post. This is a very
important step, because even though you now have a web site, you need
to make sure that people can find it!

More Related Content

PPT
Web Design by Client Perspective
PDF
Web Design
PDF
Web Design and Development Life Cycle and Technologies
PPT
Gsc awd 1_web_developmentlifecyclefrombegtoendpowerpoint
PDF
What is a website builder
PPT
Web Development Life Cycle
PPT
Website designing company in mumbai
PDF
Design Your Imagination
Web Design by Client Perspective
Web Design
Web Design and Development Life Cycle and Technologies
Gsc awd 1_web_developmentlifecyclefrombegtoendpowerpoint
What is a website builder
Web Development Life Cycle
Website designing company in mumbai
Design Your Imagination

What's hot (19)

PDF
Web Development Life Cycle - Tihalt
PPT
Website designing company in delhi
PPTX
Web development phases
PDF
Principles of web design
PDF
Website Planner Workbook
PDF
Web designing chapter 01
PDF
Simple Web Design Case Study (Website Design Process Walkthrough)
PDF
Office 365 Administration and IW Home Page UX Explorations
PPTX
thebusinesswebhosting
PPT
Web Usability
PDF
Webs Review And Tutorial
PDF
A Guide to Web Design- Business.com
PDF
5 Factors That Make a Good Website
PPTX
9 Tips for website success
PDF
Solid Web site Design Guidance Any individual Could Utilize
PPTX
Essential Components of an Engaging Blog/Magazine WordPress Website
PDF
Designing Web Experiences - Eyecatch
PPT
PPT
Example
Web Development Life Cycle - Tihalt
Website designing company in delhi
Web development phases
Principles of web design
Website Planner Workbook
Web designing chapter 01
Simple Web Design Case Study (Website Design Process Walkthrough)
Office 365 Administration and IW Home Page UX Explorations
thebusinesswebhosting
Web Usability
Webs Review And Tutorial
A Guide to Web Design- Business.com
5 Factors That Make a Good Website
9 Tips for website success
Solid Web site Design Guidance Any individual Could Utilize
Essential Components of an Engaging Blog/Magazine WordPress Website
Designing Web Experiences - Eyecatch
Example
Ad

Viewers also liked (8)

PPTX
Developers
DOCX
Act academy
PPTX
Copmuter Languages
PPTX
Internet Technology
PDF
Careers in Software Testing
PPT
Financial Accouting
PPTX
HTML (Hyper Text Markup Language)
PPTX
Computer Viruses
Developers
Act academy
Copmuter Languages
Internet Technology
Careers in Software Testing
Financial Accouting
HTML (Hyper Text Markup Language)
Computer Viruses
Ad

Similar to Web Designing Kit (20)

PPTX
Website design and development company
PDF
Website Development Explained (abriged from "The Website Manager's Handbook")
PPTX
7 phases of web development.
PDF
Website designing company in mumbai
PPTX
How to Design Your Own Website.pptx
PPTX
Digital marketing 101 v1.0
PPTX
Digital marketing-101
PDF
What are the Three Main Stages of Web Development?
PPTX
Top 10 Website Designing Hacks for Beginners.pptx.pptx
PDF
The more information Website Design_New.pdf
PDF
What are a website developer and its scope?
PPT
Digital Retail Training Session Two
DOCX
What to Expect When Engaging with a Web Design Service Provider.docx
PDF
How Do I Choose A Website Design and Development Company?
PDF
Website development
PPTX
Website development
PPTX
Step by-step process to create a website
PDF
How to make a great website
PDF
How to Optimize Your Business Website for the Holiday Season
PDF
The Essential Guide to Web Planning
Website design and development company
Website Development Explained (abriged from "The Website Manager's Handbook")
7 phases of web development.
Website designing company in mumbai
How to Design Your Own Website.pptx
Digital marketing 101 v1.0
Digital marketing-101
What are the Three Main Stages of Web Development?
Top 10 Website Designing Hacks for Beginners.pptx.pptx
The more information Website Design_New.pdf
What are a website developer and its scope?
Digital Retail Training Session Two
What to Expect When Engaging with a Web Design Service Provider.docx
How Do I Choose A Website Design and Development Company?
Website development
Website development
Step by-step process to create a website
How to make a great website
How to Optimize Your Business Website for the Holiday Season
The Essential Guide to Web Planning

Recently uploaded (20)

PDF
Unlocking AI with Model Context Protocol (MCP)
PDF
Mobile App Security Testing_ A Comprehensive Guide.pdf
PDF
Machine learning based COVID-19 study performance prediction
PPTX
Big Data Technologies - Introduction.pptx
PDF
NewMind AI Weekly Chronicles - August'25 Week I
PDF
Build a system with the filesystem maintained by OSTree @ COSCUP 2025
PPTX
Cloud computing and distributed systems.
PDF
Spectral efficient network and resource selection model in 5G networks
PDF
Network Security Unit 5.pdf for BCA BBA.
PDF
Advanced methodologies resolving dimensionality complications for autism neur...
PDF
Bridging biosciences and deep learning for revolutionary discoveries: a compr...
PDF
Diabetes mellitus diagnosis method based random forest with bat algorithm
PDF
NewMind AI Monthly Chronicles - July 2025
PDF
Agricultural_Statistics_at_a_Glance_2022_0.pdf
PPTX
Detection-First SIEM: Rule Types, Dashboards, and Threat-Informed Strategy
PDF
Blue Purple Modern Animated Computer Science Presentation.pdf.pdf
PDF
Dropbox Q2 2025 Financial Results & Investor Presentation
PPT
“AI and Expert System Decision Support & Business Intelligence Systems”
PDF
Encapsulation theory and applications.pdf
PDF
Chapter 3 Spatial Domain Image Processing.pdf
Unlocking AI with Model Context Protocol (MCP)
Mobile App Security Testing_ A Comprehensive Guide.pdf
Machine learning based COVID-19 study performance prediction
Big Data Technologies - Introduction.pptx
NewMind AI Weekly Chronicles - August'25 Week I
Build a system with the filesystem maintained by OSTree @ COSCUP 2025
Cloud computing and distributed systems.
Spectral efficient network and resource selection model in 5G networks
Network Security Unit 5.pdf for BCA BBA.
Advanced methodologies resolving dimensionality complications for autism neur...
Bridging biosciences and deep learning for revolutionary discoveries: a compr...
Diabetes mellitus diagnosis method based random forest with bat algorithm
NewMind AI Monthly Chronicles - July 2025
Agricultural_Statistics_at_a_Glance_2022_0.pdf
Detection-First SIEM: Rule Types, Dashboards, and Threat-Informed Strategy
Blue Purple Modern Animated Computer Science Presentation.pdf.pdf
Dropbox Q2 2025 Financial Results & Investor Presentation
“AI and Expert System Decision Support & Business Intelligence Systems”
Encapsulation theory and applications.pdf
Chapter 3 Spatial Domain Image Processing.pdf

Web Designing Kit

  • 2. The Web Site Design and Development Process • There are numerous steps in the web site design and development process. From gathering initial information, to the creation of your web site, and finally to maintenance to keep your web site up to date and current. • Information Gathering • Planning • Design • Development • Testing and Delivery • Maintenance
  • 3. Phase One: Information Gathering     The first step in designing a successful web site is to gather information. Many things need to be taken into consideration when the look and feel of your site is created. This first step is actually the most important one, as it involves a solid understanding of the company it is created for. It is important that web designer start off by asking a lot of questions to help them understand your business and your needs in a web site.
  • 4. Certain things to consider are: • Purpose What is the purpose of the site? Do you want to provide information, promote a service, sell a product… ? • Goals What do you hope to accomplish by building this web site? Two of the more common goals are either to make money or share information. • Target Audience Is there a specific group of people that will help you reach your goals? It is helpful to picture the “ideal” person you want to visit your web site. Consider their age, sex or interests – this will later help determine the best design style for your site. • Content What kind of information will the target audience be looking for on your site? Are they looking for specific information, a particular product or service, online ordering…?
  • 5. Phase Two: Planning Using the information gathered from phase one, it is time to put together a plan for your web site. This is the point where a site map is developed. The site map is a list of all main topic areas of the site, as well as subtopics, if applicable.
  • 6.  This serves as a guide as to what content will be on the site, and is essential to developing a consistent, easy to understand navigational system. The end-user of the web site – aka your customer – must be kept in mind when designing your site.  These are, after all, the people who will be learning about your service or buying your product. A good user interface creates an easy to navigate web site, and is the basis for this.  During the planning phase, your web designer will also help you decide what technologies should be implemented. Elements such as interactive forms, ecommerce, flash, etc. are discussed when planning your web site.
  • 7. Phase Three: Design • Drawing from the information gathered up to this point, it’s time to determine the look and feel of your site. • Target audience is one of the key factors taken into consideration. A site aimed at teenagers, for example, will look much different than one meant for a financial institution. As part of the design phase, it is also important to incorporate elements such as the company logo or colors to help strengthen the identity of your company on the web site.
  • 8. • Your web designer will create one or more prototype designs for your web site. This is typically a .jpg image of what the final design will look like. Often times you will be sent an email with the mock-ups for your web site, while other designers take it a step further by giving you access to a secure area of their web site meant for customers to view work in progress. • Either way, your designer should allow you to view your project throughout the design and development stages. The most important reason for this is that it gives you the opportunity to express your likes and dislikes on the site design. • In this phase, communication between both you and your designer is crucial to ensure that the final web site will match your needs and taste. It is important that you work closely with your designer, exchanging ideas, until you arrive at the final design for your web site. • Then development can begin…
  • 9. Phase Four: Development • The developmental stage is the point where the web site itself is created. At this time, your web designer will take all of the individual graphic elements from the prototype and use them to create the actual, functional site. • This is typically done by first developing the home page, followed by a “shell” for the interior pages. The shell serves as a template for the content pages of your site, as it contains the main navigational structure for the web site. Once the shell has been created, your designer will take your content and distribute it throughout the site, in the appropriate areas.
  • 10. • Elements such as interactive contact forms, flash animations or ecommerce shopping carts are implemented and made functional during this phase, as well. • This entire time, your designer should continue to make your in-progress web site available to you for viewing, so that you can suggest any additional changes or corrections you would like to have done. • On the technical front, a successful web site requires an understanding of front-end web development. This involves writing valid XHTML / CSS code that complies to current web standards, maximizing functionality, as well as accessibility for as large an audience as possible. • This is tested in the next phase…
  • 11. Phase Five: Testing and Delivery • At this point, your web designer will attend to the final details and test your web site. They will test things such as the complete functionality of forms or other scripts, as well last testing for last minute compatibility issues (viewing differences between different web browsers), ensuring that your web site is optimized to be viewed properly in the most recent browser versions.
  • 12. • A good web designer is one who is well versed in current standards for web site design and development. The basic technologies currently used are XHTML and CSS (Cascading Style Sheets). As part of testing, your designer should check to be sure that all of the code written for your web site validates. Valid code means that your site meets the current web development standards – this is helpful when checking for issues such as cross-browser compatibility as mentioned above. • Once you give your web designer final approval, it is time to deliver the site. An FTP (File Transfer Protocol) program is used to upload the web site files to your server. Most web designers offer domain name registration and web hosting services as well. Once these accounts have been setup, and your web site uploaded to the server, the site should be put through one last run-through. This is just precautionary, to confirm that all files have been uploaded correctly, and that the site continues to be fully functional. • This marks the official launch of your site, as it is now viewable to the public.
  • 13. Phase Six: Maintenance • The development of your web site is not necessarily over, though. One way to bring repeat visitors to your site is to offer new content or products on a regular basis. Most web designers will be more than happy to continue working together with you, to update the information on your web site. Many designers offer maintenance packages at reduced rates, based on how often you anticipate making changes or additions to your web site.
  • 14. • If you prefer to be more hands on, and update your own content, there is something called a CMS (Content Management System) that can be implemented to your web site. This is something that would be decided upon during the Planning stage. With a CMS, your designer will utilize online software to develop a database driven site for you. • A web site driven by a CMS gives you the ability to edit the content areas of the web site yourself. You are given access to a back-end administrative area, where you can use an online text editor (similar to a mini version of Microsoft Word). You’ll be able to edit existing content this way, or if you are feeling more adventurous, you can even add new pages and content yourself. The possibilities are endless! • It’s really up to you as far as how comfortable you feel as far as updating your own web site. Some people prefer to have all the control so that they can make updates to their own web site the minute they decide to do so. Others prefer to hand off the web site entirely, as they have enough tasks on-hand that are more important for them to handle directly.
  • 15. • That’s where the help of a your web designer comes in, once again, as they can take over the web site maintenance for you – one less thing for you to do is always a good thing in these busy times! • Other maintenance type items include SEO (Search Engine Optimization) and SES (Search Engine Submission). This is the optimization of you web site with elements such as title, description and keyword tags which help your web site achieve higher rankings in the search engines. The previously mentioned code validation is something that plays a vital role in SEO, as well. • There are a lot of details involved in optimizing and submitting your web site to the search engines – enough to warrant it’s own post. This is a very important step, because even though you now have a web site, you need to make sure that people can find it!