feat: Quellmaterial vom Live-Server — Seiten, Blog, CSS, Bilder
- _live_*.html: index, faq, ueber-uns, leistungen, kontakt (existierende Inhalte) - _quelle/blog/: 10 Blog-Artikel der bisherigen Seite - _quelle/legal/: Impressum, Datenschutz, Affiliate - _quelle/css/: styles.css (375 Design-Regeln) - _quelle/images/: 6 Bilder (Hero, Logo, DSGVO, Mobile, Kosten, Zeitersparnis) - ftp-creds via bsn-secrets gesichert
This commit is contained in:
Hermes Agent
@@ -0,0 +1,143 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="[BESCHREIBUNG DES ARTIKELS - ca. 150 Zeichen]">
|
||||
<link rel="canonical" href="https://it-hilfe-sofort.de/blog/[DATEINAME].html">
|
||||
<meta property="og:title" content="[TITEL DES ARTIKELS] | IT-Hilfe Sofort">
|
||||
<meta property="og:description" content="[KURZE ZUSAMMENFASSUNG]">
|
||||
<!-- BILD-PLATZHALTER: OG Image für Blog-Artikel - Datei: images/blog-[slug]-og.webp - Alt-Text: "[Beschreibung]" -->
|
||||
<meta property="og:image" content="https://it-hilfe-sofort.de/images/blog-[slug]-og.webp">
|
||||
<title>[TITEL DES ARTIKELS] | IT-Hilfe Sofort</title>
|
||||
<link rel="stylesheet" href="../css/styles.css">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
.article-header { max-width: 800px; margin: 0 auto; text-align: center; }
|
||||
.article-meta { font-size: 0.875rem; color: #6b7280; margin: 1rem 0 2rem; }
|
||||
.article-content { max-width: 800px; margin: 0 auto; line-height: 1.8; }
|
||||
.article-content h2 { margin-top: 2rem; margin-bottom: 1rem; }
|
||||
.article-content h3 { margin-top: 1.5rem; margin-bottom: 0.75rem; }
|
||||
.article-content p { margin-bottom: 1.25rem; }
|
||||
.article-content ul, .article-content ol { margin-bottom: 1.25rem; padding-left: 1.5rem; }
|
||||
.article-content li { margin-bottom: 0.5rem; }
|
||||
.article-image { width: 100%; border-radius: 0.5rem; margin: 1.5rem 0; }
|
||||
.article-tags { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid #e5e7eb; }
|
||||
.tag { display: inline-block; padding: 0.25rem 0.75rem; background: #f3f4f6; color: #374151; border-radius: 9999px; font-size: 0.75rem; margin-right: 0.5rem; }
|
||||
.back-link { display: inline-block; margin-bottom: 2rem; color: #2563eb; font-weight: 600; }
|
||||
.back-link::before { content: '← '; }
|
||||
</style>
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "BlogPosting",
|
||||
"headline": "[TITEL DES ARTIKELS]",
|
||||
"datePublished": "[YYYY-MM-DD]",
|
||||
"author": {
|
||||
"@type": "Organization",
|
||||
"name": "IT-Hilfe Sofort"
|
||||
},
|
||||
"url": "https://it-hilfe-sofort.de/blog/[DATEINAME].html"
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<header class="header">
|
||||
<nav class="nav container">
|
||||
<button class="nav-toggle" aria-label="Menü öffnen">
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
</button>
|
||||
<a href="/" class="logo"><img src="../images/logo.png" alt="IT-HilfeSofort Logo" class="logo-img"></a>
|
||||
<ul class="nav-menu">
|
||||
<li><a href="../index.html">Start</a></li>
|
||||
<li><a href="../ueber-uns.html">Über uns</a></li>
|
||||
<li><a href="../leistungen.html">Leistungen</a></li>
|
||||
<li><a href="../faq.html">FAQ</a></li>
|
||||
<li><a href="../blog/" class="active">Blog</a></li>
|
||||
<li><a href="../kontakt.html">Kontakt</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<article>
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<div class="article-header">
|
||||
<a href="index.html" class="back-link">Zurück zur Übersicht</a>
|
||||
<!-- BILD-PLATZHALTER: Artikel Hero Image - Datei: images/blog-[slug]-hero.webp - Alt-Text: "[Beschreibung des Hero-Bildes]" -->
|
||||
<h1>[TITEL DES ARTIKELS]</h1>
|
||||
<div class="article-meta">
|
||||
<span>📅 [DATUM, z.B. 10. Mai 2026]</span> ·
|
||||
<span>⏱️ [LESEZEIT, z.B. 5 Min. Lesezeit]</span> ·
|
||||
<span>👤 [AUTOR, z.B. IT-Hilfe Sofort Team]</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="article-content">
|
||||
<!-- HIER DEN ARTIKELINHALT EINFÜGEN -->
|
||||
<p>[Einleitung - fassen Sie den Artikel kurz zusammen]</p>
|
||||
|
||||
<h2>[Überschrift 1]</h2>
|
||||
<p>[Inhalt...]</p>
|
||||
|
||||
<h2>[Überschrift 2]</h2>
|
||||
<p>[Inhalt...]</p>
|
||||
|
||||
<!-- Beispiel für Aufzählung -->
|
||||
<h3>Wichtige Punkte:</h3>
|
||||
<ul>
|
||||
<li>[Punkt 1]</li>
|
||||
<li>[Punkt 2]</li>
|
||||
<li>[Punkt 3]</li>
|
||||
</ul>
|
||||
|
||||
<!-- Beispiel für Bild -->
|
||||
<!-- BILD-PLATZHALTER: Bild im Artikel - Datei: images/blog-[slug]-bild1.webp - Alt-Text: "[Beschreibung]" -->
|
||||
<img src="placeholder.jpg" alt="[Alt-Text]" class="article-image">
|
||||
|
||||
<h2>Fazit</h2>
|
||||
<p>[Zusammenfassung und Call-to-Action]</p>
|
||||
</div>
|
||||
|
||||
<div class="article-tags">
|
||||
<span class="tag">[TAG 1]</span>
|
||||
<span class="tag">[TAG 2]</span>
|
||||
<span class="tag">[TAG 3]</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<!-- Related Articles (optional) -->
|
||||
<section class="section" style="background: #f9fafb;">
|
||||
<div class="container">
|
||||
<h2>Das könnte Sie auch interessieren</h2>
|
||||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; margin-top: 1.5rem;">
|
||||
<a href="digitale-pflegedokumentation.html" style="background: white; padding: 1.5rem; border-radius: 0.5rem; text-decoration: none; color: inherit;">
|
||||
<h3 style="margin-bottom: 0.5rem;">Digitale Pflegedokumentation: So sparen Sie 10 Stunden pro Woche</h3>
|
||||
<p style="color: #6b7280; font-size: 0.875rem;">5 Min. Lesezeit</p>
|
||||
</a>
|
||||
<a href="dsgvo-pflege.html" style="background: white; padding: 1.5rem; border-radius: 0.5rem; text-decoration: none; color: inherit;">
|
||||
<h3 style="margin-bottom: 0.5rem;">DSGVO in der Pflege: Die 7 wichtigsten Anforderungen</h3>
|
||||
<p style="color: #6b7280; font-size: 0.875rem;">7 Min. Lesezeit</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="container footer-grid">
|
||||
<div class="footer-col"><img src="../images/logo.png" alt="IT-HilfeSofort Logo" class="logo-img" style="max-height: 40px; margin-bottom: 0.5rem;"><p>Ihr Partner für digitale Lösungen im Pflegebereich.</p></div>
|
||||
<div class="footer-col"><h4>Navigation</h4><ul><li><a href="../ueber-uns.html">Über uns</a></li><li><a href="../leistungen.html">Leistungen</a></li><li><a href="../faq.html">FAQ</a></li><li><a href="../blog/">Blog</a></li></ul></div>
|
||||
<div class="footer-col"><h4>Rechtliches</h4><ul><li><a href="../legal/impressum.html">Impressum</a></li><li><a href="../legal/datenschutz.html">Datenschutz</a></li><li><a href="../legal/affiliate.html">Affiliate-Kennzeichnung</a></li></ul></div>
|
||||
<div class="footer-col"><h4>Kontakt</h4><p><a href="../kontakt.html">Kontaktformular</a></p></div>
|
||||
</div>
|
||||
<div class="footer-bottom"><p>© 2026 IT-Hilfe Sofort. Alle Rechte vorbehalten.</p></div>
|
||||
</footer>
|
||||
<script src="../js/main.js" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user