Jamstack Website Redesign
Migration from Wordpress to Hugo for a B2B company
Hugo 
Microsoft Azure 
Bulma CSS 
Figma 
Who's the company?
a3SIDES S.L is a small local company based in Paterna (Valencia, Spain), which is dedicated to supporting accountants and SMEs in the area, offering the most complete accounting and billing software solutions as well as all the necessary hardware infrastructure.
The company was founded in 2016, as a consolidation of three distinct entrepreneurial structures that have more than 25 years of experience.
The problem
The website was under-performing, and upon analyzing the analytics, it became apparent that it had been hit by a Google algorithmic penalization in August 2018.
After analyzing each page's content and network parameters, including the number and size of loaded resources, an action plan has been developed.
| Browser name | Usage |
|---|---|
| Google Chrome | 53.92% |
| Internet Explorer 11 | 30.22% |
| Firefox | 6.36% |
| Microsoft Edge | 3.63% |
| Safari | 3.47% |
| Others | 2.39% |
Constraints
The website's analytics were analyzed to determine the primary areas of focus. The findings indicated that 30% of the site's users were still using Internet Explorer.
Although this may seem uncommon for B2C websites, it was expected since the company is B2B and frequently receives visits from customers seeking technical support.
To better determine the design breakpoints, I looked into the screen resolutions that were commonly used to access the website
It was interesting to see the technology trends among Spanish SMBs during that time.
| Screen Resolution | % of users |
|---|---|
| 1920x1080 | 32.00% |
| 1366x768 | 19.50% |
| 1280x1024 | 9.00% |
| 1024x768 | 8.50% |
| 1600x900 | 8.00% |
| 1440x900 | 7.50% |
| Others | 15.50% |
Previous design
Some issues have been identified in the previous website design, which require attention:
The website had a non-accessible carousel above the fold, whose text was embedded in the images themselves. This made it inaccessible to users who depend on assistive technology. Additionally, search engine crawlers were unable to detect the text.
The design was not optimized for mobile users. The website was launched in 2016 when the number of mobile users was lower. Thinking forward, the decision to redesign the website in 2019 has been far-sighted, as digital habits changed significantly in 2020.
The website had a slow loading speed. Some pages took over 7 seconds to load, which certainly led to a poor user experience.
Some sub-pages had thin or duplicated content, which negatively affected the website's ranking in search engine results.
In interviews, it was discovered that WordPress was not providing the desired experience. Among various comments, the performance of the admin interface was not up to par, and there were a few instances of hacker attacks that caused problems for the site.
The solution
I decided to propose Jamstack as a solution since I was familiar with this approach.
To build the website, Hugo was chosen for its speed and ability to process a high number of pages. Forestry.io was selected for the admin interface required to edit the content.
The project included a CI/CD phase using GitLab, and Azure was selected for its Content Delivery Network (CDN), which was already in use by the in-house sysadmin team.