In 2020, we undertook a project to rebrand our company. We changed our name from Sonocent to Glean and developed an entire brand around this new name, including ethos, colors, values, and much more.
A big part of this project involved migrating content from the Sonocent.com domain (as well as other subdomains) to the Glean.co domain, and ensuring that it could all be managed from within the Strapi CMS.
In the past, we didn't have a CMS, and every change on the website, including basic spelling fixes, involved the development team. We decided to use a CMS for the new website to allow users like the Marketing Team to be more independent.
Strapi is hosted in a Kubernetes cluster on Google Cloud using a managed Postgres database and block storage from AWS S3.
The website is built using Gatsby, giving us a GraphQL connection back to Strapi. We decided to go with Gatsby as it's quite performant and we've had a good experience using it. The integration of Gatsby and Strapi was very smooth, especially with the Gatsby Source Strapi plugin.
The UI is implemented with React, using Typescript, and some SASS for styling.
The website is hosted in AWS using S3 and CloudFront (with some Lambda@Edge sprinkled in).
We also run with continuous deployment using Jenkins (also hosted on Kubernetes with GCloud), which runs all of our tests on each change and then re-deploys Strapi or the website (whichever has changed).
We wanted to ensure that we could maximize the organic reach of our content, so we needed to bake the foundations of technical SEO into the website build. Strapi allowed us to manage aspects of SEO, such as metadata and redirects directly through the CMS.
We created a metadata component and added it to the content types. This way, the marketing team can manage the metadata directly from Strapi. Same for the redirects, there are a separate content type with "from" and "to" fields.
We're creating software for people with disabilities. That's why we have heavy accessibility requirements for our product and the website. We could customize Strapi and add some functionalities that were not available out of the box. This customization allowed us to make the website more accessible for people with special needs.
At Glean, accessibility starts in the design phase. We check all the colors we'd like to use to ensure we can achieve a ratio of 7:1 for contrast against black text; this helps work towards a AAA rating. We think about the user experience of mouse users, keyboard users, and those using assistive technology.
Once we have designed it, we'll start building the UI. We have experience with semantic HTML and the use of aria, so we use these where appropriate to ensure everything is understandable through assistive tech. We also ensure that we use sensible accessible names for fields and links which aren’t duplicated. This helps make sure people using voice control can use our web pages.
Before our changes go live, they are automatically tested by Pa11y in our continuous integration system. Pa11y scans our pages to find simple accessibility bugs; if it finds any, it blocks us from releasing the changes until they are fixed.
Pa11y can’t find everything as there is only so much you can test without a real human, so we get a real human to test our changes too in different browsers and using different input devices, from keyboard and mouse to VoiceOver and JAWS.
Once we’ve got the thumbs up, our change goes live. If something does slip through the cracks and we are informed of an accessibility issue, then it is added to our backlog, and a fix is prioritized by the severity of the impact.
In terms of SEO, we have achieved a 60% increase in organic traffic to the Glean website and a 661% increase in visibility in organic search (from 204 ranking keywords to 1,553).
Our users can now manage their content directly through the CMS, whether that's amending content or adding new pages. Our user base spreads throughout the business, covering marketing, sales, legal, and more. In total, we have about 25 users of Strapi from within the business who can log in and manage the content that relates to them and their area of the business.
We can now host multiple types of content on the Glean.co domain through the CMS, including core pages, blogs, resources, and event sign-ups.