3D-Dateiformate fürs Web — welches passt wofür?
Die Agentur schickt FBX, die Konstruktion STEP, der 3D-Drucker will STL, das iPhone versteht USDZ — und die Website soll GLB laden. 3D-Formate sind ein Dschungel. Dabei ist die Antwort für das Web ziemlich eindeutig. Hier steht, welches Format was kann und wie du von jedem zum richtigen kommst.
Für das Web ist glTF der Standard, in der Praxis als GLB — eine einzige Binärdatei mit Geometrie, Materialien, Texturen und Animationen. Die Khronos Group, die auch WebGL verantwortet, nennt glTF das „JPEG für 3D“. USDZ brauchst du zusätzlich für AR auf dem iPhone. Alle anderen Formate — FBX, OBJ, STL, STEP — sind Ausgangsformate, die vor dem Einsatz umgewandelt werden.
Alle Formate im Überblick.
| Format | Herkunft | Materialien | Animation | Im Browser |
|---|---|---|---|---|
| GLB / glTF | Khronos Group, offener Standard | Ja, physikalisch basiert | Ja | Standard, von Three.js und model-viewer direkt geladen |
| FBX | Autodesk, proprietär | Ja, aber uneinheitlich | Ja | Möglich, aber ungeeignet |
| OBJ (+ MTL) | Alt, sehr verbreitet | Einfach | Nein | Möglich, groß und ungenau |
| USDZ | Pixar USD, Apple | Ja | Ja | Für AR Quick Look auf iOS |
| STL | 3D-Druck | Nein | Nein | Nur Form, keine Optik |
| STEP | CAD, ISO-Norm | Werkstoffe, keine Optik | Nein | Nicht direkt |
glTF und GLB.
glTF wurde gezielt für die Übertragung und Anzeige von 3D-Inhalten entwickelt: kompakt, schnell zu laden, mit Materialien, die in jedem Programm gleich aussehen. Es gibt zwei Varianten. .gltf ist eine Textdatei mit separaten Dateien für Geometrie (.bin) und Texturen — praktisch zum Bearbeiten. .glb packt alles in eine einzige Datei — praktisch für die Website, weil nichts verloren gehen kann. Dazu kommen Erweiterungen für Komprimierung wie Draco, Meshopt und KTX2 (GLB verkleinern). Blender exportiert glTF direkt (Blender-Export).
FBX.
FBX ist das Austauschformat vieler 3D- und Animationsprogramme und in Spiele-Engines verbreitet. Für das Web ist es ungeeignet: proprietär, schwer, und Materialien sehen je nach Programm unterschiedlich aus. Three.js hat zwar einen FBX-Loader, aber das Ergebnis ist unberechenbarer als mit glTF. Der Weg: FBX in Blender importieren, Materialien prüfen und nachbessern, als GLB exportieren.
OBJ.
OBJ ist eines der ältesten Formate und fast jedes Programm kann es lesen. Es speichert Geometrie als Text, Materialien in einer separaten MTL-Datei, und kennt keine Animation und keine modernen Materialien. Als Web-Format ist es zu groß und zu schlicht. Als Austauschformat für einfache Formen ist es aber nützlich — umgewandelt wird auch hier über Blender.
USDZ.
USDZ basiert auf dem Universal Scene Description von Pixar und ist das Format, das Apple für Augmented Reality nutzt. Tippt ein iPhone-Nutzer auf „In AR ansehen“, öffnet AR Quick Look eine USDZ-Datei und platziert das Produkt im Raum. Für die normale 3D-Ansicht im Browser brauchst du es nicht, für AR auf iOS schon — zusätzlich zur GLB. Android nutzt für AR dagegen GLB direkt. Mehr dazu: Augmented Reality für Produkte.
STL und STEP.
STL kommt aus dem 3D-Druck und beschreibt nur die Oberfläche als Dreiecke, ohne Farben, Materialien oder Teilestruktur. Für eine schöne Web-Ansicht muss alles Optische neu dazukommen. STEP ist das neutrale CAD-Format mit exakter Geometrie und Baugruppen. Es ist ein hervorragender Ausgangspunkt, muss aber erst in Dreiecke umgewandelt und vereinfacht werden: CAD-Daten fürs Web aufbereiten.
Umwandeln ins Web-Format.
| Von | Weg zu GLB |
|---|---|
| FBX, OBJ, DAE | Blender importieren, Materialien prüfen, als glTF-Binary exportieren |
| STEP, IGES, native CAD | Tessellieren (CAD Exchanger, FreeCAD, Blender mit Import-Erweiterung), aufräumen, exportieren |
| STL | Blender importieren, Materialien neu anlegen, exportieren |
| glTF mit separaten Dateien | gltf-transform copy modell.gltf modell.glb |
| GLB zu USDZ | Reality Converter von Apple, Blender mit USD-Export oder Konverter-Werkzeuge |
# .gltf mit .bin und Texturen in eine einzige .glb packen
gltf-transform copy modell.gltf modell.glb
# Direkt optimiert für das Web
gltf-transform optimize modell.gltf modell-web.glb --compress meshopt --texture-compress webpgltf-transform arbeitet nur mit glTF und GLB. FBX, OBJ, STL und CAD werden vorher in Blender oder einem CAD-Werkzeug umgewandelt.
Empfehlung.
- Für jede Website: GLB, komprimiert.
- Zusätzlich für AR auf dem iPhone: USDZ.
- Zum Austausch mit Agenturen und Konstrukteuren: STEP für CAD, FBX oder glTF für Designmodelle — Hauptsache mit Materialien und sauberer Benennung.
- Als Archiv: die Originaldatei behalten, nicht nur das Web-Modell. Aus dem Original lassen sich später andere Varianten erzeugen.
Wie das fertige Modell auf die Website kommt: 3D-Modell auf Website einbinden.
Wenn du Unterstützung brauchst.
Ich wandle Modelle in jedem Ausgangsformat in schlanke Web-Modelle um und binde sie ein. Einen Überblick über alle Themen gibt die Seite 3D-Webentwicklung, Preisrahmen stehen unter 3D-Konfigurator: Kosten.
Wer das schreibt.
Ich bin Manuel Killert, Web- und 3D-Entwickler aus Quakenbrück. Ich baue interaktive 3D-Anwendungen mit Three.js und Blender — Produktkonfiguratoren, Explosionsansichten, digitale Zwillinge und Scroll-Storys — und bringe sie in WordPress und WooCommerce. Die Live-Demos unten habe ich selbst gebaut, vom Blender-Modell bis zum fertigen Viewer im Browser. Die Probleme in diesem Ratgeber kenne ich deshalb nicht aus der Theorie, sondern aus eigenen Projekten.
Nicht glauben — ausprobieren.
Alle Demos laufen live im Browser, auch auf dem Smartphone.
FAQ — 3D-Dateiformate fürs Web.
Welches 3D-Format ist am besten für Websites?
glTF, in der Praxis als GLB. Es ist ein offener Standard der Khronos Group, packt Geometrie, Materialien, Texturen und Animationen in eine Datei und wird von Three.js und model-viewer direkt geladen.
Was ist der Unterschied zwischen glTF und GLB?
glTF ist eine Textdatei mit separaten Dateien für Geometrie und Texturen. GLB packt alles in eine einzige Binärdatei. Für Websites ist GLB praktischer, weil keine Datei verloren gehen kann.
Kann ich FBX-Dateien auf der Website verwenden?
Technisch ja, empfehlenswert ist es nicht. FBX ist proprietär, schwer und Materialien sehen je nach Programm unterschiedlich aus. Besser in Blender importieren und als GLB exportieren.
Wofür brauche ich USDZ?
Für Augmented Reality auf dem iPhone. AR Quick Look öffnet USDZ-Dateien. Für die normale 3D-Ansicht im Browser und für AR auf Android reicht GLB.
Kann ich STL-Dateien auf der Website zeigen?
Ja, aber STL enthält nur die Form ohne Farben und Materialien. Für eine ansprechende Darstellung werden Materialien in Blender neu angelegt und das Modell als GLB exportiert.
Wie wandle ich STEP in GLB um?
Die CAD-Daten werden mit einem Werkzeug wie CAD Exchanger, FreeCAD oder Blender mit Import-Erweiterung in Dreiecke umgewandelt, vereinfacht, mit Materialien versehen und als GLB exportiert.
Das bin ich – rechts im BildErzähl mir, was du zeigen willst.
Ich sage dir ehrlich, ob sich 3D für dein Vorhaben lohnt — und wenn nicht, was stattdessen mehr bringt.
Antwort meist innerhalb von 24 Stunden · hallo@manuelkillert.de