The Malwarebytes new website design resonated with users when it launched 2 years prior to us jumping on this project. After it launched, the website was used not only to sell products, but to solve problems that weren’t directly related to the website at all. On top of all that, the company was growing – fast. With rapid growth came new business initiatives, which came with fast turnaround times and quick, often short term decisions. All this combined began to change the user experience and user interface, and not for the better. It began to lose cohesion, cutting-edge design, and seamless UX.
My fellow web developer, Nino Pelaez and I decided it was time to change the website for the better. We wanted to keep the existing design and layout concepts, but introduce cohesion, improve site performance, make the website incredibly flexible to change, and most importantly – make it mobile.
So we did. We used the power of SASS to compartmentalize every global element. We used the Atomic Design theory, and made sure any element could be used in and around just about any other element. We took the time to code up fail-safe HTML that could handle small and large character-count copy. Most importantly, we made the website lighter by stripping out unnecessary fonts and resources – over 100MB lighter, in fact. Cutting the size of the website down to 2/3 the size, resulting in a faster, cleaner user experience.
Just days after launching the site, Google recognized the website as “mobile friendly”. Malwarebytes’ organic (Google Search) traffic increased by 15%. Load times decreased about a second on average. And, for the first time in Malwarebytes history, the corporate website was mobile friendly.