The Webflow class system we use on every build
Most Webflow projects rot because classes are named after what things look like. Here is the convention we use instead, and the three rules that keep it intact.
Launch
All writingRedirects, metadata, forms that actually deliver, and analytics that fire. The unglamorous list that separates a calm launch from a bad fortnight.
Launch problems are rarely dramatic. The site goes live, it looks right, and then over the following fortnight you discover that the contact form has been posting into nothing and that half your search traffic is landing on a 404.
Here is what we work through in the final week, in the order we do it.
Export every URL from the old site. Every one gets a destination on the new site or a deliberate decision that it should not have one. Automated rules cover the bulk of it, but the pages with the most inbound links are the ones the rules get wrong, so those get checked by hand.
This is the single most expensive thing to get wrong and the easiest to fix in advance.
Every page needs its own title and description. Two pages sharing a description is a defect. We read the list as a spreadsheet rather than page by page in a browser, because duplicates are obvious in a column and invisible in a tab.
Open Graph images get checked by actually pasting links into a chat app. Preview tools lie; group chats do not.
Submit every form on the site as a real user would, with real values, from a phone as well as a laptop. Confirm the notification arrives in the inbox somebody actually reads, not a shared address that forwards to a person who left.
Test the failure path too. Submit with a missing required field and an invalid email, and check that the error is announced to a screen reader rather than only turning a border red.
Confirm the tag is on every page, including the ones outside the main template like the 404 and the thank-you page. Fire each conversion event once and watch it arrive in real time.
Tab through every page from the top. You are looking for three things: that focus is always visible, that the order makes sense, and that you never get trapped. Then check contrast on anything that changed late, because late changes are where contrast goes to die.
Test on a mid-range Android over a throttled connection, not a laptop on office wifi. Check the largest image on every template, and look for the third-party script that somebody added in week six and nobody remembers approving.
Certificate valid and auto-renewing. One canonical hostname, with the other redirecting to it. Robots file allowing crawling and pointing at a sitemap that lists only pages that exist. Favicon present at every size.
Not Friday afternoon. Whatever you missed will surface within about four hours, and you want the people who can fix it awake, at their desks, and not already at the pub.
Tomas Reiner
Lead developer
Builds and maintains the Webflow work at OrangeOrange, and writes the handover documentation nobody thinks they will read until they do.
Other notes from the studio on the same shelf.
Most Webflow projects rot because classes are named after what things look like. Here is the convention we use instead, and the three rules that keep it intact.
Colour ends arguments prematurely. Designing structure in greyscale forces the conversation you actually need to have, and it makes the visual stage faster.
A hundred-page PDF is a monument, not a tool. What actually keeps a brand consistent is a short document, published where people work, showing misuse alongside correct use.
Expires in
Limited time offer
We rebuilt your site for you. Claim it and we handle everything transfer, hosting, and your domain. Then update it anytime, just by asking AI.