Introduction to Web and HTML

Web Server

What is a web server?

A web server is simply a combination of hardware and application software that communicates with end users and serves them with required information if it's available. In the hardware section, there are all the files that an application software needs to create a web server HTTP. Such as HTML, CSS, JS, images and many other documents. An HTTP web server is software that deals with the web address and domain names that were hosted on the server and it delivers the required information of those hosted websites to the end user device which they were requested for via the URL or web address. If the requested URL is not present in the server then it returns a 404 message.

What is Apache?

Apache is an open-source web server created by American software developer Robert McCool. It was released in 1995. This is free web server software. Where people can host their websites on the internet. This is the best web server software to date.

What is a live server?

A live server is a miniature version of a web server. This is a toolkit for developers to analyze their projects while creating them simultaneously. This is an extension used in various kinds of code editors like VS code, Fleet, Atom, etc. For example, if we use the web server extension by Ritwick Dey then we can see an extra set of code while we view the page source. Those extra codes were automatically generated by the live server to track our project simultaneously. Let me present an image of that code:


HTML

HTML tags:

So far, we have discussed HTML tags named:

  • <h1></h1>

  • <h2></h2>

  • <p></p>

  • lorem

  • Image tag

  • <a href=""></a>

Now we will discuss above mentioned tags one by one.

<h1></h1>

This is a heading tag. Which is used to address any topic in larger and bolder fonts. We will write whatever we want and the browser will render that text in its designated format.

<h2></h2>

This is also a heading tag. Which is a bit smaller than h1.

<p></p>

This is a paragraph tag. We use this tag to write plain text like detailed information about any topic.

Lorem

Lorem is nothing but filler content. In the initial days of practicing when we need to write something to fill our page but lack that interest in writing then Lorem comes handy. If we simply write Lorem100 and press the Tab key in between paragraph tags then Lorem will write a 100 words paragraph for us.

Image tag
<img src="" alt="">
<img src="" alt="" srcset="">

The image tag is used to add any image to our website. We can place the image location under the "src" attribute. We have to make sure that the image and the html fire are at the same location or we can add any image from the internet by typing its URL.
In the "alt" section we will write about the image. If somehow the image link is broken then the user can understand by reading the information.
In the "srcset" attribute we can link the same image with different resolutions. Which one is the best resolution image for the browser, the browser will show us that image. It's a set of sources.

<a href=""></a>

This "a" tag is an anchor element, which hyperlinks web pages, files, email address, phone number etc. to your current web page. We simply write the address of the page in the "href" section and name it like this "<a href="xyz.com">website</a>". Then only by clicking on the website our current page will take us to the mentioned website.

These are the tags we've discussed so far in the calss.