32 lines
3.6 KiB
HTML
32 lines
3.6 KiB
HTML
|
<section id="site" data-transition="fade" style="background:#F6F7F0;color:#3E5550;font-family:'IBM Plex Sans', Arial, sans-serif;padding:128px 128px 160px;display:flex;flex-direction:column;gap:48px">
|
|||
|
|
<div style="display:flex;flex-direction:column;gap:16px">
|
|||
|
|
<p style="font-size:24px;letter-spacing:3px;text-transform:uppercase;color:#176754;font-weight:600">02 · Héberger sans posséder</p>
|
|||
|
|
<h2 style="font-family:'Source Serif 4', Georgia, serif;font-size:64px;font-weight:400;line-height:1.1;color:#152F2C">Un site héberge, une organisation possède.</h2>
|
|||
|
|
</div>
|
|||
|
|
<div style="display:grid;grid-template-columns:1fr 300px 1fr;gap:32px;align-items:center">
|
|||
|
|
<div style="display:flex;flex-direction:column;gap:16px;background:#FDFDFA;border:1px solid #D5DFD7;border-radius:12px;padding:40px">
|
|||
|
|
<h3 style="font-size:32px;font-weight:600;color:#7A5A1E">Le site · l’hébergeur</h3>
|
|||
|
|
<p style="font-size:26px;line-height:1.4">Grappe Proxmox, SDN, stockage, frontière OPNsense.</p>
|
|||
|
|
<p style="font-size:26px;line-height:1.4">Crée et détruit les machines, avec sa propre voûte.</p>
|
|||
|
|
<p style="font-size:26px;line-height:1.4">Prête trois services à un écosystème jeune : les paquets, la forge du moteur, la résolution de noms.</p>
|
|||
|
|
</div>
|
|||
|
|
<div style="display:flex;flex-direction:column;gap:20px;align-items:center">
|
|||
|
|
<p style="font-size:24px;color:#152F2C;text-align:center">fiche du site</p>
|
|||
|
|
<x-shape kind="arrow-right" style="width:180px;height:56px;background:#C59C56"></x-shape>
|
|||
|
|
<div style="height:24px"></div>
|
|||
|
|
<x-shape kind="arrow-left" style="width:180px;height:56px;background:#176754"></x-shape>
|
|||
|
|
<p style="font-size:24px;color:#152F2C;text-align:center">face réseau</p>
|
|||
|
|
</div>
|
|||
|
|
<div style="display:flex;flex-direction:column;gap:16px;background:#FDFDFA;border:1px solid #D5DFD7;border-radius:12px;padding:40px">
|
|||
|
|
<h3 style="font-size:32px;font-weight:600;color:#176754">L’écosystème · l’organisation</h3>
|
|||
|
|
<p style="font-size:26px;line-height:1.4">Son plan, sa voûte, son annuaire, son autorité, ses journaux.</p>
|
|||
|
|
<p style="font-size:26px;line-height:1.4">Configure ses services par son propre serveur d’exploitation.</p>
|
|||
|
|
<p style="font-size:26px;line-height:1.4">Peut partir : plan, données, voûte et domaines s’emportent.</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<p style="font-size:30px;line-height:1.4;color:#152F2C;border-left:4px solid #176754;padding:8px 0 8px 28px">Même entreprise ne veut pas dire même pouvoir : une voûte par dépôt, une clé par voûte, et chaque serveur d’exploitation ne lit que son propre dépôt.</p>
|
|||
|
|
<p style="position:absolute;left:128px;bottom:64px;width:1200px;font-size:24px;color:#5F716B">Set-OPS · Rencontres Linux du Québec 2026</p>
|
|||
|
|
<p style="position:absolute;right:128px;bottom:64px;width:120px;text-align:right;font-size:24px;color:#5F716B">09</p>
|
|||
|
|
<aside>Deux classes d’écosystème, un contrat entre elles. Le site, c’est l’hébergeur : le matériel, le réseau, la frontière ; il crée les machines. L’écosystème, c’est l’organisation : son plan, sa voûte, son identité, ses journaux ; il configure ses propres services. Le site publie une fiche — son résolveur, son cache de paquets, sa forge, les adresses publiques qu’il attribue — que le moteur dépose chez chaque locataire. Le locataire publie sa face réseau, que le site lit pour poser ses règles. Le site prête trois services à un écosystème jeune, jusqu’à ce qu’il ait les siens : on appelle ça la filiation, puis l’émancipation. Et une organisation peut partir avec son plan, ses données, sa voûte et ses domaines. Même quand une seule entreprise tient les deux rôles, les clés restent séparées.</aside>
|
|||
|
|
</section>
|