0:00
3:22
3:22

Day 10: Mastering Images & The figure Tag | 28-Day Web Developer Bootcamp

Education

Welcome to Day 10 of the 28-Day Web Developer Bootcamp! 🚀 In today’s lesson, we are tackling the figure and figcaption elements, and why you might be using them incorrectly! We will also clean up our code by learning which legacy HTML attributes we can finally leave behind. In this video, we cover: Not Every Image is a Figure: We explain why you shouldn't add extra figure markup around your images just for the sake of it. The figure element is specifically intended for self-contained content that can be moved away from the primary content—like to an appendix or sidebar—without affecting the document's flow . Your Logo is Not a Figure: We discuss the common abuse of the figure element when it comes to site branding . A company logo is rarely going to be referenced as a self-contained unit within the document's text, so a standard img tag is all you actually need . Figures Are More Than Images: A common misconception is that this tag is exclusively for pictures. We will show you how a figure can actually be used to mark up video, audio, charts, tables, quotes, or blocks of code . Dropping Unnecessary Attributes: We will look at how to write cleaner code by dropping outdated HTML patterns. In HTML5, there is no need to include type="text/javascript" on your script tags or type="text/css" on your style tags, because modern browsers already expect scripts to be JS and styles to be CSS by default . 📅 About This Bootcamp: Have you ever wondered how websites are built? This complete, 28-day course takes you from writing your first line of code to understanding the core technologies of the modern web: HTML, CSS, and JavaScript. We believe that learning to code should be accessible to everyone. Inspired by initiatives like CodeYogi, which successfully teaches industry-standard programming entirely via smartphones , this course is designed so you can follow along whether you have a high-end laptop or are coding right from your mobile device . In today’s lesson, we are diving into: [Brief 1-2 sentence description of what today's specific video covers. Example: "How to properly structure your HTML document and use the head tag for metadata."] 📅 About This Bootcamp: Have you ever wondered how websites are built? This complete, 28-day course takes you from writing your first line of code to understanding the core technologies of the modern web: HTML, CSS, and JavaScript. We believe that learning to code should be accessible to everyone. Inspired by initiatives like CodeYogi, which successfully teaches industry-standard programming entirely via smartphones , this course is designed so you can follow along whether you have a high-end laptop or are coding right from your mobile device . Throughout this 4-week journey, you will master: The Blueprint of the Web: Understanding basic HTML syntax, the Document Object Model (DOM) tree structure, and web page metadata . Advanced HTML5 & Best Practices: Writing clean, semantic markup and avoiding common beginner mistakes (like overusing the section tag or misusing figure) . Styling & Interactivity: Using CSS for design and JavaScript to dynamically manipulate the webpage . The Developer’s Arc: Software engineering can be a high-strain job . We dedicate time to discussing developer mental wellbeing, avoiding burnout, and protecting your personal time . 🔗 Helpful Links: 📂 Access the full 28-Day Playlist here: [Insert Playlist Link] 💻 Download today's code snippets: [Insert Link] 📱 Join our community Discord/Telegram: [Insert Link] Don't forget to Like, Comment, and Subscribe to stay updated on tomorrow's lesson. Grab your device, open your code editor, and let's start building!

ADVERTISEMENT

Comments 0

Sign in to join the conversation

Sign in
No comments yet — be the first!