Page Layouts & Visual Hierarchy

Desktop and mobile layouts for key pages

Landing Page (Homepage)

Homepage / _index.md
📷

Danilo Macrì

Brief introduction about yourself, your focus, what you do. Keep it concise and personal. (From _index.md)

Read Articles
Get in Touch

Articles List Page

Articles / List View

Articles

📌 PINNED

Why I Started This Blog

Apr 14, 2026 • Life

Building a Go CLI Tool

Apr 12, 2026 • Tech

Mountain Hiking Adventure

Apr 10, 2026 • Photo

On Simplicity

Apr 8, 2026 • Quote

Interesting Read: The Unix Philosophy

Apr 5, 2026 • Link

Single Article Page (Tech Example)

Article View / Single
TECH

Building a Go CLI Tool

Apr 12, 2026 • 5 min read

Article content goes here. This is where your markdown is rendered with proper typography and spacing.

$ go run main.go
Hello, CLI!

More content and explanation about the code...

Tags:
#golang #cli #programming

Static Pages (About, Contact, Privacy)

Static pages use a clean single-column layout. Content managed via markdown files in content/. All pages share the same template with consistent styling.

Example: /is (About), /is/here (Contact), /is/legal (Privacy) — all defined in hugo.toml for easy management.

Responsive Behavior

Desktop (1024px+)

  • Full navigation visible
  • Max content width ~800px
  • Comfortable spacing

Mobile (<768px)

  • Hamburger menu toggle
  • Full-screen overlay on tap
  • Optimized spacing