Day 2 — HTML, CSS, and You
Today we learned how to actually build websites. We moved from theory to practice, covering the core technologies that power every site on the web.
Here’s a recap
- Learnt about HTML and page structures: We learned that HTML is markup language that organizes content for browsers. Every webpage is an HTML document with nested elements. We focused on essential tags: headings (
<h1>
), paragraphs (<p>
), links (<a>
), images (<img>
), containers (<div>
), lists (<ul>
,<li>
), and inline elements (<span>
). - CSS styling and how it works with HTML: CSS targets HTML elements and changes how they look. We learned selectors—how to grab specific elements to style them. IDs are unique identifiers for single elements, classes are reusable names for groups of elements. This is how you connect design to structure.
- CSS Diner as a way to learn selectors: Interactive practice with CSS selectors, covering the most common ways to target elements for styling.
- Making an intentionally bad website!
Not only this, but we also learnt about tools and workflows which are used in professional environments:
- VS Code: Our IDE of choice. We fired up a local server to help us preview our work.
- GitHub: How to fork repositories and download them as zip files to get started with existing projects.
- And finally, how to deploy this into the ocean with Netlify for everyone to see.
Today’s Links
- CSS Diner - CSS selector practice game
- CSS Properties List - Reference for styling experiments
- MDN HTML Reference - Complete HTML documentation
- MDN CSS Reference - Complete CSS documentation
- GitHub Docs - Guide to forking repositories