webfarben
6d9a067312
- Bootstrap 5 Framework lokal integriert - Responsive Design mit Hintergrundbild - Vereine: SSC Traidendorf, FF Traidendorf - Gewerbe: Kanuschorsch, Anna Ebenbeck Keramik, Dellentechnik Lang, StolzHolz, webfarben.net, Baumer Maschinenverleih - Sehenswürdigkeiten: Schloss Traidendorf, St. Leonhard Kirche - Back-to-Top Button - Custom Farbschema angepasst an lokales Bild
132 lines
3.1 KiB
Markdown
132 lines
3.1 KiB
Markdown
# Traidendorf Webseite
|
|
|
|
Moderne Webseite für die Gemeinde Traidendorf mit Präsentation lokaler Vereine und Gewerbetreibender.
|
|
|
|
## 🌟 Features
|
|
|
|
- **Responsive Design**: Optimiert für alle Geräte (Desktop, Tablet, Mobile)
|
|
- **Bootstrap 5**: Moderne UI-Komponenten und Grid-System
|
|
- **Smooth Scrolling**: Sanfte Navigation zwischen Bereichen
|
|
- **Animationen**: Fade-in-Effekte und Hover-Animationen
|
|
- **SEO-optimiert**: Semantisches HTML5
|
|
- **Schnelle Ladezeiten**: Optimierte Assets und CDN-Integration
|
|
|
|
## 📁 Projektstruktur
|
|
|
|
```
|
|
Webseite/
|
|
│
|
|
├── index.html # Hauptseite
|
|
├── css/
|
|
│ └── style.css # Custom Styles
|
|
├── js/
|
|
│ └── script.js # Interaktive Funktionen
|
|
└── README.md # Diese Datei
|
|
```
|
|
|
|
## 🚀 Installation & Nutzung
|
|
|
|
### Lokale Entwicklung
|
|
|
|
1. Repository klonen oder Dateien herunterladen
|
|
2. `index.html` in einem Browser öffnen
|
|
3. Für Live-Entwicklung einen lokalen Server verwenden:
|
|
|
|
```bash
|
|
# Mit Python
|
|
python -m http.server 8000
|
|
|
|
# Mit Node.js (http-server)
|
|
npx http-server
|
|
|
|
# Mit VS Code Live Server Extension
|
|
# Rechtsklick auf index.html -> "Open with Live Server"
|
|
```
|
|
|
|
### Deployment
|
|
|
|
Die Webseite kann auf jedem Webserver gehostet werden:
|
|
|
|
- **Statischer Hosting**: GitHub Pages, Netlify, Vercel
|
|
- **Traditioneller Webserver**: Apache, Nginx
|
|
- **Upload**: Einfach alle Dateien via FTP hochladen
|
|
|
|
## 📋 Inhalt
|
|
|
|
### Vereine
|
|
- **SSC Traidendorf** - Sportlicher Schwimmclub
|
|
- **Freiwillige Feuerwehr** - Sicherheit und Brandschutz
|
|
|
|
### Gewerbe
|
|
- **Kanuschorsch** - Kanuverleih und Wassersport
|
|
- **Anna Ebenbeck Keramik** - Handgefertigte Keramikkunst
|
|
- **Dellentechnik Lang** - Professionelle Ausbeultechnik
|
|
- **StolzHolz** - Hochwertige Holzarbeiten
|
|
|
|
### Sehenswürdigkeiten
|
|
- **Schloss Traidendorf** - Historisches Wahrzeichen
|
|
|
|
## 🛠️ Technologien
|
|
|
|
- **HTML5**: Semantische Struktur
|
|
- **CSS3**: Modern mit Flexbox, Grid, Animationen
|
|
- **JavaScript (ES6+)**: Interaktive Features
|
|
- **Bootstrap 5.3.2**: Framework für responsives Design
|
|
- **Bootstrap Icons**: Iconographie
|
|
|
|
## 🎨 Anpassungen
|
|
|
|
### Farben ändern
|
|
|
|
In [css/style.css](css/style.css) die CSS-Variablen anpassen:
|
|
|
|
```css
|
|
:root {
|
|
--primary-color: #0d6efd;
|
|
--secondary-color: #6c757d;
|
|
/* ... weitere Farben */
|
|
}
|
|
```
|
|
|
|
### Inhalte hinzufügen
|
|
|
|
Neue Karten in [index.html](index.html) hinzufügen:
|
|
|
|
```html
|
|
<div class="col-md-6 col-lg-4">
|
|
<div class="card h-100 shadow-sm hover-lift">
|
|
<div class="card-body text-center p-4">
|
|
<!-- Inhalt hier -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
```
|
|
|
|
## 📱 Browser-Kompatibilität
|
|
|
|
- ✅ Chrome (aktuell)
|
|
- ✅ Firefox (aktuell)
|
|
- ✅ Safari (aktuell)
|
|
- ✅ Edge (aktuell)
|
|
- ✅ Mobile Browser (iOS Safari, Chrome Mobile)
|
|
|
|
## 🤝 Mitwirken
|
|
|
|
Verbesserungsvorschläge und Beiträge sind willkommen!
|
|
|
|
1. Änderungen vornehmen
|
|
2. Testen
|
|
3. Dokumentieren
|
|
|
|
## 📄 Lizenz
|
|
|
|
© 2026 traidendorf
|
|
Credits: [webfarben.net](https://webfarben.net/)
|
|
|
|
## 📞 Kontakt
|
|
|
|
Für Aktualisierungen der Inhalte oder technische Fragen wenden Sie sich bitte an die Gemeindeverwaltung.
|
|
|
|
---
|
|
|
|
**Entwickelt mit ❤️ für Traidendorf** |