128 lines
6.1 KiB
HTML
128 lines
6.1 KiB
HTML
|
<!doctype html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="utf-8">
|
|||
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|||
|
|
<title>The conventional stack — Silent Mode</title>
|
|||
|
|
<meta name="description" content="Registrars, hosts, CDNs and certificate authorities. What each layer costs, what it does well, and where each one keeps a veto.">
|
|||
|
|
<link rel="stylesheet" href="/shared.css">
|
|||
|
|
<style>
|
|||
|
|
body{background:#070a11}
|
|||
|
|
body::before{
|
|||
|
|
content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
|
|||
|
|
background:radial-gradient(720px 460px at 50% -6%, rgba(75,123,236,.12), transparent 62%);
|
|||
|
|
}
|
|||
|
|
main{position:relative;z-index:1;max-width:880px;margin:0 auto;padding:5rem 1.4rem 3rem}
|
|||
|
|
|
|||
|
|
.capsule{width:84px;height:38px;border-radius:999px;margin:0 auto 26px;position:relative;
|
|||
|
|
background:linear-gradient(180deg,#4b7bec,#1e3a8a);
|
|||
|
|
box-shadow:inset 0 -3px 6px rgba(0,0,0,.35), 0 8px 26px rgba(75,123,236,.24)}
|
|||
|
|
.capsule::before{content:"";position:absolute;top:5px;left:12px;right:12px;height:9px;border-radius:999px;
|
|||
|
|
background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0));filter:blur(1px)}
|
|||
|
|
|
|||
|
|
main h1{font-size:clamp(1.9rem,4.4vw,2.6rem);font-weight:600;text-align:center;
|
|||
|
|
margin:0 0 1rem;line-height:1.22;letter-spacing:.2px}
|
|||
|
|
.lede{color:var(--mut);font-size:1.03rem;text-align:center;max-width:660px;margin:0 auto 2.8rem}
|
|||
|
|
|
|||
|
|
h2{font-size:1.1rem;font-weight:600;margin:0 0 1rem;letter-spacing:.2px}
|
|||
|
|
.layers{display:grid;gap:11px;margin-bottom:2.4rem}
|
|||
|
|
.layer{background:rgba(255,255,255,.026);border:1px solid rgba(255,255,255,.07);
|
|||
|
|
border-radius:12px;padding:15px 18px;display:grid;grid-template-columns:130px 1fr;gap:14px}
|
|||
|
|
@media (max-width:620px){.layer{grid-template-columns:1fr;gap:6px}}
|
|||
|
|
.layer .who{color:var(--ink);font-size:14px;font-weight:600}
|
|||
|
|
.layer .who small{display:block;color:var(--dim);font-weight:400;font-size:12px;margin-top:2px}
|
|||
|
|
.layer .what{color:var(--mut);font-size:14px;line-height:1.65}
|
|||
|
|
.layer .what em{color:#7fa3f2;font-style:normal}
|
|||
|
|
|
|||
|
|
.fair{background:var(--panel);border:1px solid var(--line);border-left:3px solid #7fa3f2;
|
|||
|
|
border-radius:11px;padding:17px 20px;color:var(--mut);font-size:14px;line-height:1.72;margin-bottom:2.4rem}
|
|||
|
|
.fair b{color:var(--ink)}
|
|||
|
|
|
|||
|
|
table{margin-bottom:2.4rem}
|
|||
|
|
td b{color:var(--ink)}
|
|||
|
|
|
|||
|
|
.door{text-align:center;background:rgba(255,77,94,.05);border:1px solid rgba(255,77,94,.22);
|
|||
|
|
border-radius:14px;padding:22px 20px}
|
|||
|
|
.door p{color:var(--mut);font-size:14px;margin:0 0 1rem;line-height:1.7;max-width:560px;margin-left:auto;margin-right:auto}
|
|||
|
|
.door a.btn{background:#ff4d5e;color:#0d0509;border:none}
|
|||
|
|
|
|||
|
|
.foot{color:var(--mut);font-size:12.5px;text-align:center;margin-top:3rem;line-height:1.8}
|
|||
|
|
.foot a{color:var(--mut);text-decoration:underline;text-underline-offset:2px}
|
|||
|
|
.foot a:hover{color:var(--ink)}
|
|||
|
|
</style>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
|
|||
|
|
<main>
|
|||
|
|
|
|||
|
|
<div class="capsule" aria-hidden="true"></div>
|
|||
|
|
<h1>Rent it, like everyone.</h1>
|
|||
|
|
<p class="lede">This is the stack almost every site on the internet is built on. It is
|
|||
|
|
mature, it is inexpensive, and it is very good at its job. It is also five separate
|
|||
|
|
companies, each of whom can independently decide your project is over.</p>
|
|||
|
|
|
|||
|
|
<h2>Who holds what</h2>
|
|||
|
|
<div class="layers">
|
|||
|
|
<div class="layer">
|
|||
|
|
<div class="who">Registrar <small>GoDaddy, Namecheap, Cloudflare</small></div>
|
|||
|
|
<div class="what">Leases you the name, yearly. <em>Can suspend or transfer it</em> on a
|
|||
|
|
court order, a UDRP ruling, or its own policy — and must, by contract with the
|
|||
|
|
registry.</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="layer">
|
|||
|
|
<div class="who">Host <small>AWS, Hetzner, DigitalOcean</small></div>
|
|||
|
|
<div class="what">Runs the machine. <em>Can terminate under acceptable-use terms</em>,
|
|||
|
|
usually with notice, sometimes without.</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="layer">
|
|||
|
|
<div class="who">CDN / proxy <small>Cloudflare, Fastly</small></div>
|
|||
|
|
<div class="what">Sits in front of your traffic. <em>Can stop carrying it</em> — and has,
|
|||
|
|
publicly, for customers who broke no law.</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="layer">
|
|||
|
|
<div class="who">Certificate authority <small>Let's Encrypt, DigiCert</small></div>
|
|||
|
|
<div class="what">Vouches that you are you. <em>Can revoke</em>, at which point browsers
|
|||
|
|
refuse the connection regardless of who is right.</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="layer">
|
|||
|
|
<div class="who">App store / payments <small>Apple, Google, Stripe</small></div>
|
|||
|
|
<div class="what">If money or an app is involved, two more parties with terms and a
|
|||
|
|
<em>right to decline</em>.</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<h2>What it costs</h2>
|
|||
|
|
<table>
|
|||
|
|
<tr><th>Item</th><th>Typical</th><th>Note</th></tr>
|
|||
|
|
<tr><td><b>.com</b>, first year</td><td>$1–12</td><td>usually a promotional rate</td></tr>
|
|||
|
|
<tr><td><b>.com</b>, renewal</td><td>$12–20/yr</td><td>the real price; wholesale is ~$9.59</td></tr>
|
|||
|
|
<tr><td>Small VPS</td><td>$4–8/mo</td><td>plus your time</td></tr>
|
|||
|
|
<tr><td>TLS certificate</td><td>$0</td><td>Let's Encrypt, genuinely free</td></tr>
|
|||
|
|
<tr><td>Renewal, forever</td><td>every year</td><td>stop paying and the name returns to the market</td></tr>
|
|||
|
|
</table>
|
|||
|
|
|
|||
|
|
<div class="fair">
|
|||
|
|
<b>To be fair to it.</b> This stack is fast, well documented, supported at 3am, and
|
|||
|
|
integrates with everything. The vetoes above also remove phishing sites, malware hosts
|
|||
|
|
and worse — they exist for reasons, and most of the time they are used reasonably. If
|
|||
|
|
you are shipping a normal business, this is the sensible default and it is not close.
|
|||
|
|
The alternative gives up the support desk along with the gatekeeper.
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="door">
|
|||
|
|
<p>The other option is not a replacement for all of that. It replaces exactly one
|
|||
|
|
layer — the one that decides whether the name is still yours — and leaves the rest of
|
|||
|
|
your choices open. Same day, few cents, no account.</p>
|
|||
|
|
<a class="btn" href="/register.html">See what a name costs there →</a>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<p class="foot">
|
|||
|
|
<a href="/choose/">← Back to the choice</a> · <a href="/">silentmode.st</a><br>
|
|||
|
|
Company names are examples of each layer, not endorsements or accusations.
|
|||
|
|
</p>
|
|||
|
|
|
|||
|
|
</main>
|
|||
|
|
|
|||
|
|
</body>
|
|||
|
|
</html>
|