DEV Community

Faessal Sufi
Faessal Sufi

Posted on • Edited on

HTML Essentials: Unveiling the Basics of Structure and Key Tags

What is a web server?

A web server is not always a big rack; it can be software as well as hardware. It stores all the files that are required to view a web page on a browser.
The most popular web server is Apache, which serves 67% of the total websites all around the world. It is a software-based web server.
The reason a web server exists is to serve us the web page we want. Let's support you. You have to visit the Google website now. What will you do? You will open the browser and type www.google.com. Correct? So in this case, you typed the URL and requested the server for a web page, which is Google, and your request is sent via HTTP (Hyper Text Transfer Protocol), and then the server checks or searches the URL in the system; it will send you the response and serve the web page to you.

What is Apache?

Apache is one of the most powerful web server softwares till now, and the reason developers like it is that it is open source, highly customised, and gives so much freedom to a developer. That's the reason 67% of the world's websites are served by Apache.

What is a live server?

I can bet! When you started your coding journey and watched a YouTube tutorial, they just told you to go and install the extension called Live Server, and you're ready to go. It will automatically refresh the page, but have you ever thought How is it happening? Why?
When we open a webpage without any live server, the current state of the web page is loaded into memory, and it gets served to you. If you make any changes later on, it will not show directly because the old state is being served to you and the browser is not aware that the file has been changed. If we refresh the page, then we can see the changes. To automate this task, live servers are made. It is nothing but a piece of code that tracks the file, and if any changes are made to the file, it will refresh the page. It is all done by a script that is embedded in your code while serving you. This is how a live server actually works.

What is HTML?

HTML stands for hypertext markup language. It is used to make the structure of a webpage. Most people ignore the learning part of HTML because they think we know that.
But there is a catch: if you want to rank your website on Google, you must know the basics and fundamentals of HTML, which help a lot to rank a website, so that the Google algorithm can know what you are actually serving on your webpage. In this way, you can optimise your website.

  • HTML's basic structure You might know that using the emmet abbreviation, we can generate the boilerplate of HTML using "!" and Tab/Enter.

Image description

  • Some HTML tags: We have a heading tag to showcase the heading for a webpage, and we can have a total of 6 levels of headings from h1 to h6. H1 is the biggest heading, and H6 is the smallest heading.

Image description

  • We also have the <p></p> tag to write the paragraph or long text. Every p tag takes its own line; it is mostly used to write long text on a website.

  • Let's talk about an important tag, which is the <img src="" alt=""> tag. Which takes two parameters? One is required, which is source or src, and the other is alt. The purpose of using alt is that if our image fails to load, then the value in alt will be displayed on the screen so that the user can understand that the picture belongs to nature, space, etc.

  • We also have a size attribute to adjust the size of the image with the source set to show more than one image. Its tag looks something like this: "<img src="" alt="" sizes="" srcset="">" We can give one or more source strings separated by commas to give multiple values.

Top comments (0)