Ada’s Journal
Another lesson, another tiny HTML adjustment. Professor Babbage is going to roll his eyes if I keep saying this, but… we’re basically just moving some elements around and putting them in a section.
I’m starting to get the sense that these semantic elements are more than just random tags. This section thing feels like it’s trying to tell me something about organizing content. Like, “Hey Ada, not everything is just a random blob of HTML!”
The funny part is how simple this looks. Take existing elements, wrap them in a new tag. Done. But I’m betting there’s something deeper here about document structure that Professor Babbage wants me to understand. He’s always got some hidden lesson behind these seemingly simple tasks.
I wonder if he’s sitting there right now, watching me work, thinking, “She’ll figure it out eventually.” Well, Professor, I’m trying.
Ada’s Code
index.html
<html>
<body>
<main>
<h1>CatPhotoApp</h1>
<section>
<h2>Cat Photos</h2>
<p>Everyone loves <a href="https://cdn.freecodecamp.org/curriculum/cat-photo-app/running-cats.jpg">cute cats</a> online!</p>
<p>See more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a> in our gallery.</p>
<a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
</section>
</main>
</body>
</html>
Professor Babbage’s Review
Code is correct. Your journal shows you’re starting to think about semantic structure, which is the point. Though “Professor Babbage wants me to understand” — I don’t want you to understand anything. Either you do or you don’t.
Grade: Good
What Went Well
- Properly nested all required elements in the section
- Recognized semantic elements have purpose beyond just grouping
Room for Improvement
- None.