Putting Content In Our Body
In this video, we begin adding content to the BODY of our HTML page. Learn how to include simple text inside the BODY tag and why it's essential to keep your HTML code organized. By focusing on clean structure, you'll make it easier to style and maintain your web pages in the future.
Ready to Level Up Your Skills?
Join thousands of learners on 02GEEK and start your journey to becoming a coding expert today!
Enroll Now for Free!Getting Started with HTML Training
Join my mom as I teach her the basics of HTML. In this ground breaking course.
Starting to do HTML
In this first video we will start talking about file formats, browsers and even see a few file types in HTML.
How to pick an HTML Editor
There are a lot of HTML editors out there so how will you pick the right on for you?
Creating Our First Tag
The most basic building block in HTML is the Tags. we will create one tag of our own. In this video we will create our first simple tag.
HTML, HEAD and BODY Tags
Every HTML page has a few tags you got to have that without them its not an HTML page. In this video we will learn about the HTML tag, the Head and the Body Tags.
Putting Content In Our Body
Now that we have a legal HTML structure its time for us to add our first content into our legal built HTML file.
Creating a Page Title
Adding a TITLE to the page. In this video we will add a title into the HEAD area of the page. We will then talk about what the TITLE is and where we can see it.
Creating Headlines: Tags H1 Through H6
It's time for us to explore and learn a few more tags. The tags we will be creating next are the headline tags. By the end of this video you will know 6 new tags!
Integrating the P tag (paragraph tag)
It's time for us to add the P tag into our skill set of tags. In this video we continue to learn HTML and add in the basic information we need to know about the P tag.
RECAP
That's it we are done with our first HTML session. We would love to make many more but that is 100% up to you if you love it support us drop a nice word for my mom and me.
Putting Content In Our Body detailed:
Task 3: Transcript Converted to Tutorial
Putting Content in Our Body
In this tutorial, we’ll take the next step in building an HTML page by adding content to the BODY tag. The BODY is where all visible content resides, and keeping it organized is essential for clean, maintainable code.
1. What Is the BODY Tag?
The <body> tag is where you place all the content that will appear on the webpage. Anything inside the BODY tag—like text, images, and links—is what users see when they visit your site.
Here’s a simple example:
<body>
02Geek is a great school.
</body>
When viewed in a browser, the text 02Geek is a great school. will display on the page.
2. Adding Content to the BODY
Let’s walk through adding text to the BODY step-by-step:
-
Open Your HTML File:
- Use a plain text editor (e.g., Sublime Text, Notepad).
-
Add Content Inside the BODY:
Type the following code:<body> 02Geek is a great school. </body> -
Save the File:
Save your file with a.htmlextension, such asMyPage.html. -
View It in a Browser:
Drag and drop the file into a browser. The text02Geek is a great school.should appear on the page.
3. Why Keep Things Organized?
Organizing your HTML code is critical for several reasons:
- Easier Styling: Cleanly written HTML makes it easier to apply styles (like colors and fonts) using CSS.
- Maintainability: Organized code is easier to edit and update later.
- Structure Matters: Breaking down your page into parts like the HEAD and BODY ensures the browser knows where to find specific information.
4. The Importance of Organization in HTML
HTML is all about structure. Even though you could technically write everything without tags, it would quickly become chaotic and difficult to manage.
For example, compare these two approaches:
Messy Code:
02Geek is a great school. This is another line of text.
Clean Code with HTML Tags:
<body>
<p>02Geek is a great school.</p>
<p>This is another line of text.</p>
</body>
The second example is much easier to read and maintain, especially as the page grows in complexity.
Summary
In this tutorial, you’ve learned:
- How to add simple content to the BODY tag.
- The importance of organizing your HTML for clean and maintainable code.
What’s Next?
In the next tutorial, we’ll explore how to add different types of elements to the BODY, like headlines, paragraphs, and more. Stay tuned!