Ole-Morten Duesund
d68dc1515b
- Øk slider-track kontrast til 0.35 for 3:1 ratio (1.4.11) - Endre chart-titler fra div til h3 for riktig overskriftshierarki (2.4.6) - Endre topic-card overskrifter fra h2 til h3 under gruppe-h2 (2.4.6) - Legg til brødsmulesti på alle undersider (2.4.5) - Legg til sitemap-nav i footer på forsiden (2.4.5) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
236 lines
9.5 KiB
HTML
236 lines
9.5 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="nb">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Det er dyrt å være fattig — boutgifter etter inntekt, SSB-data 2015–2024</title>
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:locale" content="nb_NO">
|
||
<meta property="og:site_name" content="Forskjeller">
|
||
<meta property="og:title" content="Det er dyrt å være fattig">
|
||
<meta property="og:description" content="41 % av de fattigste bruker over 40 % av inntekten på bolig. Blant de rikeste: 7 %. Rike betaler mer i kroner, men det merkes knapt. SSB-data.">
|
||
<meta property="og:url" content="https://forskjeller.naiv.no/boutgifter/">
|
||
<meta name="twitter:card" content="summary">
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link href="https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,600;1,9..144,300&family=DM+Sans:wght@300;400;500&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="../style.css">
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.umd.js"></script>
|
||
<!-- Privacy-friendly analytics by Plausible -->
|
||
<script async src="/js/script.js"></script>
|
||
<script>
|
||
window.plausible=window.plausible||function(){(plausible.q=plausible.q||[]).push(arguments)},plausible.init=plausible.init||function(i){plausible.o=i||{}};
|
||
plausible.init({ endpoint: "/api/event" })
|
||
</script>
|
||
<style>
|
||
.source-strip {
|
||
text-align: center;
|
||
padding: 0.75rem 1rem;
|
||
font-size: 12px;
|
||
color: var(--ink3);
|
||
background: var(--bg2);
|
||
border-bottom: 1px solid var(--border);
|
||
}
|
||
.source-strip a { color: var(--ink3); text-decoration: underline; }
|
||
|
||
.key-number {
|
||
text-align: center;
|
||
padding: 2rem 1rem;
|
||
margin-bottom: 2.5rem;
|
||
}
|
||
.key-number .kn-value {
|
||
font-family: 'Fraunces', serif;
|
||
font-size: clamp(2.5rem, 7vw, 4rem);
|
||
font-weight: 600;
|
||
color: var(--accent);
|
||
line-height: 1.1;
|
||
}
|
||
.key-number .kn-label {
|
||
font-size: 1rem;
|
||
color: var(--ink2);
|
||
margin-top: 0.5rem;
|
||
max-width: 540px;
|
||
margin-left: auto;
|
||
margin-right: auto;
|
||
}
|
||
|
||
.comparison-grid {
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 10px;
|
||
margin-bottom: 2.5rem;
|
||
}
|
||
@media (max-width: 480px) {
|
||
.comparison-grid { grid-template-columns: 1fr; }
|
||
}
|
||
.comparison-card {
|
||
background: var(--bg2);
|
||
border: 1px solid var(--border);
|
||
border-radius: 6px;
|
||
padding: 1.25rem;
|
||
text-align: center;
|
||
}
|
||
.comparison-card .cc-title {
|
||
font-size: 11px;
|
||
letter-spacing: 0.07em;
|
||
text-transform: uppercase;
|
||
color: var(--ink3);
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
.comparison-card .cc-main {
|
||
font-family: 'Fraunces', serif;
|
||
font-size: clamp(1.8rem, 5vw, 2.4rem);
|
||
font-weight: 600;
|
||
line-height: 1.1;
|
||
}
|
||
.comparison-card .cc-sub {
|
||
font-size: 0.85rem;
|
||
color: var(--ink2);
|
||
margin-top: 0.3rem;
|
||
}
|
||
.comparison-card .cc-detail {
|
||
font-size: 12px;
|
||
color: var(--ink3);
|
||
margin-top: 0.15rem;
|
||
}
|
||
|
||
.h-300 { height: 300px; }
|
||
@media (max-width: 480px) {
|
||
.h-300 { height: 250px; }
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<a href="#main" class="skip-link">Hopp til hovedinnhold</a>
|
||
<nav class="breadcrumb" aria-label="Brødsmuler"><a href="../">Forskjeller</a> / Det er dyrt å være fattig</nav>
|
||
|
||
<header>
|
||
<p class="eyebrow">SSB-data 2015–2024</p>
|
||
<h1>Det er dyrt<br><em>å være fattig</em></h1>
|
||
<p class="lead">De fattigste betaler minst i kroner — men mest av inntekten sin. 41 % av de fattigste bruker over 40 % av inntekten på bolig. Blant de rikeste: 7 %.</p>
|
||
<div class="stamp" aria-hidden="true">Boligbyrden</div>
|
||
</header>
|
||
|
||
<div class="source-strip">
|
||
Data: <a href="https://www.ssb.no/statbank/table/14061/" target="_blank" rel="noopener">SSB tabell 14061</a>,
|
||
<a href="https://www.ssb.no/statbank/table/14067/" target="_blank" rel="noopener">14067</a>
|
||
— Boligøkonomi og boligeierskap, husholdninger
|
||
</div>
|
||
|
||
<main id="main">
|
||
|
||
<!-- Nøkkeltall -->
|
||
<div class="key-number">
|
||
<div class="kn-value">17× mer sannsynlig</div>
|
||
<div class="kn-label">De fattigste er 17 ganger mer sannsynlig å bruke over 60 % av inntekten på bolig enn de rikeste (17 % mot 1 %).</div>
|
||
</div>
|
||
|
||
<!-- Sammenligning -->
|
||
<div class="comparison-grid">
|
||
<div class="comparison-card">
|
||
<div class="cc-title">Laveste inntektskvartil</div>
|
||
<div class="cc-main" style="color:#c0392b;">120 065 kr/år</div>
|
||
<div class="cc-sub">41 % bruker >40 % av inntekten</div>
|
||
<div class="cc-detail">54 % leier — bygger ingen formue</div>
|
||
</div>
|
||
<div class="comparison-card">
|
||
<div class="cc-title">Høyeste inntektskvartil</div>
|
||
<div class="cc-main" style="color:#2c6e49;">262 940 kr/år</div>
|
||
<div class="cc-sub">7 % bruker >40 % av inntekten</div>
|
||
<div class="cc-detail">93 % eier — bygger formue</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Diagram 1: Boutgiftsandel per inntektsgruppe -->
|
||
<div class="chart-section">
|
||
<div class="chart-header">
|
||
<div>
|
||
<h3 class="chart-title">Boutgifter spiser inntekten</h3>
|
||
<div class="chart-desc">Boutgifter som andel av inntekt, etter inntektskvartil, 2024</div>
|
||
</div>
|
||
<div class="legend">
|
||
<span><span class="swatch" style="background:#2c6e49;"></span><10 %</span>
|
||
<span><span class="swatch" style="background:#27ae60;"></span>10–19 %</span>
|
||
<span><span class="swatch" style="background:#e67e22;"></span>20–29 %</span>
|
||
<span><span class="swatch" style="background:#e74c3c;"></span>30–39 %</span>
|
||
<span><span class="swatch" style="background:#c0392b;"></span>40–59 %</span>
|
||
<span><span class="swatch" style="background:#8b1a1a;"></span>60 %+</span>
|
||
</div>
|
||
</div>
|
||
<div class="chart-wrap h-240"><canvas id="chart1" role="img" aria-label="Diagram: Boutgifter spiser inntekten"></canvas></div>
|
||
</div>
|
||
|
||
<div class="insight">
|
||
De rikeste betaler <strong>dobbelt så mye i kroner</strong> (263 000 vs 120 000 kr/år) — men det utgjør bare
|
||
en liten del av inntekten deres. For de fattigste er bolig en <strong>kvelerslange</strong>:
|
||
17 % bruker over 60 % av inntekten bare på å ha et sted å bo.
|
||
</div>
|
||
|
||
<!-- Diagram 2: Utviklingen over tid -->
|
||
<div class="chart-section">
|
||
<div class="chart-header">
|
||
<div>
|
||
<h3 class="chart-title">Byrden vokser</h3>
|
||
<div class="chart-desc">Andel med boutgifter >40 % av inntekt, per kvartil, 2015–2024</div>
|
||
</div>
|
||
<div class="legend" id="legend2"></div>
|
||
</div>
|
||
<div class="chart-wrap h-240"><canvas id="chart2" role="img" aria-label="Diagram: Byrden vokser over tid"></canvas></div>
|
||
</div>
|
||
|
||
<div class="insight">
|
||
Siden 2015 har andelen med tung boligbyrde (>40 % av inntekt) steget for <strong>alle inntektsgrupper</strong>,
|
||
men gapet forblir enormt. I 2024 har de fattigste <strong>5× flere</strong> med tung boligbyrde enn de rikeste.
|
||
Rentehoppet fra 2022 rammet alle — men de fattigste hadde minst å gå på.
|
||
</div>
|
||
|
||
<!-- Diagram 3: Eierskap etter inntektsgruppe -->
|
||
<div class="chart-section">
|
||
<div class="chart-header">
|
||
<div>
|
||
<h3 class="chart-title">Penger kjøper eierskap</h3>
|
||
<div class="chart-desc">Boligeierskap etter inntektsgruppe og utsatte grupper, 2024</div>
|
||
</div>
|
||
<div class="legend">
|
||
<span><span class="swatch" style="background:#2c6e49;"></span>Selveier</span>
|
||
<span><span class="swatch" style="background:#1a4a8a;"></span>Andelseier</span>
|
||
<span><span class="swatch" style="background:#c0392b;"></span>Leier</span>
|
||
</div>
|
||
</div>
|
||
<div class="chart-wrap h-300"><canvas id="chart3" role="img" aria-label="Diagram: Penger kjøper eierskap"></canvas></div>
|
||
</div>
|
||
|
||
<div class="insight">
|
||
<strong>82 % av sosialhjelpsmottakere leier.</strong> Blant barnefamilier med lav inntekt leier over halvparten.
|
||
De betaler husleie som aldri blir til egenkapital — mens boligeiere bygger formue automatisk.
|
||
Slik forsterker boligmarkedet ulikheten: de fattige betaler andres boliglån.
|
||
</div>
|
||
|
||
<!-- Forklaring -->
|
||
<div class="explainer">
|
||
<h3>Hvorfor er dette viktig?</h3>
|
||
<p>Bolig er den største utgiftsposten for de fleste husholdninger. Men byrden er <strong>fundamentalt ulik</strong>:
|
||
de fattigste bruker en langt større andel av inntekten på å bo — og får mindre igjen for det.</p>
|
||
<div class="formula-box">
|
||
Fattigste kvartil: <span>120 065 kr/år</span> → 40 % av inntekten<br>
|
||
Rikeste kvartil: <span>262 940 kr/år</span> → 15 % av inntekten<br>
|
||
Rike betaler mer, men har <span>mer igjen til alt annet</span>
|
||
</div>
|
||
<p>Det som gjør det ekstra skjevt: <strong>54 % av de fattigste leier</strong>. Husleien er en ren kostnad — ingen
|
||
egenkapital bygges opp. De rikeste derimot eier boligen, og boliglånsbetalinger er delvis sparing.
|
||
Slik fungerer boligmarkedet som en <strong>formuesmaskin for de rike</strong> og en
|
||
<strong>fattigdomsfelle for de fattige</strong>.</p>
|
||
<p>Tallene er hentet fra SSB levekårsundersøkelsen
|
||
(<a href="https://www.ssb.no/statbank/table/14061/" target="_blank" rel="noopener">tabell 14061</a>,
|
||
<a href="https://www.ssb.no/statbank/table/14067/" target="_blank" rel="noopener">14067</a>).
|
||
Boutgifter inkluderer husleie/renter/avdrag, kommunale avgifter, forsikring, strøm og fyring.</p>
|
||
</div>
|
||
|
||
</main>
|
||
|
||
<footer>
|
||
<a href="../">← Alle visualiseringer</a> · Kilde: SSB tabeller 14061, 14067 · Laget med Chart.js · <a href="https://kode.naiv.no/olemd/forskjeller.naiv.no">Kildekode</a>
|
||
</footer>
|
||
|
||
<script src="app.js"></script>
|
||
</body>
|
||
</html>
|