Oftentimes when working with small businesses, when I start discussing price points for websites, I find difficulty expressing the differences in expected quality for price echelons. Aspects like Ideation, research, and drafting don’t seem all too important in terms of the final product, like it is additional bloat to exponentially raise the price. While I am open to working with my client’s price point, I must stress the importance of paying upfront to get the most out of their purchase. I suppose that is a problem that comes with having a malleable business model. I created this guide to explain the process in which a traditional professional website is made. In addition, I added areas in each section where shortcuts can be made to save production cost and the consequence of those decisions.

Ideation / Research

I include ideation and research together because I feel they speak to each other. Ideation is the faculty or capacity of the mind for forming ideas. For web design it is the formation of the principle thought that will govern the webpage. Research is hence the careful study undertaken to discover facts and principles that will inform the ideation phase. Concentrically speaking, ideation helps inform the nature of the research (ergo what am I supposed to be researching).

The way this takes form is in the use of brainstorming tools whether that be mind mapping, starbursting, brainwriting, SWOT analysis, or many other techniques to catapult creativity and ingenuity. In some cases, if the website tightly linked to a developing brand, I will also opt to create user personas and empathy mapping. The first round of concept mapping will generally direct me to knowledge gaps where I am then able to conduct web research and formulate questions for the subject matter expert (for a small business should be the business owner) to get a greater grasp of the subject in question. In cases where I feel the business does not have a strong grasp of their audience, I would opt into using surveys or a case study. It is also during this period where competitor websites are analyzed, site maps are created and technical feasibility is considered.

The goal is to have a strong grasp of what your brand is, who your customers are, what are their pain points, and consequentially how to best serve them. If this all sounds like branding, that’s because in large part it is. Your website is a large part of your brand, how people perceive your website affects how your brand is perceived. This means that the more branding work that was accomplished prior to the web creation or redesign, the less time that needs to be put into the research phase. Still, I would argue that the ideation/research phase is always essential. Even if it is just an audit or me familiarizing myself with the brand, the ideation/research phase facilitates creative thinking; it is the foundation of all future web work.

Unfortunately, this is the phase of the web development that often gets dropped for small businesses. The consequence of this is a website that can only meet the status quo. I am in full belief that a business that is growing must take risks to stand out, small businesses can’t afford to be conservative in their approach. However, I also understand that budget constraints don’t allow for certain affordances, in which case I would suggest pay for what your budget allows, but as you grow, look back and reconsider conducting branding research. This may or may not lead into your-website 2.0, but it will highly inform your brand moving forward.

I am also of the mind that preliminary research can be done by the company in question. It isn’t as effective as having a meaty ideation/research phase with the web designer involved, but it can provide additional context that can better streamline the process. One issue I often run into when working with some of the smaller businesses, is that they don’t have strong grasp of basic concept that pertain to their business. If you are working in a service field for instance, I would hope that you have some method of ensuring quality service to your customers and some sort of service agreement/policy. I would recommend small businesses to use brainstorming techniques to facilitate business thinking. Perhaps In a future post, I’ll go over exact strategies you can use to develop your brand from infancy.

Design Phase

(α) Alpha design

After the initial research has been accomplished, alpha designs for the website will be created. The goal of this phase is to focus on the general layout and functionality of the website. At this stage, I will be considering the UI (user interface) / UX (user experience) of the website. Alpha websites generally lack color, font research, or image treatment. You are likely to see a greyscale website with placeholder images and generic font.

Instead, the priority is on the elements that will make up the html 5 family code and wayfinding. How is the website responsive and is it highly intuitive and easy to navigate? The prior phase should have informed potential pain-points that are addressed in the UX design of the Alpha design.

(β) Beta design

In the beta design phase, the visual components of the website begin to take place. Color, fonts, and image treatment are considered. The beta design should continue to see iterative work until it becomes the finalized website.

The alpha and beta designs are often the first phases to be cut for a more cost-effective website. Without the necessary design exploration, this result in a more cookie cutter design approach for the final website and less control for the customer over the final product.

Development

At this point the website code is being written. This can be accomplished with a variety of programming languages, dependent on the functionality of the website. In addition to the coding, the programmer will set up the server-side functionality. Websites can be built from scratch, but generally most website will be utilizing a Content Management System (CMS) to expedite the process. In most cases the website will be developed on a staging platform during the development stage.

For my websites, I generally either build from scratch or build using a WordPress custom theme I created. This allows for more freedom in my design approach and in the case of WordPress, ease of use for the administrator. As for more information on website development, please check out my guide here.

Testing & Review

Once the website is developed, the programmer then tests the website to ensure it is running at the most optimal level. This includes two main types of testing:

• Functional testing: Functional testing focuses on verifying that the website performs its intended tasks on all appropriate browsers and devices.

• Non-functional testing: Non-functional testing assesses the website’s performance, security, and usability.

While testing is its own phase, test will be conducted throughout the development phase. Web Master should also continue to monitor the website after it has been deployed to ensure nothing has been missed. Deployment.

Once the website is ready to go live, it will be moved from the staging platform to the production server. This stage can be surprisingly complex as it requires configuring the environment before deployment. Once the process has begun, the developer is on the clock; it is imperative that the developer has a plan before release to ensure a smooth transition as he/she considers all potential problem sets. After release the developer will continue to monitor the website to ensure it remains accessible and performant.

Maintenance

Maintenance is the cornerstone to maintain optimal website performance. Web browsers, devices, and operating systems continue to change and evolve. With this perpetual growth, older technologies cease to function and new security vulnerabilities to older tech begin to emerge. With the appropriate maintenance, the web master can update software, back up data, monitor web traffic and check for security vulnerabilities. Continues maintenance ensures that your website is updated, relevant, assessable and optimal at all times.

I remember one client reached out to ask why maintenance was necessary, can’t the website just be designed to be efficient enough to not need maintenance. I think this is a common point for small businesses who are looking to lower their expenses. The simple truth is that there is no way to consider all the changing variables that could affect a website’s performance during the development phase. Websites rely on backend architecture to populate, whether that be the browser HTML/CSS rulesets, the CMS, a specific plugin, etc. I suppose a web developer could attempt relying solely on proven static architecture, but at that point the tools you are working with are so limited that I couldn’t fathom the formation of a professional website. I have come in to fix neglected websites in the past and from my experience, the expense to course correct is much greater than continued maintenance would provide. For this reason, I consider maintenance absolutely essential; this is one cost saving measure that is not worth the future headache.

Chawre, Huzefa “A Complete Guide to Web Development Process” Turing https://www.turing.com/resources/web-development-process

Mitsiakina, Julia “Website Development Process: Full Guide in 7 Steps ” XB Software 10 Mar 2023 https://xbsoftware.com/blog/website-development-process-full-guide/

Loy, Matt “7-Step Website Development Process [+ The Tools That Will Streamline Your Journey]” Digital Silk 1 Aug 2024 https://www.digitalsilk.com/digital-trends/website-development-process/