← Back to all posts
Learning Notes

Learning HTML & CSS

I am learning how to design websites using HTML and CSS. This post is about the basic things I practiced and what helped me understand web design as a beginner.

Starting with simple HTML structure

I first learned how to create a clean structure with headings, paragraphs, links, and sections. Instead of trying everything at once, I practiced a small layout many times.

This helped me understand where content should go and how a page is built from top to bottom.

basic-page.html
<main>
  <section>
    <h1>Learning HTML & CSS</h1>
    <p>I am learning website design step by step.</p>
  </section>

  <section>
    <h2>My Practice Links</h2>
    <a href="https://github.com/amna25ce">GitHub</a>
  </section>
</main>

How CSS made my page better

CSS helped me improve colors, spacing, and readability. I learned that even a small style file can change a plain page into a clean and friendly layout.

simple-style.css
body {
  background: #f5f5f0;
  color: #1a1a2e;
  font-family: Georgia, serif;
  line-height: 1.7;
}

h1 {
  color: #059669;
}

.box {
  background: #ffffff;
  border: 1px solid #e5e5dc;
  border-radius: 12px;
  padding: 16px;
}

Beginner habits that helped me

  • Write HTML first, then apply CSS slowly.
  • Use meaningful class names instead of random short names.
  • Test after every small change.
  • Practice one concept at a time.

My next learning step

Next I want to practice responsive design and better CSS layout with Flexbox. After that, I will continue with simple JavaScript interactions.