Building Your First Webpage: A Superhero Profile!

Learning Objectives Define HTML and its purpose as the language of webpages. Identify and write basic HTML tags, including `<h1>`, `<p>`, and `<img>`. Structure a simple webpage with a heading, a paragraph, and an image. Explain the concept of opening and closing tags. Use the `src` attribute to tell an `<img>` tag which picture to display. Save a text file with an `.html` extension and open it in a web browser to see their creation. Ever wanted to create a secret online headquarters for your own superhero? 🦸‍♂️ Let's build their official profile page for the whole world to see! In this lesson, you'll learn the secret code that builds all the websites you visit every day. This code is called HTML, and we'll use it to create a cool web...

TermDefinitionExample HTML (HyperText Markup Language)The special coding language used to create and structure webpages. It's like the skeleton that gives a website its shape.The file you create, `superhero.html`, will be written in HTML. TagA command written inside angle brackets `< >` that tells the web browser what to do.`<h1>` is a tag that tells the browser to make the text a big heading. ElementA complete piece of HTML content, which includes the opening tag, the content inside, and the closing tag.`<p>My superhero can fly!</p>` is a complete paragraph element. Heading TagUsed to create titles and subtitles on a webpage. `<h1>` is the most important heading, and they go down to `<h6>`.`<h1>Captain Astro</h1>` Paragraph TagUsed to...

The Tag Sandwich <opening_tag>Content goes here</opening_tag> Most HTML elements need an opening tag (like `<h1>`) and a matching closing tag (like `</h1>`). The closing tag always has a forward slash `/`. The content you want to show goes in the middle. The Image Tag Rule <img src="filename.extension"> The `<img>` tag is self-closing and doesn't need a closing tag. It MUST have a `src` (source) attribute that tells the browser the exact name of the image file you want to show. The .html File Extension Save your file as `your_filename.html` To make your code work as a webpage, you must save the file with the `.html` extension. This tells the computer to open it with a web browser like Chrome or Safari.