Web Site Development Process - The life-cycle

Similar to the traditional software development process, the website development life-cycle too can be divided into different steps. Such bifurcation helps align different activities towards a progressive goal that ultimately culminates into successful project completion. Knowing more about these steps will also help team to understand their respective roles in the context of a given task and extract maximum quality.

This article explains the different steps in the development process of web engineering. This is just a guideline to help you to know, how a process can be done. The steps may vary from application to application. Do feel free to write to me about your suggestions and comments on this article to enquiry@vartint.com

Note: Throughout this text, the words ‘websites’, ‘Web applications’, ‘Web based applications’ and ‘Intranet/extranets’ can be interchangeably used.

Introduction

A systematic development process can follow a number of standard or company specific frameworks, methodologies, modeling tools and languages. As an industry practice, the software development life-cycle adheres to certain set standards which need to be followed by development team to stay on track with respect to timelines and quality control. Just like software, websites can also be developed using certain concrete methods that has provisions for customization to the existing software development process.

Let us analyze the steps involved in any website development:

The first step is understanding client requirement and the various dynamics around the clients existing systems, as the website or web application will eventually be integrated into this system. The analysis will then cover all the aspects of clients’ business and their needs especially on how the website is going to be merged with their existing system.

The first important thing is finding the target audience. Then, all the present hardware, software, people and data should be carefully assessed. For example, if a company XYZ Corp is in need of a website to have its Human Resource details online, the analysis team may look to review the existing data about the employees from the present database and what migration plan will be best suited to complete the transition.

The analysis should be done in the way, that it is neither too time consuming nor lacking information. The team should be able to come up with a detailed cost-benefit analysis. As the plan for the project will be an output of analysis, it should be realistic. To achieve, this the analyst should consult the designers, developers and testers to come up with a realistic plan.

Input:

1. Kick off interview with client, initial mails and supporting docs by the client, discussion notes,
2. Online chat transcripts, recorded telephone conversations, and
3. Model sites/applications

Output:

1. Work plan,
2. Estimating cost
3. Team requirements (No of developers, designers, QA, DBA etc)
4. Hardware-software requirements
5. Supporting documents and
6. Final client approval to go ahead with the project.

Tools: There are not enough tools available in the market, But we found one good tool to try is: Requirement Heap.

Preliminary specifications are drawn up by covering up each and every element of the requirement. For example if the product is a web site then the modules of the site including general layout, site navigation and dynamic parts of the site should be included in the spec. Larger projects will require further levels of consultation to assess additional business and technical requirements. After reviewing and approving the preliminary document, a written proposal is prepared, outlining the scope of the project including responsibilities, timelines and costs.

Input: Reports from the analysis team.

Tools: For specification building, we recommend you to try django-req and a requirement management tool called rmtoo.

3. Design and development:

After the specification building, work on the website is commences after receipt of the signed proposal, a deposit, and any written content materials and graphics you wish to include. In this stage the layouts and navigation will be designed as a prototype.

In parallel, the Database team will assess and understand the requirements and develop the database with all the data structures. In this stage, the sample data will also be prepared.

Input: Requirement specification.
Output: Site design with templates, Images and prototype.
Tools: There are plenty, The most popular one is Adobe Photoshop.

4. Content writing:

This phase is necessary mainly for the web sites. There are professional content developers who can write industry specific and relevant content for the site. Content writers need to add their text in such a way as to utilize the design templates. The grammatical and spelling check should be over in this phase. The type of content could be anything from simple text to videos.

Input: Designed template.
Output: Site with formatted content.

5. Coding:

Now, it’s the programmer’s turn to add his code without disturbing the design. Unlike traditional design, the developer must know the interface and the code should not disturb the look and feel of the site or application. This calls for the developer to understand the design and navigation of the site. If the site is dynamic then the code should utilize the template. The developer may need to interact with the designer, in order to understand the design. The designer may need to develop some graphic buttons whenever the developer is in need, especially while using some form buttons.

If a team of developers is working they should use a CVS to control their sources. The coding team should generate necessary testing plans as well as technical documentation. For example, Java users can use JavaDoc to develop their documents to understand their code flow. The end-user documentation can also be prepared by the coding team. This can be used by a technical writer who can understand them, and develop helps and manuals later.

Input: The site with forms and the requirement specification.

6. Testing:

Unlike software development, web based applications need intensive testing, as the applications will always function as a multi-user, multi-tier system with bandwidth limitations. Some of the testing which should be done are, Integration testing, Stress testing, Scalability testing, load testing, resolution testing and cross-browser compatibility testing. Both automated testing and manual testing should be done without fail.

For example it’s vital to test fast loading graphics and to calculate their loading time, as they are very important for any web site. There are certain testing tools as well as some Online testing tools which can help the testers to test their applications. For example, ASP developers can use Microsoft's Web Application Test Tool to test the ASP applications, which is a free tool available from the Microsoft site to download.

After doing thorough testing at the live server too is necessary for web sites and web based applications. After uploading the site there should be a complete testing (E.g. Testing Links, Unit testing, )

Input: The site, Requirement specifications, supporting documents, technical specifications and technical documents.
Output: Completed application/site, testing reports, error logs, frequent interaction with the developers and designers.
Tools: There are a plenty. Just Google it.

7. SEO and Social Media Optimization:

This phase is applicable only for web sites. Promotion needs preparation of meta tags, constant analysis and submitting the URL to the search engines and directories. There is a detailed article in this site on Search Engine Optimization, for further read. The Search Engine Optimization and Social Media Marketing is normally an ongoing process as the strategies of search engine may change quite often. Submitting a site URL once in 2 months can be an ideal submission policy. If the customer is willing, then paid click and paid submissions can also be done with additional cost.

Input: Site with unique and great content, Competitor study, keyword analysis.
Output: Site submission after necessary meta tag preparation.
Tools: We at vartint use few popular tools, you can check them at the bottom of our SEO service page.
Also, To learn more about SEO life cycle click here.

8. Maintenance and Updating:

Web sites will need quite frequent updates to keep them fresh and relevant. In such a case, we need to do analysis again, and all the other life-cycle steps will be repeated. Bug fixes can be done during the time of maintenance. Once your web site is operational, ongoing promotion, technical maintenance, content management & updating, site visit activity reports, staff training and mentoring is needed on a regular basis, depending on the complexity of your website and the needs within your organization.

Input: Site/Application, content/functions to be updated, re-Analysis reports.
Output: Updated application, supporting documents to other life cycle steps and teams.
Tools: For easy website maintenance CMS is right choice. Investing on a CMS like WordPress or Joomla will make your site easy to maintain without much recurring expenditure.

The above-mentioned steps alone are not restricted to web application or website development. Some steps may not applicable for certain tasks. It depends largely on the cost and time involved and the necessity. Sometimes if it is an intranet site, then there will be no site promotion. But even if you are a small development firm, if you adopt certain planning along with these web engineering steps in mind, it will definitely reflect in the top notch quality of the final outcome.

See the flowchart "How we do web development in vartint?"[PDF format]