The main stages of designing a website.
Website design is a complex phase that decrees the success of the website or its failure.
Each website must be designed and built to achieve the realistic and measurable marketing objectives validated in the marketing plan.
Many small companies want the website because they have heard about it (on average from some cousins), but they do not know its value in terms of marketing or its value in economic terms.
Often the first question is: we would like a site. How much do we spend?
The intangibility of the product and the lack of knowledge of the subject by many companies push us to work without having a detailed marketing plan in hand.
So in fact we start from a website, which brings together the customer’s requests and the experience in the design of the Web Project manager.
This unorthodox path seems to cost less (the costs of market analysis and the marketing plan are avoided), but it could turn out to be a fruitless expense or one that requires major adjustments.
No site is born perfect. No site will ever be perfect. No site will ever be final. The experience in the design helps a lot, but only the data collection and the measurement of the objectives and the consequent adjustment of the layout tend to the best possible result. The subject that studies the optimization and conversion process is called CRO (Conversion Rate Optimization). It is a later stage.
Depending on the type of project, the basic steps in designing a website can vary. Not all websites are the same: different types of management and planning are required to create a company website, an online catalog, or, e-commerce. Consequently, even the implementation phases can increase or be divided in turn into web design sub-phases.
If you have already found an idea and a web agency, then the time has come to understand the main stages of designing your new website:
Initial meeting for the definition of the specific objectives of the website and of the resources that are put in place for the realization of the objectives themselves. This is one of the most important moments in the design of your website and for this, you need to ask yourself a few questions:
- What is the purpose of the website? What results would I like to achieve with its realization?
- Who are we trying to reach? Which target audience?
- What are the websites from which we can take inspiration? Why have they proved to be more effective or why are they liked by our target audience? In this context… how does the competition move?
- Who are the people involved in the design and construction of the site and what will their role be?
- Will there be any news in progress and updates that need to be presented to users? Who will and will need to update this site? How often?
- Will the site be a part of a larger online communication strategy (which also involves social media) or is it our only means of communication?
- How important is it to be visible on search engines?
- What budget can we allocate to the project?
- What is the deadline?
Website design document
Planning and creation of the web design document in which the best technical solutions and the structure to be given to the web project are established (for example the choice of using a CMS like WordPress, establishing the necessary contents, social channels, etc.). Two of the basic technical topics that we must deal with are the domain name and the choice of hosting.
The importance of these two elements is often underestimated by those who enter the world of the web for the first time. The domain name and web hosting are two crucial variables in the success of your project both in terms of “performance” of the site and in terms of SEO (positioning on search engines).
Discussion of this document with the client, to understand if all the preliminary aspects have been examined.
Graphic design and a draft of the website
Based on the information collected and the web design document, it is time to determine the appearance of your site: site design and draft.
The audience you target is one of the key factors that you need to take into consideration. A site aimed at a very young audience, for example, will appear very different from that designed for a construction company. At this stage of the design, it is important to incorporate elements such as the logo and company colors so that the site reinforces the identity of your company on the web.
The spaces and boxes of the project are also decided for the various devices: Desktop PC, Tablet, and Smartphone… the design of the website must scrupulously follow the rules of responsive web design. Your web designer will create one or more drafts for your website. Typically this is a jpg image of what the final design will look like. In some cases, for particularly complex projects, it may be necessary to create a preliminary development environment on which to mount some test templates by making the required customizations.
Web design and site development
The website development phase is the time when your site is created. The web designer in collaboration with the developer will start from the single graphic elements included in the prototype and will use them to create the real site. Elements such as the CMS (content management system for example WordPress), the code to be used (HTML / CSS), interactive contact forms, or e-commerce systems are implemented and made functional during this phase.
Usually, the first thing you create is the structure of the site, the basic template of the various pages, with the fundamental elements: the navigation structure, the footer, the socket, etc. This structure acts as a template for most of the content pages on your site: the web designer will take the content and distribute it throughout the site, in the appropriate areas.
At the same time as this phase, it is, therefore, necessary to work on the contents to be included within the site. The site map that we defined in the design phase represents the track that we will have to follow for the preparation of the texts and images.
In this phase, the website “in progress” is installed on a local server (accessible only to the web agency and the client) so that it is always available for consultation and so that any additional changes or corrections can be made before going online.
The test phase and online publication
At this point, the web designer and developer will take care of the debugging phase of your website. All elements such as the functionality of contact forms or other scripts will be tested, as well as compatibility tests (display of the differences between different web browsers) will be carried out, ensuring that your website is correctly displayed in the most recent versions of the browser and on the different devices.
Once you have given final approval, it is time to publish the site.
But beware, there are many other details involved in creating and optimizing your website for search engines. Taking care of SEO (Search Engine Optimization) is a very important step… if you now have a website, you need to make sure that people can find it!
This phase marks the official launch of your site, it is now visible to the public.
At the end of the work, it is essential to dedicate some time to training (the customer’s staff) who will take care of the insertion of new content on your site. A dynamic or updatable website gives you the possibility to directly modify the contents through access to a back-end administrative area, where it is possible to use very intuitive programs and an online text editor (similar to a mini version of Microsoft Word). You will be able to edit existing content and add new pages and content. The possibilities are endless!
Whether it is proprietary software or an open-source CMS (such as WordPress) those who explain the operation of the site (or your SEO consultant) must know how to transmit the basic knowledge for the updating but above all the basics of SEO.
Those who create professional websites know in fact that successful web projects are often linked to a vital and frequently updated site, in which the customer is motivated and personally involved in the preparation of the contents and can appreciate the results.
The choice of whether to dedicate internal resources or rely on the web agency to manage the site update phase is very important in the design of your website.
Some entrepreneurs prefer to have full control over their site, others prefer to rely on the agency. The important thing is that the site gets results!
For more complex projects, it may sometimes be useful to create a post-project document in which to insert some elements used for the design: colors used, the definition of the architecture, passwords, and elements that can be used if the web project grows. This document also helps to improve and increase visibility on the internet.
One of the last stages is implementation with web marketing activities that help give visibility to your web project (on social media, on search engines with an SEO campaign, Adwords campaigns, Facebook marketing, etc.).
Assistance and maintenance
Once the website has been created, our online showcase, and put online, for this to be efficient over time, constant updating, assistance, management, and maintenance from a technical point of view are required.
Constant and continuous renewal is essential for reasons of security and compatibility of the site with the devices and software used by users. Maintenance interventions can be periodic (e.g. insertion or modification of functions and plugins, page and database backup services, statistical services …) or they can be occasions when single problems or new opportunities arise (e.g. interventions related to server and hosting problems, the evolution of the operating logic of search engines, new developments, and software functions …).
A system of statistics and Web Analytics
If you want to create a professional website, you cannot fail to know how it is going.
This is why it is important to use Web Analytics, which is a set of tools and techniques used for analyzing the data of a website.
Web Analytics is aimed primarily at collecting and measuring statistical information and subsequently at understanding user behavior across web pages: in other words where visitors come from, what they do, what content they prefer, and much more.
Google Analytics is the most used service in the Web Analytics field. It is a free statistics tool that can be used at different levels, starting from the basic level (to monitor access to the website in detail) up to much more advanced uses.
Fundamentals of web design: design
Even for the design of a website the rule applies: the better the design, the easier it will be to create. It does not matter whether you are building a website for your company or yourself or that you are perhaps developing it for someone else: the design of a page is a fundamental element for success. For this, it is advisable to budget enough time to find the right idea, conceive and improve the website. To find an appropriate and convincing structure for your page, you must consider the following points.
What is the function of the web page?
Before creating a page design it should be clear what you want to achieve and in how long. It would therefore be useful to ask: what is the purpose of your site? The answer is the basis of the entire project, so each component of the homepage should orient itself towards the success of the set goal. For example, a website can have the purpose of increasing the degree of popularity of the contents, therefore promoting or informing. If the page is e-commerce, the main goal will be to get new customers or sell more products. A website is generally the business card of a company or an institution; the purpose of the site must be kept in mind during the design and creation phase.
What kind of content suits your purpose best?
Think carefully about what are the topics to be presented on your site and how they can ideally be treated. Is the page mainly based on text or is the content mainly composed of images and videos? Do users need to register to fully use the site? Should a payment system be integrated? Is a comment function required to allow users to give feedback or not? By asking yourself these questions, you can quickly determine how expensive your project is, how long it will take and how much the costs are.
Get an idea of what measures and what contents are needed to achieve your goal, through brainstorming, research, and exchange of views between colleagues. This way you will have a complete picture of the designed website, which will make it easier for you in the following steps.
The target audience of the website and user expectations
Who is the target audience of your website? Define it. Always keep your goal in mind: if you promote a product or service, you must define your target audience and adapt it to the design of the site, even if it is an information portal or a forum on a specific topic. Ultimately, whether you want to propose a commercial offer or choose an information one, every website manager should know which group you are trying to involve. Only those who know their users can shape their page according to these parameters.
In many areas, standards have been set for content and its presentation. Thus, for example, on the online sales pages, you will always find a search function with practical filters. Each sector and each reference group has its characteristics that distinguish the contents and presentation on the web. It is important to know this type of user expectation, especially if your site deviates from current patterns.
The structure of the sitemap
Here are some indications for deciding the structure of the web page. To carry out this task, it is advisable to create a sitemap, which is a diagram that reproduces the structure of the pages and the links of the individual pages. To get a general overview, view the hierarchy of your internet page with pen and paper or directly on your PC. By doing so you will not only organize the content of your site, but at the same time, you will determine its navigability. In the sitemap, you establish the links of the site, sort each page according to its importance and create a short description of the scheduled contents. The structure of the pages must remain clear and must not contain too many sub-pages for each category.
The layout of the website
Linked to the creation of the sitemap is the draft of the website layout. In this case, this is not the final design of the site, but only the ordering and function of the content on the individual pages. By choosing the layout, you will decide for example where to insert the menu, how users reach the sub-items of the menu, and where the website logo is placed. The other elements to deal with in the layout draft will depend on the content. Other potential functions of the site to integrate and reflect on are:
A comment function for visitors
Links to social media, and social media buttons, with which users can share and show their appreciation for the contents of the site
Sponsor ads, banners, and videos
Affiliate links to partner companies that you promote on your site
In addition, you will have to think ahead if you want to optimize the display of your website for different devices (pc, tablets, smartphones, etc.). Generally adapting the graphics of the site to different display sizes has advantages and often it will be necessary to reorder the individual components of the page. The sitemap and layout are always connected and must be planned from the beginning in the design of the individual elements.
Search engine optimization: SEO
Your web presence must not only be adapted for the visitor, but also search engines such as Google. This can be achieved through SEO techniques, an acronym for Search Engine Optimization, in Italian search engine optimization. Through SEO, a website must be as high as possible in the search results when relevant website topics are called up. The contents of the pages are first of all optimized for Google, the leader in the sector also in Italy. With a high ranking in Google’s search results, your site will be found faster and above all by a greater number of users. Thanks to SEO, you will therefore broaden the range of action of your website.
Thanks to good and relevant content, you will make sure that your site is interesting for the target audience and that it is visited often. However, there are also other methods to optimize a website for search engines, and for this, there is no need to be an SEO expert. You must know what your target audience is looking for on Google & co. It is essential to integrate these concepts and combinations of terms into the text as much as possible, while also arranging them intelligently. These and other aspects are taken into consideration when indexing content by search engine software (so-called crawlers) and determining the positioning of your website.
Professional web design vs. ready-made sites and CMS
Nowadays internet pages are no longer just built by professionals. If before creating and building a website it was still necessary to have computer programming skills, today even amateurs can try their hand at the enterprise. Those who have no experience in web design usually rely on ready-made website templates based on the Content Management System (CMS).
A CMS offers users a graphic surface with which the individual components of the page are created and sorted. Knowing a programming language is no longer necessary, although it can often help. The number of functions made available by the individual systems varies according to the programs; the pre-existing features in a CMS depend-depending depend depending on the chosen provider whicwhichwhich which generally offers different packages. The more the price of an offer increases, the greater the number of functions included. Alongside these, there are also free ready-made sites. Unfortunately, however, their features are generally limited and only simple web pages can be created.
If you want to create a professional homepage, you should know the HTML and CSS languages with which you will have maximum flexibility. However, to develop an error-free and professional-looking page directly from the source code, you need industry experience. Furthermore, maintenance and updating are more complicated than CMSs.
You also have the option of entrusting the creation of your web page to a professional. Even in this case, you will need to be aware of what needs your page must meet. Finally, it will be up to you, the person in charge of the agency you have entrusted to approach, in as much detail as possible, your expectations. In any case, a design studied in detail has a positive influence both on the process and on the final result of the website.
Give yourself time
As soon as you know what content your website will offer, you have thought carefully about the structure and its creation decided whether you will create the page yourself or hire someone else, and can finally establish the timing. In the case of larger projects, you can decide to manage the deadlines in stages (starting for example from the production of the basic texts for the contents and then moving on to the realization of the basic design, etc.). In any case, time management should contain all the most important points and remain clear at the same time. Always keep in mind that individual sections, in some circumstances, need to be adapted or improved and a good roadmap provides enough room for such corrections. In addition, timelines need to be updated regularly and adapted to new elements of the project.
If you are building a new website, your web designer should work closely with you, guiding you on a design path similar to this one. Open and constructive communication with your web agency is very important in creating a successful website, which will help your business grow.
In 3dmlstudio we follow these steps for our client’s websites. If you are looking for a professional partner to guide you along this path and if you like our style, do not hesitate to contact.