0% found this document useful (0 votes)
5 views

coding notes

HTML (Hyper Text Markup Language) is a markup language created by Tim Berners-Lee in 1991 for structuring web content, defining elements like headings, paragraphs, and images. It is platform-independent and can integrate with other languages like CSS and JavaScript to enhance web pages. HTML documents are saved with a '.html' extension and are rendered by web browsers, which parse and display the content to users.

Uploaded by

anujj4164
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
5 views

coding notes

HTML (Hyper Text Markup Language) is a markup language created by Tim Berners-Lee in 1991 for structuring web content, defining elements like headings, paragraphs, and images. It is platform-independent and can integrate with other languages like CSS and JavaScript to enhance web pages. HTML documents are saved with a '.html' extension and are rendered by web browsers, which parse and display the content to users.

Uploaded by

anujj4164
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

HTML NOTES

What is HTML?
HTML (Hyper Text Markup Language) was created by Tim
Berners-Lee in 1991 as a standard for creating web pages. It's a
markup language used to structure content on the web, defining
elements like headings, paragraphs, links, and images. HTML
forms the backbone of web content. In layman's terms, HTML is
like the skeleton of a website. It's a set of instructions that tells
a web browser how to display text, images, videos, and other
elements on a webpage. Think of it as the building blocks that
create the structure and look of a website, similar to how bricks
and mortar are used to build a house.
In a nutshell:

 HTML is the language of the web, used to create


websites.
 HTML defines the barebone structure or layout of web
pages that we see on the Internet.
 HTML consists of a set of tags contained within an HTML
document, and the associated files typically have either
a ".html" or ".htm" extension.
 There are several versions of HTML, with HTML5 being
the most recent version.

Features of HTML
 It is platform-independent. For example, Chrome
displays the same pages identically across different
operating systems such as Mac, Linux, and Windows.
 Images, videos, and audio can be added to a web page
(For example - YouTube shows videos on their website)
 HTML is a markup language and not a programming
language.
 It can be integrated with other languages like CSS,
JavaScript, etc. to show interactive (or dynamic) web
pages

Why the Term Hyper Text & Markup


Language?
The term 'Hypertext Markup Language' is composed of two main
words: 'hypertext' and 'markup language.' 'Hypertext' refers to
the linking of text with other documents, while 'markup
language' denotes a language that utilizes a specific set of tags.
Thus, HTML is the practice of displaying text, graphics, audio,
video etc. in a certain way using special tags.
Note: Tags are meaningful texts enclosed in angle braces, like
'<...>'. For example, the '<head>' tag. Each tag has a unique
meaning and significance in building an HTML page, and it can
influence the web page in various ways.

Quick Exercise:
Open a webpage of your choice, right-click on the browser, and
select 'View Page Source,' and then you will see the HTML code
for that page.
This is the code that the server sent to display the page you're
currently viewing. In this tutorial, we'll learn how to write this
type of code using HTML.

A beautiful analogy to understand HTML,


CSS, and JavaScript:

In building a webpage, think of HTML, CSS, and JavaScript as


different parts of a car. HTML is like the car's skeleton, forming
the basic structure and frame. CSS adds the paint and finishing
touches, making the car look appealing with color, style, and
design. JavaScript is similar to the engine and mechanical parts,
infusing the car with functionality, movement, and interactive
features. Similarly, when developing a website, HTML lays out
the structure, CSS enhances its visual appeal, and JavaScript
provides interactivity and dynamic content

History of HTML:
 In 1989, Tim Berners-Lee established the World Wide
Web (www), and in 1991, he created the first version of
HTML.
 From 1995 to 1997, further work was done to develop
and refine different versions of HTML.
 In 1999, a committee was organized that standardized
HTML 4.0, a version still used by many today.
 The latest and most stable version of HTML is 5, also
known as HTML5.

HTML Working
You must have heard of frontend and backend. Frontend refers
to the visible part of a website or app that users interact with,
like the tables, images, and buttons. It's built using languages
like HTML, CSS, and JavaScript. The backend, on the other hand,
handles behind-the-scenes operations like storing and
processing data when users interact with the frontend. It uses
languages like Python, Ruby, and Java. In essence, frontend is
what users see, while backend manages the functionality.

How do websites work?


When we want to access any information on the internet, we
search for it using a web browser. The web browser retrieves
the content from web servers, where it is stored in the form of
HTML documents.
An HTML document is created by writing code with specific tags
in a code editor of your choice. The document is then saved with
the '.html' extension. Once saved, the browser interprets the
HTML document, reads it, and renders the web page.

The text editor has the HTML code of a website. This website
can now be viewed in a beautifully rendered format using a
computer program known as a web browser.
What is a Web Browser?
A web browser is a program that understands HTML tags and
renders them in a human-readable format that is easily
viewable by people visiting the website. Developers write code
in HTML because it's a straightforward way to instruct the web
browser on what to display. In the next section, I'll show you
how to set up VS Code for writing your own HTML code and
rendering it in a web browser.

What is an HTML Document?


An HTML document is a text document saved with the '.html' or
'.html' extension, containing text and specific tags enclosed in
'< >'. These tags provide the necessary instructions for
configuring the web page. The tags themselves are
standardized and fixed. The structure of an HTML document will
be explained later in this HTML tutorial.

What is a Rendered Page:


The rendered page is the output screen of our HTML Document
which is the page displayed on the browser.

How does a basic website work?

 Web Browser(client) requests websites like


(WWW.GOOGLE.COM) from the web server.
 Web server in return sends HTML, CSS, and JavaScript
files to it.
 HTML, CSS, and JavaScript files are parsed by a
webbrowser which is responsible for showing you a
beautiful website.

How does a browser work?


A web browser plays a crucial role in parsing and rendering
HTML code to the client. A web browser is a complex program
that performs many tasks behind the scenes. Here's a summary
of how it works:

 A browser is an application that reads HTML documents


and displays them as web pages. Browsers can't access
the content directly from where it's stored; this is where
servers come into play.
 A server acts as an intermediary, listening to browser
requests and fulfilling them by delivering the HTML
document to the browser.
 Web browsers perform two main tasks: parsing and
rendering.
 During the parsing stage, the browser receives raw
bytes, which are converted into characters. These
characters are then converted into tokens, which in turn
are transformed into nodes. These nodes are organized
into a tree-like data structure known as the DOM
(Document Object Model).
 Once the DOM tree is constructed, the browser moves
on to the rendering stage. At this point, each node in
the DOM tree is rendered and displayed on the screen.

Don‘t worry about how browser exactly works just yet. Rather
focus on learning HTML. In the next page we will install VS Code
and some extensions for writing our HTML code.

You might also like