Introduction to Web and HTML

Introduction to Web and HTML

This article is about introduction to web and HTML

Introduction

Hello there! Welcome to my very first blog. In this brief article, we are going to discuss what the web is, how it works, and a few HTML tags.

Why do we need an index.html page?

By default, servers serve the index.html or default.html if anyone hit our website link. For example, let out website is hc.com then if we want to visit the product page we hit hc.com/product.html but what happens when anyone hit hc.com, then we can show a default page that is either index.html or default.html.

What is Web Server?

Web servers are programs which are used to serve out web pages. One of the popular web servers is Apache. When we host our website on any particular hosting platform on the backend they have a server like Apache server, which is used to render our pages on the internet.

What is HTML?

HTML (HyperText Markup Language) is the most basic building block of the Web. It defines the meaning and structure of web content. Other technologies besides HTML are generally used to describe a web page's appearance/presentation (CSS) or functionality/behaviour (JavaScript).

Structure of HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
</html>
  • <!DOCTYPE html> declaration defines that this document is an HTML5 document.

  • <html> element is the root element of an HTML page.

  • <head> element contains meta-information about the HTML page.

  • <title> element specifies a title for the HTML page (which is shown in the browser's title bar or the page's tab).

<body> element defines the document's body and is a container for all the visible contents.

HTML Element

  • <h1>..<h2> -> heading tags which are used for headings of different sizes up to h6.
  • <p>...<p>-> paragraph tags which are treated as new paragraphs.

  • <br> -> break to enter into a new line.

  • <hr> -> breaks the line by inserting a horizontal line.

  • <pre>..</pre> element defines preformatted text(text as mentioned in document).

  • <img /> tag is used when you want to display an image. It usually consists of at least two attributes, src and alt. The src attribute contains the source or address of the image to be displayed. The alt attribute contains some brief information about the image which is displayed when the image is not loaded or for accessibility purposes.

  • <a></a> is called the anchor tag. It is the hyperlink tag. It has an attribute href that contains the link to other pages that you want to navigate the user to.

  • <strong>...</strong> -> bold text ( shows strong importance/urgency)

  • <i>...</i> -> italic itext

  • <em>...</em> -> italics text (used when more emphasis is needed).

  • <sup>...</sup> -> superscript (x2)

  • <sub>...</sub> -> subscript (H2O)