HTML is the fundamental markup language used for crafting web pages.
Understanding HTML:
- HTML stands for Hyper Text Markup Language.
- It is the foundational markup language used to construct web pages.
- HTML outlines the structure of web pages.
- HTML comprises various elements.
- These elements instruct the browser on how to present content.
- HTML elements tag content with descriptions like "this is a heading", "this is a paragraph", "this is a link", etc.
Example of a Basic HTML Document:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>My Initial Heading</h1>
<p>My introductory paragraph.</p>
</body>
</html>
Explanation of the Example:
- The
<!DOCTYPE html>declaration indicates that this document adheres to HTML5 standards. - The
<html>tag represents the root of an HTML page. - The
<head>tag holds meta-information about the document. - The
<title>tag sets the title of the web page, which appears in the browser's title bar or tab. - The
<body>tag establishes the main content area for visible items like headings, paragraphs, images, links, tables, lists, etc. - The
<h1>tag denotes a significant heading. - The
<p>tag signifies a paragraph.
Understanding HTML Elements:An HTML element consists of an opening tag, content, and a closing tag:
<tagname>Content goes here...</tagname>
The complete element includes everything from the opening tag to the closing tag
<h1>My Initial Heading</h1>
<p>My introductory paragraph.</p>
Elements and Tags:
- Start tag:
<h1> - Content: "My Initial Heading"
- End tag:
</h1> - Start tag:
<p> - Content: "My introductory paragraph."
- End tag:
</p> - Some elements, like
<br>, do not contain content or end tags and are referred to as empty elements.
Role of Web Browsers:Web browsers like Chrome, Edge, Firefox, and Safari are designed to read HTML documents and render them appropriately. The browser does not show the HTML tags themselves but uses them to format and display the content.
Visualizing HTML Page Structure:
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>
Note: Content inside the <body> will be visible in the browser, whereas content in the <title> is displayed in the browser's title bar or tab.
HTML Evolution:HTML has evolved significantly since the inception of the World Wide Web:
- 1989: Tim Berners-Lee founded the WWW.
- 1991: Tim Berners-Lee introduced HTML.
- 1993: Dave Raggett developed HTML+.
- 1995: HTML 2.0 was standardized by the HTML Working Group.
- 1997: HTML 3.2 was endorsed by W3C.
- 1999: HTML 4.01 received W3C's recommendation.
- 2000: XHTML 1.0 was recommended by W3C.
- 2008: WHATWG released the first public draft of HTML5.
- 2012: HTML5 was adopted as a living standard by WHATWG.
- 2014: HTML5 was recommended by W3C.
- 2016: HTML 5.1 was nominated as a candidate by W3C.
- 2017: HTML5.1 Second Edition was recommended by W3C.
What Can JavaScript Do?
JavaScript can change HTML attribute values.
In this case JavaScript changes the value of the src (source) attribute of an image.
