ForHosting KIT · Daten & Dateien

CSS-Dateien minifizieren

KIT entfernt aus CSS-Code Leerzeichen, Zeilenumbrüche, Kommentare und andere für die Darstellung unnötige Zeichen, ohne eine einzige Regel zu verändern. Gedacht für alle, die kurz vor einer Veröffentlichung die Ladezeit ihrer Website verbessern möchten. Das Ergebnis lässt sich sofort in Produktion einsetzen.

● StabilKostenlos · im Browser

Im Browser ausführen – kostenlos API ansehen

Nutzen Sie es über WebAPIE-MailApp baldTelegram bald

Was beim Minifizieren aus CSS verschwindet

Sie fügen den CSS-Code ein, KIT entfernt Leerzeichen, Zeilenumbrüche, Einrückung und Kommentare, ohne Selektoren, Eigenschaften oder Werte anzufassen. Jede Regel wirkt danach exakt so wie vorher, nur die Zeichen dazwischen fehlen, auch überflüssige Semikolons am Ende eines Blocks werden entfernt. Wie stark sich die Datei am Ende verkleinert, hängt vor allem davon ab, wie ausführlich der ursprüngliche Code kommentiert und eingerückt war; ein bereits kompakt geschriebenes Stylesheet schrumpft entsprechend weniger.

Warum kleine CSS-Dateien beim Rendern zählen

Der Browser lädt CSS, bevor er eine Seite überhaupt anzeigt; eine kleinere Datei steht entsprechend früher vollständig bereit, und das sogenannte Render-Blocking dauert kürzer. Bei einer langsamen mobilen Verbindung macht sich das direkt bei der gefühlten Ladezeit bemerkbar, besonders wenn das Stylesheet im Kopf jeder einzelnen Seite eingebunden ist und bei jedem Aufruf neu geladen werden muss. Über viele Seitenaufrufe hinweg summiert sich die eingesparte Datenmenge zusätzlich spürbar auf.

Was diese Funktion nicht macht

Die Minifizierung ändert weder Selektoren noch die Reihenfolge der Regeln und ergänzt auch keine fehlenden Vendor-Prefixes für ältere Browser. Doppelte oder ungenutzte Regeln bleiben ebenfalls erhalten, denn deren sichere Erkennung erfordert eine Analyse des tatsächlich verwendeten HTML, die diese Funktion bewusst nicht vornimmt. Der CSS-Code darf bis zu 25 MB groß sein, was für praktisch jedes Stylesheet reicht, selbst für ein umfangreiches Framework mit vielen Komponenten.

CSS, HTML und JavaScript gemeinsam verkleinern

Für eine insgesamt schlankere Seite lohnt sich zusätzlich die Minifizierung des zugehörigen HTML-Codes und der eingebundenen JavaScript-Dateien mit den passenden KIT-Funktionen, jeweils mit demselben unkomplizierten Ablauf über die Web-Oberfläche und ohne dass dafür ein eigener Build-Prozess eingerichtet werden muss. Am sichtbaren Ergebnis für die Besucherin ändert sich dabei nichts, nur die Ladezeit wird kürzer, Schritt für Schritt über alle drei Dateitypen hinweg, bis die gesamte Seite spürbar schneller lädt.

Anwendungsfälle

Firmenwebsite kurz vor dem Livegang

Weber Metallbau GmbH aus Stuttgart minifiziert das CSS der neuen Website, bevor sie live geht, um die Ladezeit für Besucherinnen mit mobiler Verbindung zu verbessern.

Letzter Schritt ohne Build-Pipeline

Sabine Schneider betreut mehrere Kundenprojekte ohne automatisierten Build-Prozess und minifiziert das CSS jeder Website manuell über die Web-Oberfläche, bevor sie es hochlädt.

Schlankes Stylesheet für den Onlineshop

Bäckerei Hoffmann e. K. aus Leipzig minifiziert das CSS ihres kleinen Onlineshops, weil das Hosting-Paket ein begrenztes monatliches Datenvolumen vorsieht.

Häufige Fragen

Was kostet das Minifizieren einer CSS-Datei?

Im Browser: kostenlos und ohne Limit. Per API: $0.002 pro Anfrage – der Preis steht vorab fest.

Verändert sich das Erscheinungsbild meiner Website dadurch?

Nein, es werden ausschließlich Leerzeichen, Zeilenumbrüche und Kommentare entfernt; jede Regel bleibt inhaltlich unverändert.

Werden auch Kommentare mit Browser-Hacks entfernt?

Ja, alle Kommentare werden entfernt, auch solche, die einen bedingten Hack markieren. Prüfen Sie vor dem Einsatz, ob Ihr CSS auf solche Kommentare angewiesen ist.

Verlässt meine CSS-Datei dabei den Browser?

Im Browser bleibt Ihr Code auf Ihrem Gerät: Die Minifizierung läuft vollständig lokal, ohne dass etwas übertragen wird.

Gibt es ein Limit für die Dateigröße?

Der CSS-Code darf bis zu 25 MB groß sein.

Brauche ich ein Konto, bevor ich das nutzen kann?

Nein. Es gibt keine Konten und keine Anmeldung – nur bei der API-Nutzung zahlen Sie, und zwar pro Anfrage.

Für Entwickler — API-Zugang

Alles auf dieser Seite ist auch per API verfügbar. Dieser Abschnitt richtet sich an Teams, die es in ihre eigenen Systeme einbinden möchten; alle anderen nutzen einfach das Tool oben.

Endpunkt

POSThttps://api.kit.forhosting.com/data/css-minify

Authentifizierung per Bearer-Token. Ein einziger POST stellt die Aufgabe in die Warteschlange; das Ergebnis erhalten Sie per Webhook oder über einen signierten Link.

Aufruf aus Ihrem Stack

curl -X POST https://api.kit.forhosting.com/data/css-minify \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d &#39;{"input":"…"}'

const res = await fetch("https://api.kit.forhosting.com/data/css-minify", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.KIT_KEY}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    "input": "…"
  })
});
const { task_id } = await res.json();

import os, requests

res = requests.post(
    "https://api.kit.forhosting.com/data/css-minify",
    headers={"Authorization": f"Bearer {os.environ[&#39;KIT_KEY']}"},
    json={
    "input": "…"
},
)
task_id = res.json()["task_id"]

<?php
$res = file_get_contents("https://api.kit.forhosting.com/data/css-minify", false, stream_context_create([
  "http" => [
    "method"  => "POST",
    "header"  => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
    "content" => &#39;{"input":"…"}',
  ],
]));
$task = json_decode($res, true);

body := bytes.NewBufferString(`{"input":"…"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/data/css-minify", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)

Beispiel-Anfrage

{
  "input": "…"
}

Beispiel-Antwort

{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "data.css_minify",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

Die API arbeitet asynchron: Sie erhalten sofort eine task_id. Polling ist mit 1 Anfrage pro Sekunde erlaubt.

Preis

pro Anfrage$0.002

Der Preis steht auf der Seite – keine Tokens, keine Credits. Fehlgeschlagene Aufgaben werden nicht berechnet.

Limits

max_mb 25

Fehler

HTTP	Code	Bedeutung
`401`	`unauthorized`	Der API-Schlüssel fehlt oder ist ungültig – prüfen Sie den Authorization-Header (Bearer).
`402`	`insufficient_balance`	Ihr Guthaben reicht für diese Aufgabe nicht aus – Aufladungen verfallen nicht.
`404`	`unknown_type`	Unbekannter Aufgabentyp – prüfen Sie das Feld „type“ gegen den Katalog.
`429`	`rate_limited`	Zu viele Anfragen – warten Sie kurz; Polling ist mit 1 Anfrage pro Sekunde erlaubt.

Vollständige KIT-Dokumentation lesen →

Im Browser ausführen – kostenlos