Introduction To  Web Servers & HTML

Introduction To Web Servers & HTML

Have you ever noticed how the internet works? What is this WWW?

·

5 min read

Web is also known As WWW. Basically it is a Collection Of Web Pages or Websites that are hosted on Server. Which are accessed by the web browsers through Internet.

Now the question Arises ?? How this websites Are made ? Fetched through Internet ? Where this Websites are Stored? & That is because of Webservers

Webserver

Webserver is a software which stores the content of Websites & Displays them when ever they are requested

When ever we search any website a request is sent to a webserver Via HTTP Hyper Text Transfer Protocol, Web server handle the request & displays the content on the page.

Appache HTTP Serve

image_2022-11-21_165126893.png Apache HTTP Server is a free and open-source web server that delivers web content through the internet. It is commonly referred to as Apache and after development, it quickly became the most popular HTTP client on the web.

One of the pros of Apache is its ability to handle large amounts of traffic with minimal configuration. It scales with ease and with its modular functionality at its core, you can configure Apache to do what you want, how you want it. You can also remove unwanted modules to make Apache more lightweight and efficient.

Live Server

Live-Reload.png When we Write The code & Runs that's on browser It show desired Output but after few more changres we must refresh the browser to view the update one, To get rid of this Annyoing thing There is an Extension on VS code Named Live Server by Ritwick Dey It help in launching a local development server with live Reload feature for Static & dynamic pages

Code Editor

It is kind of software that help the developer to create, edit , add Features to construct the code. Some of them are

  • VS Code

  • Sublime

  • Jet brains Fleet

  • Atom

Most Common Technologies Used in creating Webpages & Websites

image_2022-11-21_170410566.png

HTML

HTML stands For Hyper Text Markup Language , This is Markup Language used to Develope Website & Webpages, It describes the Structure of Webpage.

HTML have Series of Element this Elements Align the Content, How To display.

GVriG0Vd6.webp

  • Here<h1> is an opening tag and </h1> is closing tag

  • Content is the text present in the tag ie "Example Heading"

  • The opening tag, the closing tag, and the content together comprise the element.
  • Elements can also have attributes . Attributes contain extra information about the element that you don't want to appear in the actual content. Here, class is the attribute name and primary is the attribute value

Structure of HTML

       <!DOCTYPE html>
          <head>
             <meta charset="utf-8">
             <title>Introduction to HTML</title>
         </head>
         <body>
              <h1>Basics of HTML</h1>
               <p>This is a beginner friendly article.</p>
          </body>
      </html>
  • <!DOCTYPE html> : This tells the server that this is Html File while Rendering.
  • <head> : This contains All The Meta tags means the data(information) about data, this only contain the content which the developer wants to tell to the Server Not on the webpage.

  • <title> : This sets the title to your webpage, that appears on browsers tab.

  • <body> : This Contains all the content that the developer want to show on his webpage, like texts , image, videos & audios etc.

Basics Tags In HTML

  • Heading Tag <h1><h6>

Heading tag in Html Are used to define the title or a subtitle which the developer want to display on webpage. Html element represnt Six levels of Heading Section
<h1> to <h2> In which <h1> is higest section & <h6> is lowest.

Below Examples can Brif you about this.

  • Paragraph Tag <p> </p>
    The p is used to define the paragraph in webpage.

    Lorem

Its a content filler shortcut used in VS Code to fill the paragraph with Random meaningless text. By writhing lorem & the numbers of word required lorem 50

  • Anchor Tag <a>

This tag Is used to Create a hyper link within the webpage.

  ```<a href= https://ineuron.ai >FSJS 2.0</a>```
  • Line Breaking Tag <br>

br tag is used to end the line. and the start remaining Text from next line.

  • Image Tag <img>

   <img src="" alt="">

above tag is image tag used to embed the image in webpage.

Src-> Source -> Path to the Image.

alt -> Attribute -> Description of Image. description is used for Accessibility If the image will not load then this description will be displayed

Some Other properties like width & hight . can Also Be altered.

Hope You All Like The Blog, For Upcoming Blogs Stay Tunned, keep Coding.