ComputerKumpel.de
IT-Dienstleistungs-Portal für Senioren, Vereine und Betriebe
Technologie
- PHP 8.x
- MySQL/MariaDB
- HTML5 & CSS3
- JavaScript (vanilla)
- Apache Webserver
- WebP Bildoptimierung
Datenbank-Architektur
- Ortsdaten: Verwaltung von Städten, PLZ und Dörfern
- Themen: Dynamische Content-Kategorien
- Meta-Informationen: SEO-Daten pro Thema
- Content-Generator: Zufällige Satzauswahl für Variation
Besonderheiten
- DSGVO-konform (keine Cookies, keine Tracking-Skripte)
- Dynamic Content Generation aus Datenbank
- Audio-Integration für Barrierefreiheit
- Mobile-first Responsive Design
- SEO-optimierte Meta-Daten
- Schema.org LocalBusiness Markup
Projektstruktur
inc/- Datenbankverbindung & Konfigurationtemplates/- Wiederverwendbare PHP-Templatesassets/- CSS, JS, Bilder, Audio*.php- Seiten (index, kontakt, preise, etc.)llm.txt- KI-Kontext für Suchmaschinen
Projektbeschreibung
Dies ist die ursprüngliche Version der ComputerKumpel.de-Webseite, entwickelt als dynamische PHP-Anwendung mit MySQL-Datenbankanbindung. Die Seite dient als Landingpage und Informationsportal für IT-Dienstleistungen für Senioren, Vereine und kleine Betriebe in der Region Herzogenrath.
Architektur
Die Anwendung nutzt eine modulare PHP-Architektur mit separates Templates für Header und Footer. Die Datenbank speichert ortsspezifische Inhalte, Themen und zufällig generierte Textbausteine für SEO-Optimierung. Über eine zentrale connect.php werden alle Konfigurationsvariablen und Datenbankverbindungen verwaltet.
Design
Das Design orientiert sich am Apple-Style mit einer modernen, aufgeräumten Ästhetik: großzügige Whitespace, abgerundete Ecken (18px Border-Radius), subtile Schatten und eine sanfte Farbpalette mit blauen Akzenten (#0c80de). Die Seite ist komplett responsiv und optimiert für mobile Geräte.
Audio-Features
Ein besonderes Highlight ist die Integration von Audio-Erklärungen zu den einzelnen Services. Dies unterstützt die Barrierefreiheit und hilft Senioren, die Inhalte auch akustisch aufzunehmen. Die Audio-Dateien werden erst bei Bedarf geladen (Lazy Loading).
SEO & Performance
- Dynamische Meta-Description und Keywords pro Seite
- WebP-Bildformate für optimale Ladezeiten
- CSS- und JS-Minifizierung
- Lazy Loading für Bilder
- Content-Visibility für bessere Rendering-Performance
Zielgruppen
- Senioren: Computerkurse, Videotelefonie, Online-Banking, E-Mail
- Vereine: Digitalisierungsberatung, Homepage-Erstellung
- Betriebe: IT-Schulungen, Software-Beratung, Reparatur-Service
Galerie
Bilder der Webseite können hier eingefügt werden
Platzhalter für Screenshots der verschiedenen Ansichten