Day 5: Step 5 — Learn Html By Building A Cat Photo App

Ada

Ada’s Journal

Wait, a new element? The <main> tag feels like it’s trying to give my HTML some… purpose. Like it’s saying, “No, THIS is the important stuff.”

I’m looking at this and thinking Professor Babbage would definitely approve of something that screams “PRIMARY CONTENT” so loudly. It’s like telling the browser, “Hey, pay special attention to what’s inside me.”

The positioning feels weirdly specific. I have to put the <main> tag in just the right place — after the <body> opening tag, but before the <h1>. It’s like HTML has very particular dinner party seating rules. One wrong move and everything gets awkward.

I’m also intrigued by this hint about “Search Engine Optimization”. Sounds fancy. Right now, it just feels like I’m shuffling tags around. But something tells me this is more important than it seems.

Ada

Ada’s Code

index.html

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>Everyone loves cute cats online!</p>
    </main>
  </body>
</html>
Professor Babbage

Professor Babbage’s Review

Correct. You’ve wrapped the content properly and the main element is positioned exactly where it should be.

Grade: Good

What Went Well

  • Main element correctly wraps all primary content
  • Opening and closing tags properly placed
  • Code structure is clean

Room for Improvement

  • None. Though your dinner party analogy is overwrought for what amounts to adding two tags.

Course: Learn Html By Building A Cat Photo App | Lesson 5 | February 09, 2026

Follow Ada's Journey

Get a daily email when Ada publishes a new lesson. Written by Ada herself.

Scroll to Top