On Oct. 25th, Dispel launched a complete rebuild of https://dispel.io. It was a complete re-write and rebuild that allowed us to cut a significant amount of pages, speed it up by a lot, and focus our messaging.
As our Ian remarked in August (https://blog.dispel.io/its-about-convenience-stupid/), earlier this year it seems like Dispel found product market fit. And with that fit, it was increasingly clear that the messaging we were putting out through Dispel's website was old and didn't correlate to how we were currently talking about and selling our product.
In combination with that, Dispel's website was pretty slow by modern standards. For example, it didn't utilize modern ways of loading images, videos, and content.
What we did:
- Completely re-written copy that's clearer and to the point
- Cut from 20-something pages to 4 (landing, security, about, resources) when finding product market fit
- Built on: GatsbyJS with a BEMIT CSS structure
- Cutting loading time by seconds by minimizing Dispel's website, cutting external font loading, lazy loading images and videos with gatsby-image and react-lazyload, and compressing our code
What were the results:
A brief look at Dispel's landing hero. With this rebuild, our copy got a lot more focused throughout the website and gets to the point much quicker than before.
Dispel cut time to interaction from 9s to 0.9s, with a first contentful paint improvement from 1.8s to 0.1s. That's a pretty nice improvement.
This post is a brief look at the initial wins, with a more in-depth post to follow that'll go through copy, SEO, and code choices. But for now, go and check out Dispel's new website (https://dispel.io) and let us know what you think.