In this HTML tutorial for beginners, we will continue where we left off in Part 2. You will learn about some more basic HTML tags that are commonly used. These tags are important if you want to create a well-structured website.
If you have not done so already, I suggest that you go through Part 1 and Part 2 of this HTML tutorial for beginners before continuing. This will ensure that you understand the concepts that we will be discussing in this article.
So, let’s get started!
Headings
Headings are used to indicate the importance of a section of text. There are six heading levels, ranging from
(the most important) to
(the least important).
The following example shows how headings are typically used on a website:
This is a Level 1 Heading
This is a Level 2 Heading
This is a Level 3 Heading
This is a Level 4 Heading
This is a Level 5 Heading
This is a Level 6 Heading
As you can see, the headings become progressively smaller as the heading level decreases.
It is important to use headings correctly, as they can affect both the appearance and the SEO (Search Engine Optimization) of your website.
Headings should be used to structure the content of your page, making it easy for users to scan and find the information they are looking for.
They should also be used to indicate the hierarchy of information on the page, with
being used for the most important sections, and
being used for the least important sections.
Images
Images are an important part of any website. They can help to break up text, add visual interest, and make your site more visually appealing.
There are two ways to add images to your website: using the tag, or using the background-image property in CSS.
We will discuss both methods in this article.
Adding Images Using the Tag
The tag is used to add images to your website. The syntax for this tag is as follows:
where “URL” is the location of the image file on your server or on another website.
For example, if you wanted to add an image from your computer, you would use a URL similar to this:
file:///C:/Users/myname/Documents/myimage.jpg
If you wanted to add an image from another website, you would use a URL similar to this:
http://www.example.com/images/myimage.jpg
In both cases, “myimage” would be replaced with the actual name of your image file.
It is also possible to specify the width and height of an image using the width and height attributes:
where “XXX” is replaced with the actual width and height values in pixels. However, it is generally not recommended to specify these values, as it can lead to distorted images if the actual image size does not match these values exactly.
Adding Images Using CSS
Another way to add images to your website is by using CSS (Cascading Style Sheets). This method offers more control over how images are displayed on your page than using HTML alone.
To add an image using CSS, you first need to create a CSS class that contains all of the properties that you want to apply to your image:
.classname {
property1: value1; /* plus any other properties that you want */
}