Files
web7sys/website-7sys/PROMPT.md
2024-11-01 06:42:44 +01:00

5.0 KiB

SHOT-5

IT-Beratung und Sicherheitslösungen

Beratung zu IT-Infrastruktur, maßgeschneidert auf die spezifischen Bedürfnisse kleiner Unternehmen. Dazu könnten Empfehlungen für Hardware, Netzwerkoptimierung und Firewall-Management gehören, beispielsweise mit Securepoint-Lösungen, die besonders für Datenschutz und Zertifizierungsanforderungen geeignet sind. Netzwerk- und Datensicherheits-Implementierung

Einrichtung und Konfiguration sicherer Netzwerke, inklusive VPN, Zugriffskontrollen und Firewall-Management. Fokus auf den Schutz sensibler Daten und Absicherung der Netzwerke gegen Bedrohungen unter Berücksichtigung neuer Sicherheitsstandards wie der NIS-2-Regelung. Proaktives Monitoring und Wartung

Regelmäßige Wartung und Überwachung der IT-Systeme, um Ausfälle zu minimieren und eine hohe Verfügbarkeit sicherzustellen. Dazu gehören automatisierte Backups, Systemupdates, und kontinuierliches Monitoring, um Probleme frühzeitig zu erkennen und zu beheben.

Farben für Dark-Mode:

Haupt-Farbe: #0A0A0A (Tiefes Schwarz) Akzent-Farbe: #1534D1 (Tiefes Blau) Schrift-Farbe: #F2F2F2 (Helles Grau)

Farben für Light-Mode:

Haupt-Farbe: #F2F2F2 Akzent-Farbe: #4A90E2 Schrift-Farbe: #333333


Erstelle eine moderne One-Page Webseite als digitale Visitenkarte für das IT-Unternehmen 7SYS mit Space-Theme und Theme-Switcher. Die Seite soll die professionellen IT-Dienstleistungen und Sicherheitslösungen präsentieren.

Farbschema: Dark Theme:

  • Hauptfarbe: #0A0A0A (Tiefes Schwarz)
  • Akzentfarbe: #1534D1 (Tiefes Blau)
  • Schriftfarbe: #F2F2F2 (Helles Grau)

Light Theme:

  • Hauptfarbe: #F2F2F2
  • Akzentfarbe: #4A90E2
  • Schriftfarbe: #333333

Struktur und Inhalt:

  1. Header:
  • Logo "7SYS"
  • Theme-Switcher
  • Hauptnavigation
  1. Hero-Section:
  • Headline: "IT-Beratung und Sicherheitslösungen"
  • Subtiler Space-Theme Hintergrund
  • Call-to-Action Button
  1. Hauptdienstleistungen:

IT-Beratung und Sicherheitslösungen:

  • Fokus auf kleine Unternehmen
  • IT-Infrastruktur Beratung
  • Hardware-Empfehlungen
  • Netzwerkoptimierung
  • Firewall-Management (Securepoint-Lösungen)
  • Datenschutz und Zertifizierungsanforderungen

Netzwerk- und Datensicherheit:

  • Sichere Netzwerkkonfiguration
  • VPN-Einrichtung
  • Zugriffskontrolle
  • Firewall-Management
  • NIS-2-Regelung Implementation
  • Bedrohungsschutz

Proaktives Monitoring und Wartung:

  • System-Überwachung
  • Automatisierte Backups
  • Systemupdates
  • Frühwarnsystem
  • Ausfallsicherheit
  • Verfügbarkeitsoptimierung
  1. Zukunftsvision:
  • Desaster Recovery Rechenzentrum
  • Sustainable & Renewable IT-Infrastructure
  1. Kontaktbereich:
  • Kontaktformular
  • Geschäftsdaten
  • Impressum

Technische Anforderungen:

  • Responsive Design
  • Theme-Switching Funktionalität
  • Performance-Optimierung
  • SEO-freundliche Struktur
  • Barrierefreiheit

Design-Richtlinien:

  • Modernes, klares Layout
  • Space-Theme Integration
  • Professionelle Typographie
  • Optimale Lesbarkeit
  • Subtle Animationen
  • Konsistente Gestaltung

Besondere Aspekte:

  • Hervorhebung der Sicherheitsexpertise
  • Fokus auf kleine Unternehmen
  • Betonung der individualisierten Lösungen
  • Integration der Nachhaltigkeitsaspekte

Liefere den Code in drei Teilen:

  1. HTML-Struktur
  2. CSS mit Theme-Definitionen
  3. JavaScript für Theme-Switching

Wichtige Anforderungen:

  • Klare Leistungskommunikation
  • Professionelle Darstellung
  • Optimale User Experience
  • Mobile-First Design
  • Schnelle Ladezeiten
  • Intuitive Navigation

Webseite in shot-5 inspizieren und Verbesserungsvorschläge machen.

Nach der Inspektion der Website und des Codes schlage ich folgende Verbesserungen vor:

Accessibility & SEO: Fehlende ARIA-Labels für bessere Barrierefreiheit Fehlende Meta-Tags für Social Media Sharing Fehlende Sitemap und robots.txt Performance & UX: Fehlende Ladeanimationen für Service-Cards Fehlende Validierung im Kontaktformular Fehlende Erfolgsmeldung nach Formularversand Fehlende Responsive Images Design: Kontrastverbesserungen im Light-Mode Konsistentere Abstände zwischen Sektionen Verbesserte Mobile Navigation Ich werde diese Verbesserungen nun implementieren.

Die Website wurde in folgenden Bereichen verbessert:

Barrierefreiheit & SEO Integration von ARIA-Labels und semantischen HTML-Elementen Erweiterte Meta-Tags für bessere Suchmaschinen-Indexierung Verbesserte Keyboard-Navigation und Screenreader-Unterstützung Benutzerfreundlichkeit & Performance Animierte Service-Karten mit optimierter Performance Verbessertes Kontaktformular mit Validierung und Feedback Optimierte Scroll-Funktionalität und Theme-Umschaltung Design & Responsive Layout Optimierte Farbkontraste und Abstände Verbesserte Mobile-Ansicht Implementierte Print-Styles Code-Qualität Modularisierte JavaScript-Struktur Optimierte CSS-Variablen Erweitertes Error-Handling Diese Verbesserungen machen die Website zugänglicher, benutzerfreundlicher und wartbarer.


Ich möchte die styles.css sinnvoll auftrennen so dass möglichst viele kleine css-files entstehen.


Die Top-Bar soll einen gradienten erhalten (dark & light mode)

Ich möchte den Dark Mode als Default eingestellt haben.