73 lines
2.6 KiB
Markdown
73 lines
2.6 KiB
Markdown
# Tischlerei Staffenberger – Kleine Firmenwebsite
|
||
|
||
Kleine, statische Website für einen selbstständigen Tischler (Ein-Mann-Betrieb).
|
||
Technik: reines HTML, CSS und JavaScript ohne Frameworks.
|
||
|
||
## Ordnerstruktur
|
||
|
||
```
|
||
Tischlerei-Staffenberger/
|
||
├── index.html # Startseite (Landing Page)
|
||
├── pictures.html # Bildergalerie mit Filter
|
||
├── shop.html # Kleiner Shop (Anfragen per E-Mail)
|
||
├── impressum.html # Impressum mit Platzhalterdaten
|
||
├── README.md
|
||
├── css/
|
||
│ └── style.css # Ein zentrales Stylesheet
|
||
├── js/
|
||
│ └── script.js # Navigation, Galerie-Filter, Shop-Anfragen
|
||
└── images/
|
||
└── .gitkeep # Ordner für eigene Bilder (optional)
|
||
```
|
||
|
||
## Lokal ausführen
|
||
|
||
Die Seite besteht nur aus statischen Dateien. Sie können sie so starten:
|
||
|
||
### Option 1: Direkt im Browser öffnen
|
||
|
||
- Doppelklick auf `index.html` oder
|
||
- Datei in den Browser ziehen
|
||
|
||
**Hinweis:** Einige Browser blockieren bei `file://` das Laden externer Ressourcen (z.B. Google Fonts, Platzhalter-Bilder von picsum.photos). Dann Option 2 nutzen.
|
||
|
||
### Option 2: Mit lokalem Webserver (empfohlen)
|
||
|
||
Im Projektordner in der Kommandozeile:
|
||
|
||
**Mit Python 3:**
|
||
```bash
|
||
# Ab Python 3.x
|
||
python -m http.server 8000
|
||
```
|
||
|
||
**Mit Node.js (npx):**
|
||
```bash
|
||
npx serve .
|
||
```
|
||
|
||
**Mit PHP:**
|
||
```bash
|
||
php -S localhost:8000
|
||
```
|
||
|
||
Anschließend im Browser aufrufen: **http://localhost:8000**
|
||
|
||
Von dort aus funktionieren alle Links, Schriftarten und Platzhalter-Bilder.
|
||
|
||
## Anpassungen
|
||
|
||
- **Impressum & Kontakt:** In `impressum.html` und im Footer aller Seiten die Platzhalterdaten (Name, Adresse, Telefon, E-Mail, USt-ID) durch echte Angaben ersetzen.
|
||
- **Shop-Anfragen:** In `js/script.js` die E-Mail-Adresse in der Zeile mit `mailto:` durch Ihre echte Adresse ersetzen.
|
||
- **Bilder:** Aktuell werden Platzhalter von [picsum.photos](https://picsum.photos) genutzt. Eigene Fotos in den Ordner `images/` legen und in `pictures.html` bzw. `shop.html` die `src`-Pfade anpassen (z.B. `images/kuche-1.jpg`).
|
||
|
||
## Seitenüberblick
|
||
|
||
| Seite | Inhalt |
|
||
|-------------|--------|
|
||
| **Start** | Banner, Willkommenstext, Über mich, Leistungen (Möbel, Küchen, Außen), CTA „Kontakt“. |
|
||
| **Bilder** | Galerie mit Filter: Alle / Küche / Außenbereich / Sonderanfertigung. |
|
||
| **Shop** | 6 Beispielprodukte mit Bild, Beschreibung, Preis und Button „Anfragen“ (öffnet E-Mail). |
|
||
| **Impressum** | Anbieter, Kontakt, USt-ID, Verantwortlichkeit, Haftungsausschluss (Platzhalter). |
|
||
|
||
Navigation ist auf allen Seiten gleich; die aktuelle Seite wird hervorgehoben.
|