The website
Most people meet Clivio on clivio.fr, long before they open the app. In October I rebuilt it from scratch, from one approved mockup, and it became the reference the app is measured against.
- Pages
- 190 addresses in the sitemap: 73 pages in French, 50 in English, the published articles and 61 glossary terms
- Free tools
- 15 in French, 12 of them in English too, all running in the browser, nothing uploaded
- Content
- 44 blog articles, 38 of them scheduled until January; 89 changelog entries in each language; 35 films
- Built
- 174 commits and 22 pull requests in six days, from 14 to 19 October 2026
- Dependencies
- Five at runtime: Next.js, React, React DOM, MDX and a YAML parser. The old site had 43
- Lighthouse
- 99 performance, 100 accessibility, 100 best practices, 100 SEO, and 3 out of 3 for agentic navigation
Counted in the repository on 19 October 2026.
One binder, four readers
The home page opens on a stack of dividers, one per kind of reader. Each divider has its own promise and the documents filed behind it. Pick one.
Clivio, the binder that files itselfFor renters
Your lease answers for you.
Notice period, rent review, deposit: ask the question, and Clivio finds the clause and answers in one sentence.
Behind this divider
- Scanned with the phoneResidential lease · 12 rue des LilasOne month’s notice, high-demand area
- Received by email · PDFRent receipt · October 2026€1,040.00 excluding charges
- Scanned with the phoneMove-in inventorySigned on March 1, 2024
The binder isn’t decoration. Filing is what the product does, so the page is built like a binder: the sections under the hero are its tabs, and the last call to action is one more divider, labelled “To sort · 3”.
A new site in six days
The product had outgrown its first website.
The first website went up in July, in the same two-week sprint as the app: 86 pages, built to get Clivio online fast. By October the product had found its focus: two plans, a clear audience, e-invoicing at the centre. I reviewed the site line by line, the way I review a client’s, so that every sentence matched what the product does today.
Then I chose a new design over more patches. On 14 October the first commit of a new repository put 92 pages online at once, generated from the boards of the approved mockup, and that repository has been the source ever since. The same day, clivio.app was closed to search engines, and every page that has an equivalent on clivio.fr now redirects there. Four days later the home page moved to another board: the binder above.
A menu that shows the product
The Features menu is a list on the left and a preview on the right. Hover a module and eight seconds of its film loop, cut from the same films as on these pages. The bottom line carries the latest entry of the changelog.
Free tools that keep the file
Fifteen free tools, and not one of them uploads your file.
E-invoicing is becoming mandatory in France, and the home page counts the days until businesses have to issue them, on 1 September 2027. People search for “how do I open this Factur-X invoice?” long before they look for a document vault. So the site answers that question with tools that work on the spot: read an e-invoice in plain language, extract its XML, turn it into a PDF, rename a folder of invoices, create a Factur-X invoice, check a SIREN or VAT number, work out VAT or late-payment penalties, write a notice letter.
- Factur-X, UBL and CII invoices are read in the browser. The XML hidden inside a PDF is pulled out with the browser’s own DecompressionStream, and the renamer hands back a ZIP written without a library.lib/facturx.ts, lib/pdf-embedded-xml.ts, lib/zip.ts
- The invoice creator writes a PDF/A-3 with its factur-x.xml, to the EN 16931 profile: 1,295 lines, no dependency, amounts counted in cents, output checked with veraPDF and the official schematron.lib/facturx-writer.ts
- The SIREN and VAT checker works out the check digits locally, then asks the public company register and VIES.lib/siren.ts, app/actions/vies.ts
- Late-payment penalties follow the ECB rate and the legal interest rates, updated every six months.lib/penalties.ts, content/rates.ts
Written to be found
By people searching Google, and by the AI assistants they increasingly ask instead.
A guide, a glossary, a blog
A guide to the 2026 reform with fourteen pages in French, five of them for one profession each. A glossary of 61 terms, each on its own page. 44 articles in two languages: a scheduled one answers 404 until its date, Paris time, and is sent to Bing through IndexNow that morning.
Comparisons with sources
Five pages compare Clivio with Dext, Regate, Google Drive and Dropbox, Paperless-ngx, Pennylane and Indy. Every fact about a competitor links to its source.
The official list
The list of e-invoicing platforms accredited by the French tax authority (155, plus 11 pending) is copied from impots.gouv.fr with its date. Replace the data and the page recalculates its own figures.
Dates engines can trust
The sitemap gives each page the day its text last changed, not the build time. A script fails the check if a page shows one date and the sitemap another.
Made for AI assistants
/llms.txt presents Clivio and its key pages, /llms-full.txt carries the full articles, and the pages describe themselves in structured data: tools, terms, breadcrumbs.
Tools an agent can call
With WebMCP, an AI agent in Chrome sees seven functions: four of the tools, the FAQ search, the status page and the contact form. It gets data back, not a page. It can fill in the contact form, but a person sends it.
Measured like a client’s site
Tracking is my day job, so the site got the plan I’d write for a client.
Nothing loads before consent. The banner is home-made, with “Reject all” as prominent as “Accept all”, as the CNIL asks. Google Analytics 4 and Microsoft Clarity start only once the visitor accepts, and the choice travels with them to the app, measured as one journey across both domains. Links to the app say where the visitor came from (the page, the campaign, the referring site) without storing anything on the device. The conversions themselves are sent by the app, from the server, so a blocked script can’t lose a sign-up.
| Event | Fires when | Parameters |
|---|---|---|
| cta_click | A link to the app is clicked | app page, plan or source |
| tool_used | A free tool gives its result | tool, success or error, sample or real file |
| video_start, video_complete | A film starts, or plays to the end | film |
| module_view | A feature tab is opened on the home page | module |
| pricing_toggle | Monthly or yearly is picked on the pricing | period |
| calculator_used | The free-plan calculator is used | documents per month |
| language_switch | The visitor switches between French and English | language |
| generate_lead | The contact form is sent | form |
| ai_referral | A visit comes from an AI assistant, once per visit | assistant |
| sign_up, begin_checkout, trial_start, purchase | Sent by the app’s server, not the browser | sign-up method, plan, billing period |
One event I had never needed for a client: ai_referral, for visits sent by ChatGPT, Perplexity, Gemini and four other assistants, recognised by their referrer.
The site sets the bar
Once the site was live, it became the reference for the app.
Every promise on clivio.fr became something to check in the app. On 17 October a run of commits made the code match the site, under one rule written in a commit message: clivio.fr is the reference. Since then it has gone both ways.
In the green, everywhere
Lighthouse on the English home page, tested as a phone on 20 October 2026: fast, accessible, by the book, easy to find, and usable by AI agents.
- 99Performance
- 100Accessibility
- 100Best practices
- 100SEO
- 3/3Agentic navigation
How it got there: the CSS inlined in the page, posters cut down to 768 pixels for phones, no polyfills, the italic font kept off the critical path, and the cookie banner drawn by the server. Agentic navigation is Lighthouse’s newest category: it checks that AI agents can use the page, and that’s where the WebMCP tools count.
On a phone
The dividers keep working on a small screen, with one-word labels on the tabs. The menu becomes a sheet where each menu opens as its own screen, tables turn into cards, and the breadcrumbs shrink to a single link back. There’s no sticky call-to-action bar either: it would have covered the text of 84 pages.
Under the hood
Small on purpose. A marketing site should be quick to load and quick to change.
- Next.js 16 and React 19, with two root layouts: French at the root of clivio.fr, English under /en, each page with its twin.
- No UI kit and no CSS framework. Each page has its own stylesheet, scoped with :where(), so a fix on the French page fixes the English one.
- Two typefaces, Schibsted Grotesk and IBM Plex Mono, served by the site itself, with an Arial fallback reshaped to their metrics: on desktop, the jump while fonts load fell from 417 to 23 pixels.
- No Firebase SDK: the contact form and the status page talk to Firestore over its REST API.
- Five check scripts guard what’s easy to break: share titles, consent, dates, languages and the invoice tools.
- The PageSpeed pass of 19 October took the largest paint on a phone (LCP) from 3.4 to 2.5 seconds.
