HTML Essential Tags- Summary:
In this video we have covered the essential HTML Tags. They include: Heading Tags, HTML Paragraph Tag, HTML Link Tag , and HTML List Tag. It's important to get familiar with these HTML Tags because they provide basic building blocks for creating web pages. In addition to providing structure & functionality to web pages they also enhance the accessibility for users who rely on screen readers (or other assistive technologies) to navigate your content. Here is list along with the html code of the essential tags we have covered in this video:
HTML Headings
There are total of 6 HTML Headings; from < h1 > to < h6 >.
They provide hierarchy in order of importance. They provide hierarchy in order of importance. They provide hierarchy in order of importance.
Here is the complete list of html headings:
< h1 > This is h1 heading < /h1 >< h2 >This is h2 heading < /h2 >< h3 >This is h3 heading < /h3 >< h4 >This is h4 heading < /h4 >< h5 >This is h5 heading < /h5 >< h6 >This is h6 heading < /h6 >
HTML Paragraphs
HTML paragraph tag is used to define and represent a paragraph of text.
Here is html code for paragraph:
< p > Here goes your paragraph < /p >
HTML Links
The < a > Anchor Text < /a > element in HTML is used to create hyperlinks, which allow you to link to other web pages,
files, locations within the same page, email addresses, and more. Here is full html code for links:
< a href="https://coding4success.com/" target="_blank">
Visit W3Schools.com < /a >
HTML List
HTML List is used when we want to present list of items in a structured way on a webpage. When you're making a to-do list on paper or when you write down different tasks to perforom- you most likely would use some kind of bullet-points to make it stand out. The HTML List does exactly the same. In our future videos, we'll go into more details about html list. Here we'll only talk about unordered list. Here is the html code:
< ul >
< li > This First List Item < /li >
< li > This Second List Item < /li >
< li > This Third List Item < /li >
< li > This Fourth List Item < /li >
< /ul >
HTML Essential Tags: FAQ
We understand that learning Essential HTML Tags can be filled with questions and uncertainties, especially for beginners. That's why we've created this dedicated QA Session: .
An HTML tag typically consists of three main parts: 1) Openning Tag, 2) Content and c) Closing Tag. For example < p > is opening paragraph tag; and < /p > is closing tag. The content would go between these two tags.
Tags are used to create HTML elements by marking the beginning and end of elements. The basic structure is < tagname > content </ tagname >. On the other hand, HTML attributes provide additional information about HTML elements. Attributes are added to the opening tag and are written as name-value pairs. The syntax is < tagname attribute="value" > content </ tagname >
In HTML, the < h1 > (heading level 1) tag represents the most important or highest-level heading on a webpage. Headings in HTML are used to structure content hierarchically, with < h1 > being the top-level heading and subsequent heading levels (< h2 >, < h3 >,, and so on) indicating decreasing levels of importance.
While other tags such as < html >, < head >, and < body > are also crucial for structuring an HTML document, the < !DOCTYPE html > declaration is often considered the most essential as it sets the stage for the proper interpretation of the HTML code by browsers.
The last tag on every HTML document is the closing < /html > tag. This tag signifies the end of the HTML document and encapsulates the entire content of the webpage.
The two main sections of an HTML document are the < head > and < body > sections. The < head > section is where you include meta-information about the HTML document, such as the title of the page, links to external stylesheets or scripts, meta tags for SEO (Search Engine Optimization), and other elements that are not directly displayed on the webpage. The < body > section contains the actual content of the HTML document that is displayed in the browser. This includes text, images, links, forms, and other elements that make up the visible part of the webpage.
In HTML, the < span > tag is an inline container element that is used to apply styles or scripting to a specific section of text within a larger block of content. Unlike block-level elements, the < span > tag does not add any line breaks or new lines, and it is typically used for applying styles or scripting to a small portion of text, rather than creating a distinct block-level structure.
Test Your HTML Essential Tags Knowledge with Our Quiz
Ready to put your HTML skills to the test? This quiz is a great way to reinforce what you've learned in our HTML Essential Tags tutorial. Let's see how well you've grasped the essentials of HTML development!
Your Result Is ...
HTML Essential Tags Coding Challenge
Get ready for a hands-on learning exercise! In this challenge, you'll have the opportunity to practice and master the use of essential HTML tags. Have fun coding!
Challenge Instructions
Your task is to create the same page as displayed on the right side using the code editor below. If you encounter any difficulties or need assistance with the code, don't hesitate to click the "Need Some Help?" button below..
This Is My Awesome H2 Heading
This is my amazing paragraph where I demonstrate my proficiency in using HTML Essential Tags to build my first webpage! Cool, isn't it?
Here is my amazing link so you could Visit Coding4Success
I have created this list of HTML Essential Tags using HTML Unordered List Tags.
My Unordered List
- HTML Heading
- HTML Paragraph
- HTML Links
- HTML List
Now is your turn! Use the code editor below to practice the essential HTML tags. Remember: "Practice makes perfect"!
Please Do Not Copy & Paste the above code as it will not display. Please type in the above code to practice.