HTML Semantic Blog

A simple blog layout created to practice semantic HTML structure and clean webpage organization.

🎯 About

This project was created to practice semantic HTML elements and proper webpage structure.

The page simulates a simple blog layout using semantic tags such as header, nav, main, section, article, and footer.
The goal was to improve my understanding of accessible and well-structured HTML markup.

✨ Features

• 🧱 Semantic HTML Structure – Uses proper HTML5 semantic elements
• 📰 Blog Layout – Simulated blog post structure
• 🎨 Basic Styling – Simple CSS styling for layout and readability
• 📚 Learning Project – Focused on improving HTML best practices

🛠️ Built With

• HTML5 – Semantic structure and page organization
• CSS3 – Basic styling and layout adjustments

🚀 Getting Started

Prerequisites

• A modern web browser (Chrome, Firefox, Safari, Edge)

Installation

# Clone the repository
git clone https://github.com/Luan-Neumann-Dev/html-semantic-blog.git

# Navigate to project directory
cd html-semantic-blog

Then open the index.html file in your browser.

📁 Project Structure

html-semantic-blog/
├── index.html        # Main page with semantic HTML structure
├── style.css         # Page styling
└── img/              # Images used in the layout

🎓 What I Learned

• How to use HTML5 semantic elements
• Structuring content for better readability and accessibility
• Organizing simple frontend projects
• Creating a basic blog-style layout

📝 Notes

• This is a beginner educational project
• Created to practice semantic HTML best practices
• No frameworks or JavaScript were used

📄 License

This project is open source and available under the MIT License.

👤 Author

Luan Neumann

• LinkedIn: Luan-Neumann-Dev
• GitHub: @luan-neumann-dev

---

⭐ If you enjoyed this project, consider giving it a star!