How I planned my first project
I started with a very simple file structure so I would not get confused. My goal was to learn the basics first, not to make a complex app.
I made three files: one for structure, one for styling, and one for interactions. This helped me understand what each part does.
# Beginner-friendly blog project
index.html
style.css
script.js
post1.html
post2.html
post3.html
What I learned from this approach
- Small steps are easier to understand and debug.
- HTML structure becomes clear before styling starts.
- CSS is easier when class names are clean and simple.
- JavaScript can stay short and focused.
Basic HTML layout I used
For my first page, I used semantic sections like header, main, and footer. This made my page readable and easier to style.
<header>
<nav>Home | About | Contact</nav>
</header>
<main>
<section>
<h1>My First Blog</h1>
<p>This is my first website project.</p>
</section>
</main>
<footer>© 2026 Amna Khan</footer>
Simple tips for beginners
My biggest lesson is to keep everything simple in the first projects. You do not need to use advanced tools when learning. Good basics are enough for a strong start.
Checklist I followed
- Write clean HTML first.
- Add CSS spacing and colors slowly.
- Test on laptop and phone screen.
- Keep JavaScript only for small interactions.
This project gave me confidence to continue learning. Building a working blog with simple tools helped me understand how websites are created from scratch.