diff --git a/content/blog-index/module.md b/content/blog-index/module.md
new file mode 100644
index 0000000..5351485
--- /dev/null
+++ b/content/blog-index/module.md
@@ -0,0 +1,21 @@
+# Blog
+
+<details>
+slug: blog
+published: 03/15/2026
+author: Gopher Guides
+seo_description: Articles, tutorials, and guides about Hype — the dynamic Markdown engine for technical writers.
+tags: blog
+</details>
+
+Tutorials, guides, and updates from the Hype project.
+
+## Tutorials
+
+- [Single-Source Documentation](/single-source-docs/) — Use one Markdown file to generate your README and website docs
+- [Deploying a Hype Blog with Docker](/deploying-with-docker/) — Deploy with Dokploy, Heroku, or Docker Compose
+- [Getting Started with Hype](/getting-started/) — Install Hype and create your first dynamic document
+
+## Documentation
+
+Looking for reference docs? See the [documentation section](/docs/).
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 56c1d0a..cb59dd3 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -52,48 +52,41 @@ <h3 class="font-mono font-bold mb-2">Build-Time Validation</h3>
             </div>
         </div>
 
-        <!-- Articles Section -->
+        <!-- Latest Articles Teaser -->
         {{if .Articles}}
         <div>
-            <div class="flex items-center gap-2 text-emerald-400 text-sm mb-4 font-mono">
-                <span class="text-gray-500">$</span>
-                <span>ls -la articles/</span>
-            </div>
-            <div class="text-gray-500 text-xs font-mono pb-2 border-b border-gray-800">
-                total {{len .Articles}}
+            <div class="flex items-center justify-between mb-4">
+                <div class="flex items-center gap-2 text-emerald-400 text-sm font-mono">
+                    <span class="text-gray-500">$</span>
+                    <span>ls articles/ | head -3</span>
+                </div>
+                <a href="/blog/" class="text-sm font-mono text-gray-400 hover:text-emerald-400 transition-colors">
+                    view all &rarr;
+                </a>
             </div>
-            <div class="space-y-4 mt-4">
-                {{range .Articles}}
+            <div class="space-y-4">
+                {{range $i, $a := .Articles}}{{if lt $i 3}}
                 <article class="group py-4 border-b border-gray-800 hover:bg-gray-900/50 transition-colors -mx-4 px-4">
                     <div class="flex items-start gap-4">
                         <div class="text-gray-500 text-xs font-mono whitespace-nowrap pt-1">
-                            {{.FormattedDate}}
+                            {{$a.FormattedDate}}
                         </div>
                         <div class="flex-1 min-w-0">
                             <h2 class="text-lg font-mono mb-1">
-                                <a href="{{.URL}}" class="text-white hover:text-emerald-400 transition-colors">
-                                    {{.Title}}
+                                <a href="{{$a.URL}}" class="text-white hover:text-emerald-400 transition-colors">
+                                    {{$a.Title}}
                                 </a>
                             </h2>
-                            {{if .SEODescription}}
-                            <p class="text-gray-400 text-sm line-clamp-2">{{.SEODescription}}</p>
+                            {{if $a.SEODescription}}
+                            <p class="text-gray-400 text-sm line-clamp-2">{{$a.SEODescription}}</p>
                             {{end}}
-                            <div class="flex items-center gap-4 mt-2 text-xs text-gray-500 font-mono">
-                                {{if .Author}}<span>@{{.Author}}</span>{{end}}
-                                {{if .ReadingTime}}<span>~{{.ReadingTime}}m</span>{{end}}
-                                {{if .Tags}}
-                                <div class="flex gap-1">
-                                    {{range .Tags}}<span class="text-emerald-600">#{{.}}</span>{{end}}
-                                </div>
-                                {{end}}
-                            </div>
                         </div>
-                        <a href="{{.URL}}" class="text-emerald-400 opacity-0 group-hover:opacity-100 transition-opacity font-mono text-sm">
+                        <a href="{{$a.URL}}" class="text-emerald-400 opacity-0 group-hover:opacity-100 transition-opacity font-mono text-sm">
                             &rarr;
                         </a>
                     </div>
                 </article>
-                {{end}}
+                {{end}}{{end}}
             </div>
         </div>
         {{end}}
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index 6b94054..9f1aaad 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -3,7 +3,7 @@
         <div class="max-w-5xl mx-auto px-4 py-6 text-center text-gray-500 font-mono text-sm">
             <div class="flex justify-center gap-6 mb-3">
                 <a href="/docs/" class="hover:text-emerald-400 transition-colors">Docs</a>
-                <a href="/" class="hover:text-emerald-400 transition-colors">Blog</a>
+                <a href="/blog/" class="hover:text-emerald-400 transition-colors">Blog</a>
                 <a href="https://github.com/gopherguides/hype" class="hover:text-emerald-400 transition-colors">GitHub</a>
                 <a href="https://x.com/hype_markdown" class="hover:text-emerald-400 transition-colors">𝕏</a>
                 <a href="/rss.xml" class="hover:text-emerald-400 transition-colors">RSS</a>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 3a7deaa..2030bed 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -7,7 +7,7 @@
             </a>
             <div class="flex gap-6 text-sm font-mono">
                 <a href="/docs/" class="text-gray-400 hover:text-emerald-400 transition-colors">docs</a>
-                <a href="/" class="text-gray-400 hover:text-emerald-400 transition-colors">blog</a>
+                <a href="/blog/" class="text-gray-400 hover:text-emerald-400 transition-colors">blog</a>
                 <a href="https://github.com/gopherguides/hype" class="text-gray-400 hover:text-emerald-400 transition-colors">github</a>
                 <a href="https://x.com/hype_markdown" class="text-gray-400 hover:text-emerald-400 transition-colors">𝕏</a>
                 <a href="/rss.xml" class="text-gray-400 hover:text-emerald-400 transition-colors">[rss]</a>