From structure to a strong visual foundation

A website project starts with mapping out the wireframes. In this essential step, it is important to have input in the form of user stories and to have a clear view of the website’s goal. Wireframing is essentially creating a sketch of the website that shows the basic structure of the pages. At this stage we leave out all design elements such as colours or images, as it is purely about the purpose of the pages. The resulting wireframes help our designers focus on the user experience (UX) by making the navigation and interaction on the website easy to understand. During this phase of the website, we continuously check whether the layout of the page is functional for the visitor. Ultimately, this phase also creates efficiency in the further course of the project. The clearer we can set out the wireframes, the more smoothly the rest of the process runs.

After the wireframing phase, we have a functional blueprint that our designers can start working with. This is the moment where the visual elements and aesthetics of the website come to life. We start by adding colours, typography and other elements to shape the pages. We take spacing, line heights, contrast and many other elements that affect how the website works into account. On top of that, we deal with a range of different devices nowadays. The website needs to be easy to use on every screen size, and that sometimes requires a few adjustments to the design to achieve a good result. Ultimately, we create a working design so we have a clickable ‘prototype’ of the website. This allows us to align closely together on whether everything is as desired.

In the development phase, things start to get even more interesting. The visual and interactive design is turned into a working website. Besides becoming tangible, this phase is also hugely crucial. We start by coding the website in a test environment. This keeps the website out of reach of search engines or other external parties for now. Front-end and back-end development work together to convert the designs into HTML, CSS and/or JavaScript, as well as to set up the server side properly. During this phase we also test extensively whether the design actually works well on all devices. Tests are also carried out regarding the performance of the website. Think of page speed and any health score tests. Naturally, it is important that your website is delivered securely, so we pay attention to SSL, security protocols and any software updates that are needed.

Once the development phase is complete, the right content naturally needs to be shown on the pages. This is a phase that can lie entirely with the client, but can also be partly with Addmark or entirely our responsibility. In any case, it is crucial to already think carefully about any redirects. You do not want to lose valuable positions in the search engines during a migration because redirects are missing. By carrying out an extensive scan of the current website, we map out the existing redirects and combine these with any new redirects that are needed. We also take Meta titles and texts, internal links, URL structure, breadcrumbs, compressed images, ALT texts and other content-related matters into account. This makes your website immediately SEO-proof, so it is properly indexed by Google, Bing or other search engines.

The final phase has arrived: go-live! The content is in place, the migration plan is fully thought through and ready to be carried out. We choose a moment during the week when visitor numbers are lowest. This keeps the impact on visitors to a minimum and allows the migration to be carried out carefully. It is also important that everyone involved is on standby for any setbacks, so we can act quickly. Once the redirects are loaded, the transfer to the main domain can begin. Once the migration is complete, we test the whole website again. We make sure all buttons work properly, all links point to the correct domain, and that no strange 404s or redirect loops have appeared. Finally, we test the page speed and the overall health score of the website once more, so that everything really does work well and the website is definitively part of the worldwide web.