Skip to content

docs: rewrite homepage to lead with positioning + add /about and /why-etherpad #361

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
JohnMcLear merged 1 commit into from
Apr 17, 2026
Merged

docs: rewrite homepage to lead with positioning + add /about and /why-etherpad #361

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
69 changes: 69 additions & 0 deletions app/about/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
import {Header} from "../../src/pagesToDisplay/Header.tsx";
import {Footer} from "../../src/components/Footer.tsx";

export default function AboutPage() {
return <div className="dark:bg-gray-800">
<div className="sticky top-0 z-50">
<div className="relative top-0">
<Header/>
</div>
</div>

<div className="main-container">
<div className="content wrap dark:text-gray-300">
<h1 className="text-4xl font-bold mt-16 mb-2 dark:text-white">An editor for documents that matter</h1>
<p className="text-xl italic mt-2 mb-12 dark:text-gray-400">Why Etherpad exists, what it&apos;s for, and what it won&apos;t do.</p>

<h2 className="text-2xl text-primary font-bold mt-12 mb-4">The problem</h2>
<p className="mb-4">Most collaborative editors are designed to forget.</p>
<p className="mb-4">They show you the current version of the document. They hide the history behind menus. They obscure who wrote what. They live on servers you don&apos;t control, governed by terms you don&apos;t write, owned by companies whose business model is the opposite of trust.</p>
<p className="mb-4">For most documents &mdash; a shopping list, a meeting note, a draft email &mdash; none of that matters.</p>
<p className="mb-4">For some documents, it matters enormously.</p>

<h2 className="text-2xl text-primary font-bold mt-12 mb-4">The documents that matter</h2>
<p className="mb-4">If a country were drafting a new constitution, where would they write it?</p>
<p className="mb-4">If a treaty were being negotiated between governments, where would they draft it?</p>
<p className="mb-4">If a scientific paper were being co-authored across continents, where would the record of authorship live?</p>
<p className="mb-4">If a piece of investigative journalism were being assembled from sources who need to know that their words won&apos;t be silently edited by a platform, where would they write?</p>
<p className="mb-4">If a school were teaching children that what they say belongs to them, what tool would they put in front of them?</p>
<p className="mb-4">These documents share something in common. Provenance is not a nice-to-have &mdash; it is the entire point. <em>Who said what, when, and why</em> is part of the meaning of the document itself.</p>

<h2 className="text-2xl text-primary font-bold mt-12 mb-4">What Etherpad is</h2>
<p className="mb-4">Etherpad is the editor for those documents.</p>
<p className="mb-4">Every keystroke is attributed. Every revision is preserved. Every change is reversible. The timeslider lets you scrub through the entire history of a document, character by character, watching it come into being. The author colours aren&apos;t a hidden feature &mdash; they&apos;re the product. They make authorship visible, by default, to everyone who reads.</p>
<p className="mb-4">And the whole thing runs on your server, under your governance, with no telemetry, no upsells, no terms of service you didn&apos;t agree to. AI is a plugin you install, pointed at the model you choose, running on infrastructure you control &mdash; not a feature decided for you in a boardroom you weren&apos;t in. The code is Apache 2.0. The data format is open. The history is yours.</p>

<h2 className="text-2xl text-primary font-bold mt-12 mb-4">Our principles</h2>
<ul className="list-none pl-0 space-y-3 mb-4">
<li><strong>Honest.</strong> We tell you what the software does and what it doesn&apos;t.</li>
<li><strong>Open.</strong> Source, format, governance, roadmap.</li>
<li><strong>Transparent.</strong> No hidden state. No invisible edits. No silent changes.</li>
<li><strong>Malleable.</strong> A plugin system that lets you make Etherpad fit your work, not the other way around.</li>
<li><strong>Accessible.</strong> 105 languages. Runs on a Raspberry Pi or a server farm. Works in any modern browser.</li>
<li><strong>Truthful.</strong> The document tells the truth about itself. Who wrote it, when, and how it got to be what it is.</li>
</ul>

<h2 className="text-2xl text-primary font-bold mt-12 mb-4">What we won&apos;t do</h2>
<p className="mb-4">We won&apos;t pander to the trends. We won&apos;t add surveillance. We won&apos;t pivot to extraction. We won&apos;t bury the authorship to make the UI cleaner. We won&apos;t give up the values to grow the userbase.</p>
<p className="mb-4">The world is trending the other way. We&apos;re holding the line.</p>

<h2 className="text-2xl text-primary font-bold mt-12 mb-4">A short history of holding the line</h2>
<p className="mb-4">Etherpad has been quietly used by Wikimedia, governments, EU public-sector institutions, universities, and self-hosters around the world since 2009. No pivots. No acquisitions. No enshittification. Just sixteen years of doing the same thing, well.</p>
<p className="mb-4">That kind of stability is itself a feature. Institutions that adopt Etherpad in 2026 can reasonably expect it to still be Etherpad in 2036 &mdash; still open, still self-hostable, still attributing every keystroke, still owned by no one.</p>
<p className="mb-4">Almost no other software in this category can credibly say the same.</p>

<h2 className="text-2xl text-primary font-bold mt-12 mb-4">What you can do</h2>
<p className="mb-4">If this matters to you:</p>
<ul className="list-disc pl-8 space-y-2 mb-4">
<li><a className="underline" target="_blank" href="https://github.com/ether/etherpad-lite">Run an Etherpad</a> for your team, your organisation, your school, your community.</li>
<li>Contribute &mdash; code, documentation, translations, plugins, time.</li>
<li>Tell someone else this exists. A generation of developers and decision-makers grew up after Etherpad&apos;s first wave of fame and have never heard of it. Word of mouth is how this kind of project survives.</li>
</ul>
<p className="mb-12">The documents that matter deserve an editor that takes them seriously.</p>
<p className="mb-12 italic">That&apos;s what Etherpad is for.</p>
</div>

<Footer/>
</div>
</div>
}
6 changes: 6 additions & 0 deletions app/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@ import {CookieBanner} from "../src/components/CookieBanner.tsx";
import {Header} from "../src/pagesToDisplay/Header.tsx";
import {MainHeadline} from "../src/pagesToDisplay/MainHeadline.tsx";
import {RealTimeCollaboration} from "../src/pagesToDisplay/RealTimeCollaboration.tsx";
import {WhoUsesEtherpad} from "../src/pagesToDisplay/WhoUsesEtherpad.tsx";
import {AIOnYourTerms} from "../src/pagesToDisplay/AIOnYourTerms.tsx";
import {AddFunctionalities} from "../src/pagesToDisplay/AddFunctionalities.tsx";
import {CustomizeAppearance} from "../src/pagesToDisplay/CustomizeAppearance.tsx";
import {DownloadLatestVersion} from "../src/pagesToDisplay/DownloadLatestVersion.tsx";
Expand All @@ -27,6 +29,10 @@ export default function Page() {
<MainHeadline/>
<a className="scroll-point" id="about"></a>
<RealTimeCollaboration/>
<a className="scroll-point" id="who"></a>
<WhoUsesEtherpad/>
<a className="scroll-point" id="ai"></a>
<AIOnYourTerms/>
<a className="scroll-point" id="customize"></a>
<AddFunctionalities/>
<CustomizeAppearance/>
Expand Down
83 changes: 83 additions & 0 deletions app/why-etherpad/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
import {Header} from "../../src/pagesToDisplay/Header.tsx";
import {Footer} from "../../src/components/Footer.tsx";

export default function WhyEtherpadPage() {
return <div className="dark:bg-gray-800">
<div className="sticky top-0 z-50">
<div className="relative top-0">
<Header/>
</div>
</div>

<div className="main-container">
<div className="content wrap dark:text-gray-300">
<h1 className="text-4xl font-bold mt-16 mb-2 dark:text-white">Why Etherpad?</h1>
<p className="text-xl italic mt-2 mb-12 dark:text-gray-400">Honest comparison with the alternatives. Where Etherpad is stronger, where it isn&apos;t, and which one you should use.</p>

<p className="mb-4">Most product comparison pages exist to win the click. This one doesn&apos;t. Etherpad isn&apos;t the right tool for everyone, and pretending otherwise would betray our first principle &mdash; honesty.</p>

<p className="mb-8">Here&apos;s an honest read on how Etherpad compares with the major collaborative editors in 2026.</p>

<h2 className="text-2xl text-primary font-bold mt-12 mb-4">Capability comparison</h2>

<div className="overflow-x-auto mb-8">
<table className="min-w-full text-sm border border-gray-700">
<thead className="bg-gray-700 text-white">
<tr>
<th className="text-left p-2 border border-gray-600">Capability</th>
<th className="text-left p-2 border border-gray-600">Etherpad</th>
<th className="text-left p-2 border border-gray-600">Google Docs</th>
<th className="text-left p-2 border border-gray-600">MS&nbsp;Word/365</th>
<th className="text-left p-2 border border-gray-600">Notion</th>
<th className="text-left p-2 border border-gray-600">CryptPad</th>
<th className="text-left p-2 border border-gray-600">HedgeDoc</th>
</tr>
</thead>
<tbody className="dark:text-gray-300">
<tr><td className="p-2 border border-gray-600">Real-time multi-user editing</td><td className="p-2 border border-gray-600">Yes</td><td className="p-2 border border-gray-600">Yes</td><td className="p-2 border border-gray-600">Yes</td><td className="p-2 border border-gray-600">Yes</td><td className="p-2 border border-gray-600">Yes</td><td className="p-2 border border-gray-600">Yes</td></tr>
<tr><td className="p-2 border border-gray-600">Per-character authorship visible by default</td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600">No (hidden)</td><td className="p-2 border border-gray-600">No (hidden)</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">Partial</td><td className="p-2 border border-gray-600">No</td></tr>
<tr><td className="p-2 border border-gray-600">Full history scrubbable character-by-character</td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600">No (snapshots)</td><td className="p-2 border border-gray-600">No (snapshots)</td><td className="p-2 border border-gray-600">Limited</td><td className="p-2 border border-gray-600">Limited</td><td className="p-2 border border-gray-600">Limited</td></tr>
<tr><td className="p-2 border border-gray-600">Open source</td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">Yes</td><td className="p-2 border border-gray-600">Yes</td></tr>
<tr><td className="p-2 border border-gray-600">Self-hostable</td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">Yes</td><td className="p-2 border border-gray-600">Yes</td></tr>
<tr><td className="p-2 border border-gray-600">No corporate owner</td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">Yes (foundation)</td><td className="p-2 border border-gray-600">Yes</td></tr>
<tr><td className="p-2 border border-gray-600">Apache 2.0 / permissive licence</td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">AGPL</td><td className="p-2 border border-gray-600">AGPL</td></tr>
<tr><td className="p-2 border border-gray-600">15+ years stable, no pivots</td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600">N/A</td><td className="p-2 border border-gray-600">N/A</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">~10 years</td><td className="p-2 border border-gray-600">~7 years</td></tr>
<tr><td className="p-2 border border-gray-600">End-to-end encryption</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600">No</td></tr>
<tr><td className="p-2 border border-gray-600">Multiple document types (sheets, slides, etc.)</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600">No</td></tr>
<tr><td className="p-2 border border-gray-600">Mobile-first experience</td><td className="p-2 border border-gray-600">No</td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600"><strong>Yes</strong></td><td className="p-2 border border-gray-600">Limited</td><td className="p-2 border border-gray-600">Limited</td></tr>
</tbody>
</table>
</div>

<h2 className="text-2xl text-primary font-bold mt-12 mb-4">When you should use something else</h2>

<p className="mb-4"><strong>Use CryptPad if</strong> end-to-end encryption is non-negotiable for your threat model. CryptPad encrypts in the browser and even the server operator cannot read your documents. Etherpad does not.</p>

<p className="mb-4"><strong>Use HedgeDoc if</strong> you want a markdown-first collaborative editor with native rendering, slides mode, and code highlighting baked in. Etherpad can do markdown via plugin, but HedgeDoc is purpose-built for it.</p>

<p className="mb-4"><strong>Use Onlyoffice or Collabora if</strong> you need a full office suite (documents, spreadsheets, slides) with formatting compatible with Microsoft Office. Etherpad has one editor type.</p>

<p className="mb-4"><strong>Use Google Docs or Notion if</strong> you want polished mobile apps, integrated suites, and modern AI features that you don&apos;t mind running on a third-party model. Both are more polished than Etherpad and have larger feature surfaces. They are also more expensive in ways that don&apos;t show up on the bill.</p>

<p className="mb-8"><strong>Use Git if</strong> the document is code, the history needs cryptographic integrity, and you don&apos;t need real-time collaboration.</p>

<h2 className="text-2xl text-primary font-bold mt-12 mb-4">When you should use Etherpad</h2>

<p className="mb-4">Etherpad is the right choice when:</p>
<ul className="list-disc pl-8 space-y-2 mb-4">
<li>You need <strong>real-time collaborative editing</strong> with no setup friction for editors.</li>
<li>You need <strong>visible, per-character authorship</strong> as the default UX &mdash; not buried in a menu.</li>
<li>You need to <strong>self-host</strong> for sovereignty, GDPR, regulatory, or institutional reasons.</li>
<li>You need a tool with <strong>no corporate owner</strong> &mdash; one that cannot be acquired and shut down, and that has a track record of holding the line.</li>
<li>You need <strong>opt-in AI</strong> rather than forced AI &mdash; or no AI at all.</li>
<li>You need to <strong>extend the editor</strong> to fit a specific institutional workflow without forking, without enterprise contracts, and without permission from a vendor.</li>
<li>You value <strong>boring stability</strong> over feature novelty. Etherpad has been doing the same thing well since 2009.</li>
</ul>

<p className="mb-12">If most of those apply, you&apos;re probably in the right place.</p>
</div>

<Footer/>
</div>
</div>
}
2 changes: 1 addition & 1 deletion src/components/Footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,9 +17,9 @@ export const Footer = ()=>{
<p>The Etherpad logos by <span {...CCC_ATTR} property="cc:attributionName">Marcel Klehr</span> are
licensed under a <a rel="license" href="https://creativecommons.org/licenses/by-sa/3.0/">Creative
Commons Attribution-ShareAlike 3.0 Unported License</a>.</p>
<p>Bitcoin public address: 198uyayMFVHUmrcuzWKFSMAkmwfkQgQEXj</p>
<p>Thanks to <a href="https://github.com/seballot" target="_blank">@seballot</a> and
<a href="https://github.com/SamTV12345" target={"_blank"}> @SamTV12345</a> for the redesign</p>
<p className="text-xs opacity-60 mt-2">Bitcoin: 198uyayMFVHUmrcuzWKFSMAkmwfkQgQEXj</p>
</div>

<Suspense>
Expand Down
Loading