Introdction To Web and HTML

Introdction To Web and HTML

What Is Web?

The World Wide Web, also known as the Web. It is a collection of Websites or Web Pages stored in Web Servers & connected to local computers through the internet. [For beginners the World Wide Web is like a Book Printing House, Where Web pages are like Books & the data we get from the web pages through the internet is like a Book Shop].

What is a Web Server?

Web pages are a collection of data, including images, videos, text files, hyperlinks, database files etc., everything located on some computer (also known as server space) on the internet. A web server is a dedicated software that runs on the server side. When any user requests their web browser to run any web page, the web server places all the data materials together into an organized web page & forwards them back to the web browser with the help of the internet.

web-servar.jpg

Types of Web Servers?

Web Servers are mainly 7 types

  • Apache HTTP Server Web Server

  • Internet Information Services Web Server (IIS)

  • Lighttpd Web Server

  • Sun Java System Web Browser

  • Jigsaw Web Server

  • Lightspeed Web Server

  • Node.js Web Browser

Apache Server :

Apache 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. It’s widely thought that Apache gets its name from its development history and process of improvement through applied patches and It was revealed that the name originated from the respect of the Native American tribe for its resiliency and durability.

reverse-proxy-arch.png

Live Server :

Live Server - Makes the existing server live. This is a web extension that helps users to live to reload features for dynamic content (PHP, Node - JS, ASPNET etc.).

vscode-live-server-extension.jpg

What is HTML & Its tags?

HTML is a short form of Hyper Text Markup Language, It is a standard markup language that is understandable by humans and computers for designing a webpage or web application.

  • Hyper Text: Hypertext is a text that links to other information. By clicking on a link in a hypertext document, a user can quickly jump to different content.

  • Mark-Up: It is used to highlight text either by underlining or displaying it or both.

  • Language: It refers to the way of communication between web pages, which has its syntax.

  1. < !DOCTYPE HTML>: This is information given for the browser to know what type of document is being uploaded or used.

  2. < HTML lang=" en" >: It is the opening of the HTML program, and the main code starts from this point, and lang="en" describes that the program below is written in English. Similarly, as is used for french, etc.,

  3. < head >: This is where the main HTML header and metadata, like style, script, and character styles, that aren't shown on the main web page, are kept.

  4. < body >: This is the major role player in an HTML program, this is where the whole content is present that is displayed on the webpage.

  5. < style >: This HTML element contains style information for a document. or a part of a document. it contains CSS, which is applied to the contents of the document containing the < style > element.

  6. < h1 >< h2 >: These are heading tags given in the body tag for different sizes of headings and subheadings. There are further tags that can be given, such as < h3 >< h4 >

  7. < p >: It represents a paragraph of text. it is a block-level element, that always starts a new line. Before & After each paragraph.

  8. < a >: anchor tag is used to define a hyperlink, it is used to link one page with another page or used to go to page 2 from page 1.

  9. < br >: This is used to insert a line break. It is very useful for writing addresses, poems,

  10. < img > : This is used to embed an image file in an HTML page, it creates a holding space for the image that the user wants to put on the HTML page.

What is Attribute?

attributes are used to provide additional information about elements. It's always specified in the start tag, e.g. name='value'

What is Emmet?

Emmet is a plugin for text editors which improves HTML CSS Workflow in easy words we can say that Emmet is a toolkit for Web developers.