It doesn't matter whether it's a news portal page, a webshop or a small business's introductory website, the main steps of the web development process are almost always the same. In my article, I would like to present this process in detail.
The process presented here also highlights that...
- although the work is called web development, in order for the end result to be successful, a series of related services, e.g. for competitor analysis, UX design, copywriting...etc. need.
- it goes without saying that you are looking for a web development specialist for a web development project, but you will also see from the following article that in addition to effective programming, you will also need a project manager, web designer, SEO specialist, copywriter, UX specialist, and online marketer.
Tartalomjegyzék
- 1. Contact, needs assessment
- 2. Preparation of specifications
- 3. Making a price offer
- 4. Contract conclusion
- 5. Research and planning
- 6. Web design
- 7. Programming
- 8. Uploading content
- 9. Testing
- 10. Deploy
- Maintenance and operation
- The most common questions that arise during web development
- Final word
1. Contact, needs assessment
The first inquiry, usually by e-mail, is followed by a Skype or personal meeting, during which we try to gather as much information as possible about the project.
We usually cover the following topics during the first meeting:
- What does the company do?
- What is the purpose of web development?
- What are your expectations regarding the website to be created?
- Who is the website designed for? Who is the target audience?
- What results does marketing expect from the new website?
- What kind of market environment should the new site find its place in? Who are the competitors?
I hear about many web development projects where they jump right into website design without knowing exactly what the company's goal is with the website, what results they expect from it, and who the main competitors are with whom the new site will have to compete.
From the very first step, I try to document every little piece of information in writing and share it with the project participants, so that nothing is forgotten, and on the other hand, there remains a written record of everything we agreed on regarding the development. Such written documentation is also good for preventing possible conflicting requests.
The larger the web development project, the greater the role of documentation. Behind many never-ending, dead projects lies the fact that the requirements were not properly recorded and half a year after the start of the project, no one remembers who agreed on what with regard to a specific sub-task.
2. Preparation of specifications
The web development project specification is actually a detailed task description. It summarizes all the relevant information we have learned about the project so far.
In order to be able to provide a price quote for a web development project, it is recommended to answer the following questions:
- In which industry does the company operate, what does it do?
- What is the purpose of the new website? Here, we are primarily interested in business and marketing purposes.
- What was your experience with the previous website? What has worked and what would you definitely like to change?
- Who is the target audience of the website? What can be learned about potential customers?
- Does the company have visual elements and a logo?
- What menu items does the website to be created consist of? What kind of information is included in each menu item?
- What features are needed on the new website? E.g. blog, webshop, password-protected interface, event calendar, ... etc.
- How many languages will the website be in?
- Who are the potential competitors?
- Can you show me websites that you like the way they look?
3. Making a price offer
After the specification of the web development, we prepare an itemized quotation of usually 6-12 pages. The price offer includes the presentation of the work process, the description of the individual services, the details of the costs and the presentation of the deadlines.
In the price offer, we describe exactly how each service, e.g. graphic design, programming, uploading content...etc. what activities they represent and what information we need to carry them out.
4. Contract conclusion
After accepting the price offer, we prepare a contract and send it to our client for approval. The main parts of the draft contract:
- basic data of parties
- the subject of the contract
- service cancellation procedure
- rights and obligations of parties
- data protection and confidentiality
- warranty
- entrepreneur fee
- payment terms, billing period
- entry into force, termination of contract
- copyrights
- closing provisions
- attachments (e.g. service orderer, task specification)
5. Research and planning
Based on the information from the first meeting with the client and the specification that was then prepared, we begin research that will help ensure that the website to be created provides the target audience with the highest possible user experience.
User experience-based design (UX design in English) plays an increasingly decisive role in web projects, as it is used to create websites that visitors enjoy browsing.
Research and planning may affect the following activities:
- competitor analysis - we thoroughly review the website and online strategy of the strongest market players, so that the website we create can be among the best right away.
- website traffic analysis – reviewing past website analytics to understand user behavior.
- website UX audit – auditing the previous website from the point of view of user experience. What worked well in it and what needs improvement?
- persona creation - defining the website's target audience groups, understanding their motivation, device usage habits, and browsing habits
- user interviews – oral or written interviews with the target audience in order to get to know them better
- defining the customer journey - defining the visitor's path on the website. This tool helps you define conversion paths and optimize conversions
- wireframing – wireframes are freehand or computer-generated black-and-white drawings that help show the layout of individual pages.
- prototyping – equipping the wireframe designs with basic actions (clickability) in order to simulate the visitor's behavior on the page
6. Web design
Here, all the information has already been assembled so that the web designers can prepare the graphic plans of the website based on the previously approved structure, functional plan and wireframes.
First, a 1:1 scale plan of the opening page is prepared, which is presented in a browser, and then, after its refinement and approval, the plans of the subpages are prepared. In the case of a simple introductory page, 2-3 subpage designs may be sufficient, while in the case of a complex site, even a dozen subpage designs may be prepared.
In addition to the layouts presented on the wireframes, the graphic design of the website already contains the final colors, shapes, visual elements, fonts, icons, illustrations and images. In short, it pixels exactly what future visitors will see in their browser.
The ideal case is when we already receive draft text materials, because in this case the designers can tailor the appearance of the page exactly to the structure and quantity of the text.
The graphic design of the website is no longer an artistic work for its own sake, designers must take into account countless aspects during the design in order to ensure that the finished site meets the business and marketing goals and provides maximum performance. Here are some of them:
- target audience – the website should not suit your own or even the customer's taste, but rather the target audience. This applies not only to the appearance, but also to the operation and even the texts.
- image - the website must follow the image of the company. If you get only one logo, you have to adapt to its world of shapes and colors.
- competitors – when designing a website's structure, functionality and appearance, we must consider online competitors.
- navigation - website navigation is an extremely important function. If it is poorly designed, the site will perform less well from the start, which is often not easy to fix afterwards.
- loading speed - with the spread of mobile use, the loading speed of the website has become one of the most important aspects. The first step in this is the web designer, who must take speed-related aspects into account in his work and cannot design a landing page with so many images that it is impossible to achieve good performance in the first place.
- Responsiveness - the graphic designer must be aware of the basic requirements for responsive operation and must design the desktop, tablet and mobile view with these in mind
- programmability – a web designer must consider web development technologies and produce designs that are compatible with today's modern programming languages.
- SEO-friendly design - the web designer must have basic SEO knowledge and must design the elements on the website that improve the crawlability of the site and Google's performance. E.g. breadcrumbs, headlines, … etc.
- compatibility with language versions - this is perhaps one of the most difficult conditions. The website must be designed in such a way that the appearance does not fall apart after uploading with language mutations. Here, I am primarily thinking that naming a specific menu item in English takes up much less space than e.g. in German. So you have to leave adequate space for longer texts as well.
- content management systems - all of today's modern websites have a content management system. When designing the graphics of the website, care must be taken to ensure that as many content elements as possible can be edited from the CMS.
- consistency - the style, header, footer and navigation of the homepage and subpages of a website must be structured consistently in order to make it clear to the visitor which page they are currently on
- user experience - as I mentioned earlier, user experience-based design is one of the most important aspects of the website
- current trends - if all the previously listed aspects have been met, then it doesn't hurt if the site is fashionable and meets modern design trends. According to research, even an average visitor can decide whether a website has an outdated or trendy appearance, which naturally affects the perception of the company as well.
7. Programming
We are at the point where the client-approved graphic design of the homepage and subpages of the website is ready. In this step, the programmers are given a role, who create a clickable, responsive, functional website from the graphic designs.
In addition to programming the graphic designs, the specialists set up the content management system, which allows the website to be edited by the customer through a password-protected interface.
The work of the web developer (programmer) is essential for the success of the website. It is the responsibility of the web developer that the website...
- should be exactly the same as seen in the graphic designs
- work flawlessly in all modern browsers
- be responsive, i.e. adapt to the resolution of the visitor's device
- should be designed in a search engine-friendly way for the best possible Google rankings
- can be updated from a content management system (CMS).
- loading speed should be as short as possible
- comply with GDPR recommendations
- be secure, protect visitors' personal data and resist attacks from the web
- display flawlessly in all supported languages
- coding should be clear and transparent
For the reasons listed above, it does not matter which web developer a company chooses as a partner.
8. Uploading content
Almost no matter what industry we're talking about, it can generally be said that a top-notch website requires a large amount of quality text and image content. It is advisable to start the preparation of these materials already in the design phase of the website, and then, according to our experience, by the end of the programming phase, they will be in such a condition that they can be uploaded to the site.
Despite the most thorough planning, it often happens that the materials to be uploaded differ due to their quantity or structure from what we developed the website for, and in such cases we have to make minor or major modifications in order to ensure a perfect appearance and function.
9. Testing
The finished website must be tested before activation. Testing usually covers the following areas:
- spelling of texts
- testing the functionality of the forms
- error messages
- browser compatibility
- responsive operation
- technical SEO settings
- website speed
- appearance of language mutations
- redirecting old URLs to new ones
- connection of social networking sites
- placement of analytical codes (Google Analytics, Google Ads, Google Tag Manager, Facebook Pixel ... etc.)
- XML sitemap
If the testing proves flawless in all areas, the website is ready to go live.
10. Deploy
Deploying the website is a delicate operation, as several coordinated activities must be performed on the site in a short period of time. Since the website is usually developed at its final hosting location with a temporary availability, in most cases, activation means redirecting the domain name from the old hosting location to the new one. We can redirect the domain name ourselves in the case of service provider or administrative access.
Since the website available under the temporary address is blocked from search engines during the development phase, the first thing is to remove this ban. At the same time, we will cancel the temporary address.
Right after the live launch, we check the redirections of the URLs of the old website to the new one, this is crucial in order to maintain Google rankings. We double check that the analytics codes and the HTTPS connection are working. We register the website in Google Search Console, which provides an additional confirmation that everything went well with the transition. If there is a problem, e.g. some old URLs run into 404 page not existing error messages, then we can quickly correct this.
Maintenance and operation
Modern content management systems have made it possible for a minor or major modification or update to be done without the help of a web developer, but can be done immediately by the website owner himself.
At the same time, attacks against websites have also increased with content management systems. The reasons are relatively simple: content management systems are complex software that are constantly available on the web and can cause serious damage to a website even in the case of the smallest security hole, which is why they must be constantly monitored and updated. (You can read my exhaustive article on the causes of attacks against websites here.)
Among other things, due to the vulnerability of modern websites, it became necessary to set up a customer service that is constantly available by e-mail or phone and can provide help with minor or major issues related to security or even the use of the content management system.
This operator background provides great security to our customers, because with continuous supervision, they can know their websites are safe, and if they have any questions, there will be someone they can reach and get help.
The most common questions that arise during web development
- Will the new website be search engine friendly? Answer: from a technical SEO point of view, we do everything to ensure that the website has the best possible foundations in the competition for the best Google rankings.
- Will the website display well on mobile? Answer: we only create responsive websites that automatically adjust to the resolution of the visitor's device, so they also have an optimal appearance on mobile
- Will I be able to edit the page myself? Answer: we add a content management system to every website, which allows you to modify the content through an interface protected by a user name and password
Final word
Web development has changed a lot in the last 10 years. With the increase in revenues from online sales, competition has become huge in almost every industry, companies are bidding on the quality, content and functionality of their websites in order to be chosen by visitors.
The design and development of such a cutting-edge website, however, requires careful project management, the steps of which I tried to provide some insight into in this article.