Development Process
The process we follow at La Mesa Web Designs and Development to ensure high quality, reliable web sites has been developed over years of experience. This process results from formal system analysis and design training and is organized in a way to deliver prompt results and client satisfaction.
Our client's input is important to us to provide the most relevant and comprehensive web site. The goals for the web site are focused upon throughout this process and formal reports and deliverables are made available.
The web site, in it's creation stages, is built on our development server and can be accessed by our client, and revisions are stored in a file repository for reference.
This process streamlines the development of the web site and the finished product is strong, efficient, and built to last.
1. Business Needs and Requirements - (formal documents)
- Needs:
- gather information from client about the goals of the web site,
what the client wants the web site to accomplish, i.e. display products
and product information, email form, e-commerce payment gateway,
administration section, management interaction like product updates,
modules like inventory tracking, request for quotations, sales tracking
and follow-up, multimedia, mobile web version, mobile app integration,
database access, queries and views, reports for administration and management,
and other relative goals
- Requirements:
- determine hardware requirements for accessing and managing web site – usually
these requirements are met by client’s existing hardware, unless the web site
needs to interact with the client’s local (company) server for database access
(inventory, sales, etc.), Virtual Private Network (VPN) connections, e-commerce
payment gateway connections, or other connections, data or software residing
on the client’s local hardware, then some small adjustment may need to be made
for firewall or other settings, or additional hardware
- determine software requirements for programming web site, server
interactions, and database
2. Feasibility Analysis- (formal document)
- includes spreadsheets for cost / benefit analysis, projecting project
investment and return on investment (ROI), estimated programming time, project
time-line, and other spreadsheets comparing the investment in the project to
the expected results, so the client can consider the positive benefits the proposed
project will provide
3. Data Flow Diagram (DFD) - (formal document - diagram)
- depicts the flow of data through the web site – this
is determined by the database information required in the
Business Needs and Requirements
4. Database Design - (document)
- structure of database tables, columns, and relationships, according
to Business Needs and Requirements
5. Entity - Relationship Diagram (ERD) - (formal document - diagram)
- depicts the database tables required by the DFD data stores and
the relationships between the tables required to produce reports and
interactivity defined in the Business Needs and Requirements
- these tables are organized in the most efficient way, according to
ERD level three (3), to reduce data redundancy and minimize processing time
6. Web Site Storyboard - (formal document - diagram)
- shows the flow of the User Interface (UI) from the Home
Page to all linked pages. This is determined by the interaction
required by the Data Flow Diagram and the pages required
according to the Business Needs and Requirements
7. Web Site Wireframe - (document - diagrams / drawings)
- Layout Design - (paper)
- digital drawings of web pages, including
placeholders for image areas, text areas, menu
placement, interactive areas (buttons, input boxes, etc.), and
all objects and their placement in each page included in the web site
- designed to achieve the goals outlined in the Business
Needs and Requirements, and designed in way to optimize web site
attractiveness , loading time, and functionality
8. Web Site Mockup - (web site)
- Layout Design - (web)
- the User Interface depicted in the Web Site Wireframe is converted
to actual web pages, built using table-less Cascading Style Sheets
(CSS) code for precise and optimal placement of the web site objects, using
placeholders for content areas
- the client can make changes to things like placement, content
areas, add or reduce pages, and other suggestions
- this web site is served from the La Mesa Web Designs development server
- after the client approves the web site mockup, the
layout will be used for the actual web site
- the mockup does not include any interactivity, other than
the menu buttons, or any other functionality
(database, e-commerce, reports, etc.), it is only used to serve as the
approved layout for the web site
9. Begin Content Gathering - (client)
- web site content is gathered from client, including
images and text, according to approved web site mockup
and Business Needs and Requirements goals
- this content is acquired from existing information for company
products (i.e. sales literature information, etc.), client
interviews, existing images and photos and graphics and multimedia
(which will be optimized by La Mesa Web Designs for the web site),
and photos and video and graphics taken or created by La Mesa Web
Designs and later optimized for the web site
- this stage continues through the next few stages
- content can be uploaded to the La Mesa Web Designs
Network Attached Storage (NAS) server 24/7 using the
client’s login credentials. It is then taken by La Mesa
Web Designs and optimized for object size (i.e. image
size, text area size, etc.), quality, and file size (for
web site loading time), for the web site according to
content placeholders in the Web Site Mockup. The placeholders
are then replaced with the actual text, graphics, and
multimedia in the web site construction stage
10. Database Creation - (La Mesa Web Designs development server)
- Client Database is Set-up on the La Mesa Web Designs Development Server
- the database tables created in the database
design stage and refined in the Entity Relationship
Diagram are created in the client’s database on the
La Mesa Web Designs development server
- ASP.Net Schema is placed on the database for users’ security
11. Business Logic Programming - (La Mesa Web Designs development server)
- programming for interactivity throughout the web site, as
determined by the Business Needs and Requirements and the
Data Flow Diagram, is done on pages and overall web site
to provide functionality with the database, dynamic web
page updates (i.e. product updates, processing updates,
etc.), for e-commerce payment gateways the programming
interacts with the payment gateway testing account
- SQL database queries and results are programmed using test data
- users are added to the ASP.Net Schema with user login
information (user name and password) and user roles
(administrator, management, etc.)
- objects and classes are set-up and programmed for
Object-Oriented Programming (OOP) and a class
diagram document is created
- user profiles are set-up if required by the Business Needs and Requirements
- user controls are created and added for menus and other customized controls
- ASP.Net controls, like buttons, views, and datalists, are added and
programmed for interactivity with the database, reports, etc.
12. Completion of Content Gathering – (client, La Mesa Web Designs)
- at this point all content for the web site has been gathered
13. Optimization of Content and Multimedia Creation – (La Mesa Web Designs)
- content is optimized for the web (object size, quality, file size)
- any multimedia required is created (Flash, video, etc.)
14. Web Site Creation – (La Mesa Web Designs)
- all optimized content and multimedia is placed on the web site and placeholders are removed
- all functionality is hooked-up to web site objects, such as data tables, reports,
screens, dynamic text, log in / out, menu sitemap, page access, payment gateway, etc. and tested
15. Testing – (La Mesa Web Designs)
- the web site is tested for security and robust and
easily maintainable code by La Mesa Web Designs using code analysis tools
- any necessary changes to provide security or efficient coding are made
- cross-browser compatibility testing is done on
four (4) major browsers (Internet Explorer, Chrome, Firefox, and Safari)
- content is checked for typographical errors
16. Client Approval – (client)
- The Completed Web Site is made Available on the La Mesa Web Designs Development
Server for Client Review
- the client reviews the web site for:
- accordance with the goals determined in the Business Needs and Requirements
- attractiveness of site and loading time
- correct information
- accurate and relevant reporting
- any other changes the client would like to make
- La Mesa Web Designs makes the changes
17. Domain Name, Hosting, and Payment Gateway – (La Mesa Web Designs, client)
- domain name is determined by client and, if available, is attained.
If the client’s domain name needs to be transferred the transfer is made
- hosting is acquired from a web site hosting company
- if e-commerce is required a payment gateway account is acquired
18. Move the Site to the Live Hosting Server – (La Mesa Web Designs)
- the completed web site, including code and database, is
moved from the La Mesa Web Designs development server to the
live site hosting server and is accessible using the actual domain name
- if the web site is an e-commerce site, the testing payment gateway is made live
19. Basic Search Engine Optimization (SEO) – (La Mesa Web Designs)
- Google Analytics, Google AdWords, and Google Webmaster Tools accounts are set-up for the client
- keyword search is done using Google Webmaster Tools and SERPS keyword competition tool
- META tags and Google Analytics code is placed on the web site using keywords from keyword search
- the domain name is sent to major search engines (Google, Bing, Yahoo, etc.) for indexing and initial reports
20. Testing – (La Mesa Web Designs)
- the live web site is again tested for cross-browser compatibility on the
four (4) major browsers (Internet Explorer, Chrome, Firefox, and Safari)
- site speed, loading time, and web site optimization, are tested and
documented as the web site’s initial benchmark reports and kept on
file for site improvements
- Google Analytics statistics are recorded for initial benchmark and kept on
file for site improvements
21. Basic Advertising – (La Mesa Web Designs)
- if desired, La Mesa Web Designs will set-up a basic Google Search advertisement through Google AdWords
- (any further advertising or search engine optimization improvements will need to be
done by a web site advertising (or SEO) company
22. Web Site Report – (formal document)
- La Mesa Web Designs provides a comprehensive report on the web site, including
all user names, passwords, email information, ftp information, database access
information, time reports, initial benchmarks, site structure, and all related information