behaav-logo-wit-case

Security first for the new website for Behaav

At Behaav, they help organisations with awareness and cybersecure behaviour. That makes for a great connection with the HubSpot CMS, where security is essential. That is of course not the only reason, as there are plenty of benefits to choosing the HubSpot CMS and delivering a beautiful website.

  • Home
  • Cases
  • Security first for the new website for Behaav
addmark-headermockup-behaav
Accounted
for user stories
Collecting
the right data
Extensive
personalisation options
About Behaav

A secure and audience-focused website for Behaav

Behaav approached Addmark to develop a new website with the HubSpot CMS. They use the HubSpot CRM and additional Hubs, so the CMS connects seamlessly with the other systems. We started by setting up wireframes, taking the user stories into account. This is an essential part of telling a clear story for the various target audiences. The wireframes were then brought to life in the design, closely following the brand book. Finally, we brought the website to life with development and the right content and put it live on the web.

Synergy with all Hubs

Tight deadline and an extensive website

Because Behaav already works with other HubSpot Hubs, we can combine all touch points to achieve powerful results. Think of the personalisation options on the website in the form of smart content, where the content of the pages adapts based on the visitor’s lifecycle stage. Interactions with the website are also logged on the contact record, so you can act proactively when specific pages have been viewed. For example, send automated emails from the contact owner based on page views, or trigger an automatic task for your sales manager once more than 10 pages have been viewed. In short, it opens many doors for personalised marketing and sales!

addmark-cases-behaav-website-slider-overview addmark-cases-behaav-website-slider-methode addmark-cases-website-slider-dienstverlening addmark-cases-website-slider-header
addmark-cases-behaav-website-slider-overview addmark-cases-behaav-website-slider-methode addmark-cases-website-slider-dienstverlening addmark-cases-website-slider-header
Approach

Tight planning & maximum results

With a strategic approach and a clear step-by-step plan, we always deliver our websites with a clear goal in mind. This strengthens the synergy between design, development and marketing to achieve maximum results. How do we do that? We can explain it in 5 steps.

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 keep the goal of the website clearly in mind. Wireframing is essentially about creating a sketch of the website that shows the basic structure of the pages. In this phase, we leave aside all design elements such as colours or images, it is purely about the purpose of the pages. The final wireframes help our designers focus on the user experience (UX) by making the navigation and interaction on the website understandable. During this phase, we continuously check whether the layout of the page works for the visitor. Ultimately, this phase also improves efficiency for the rest of the project. The clearer we can set up the wireframes, the more smoothly the rest of the process runs.

After the wireframing phase, we have a functional blueprint that our designers can work 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. Spacing, line heights, contrast and many other elements that affect how the website works are all taken into account. On top of that, we deal with a range of different devices today. 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. Finally, we create a working design, so we end up with a clickable ‘prototype’ of the website. This makes it easy to align together on whether everything is as desired.

The development phase is where things get even more interesting. The visual and interactive design is converted into a working website. Besides becoming tangible, this phase is also hugely important. We start by coding the website in a test environment, so it stays out of reach of search engines or other outside parties. 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 correctly. During this phase, we also thoroughly test whether the design actually works well on all devices. Tests are also carried out on the performance of the website, such as page speed and health score checks. 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 handled partly, or fully, by Addmark. In any case, it is crucial to think carefully about any redirects in advance. During a migration, you do not want to lose valuable positions in the search engines because redirects are missing. By running an extensive scan of the current website, we map out the existing redirects and combine them 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 can be indexed properly 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 pick a moment in the week when visitor numbers are lowest, so the impact on visitors is as small as possible and the migration can be handled carefully. It is also important that everyone involved is on standby for any setbacks, so we can act quickly if needed. Once the redirects are loaded, the transfer to the main domain can begin. When the migration is complete, we test the entire website once more. We make sure all buttons work as intended, all links point to the correct domain, and no strange 404s or redirect loops have appeared. Finally, we test the page speed and overall health score of the website once more, so that everything really does work well and the website is definitively live on the web.

1. Wireframing

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 keep the goal of the website clearly in mind. Wireframing is essentially about creating a sketch of the website that shows the basic structure of the pages. In this phase, we leave aside all design elements such as colours or images, it is purely about the purpose of the pages. The final wireframes help our designers focus on the user experience (UX) by making the navigation and interaction on the website understandable. During this phase, we continuously check whether the layout of the page works for the visitor. Ultimately, this phase also improves efficiency for the rest of the project. The clearer we can set up the wireframes, the more smoothly the rest of the process runs.

2. Design

After the wireframing phase, we have a functional blueprint that our designers can work 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. Spacing, line heights, contrast and many other elements that affect how the website works are all taken into account. On top of that, we deal with a range of different devices today. 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. Finally, we create a working design, so we end up with a clickable ‘prototype’ of the website. This makes it easy to align together on whether everything is as desired.

3. Development

The development phase is where things get even more interesting. The visual and interactive design is converted into a working website. Besides becoming tangible, this phase is also hugely important. We start by coding the website in a test environment, so it stays out of reach of search engines or other outside parties. 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 correctly. During this phase, we also thoroughly test whether the design actually works well on all devices. Tests are also carried out on the performance of the website, such as page speed and health score checks. 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.

4. Content

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 handled partly, or fully, by Addmark. In any case, it is crucial to think carefully about any redirects in advance. During a migration, you do not want to lose valuable positions in the search engines because redirects are missing. By running an extensive scan of the current website, we map out the existing redirects and combine them 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 can be indexed properly by Google, Bing or other search engines.

5. Go-live

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 pick a moment in the week when visitor numbers are lowest, so the impact on visitors is as small as possible and the migration can be handled carefully. It is also important that everyone involved is on standby for any setbacks, so we can act quickly if needed. Once the redirects are loaded, the transfer to the main domain can begin. When the migration is complete, we test the entire website once more. We make sure all buttons work as intended, all links point to the correct domain, and no strange 404s or redirect loops have appeared. Finally, we test the page speed and overall health score of the website once more, so that everything really does work well and the website is definitively live on the web.

"Experienced and skilled people who put customer focus first. A great HubSpot partner to work with!"
Rudy Spinola Managing Partner
addmark-case-behaav-review-rudy
Featured Cases

Projects we are proud of!

Automatisch cadeaus versturen met HubSpot en Thanqs
HubSpot Data & Automation

Automatisch cadeaus versturen met HubSpot en ...

Operational Excellence met HubSpot en ClickUp bij Frame Offices
Strategie HubSpot Sales

Operational Excellence met HubSpot en ClickUp bij ...

HubSpot verbindt data, teams en systemen bij Special Cargo
HubSpot Data & Automation Sales

HubSpot verbindt data, teams en systemen bij ...

Een moderne website die vertrouwen en persoonlijkheid uitstraalt
Website

Een moderne website die vertrouwen en ...

BTS Logistics navigeert naar commerciële efficiëntie
HubSpot Data & Automation

BTS Logistics navigeert naar commerciële ...

Injuriam-Expertise
BTS Logistics