1. Explain the client-server model of communica on on the web.

How do clients and servers

interact?
The client-server model is a fundamental concept in network compu ng, par cularly on the web. In
this model, two main en es are involved: the client and the server.

Client: The client is typically a web browser or any applica on that ini ates communica on by
sending a request to a server. The client requests resources like web pages, images, videos, or any
other data. The client is the front-end interface that users interact with.

Server: The server is a system that listens for requests from clients and processes them. It hosts
resources and services that clients need. Upon receiving a request from the client, the server
processes the request and sends back the appropriate response, which could be the requested web
page, an error message, or other data.

Interac on:

Request: The client sends an HTTP request to the server asking for a specific resource.
Processing: The server processes the request, accessing necessary data, performing computa ons, or
retrieving a file.
Response: The server sends back an HTTP response containing the requested resource, or an error
message if the resource is unavailable.
This interac on is stateless, meaning each request-response pair is independent of others, and the
server doesn’t retain informa on between requests unless explicitly designed to do so (e.g., using
sessions or cookies).

2. Describe the basic Internet protocols such as TCP/IP, DNS, and FTP, and explain their roles in
facilita ng internet communica on.
TCP/IP (Transmission Control Protocol/Internet Protocol):
TCP/IP is the fundamental protocol suite that forms the backbone of the internet. It consists of two
core protocols:

IP (Internet Protocol): Responsible for rou ng and addressing packets of data so that they reach the
correct des na on. IP assigns IP addresses to devices and ensures data packets are sent to the
correct des na on.
TCP (Transmission Control Protocol): Ensures the reliable transmission of data over the network. TCP
breaks data into packets, transmits them, and ensures they are received and reassembled in the
correct order. If any packet is lost, TCP retransmits it.
DNS (Domain Name System):
DNS is a hierarchical system that translates human-readable domain names (like www.example.com)
into IP addresses (like 192.168.1.1), which are used by computers to iden fy each other on the
network. DNS servers maintain a directory of domain names and their corresponding IP addresses,
allowing users to access websites using easy-to-remember names.

FTP (File Transfer Protocol):

FTP is a standard protocol used to transfer files between a client and a server over a network. It
allows users to upload, download, and manage files on a remote server. FTP is commonly used for
transferring large files, upda ng websites, and performing backups.
3. What is the World Wide Web (WWW)? Discuss its significance and how it differs from the Internet.
World Wide Web (WWW):
The World Wide Web is a vast collec on of interlinked hypertext documents and resources,
accessible via the internet. It was invented by Tim Berners-Lee in 1989 as a way to share informa on
globally. The WWW uses the HTTP protocol to transmit data and is primarily made up of web pages,
which can contain text, images, videos, and other mul media content.

Significance:

The WWW revolu onized how informa on is accessed and shared. It provided a pla orm for the
global exchange of ideas, communica on, commerce, educa on, and entertainment.
The WWW made it possible to navigate the internet using hyperlinks, which allow users to move
from one document to another with a click.
It enabled the crea on of dynamic and interac ve websites, which are now essen al in almost every
aspect of modern life.
Difference from the Internet:

The internet is the global network of interconnected computers and devices that allows for data
exchange. It is the infrastructure that supports various services, including the World Wide Web,
email, file transfer, and others.
The WWW is a service that runs on the internet. It uses the internet’s infrastructure to deliver
content to users. Essen ally, the internet is the hardware (the network), and the WWW is one of the
many services that run on it.
4. What is the rule cascading in CSS3? Explain how it affects the applica on of styles, including the
concepts of specificity and inheritance.
Rule Cascading in CSS3:
Cascading refers to the way CSS rules are applied to HTML elements when mul ple rules could apply
to the same element. The term "cascading" is used because CSS rules cascade down in a hierarchy,
with certain rules taking precedence over others based on specific criteria.

Factors affec ng cascading:

Specificity: This determines the priority of CSS rules based on how specific they are. Specificity is
calculated based on the types of selectors used:

Inline styles (e.g., <h1 style="color: red;">) have the highest specificity.
ID selectors (e.g., #header) are more specific than class selectors (e.g., .header).
Class selectors are more specific than type selectors (e.g., h1).
Universal selectors (e.g., *) have the lowest specificity.
If two or more rules conflict, the one with the higher specificity is applied.
Inheritance: Some CSS proper es are inherited from parent elements to child elements (e.g., font-
family, color). If a child element does not have a specific rule for a property, it may inherit the style
from its parent.

Order of Appearance: When mul ple rules have the same specificity, the one that appears last in the
CSS code is applied. This allows developers to override previous styles by wri ng new rules later in
the stylesheet.
Cascading allows for flexibility in applying styles but requires careful management to ensure that the
desired styles are applied correctly.

5. Explain the difference between inline, embedded, and external style sheets in CSS3. Discuss the
advantages and disadvantages of each.
Inline Style Sheets:
Inline styles are applied directly to an HTML element using the style a ribute.

Example: <p style="color: red;">This is a paragraph.</p>

Advantages:
Quick and easy to apply.
Ideal for single-use styles or overrides.
Disadvantages:
Not reusable, making it difficult to maintain.
Can clu er HTML code.
Lower performance for large projects because styles are repeated across mul ple elements.
Embedded Style Sheets:
Embedded styles are defined within the <style> tag in the <head> sec on of an HTML document.

Example:
html
Copy code
<style>
p{
color: blue;
}
</style>
Advantages:
Centralized within a single document, making it easier to manage than inline styles.
Allows for document-specific styling.
Disadvantages:
Not reusable across different documents.
Can increase the size of the HTML file, poten ally affec ng load mes.
External Style Sheets:
External styles are defined in a separate .css file and linked to the HTML document using the <link>
tag.

Example:
html
Copy code
<link rel="stylesheet" href="styles.css">
Advantages:
Styles can be reused across mul ple documents, improving consistency and maintainability.
Separa on of content (HTML) and presenta on (CSS), following best prac ces.
External CSS files can be cached by browsers, improving performance.
Disadvantages:
Requires an addi onal HTTP request to load the CSS file, which can impact page load me.
If the external CSS file fails to load, the page may display incorrectly.
6. Detail the structure of an HTTP request message. What are the key components, and what is their
purpose?
An HTTP request message is what a client (usually a web browser) sends to a server to request
resources like web pages, images, or data. The structure of an HTTP request message consists of
several key components:

Request Line:

The first line of the request message.

Contains three parts: the HTTP method, the requested resource (URL), and the HTTP version.
Example: GET /index.html HTTP/1.1
HTTP Method: Specifies the ac on to be performed (e.g., GET, POST, PUT, DELETE).
Requested Resource: The path to the resource being requested.
HTTP Version: Indicates the version of the HTTP protocol being used (e.g., HTTP/1.1, HTTP/2).
Headers:

A series of key-value pairs that provide addi onal informa on about the request.
Examples:
Host: www.example.com (Specifies the domain name of the server).
User-Agent: Mozilla/5.0 (Provides informa on about the client making the request).
Accept: text/html (Indicates the type of content the client can process).
Body (Op onal):

The body contains data being sent to the server, typically in POST, PUT, or PATCH requests.
Example: In a POST request submi ng a form, the body might contain the form data in key-value
pairs.
CRLF:

Carriage Return Line Feed (\r\n) separates the different components of the request.
A blank line (CRLF) a er the headers indicates the end of the headers and the beginning of the body
(if any).
The combina on of these components allows the client to precisely communicate its needs to the
server.

7. Explain the components of an HTTP response message and how it communicates the result of an
HTTP request.
An HTTP response message is what a server sends back to a client in response to an HTTP request. It
communicates the outcome of the request and, if successful, returns the requested resource.

Status Line:

The first line of the response message.

Contains three parts: the HTTP version, a status code, and a reason phrase.
Example: HTTP/1.1 200 OK
HTTP Version: Indicates the version of the HTTP protocol being used (e.g., HTTP/1.1).
Status Code: A three-digit number indica ng the result of the request (e.g., 200 for success, 404 for
not found, 500 for server error).
Reason Phrase: A brief descrip on of the status code (e.g., "OK", "Not Found").
Headers:

A series of key-value pairs that provide addi onal informa on about the response.
Examples:
Content-Type: text/html (Specifies the MIME type of the response body).
Content-Length: 1024 (Indicates the size of the response body in bytes).
Set-Cookie: sessionId=abc123; (Instructs the client to store a cookie).
Body (Op onal):

The body contains the actual content being returned to the client, such as an HTML page, an image,
or JSON data.
Example: In a response to a GET request for a web page, the body would contain the HTML content
of the page.
CRLF:

Carriage Return Line Feed (\r\n) separates the different components of the response.
A blank line (CRLF) a er the headers indicates the end of the headers and the beginning of the body
(if any).
The HTTP response message provides all the informa on the client needs to understand the
outcome of its request and, if successful, to display or process the requested resource.

8. Describe the role of web clients (e.g., browsers) in the context of the World Wide Web. How do
they process and render content?
Role of Web Clients:
Web clients, commonly web browsers, play a crucial role in accessing, rendering, and interac ng with
content on the World Wide Web.

Reques ng Resources: Web clients ini ate HTTP requests to web servers to retrieve resources such
as HTML documents, CSS stylesheets, JavaScript files, images, and videos.
Rendering Content: Once the resources are retrieved, the browser processes and renders the
content so that users can interact with it.
How Browsers Process and Render Content:

Parsing HTML:

The browser starts by parsing the HTML document, crea ng a Document Object Model (DOM) tree,
which represents the structure of the web page.
The DOM tree is a hierarchical representa on of the HTML elements, where each element is a node
in the tree.
Loading and Applying CSS:

The browser then retrieves and applies CSS rules, crea ng a CSS Object Model (CSSOM) tree.
The CSSOM tree works in conjunc on with the DOM tree to apply styles to the elements.
Execu ng JavaScript:

If the page includes JavaScript, the browser’s JavaScript engine executes the code, which can modify
the DOM and CSSOM, update content, handle user interac ons, and more.
Rendering the Page:
The browser combines the DOM and CSSOM trees to create a Render Tree, which contains all the
visual elements to be displayed.
The browser then calculates the layout, determining the posi on and size of each element on the
page.
Finally, the browser paints the elements to the screen, rendering the page that the user sees.
Handling User Interac ons:

The browser con nuously listens for user interac ons such as clicks, scrolling, or typing, and updates
the page as needed.
This process happens very quickly, allowing users to interact with web pages smoothly.

9. What func ons do web servers perform? Discuss how they serve content to web clients.
Func ons of Web Servers:
Web servers are specialized so ware or hardware that perform several cri cal func ons to serve
content to web clients:

Hos ng and Managing Resources:

Web servers store and manage the resources (HTML files, images, videos, etc.) that make up a
website.
Processing Client Requests:

When a web client sends an HTTP request, the web server processes the request, retrieves the
appropriate resource, and prepares an HTTP response.
Serving Content:

The web server delivers the requested content back to the client, typically a web browser, in the
form of an HTTP response. The response includes the requested resource or an error message if the
resource is not found.
Handling Security:

Web servers manage security protocols, such as HTTPS, to encrypt data transmi ed between the
client and server.
They also enforce authen ca on and authoriza on, ensuring only authorized users can access
certain resources.
Logging and Analy cs:

Web servers keep logs of all requests and responses, which are used for analy cs, troubleshoo ng,
and monitoring the performance and security of the website.
Load Balancing:

In high-traffic scenarios, web servers distribute incoming requests across mul ple servers to balance
the load and ensure efficient and reliable access to resources.
Execu ng Server-Side Scripts:
Web servers o en execute server-side scripts (wri en in languages like PHP, Python, or Ruby) to
generate dynamic content. This content is generated in response to a client’s request and tailored to
the client’s needs, such as personalized web pages or data retrieval.
Web servers play a pivotal role in ensuring that web content is accessible, secure, and efficiently
delivered to clients across the World Wide Web.

10. Define seman c elements in HTML5 and explain their importance in crea ng meaningful and
accessible web content.
Seman c Elements in HTML5:
Seman c elements are HTML tags that convey meaning about the content they contain, beyond just
their visual presenta on. These elements are named in a way that clearly describes their purpose,
making the structure of a webpage more understandable both to developers and to machines (like
search engines and screen readers).

Examples of Seman c Elements:

<header>: Defines the header sec on of a document or sec on, typically containing introductory
content or naviga on links.
<nav>: Represents a sec on of a page that links to other pages or parts of the same page, commonly
used for naviga on menus.
<ar cle>: Specifies independent, self-contained content that could stand alone, such as a blog post
or news ar cle.
<sec on>: Groups related content together, o en with a heading.
<footer>: Denotes the footer sec on of a document, usually containing informa on about the
author, copyright details, or links to related documents.
<aside>: Represents content that is tangen ally related to the content around it, o en used for
sidebars or pull quotes.
Importance of Seman c Elements:

Improved Accessibility:

Seman c elements enhance the accessibility of web content for users with disabili es. Screen
readers and other assis ve technologies can be er interpret the structure and meaning of a page
when seman c elements are used correctly.
SEO Benefits:

Search engines use the structure of a page to determine its relevance to search queries. Seman c
elements help search engines understand the content of a page, improving its chances of ranking
well in search results.
Enhanced Readability and Maintainability:

Code that uses seman c elements is more readable and maintainable. Developers can quickly
understand the structure and purpose of different sec ons of a page, making it easier to maintain
and update the code.
Be er Browser Compa bility:

Seman c elements ensure that content is presented consistently across different browsers,
enhancing the user experience.
Using seman c elements is a best prac ce in modern web development, contribu ng to the crea on
of meaningful, accessible, and well-structured web content.

11. Discuss the fundamental syntax and seman cs of HTML5. How does it differ from previous
versions of HTML?
Fundamental Syntax of HTML5:
HTML5 syntax is simpler and more flexible than previous versions of HTML, with several key features:

Doctype Declara on:

The doctype declara on in HTML5 is simpler: <!DOCTYPE html>. This declara on informs the
browser of the version of HTML being used, ensuring proper rendering.
Character Encoding:

HTML5 uses UTF-8 as the default character encoding. The declara on is simplified: <meta
charset="UTF-8">.
Tags and A ributes:

HTML5 supports a more streamlined syntax where certain elements and a ributes are op onal:
Closing tags are not required for some elements, like <img> and <input>.
Quotes around a ribute values are op onal if the value doesn’t contain spaces: <input type=text>.
New Elements:

HTML5 introduces new seman c elements like <header>, <footer>, <sec on>, and <ar cle>, which
provide meaningful structure to web content.
Form Enhancements:

HTML5 includes new input types (email, date, number) and a ributes (placeholder, required) that
enhance form func onality and valida on.
Seman cs of HTML5:

HTML5 emphasizes seman c markup, encouraging the use of tags that clearly define the content and
structure of a web page.
Seman c elements (e.g., <nav>, <ar cle>, <aside>) provide a clearer, more meaningful descrip on of
the content, which benefits accessibility, SEO, and code maintainability.
Differences from Previous Versions of HTML:

Doctype:

HTML4 required a complex doctype declara on with mul ple versions. HTML5 simplifies this with a
single, universal declara on.
Seman cs:

HTML5 introduces many new seman c elements that were not present in HTML4, improving the
readability and accessibility of web pages.
Mul media:
HTML5 provides na ve support for audio and video elements (<audio>, <video>), elimina ng the
need for third-party plugins like Flash.
APIs and Features:

HTML5 includes new APIs and features like the Canvas API, Web Storage, and Geoloca on, enabling
more dynamic and interac ve web applica ons.
Cross-Browser Compa bility:

HTML5 is designed to be backward-compa ble, meaning that browsers can s ll render older HTML
content correctly, while also suppor ng new features.
HTML5 represents a significant evolu on from previous versions, emphasizing simplicity, seman cs,
and the ability to create richer, more accessible web content.

12. Explain how tables and lists are structured in HTML5. Provide examples of when each might be
used.
Tables in HTML5:
Tables are used to present tabular data, organizing informa on into rows and columns. The basic
structure of a table consists of several key elements:

<table>: The container element for the en re table.

<thead>: Contains the table header row(s), usually containing <th> elements.
<tbody>: Contains the main content rows, typically containing <td> elements.
< oot>: Contains the footer row(s) with summary informa on (op onal).
<tr>: Defines a row in the table.
<th>: Defines a header cell, usually appearing in the <thead> sec on.
<td>: Defines a data cell, usually appearing in the <tbody> sec on.
Example:

html
Copy code
<table>
<thead>
<tr>
<th>Product</th>
<th>Price</th>
<th>Quan ty</th>
</tr>
</thead>
<tbody>
<tr>
<td>Apples</td>
<td>$1.00</td>
<td>10</td>
</tr>
<tr>
<td>Oranges</td>
<td>$0.80</td>
<td>20</td>
 </tr>
</tbody>
</table>
When to Use Tables:

Use tables when presen ng structured data that naturally fits into a grid format, such as financial
reports, schedules, comparison charts, or any dataset where informa on is best understood in a
tabular form.
Lists in HTML5:
Lists are used to group related items, o en for presen ng informa on in a sequen al or hierarchical
manner. There are three main types of lists in HTML5:

Ordered List (<ol>): A list where the items are presented in a specific order, usually numbered.
Unordered List (<ul>): A list where the items are presented without a specific order, usually with
bullet points.
Descrip on List (<dl>): A list of terms and their descrip ons, o en used for glossaries or defini ons.
Example of an Ordered List:

html
Copy code
<ol>
<li>Preheat the oven to 350°F.</li>
<li>Mix the flour, sugar, and eggs.</li>
<li>Bake for 25 minutes.</li>
</ol>
Example of an Unordered List:

html
Copy code
<ul>
<li>Milk</li>
<li>Bread</li>
<li>Cheese</li>
</ul>
Example of a Descrip on List:

html
Copy code
<dl>
<dt>HTML</dt>
<dd>A markup language used for crea ng web pages.</dd>
<dt>CSS</dt>
<dd>A stylesheet language used for describing the presenta on of web pages.</dd>
</dl>
When to Use Lists:

Use ordered lists when the sequence of items ma ers, such as step-by-step instruc ons or rankings.
Use unordered lists when the order of items is not important, such as lists of features, ingredients, or
items in a category.
Use descrip on lists when defining terms or presen ng pairs of related items, such as in glossaries or
FAQs.
13. What are HTML5 control elements? Explain their significance in enhancing user interac on on
web pages.
HTML5 Control Elements:
HTML5 introduced a variety of form control elements designed to improve the user experience when
interac ng with web forms. These elements provide built-in valida on, user-friendly input types, and
enhanced accessibility.

Examples of HTML5 Control Elements:

<input type="email">:

A specialized input field that expects an email address. It includes built-in valida on to ensure the
input conforms to the email format.
Significance: Reduces the need for custom valida on scripts and provides a consistent user
experience across browsers.
<input type="date">:

Provides a date picker interface, allowing users to select a date from a calendar.
Significance: Simplifies date input, ensuring consistent forma ng and reducing errors.
<input type="range">:

Displays a slider control, allowing users to select a value from a specified range.
Significance: Enhances user interac on by providing a more intui ve way to select numerical values.
<input type="number">:

Allows users to enter numeric values with built-in valida on to ensure only numbers are entered.
Significance: Improves the accuracy of numeric input and provides features like
increment/decrement arrows.
<input type="color">:

Provides a color picker, enabling users to select a color value.

Significance: Simplifies the process of selec ng and inpu ng color values, enhancing user interac on
in applica ons like design tools.
<input type="tel">:

Designed for telephone number input, o en triggering a numeric keypad on mobile devices.
Significance: Enhances user experience on mobile devices by providing a keypad op mized for phone
number input.
Significance of HTML5 Control Elements:

Enhanced User Experience: These controls provide more intui ve and accessible ways for users to
interact with forms, reducing errors and improving overall usability.
Built-in Valida on: HTML5 controls come with built-in valida on, reducing the need for custom
valida on scripts and ensuring consistency across different browsers.
Mobile Op miza on: Many of these controls are op mized for mobile devices, offering specialized
keyboards and input methods that improve the user experience on touch screens.
Accessibility: HTML5 controls are designed with accessibility in mind, ensuring that they are usable
by people with disabili es and compa ble with assis ve technologies.
HTML5 control elements represent a significant advancement in form design, providing developers
with powerful tools to create more interac ve and user-friendly web applica ons.

14. Describe the drag-and-drop func onality in HTML5. Provide an example of its usage.
Drag-and-Drop Func onality in HTML5:
HTML5 introduced a na ve drag-and-drop (DnD) API that allows developers to create interac ve web
applica ons where users can drag elements from one loca on to another.

How It Works:

Draggable Elements:

Elements can be made draggable by se ng the draggable a ribute to true.

Example: <div draggable="true">Drag me!</div>
Events:

Several events are associated with the drag-and-drop process, such as dragstart, dragover, drop, and
dragend.
dragstart: Triggered when the user begins dragging an element.
dragover: Fired when an element is being dragged over a valid drop target.
drop: Fired when the dragged element is dropped on a valid drop target.
dragend: Triggered when the drag opera on is complete.
Data Transfer:

The DataTransfer object is used to hold the data being dragged and to manage the transfer between
the drag source and the drop target.
Example Usage:

html
Copy code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, ini al-scale=1.0">
< tle>Drag and Drop Example</ tle>
<style>
#drag1 {
width: 100px;
height: 100px;
background-color: #f00;
margin: 10px;
}
#dropzone {
 width: 300px;
height: 300px;
border: 2px dashed #000;
margin: 10px;
}
</style>
</head>
<body>

<div id="drag1" draggable="true">Drag me</div>

<div id="dropzone">Drop here</div>

<script>
const dragItem = document.getElementById('drag1');
const dropZone = document.getElementById('dropzone');

dragItem.addEventListener('dragstart', func on(e) {

e.dataTransfer.setData('text/plain', e.target.id);
});

dropZone.addEventListener('dragover', func on(e) {

e.preventDefault(); // Necessary to allow drop
});

dropZone.addEventListener('drop', func on(e) {

e.preventDefault();
const id = e.dataTransfer.getData('text');
const draggedElement = document.getElementById(id);
dropZone.appendChild(draggedElement);
});
</script>

</body>
</html>
Explana on:

In this example, a red square (drag1) is draggable.

A drop zone is defined where the draggable element can be dropped.
Event listeners handle the drag-and-drop process, moving the square into the drop zone when the
user drags and releases it.
Usage Scenarios:

File Upload Interfaces: Allowing users to drag files from their desktop directly into a browser window.
Interac ve UI Elements: Enabling users to rearrange items in a list or move objects within a page,
such as in a custom dashboard or a game.
Data Transfer: Facilita ng the transfer of data between different parts of an applica on, like dragging
text from one field to another.
The drag-and-drop API in HTML5 enables developers to create more dynamic and interac ve web
applica ons, enhancing user engagement and experience.

15. Discuss the purpose and usage of the <canvas> element in HTML5. What are its applica ons?
Purpose of the <canvas> Element:
The <canvas> element in HTML5 provides a container for graphics that can be dynamically generated
and manipulated using JavaScript. It is used to draw shapes, images, text, and anima ons directly on
a web page.

Usage:

The <canvas> element itself is a blank slate; to draw on it, you must use the JavaScript API associated
with it.
The basic syntax is: <canvas id="myCanvas" width="500" height="400"></canvas>.
Drawing on the canvas involves obtaining the rendering context (usually 2D or 3D) and using
methods provided by that context to create graphics.
Example:

html
Copy code
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #000000;"></canvas>

<script>
const canvas = document.getElementById('myCanvas');
const ctx = canvas.getContext('2d');

// Draw a rectangle
ctx.fillStyle = "#FF0000";
ctx.fillRect(10, 10, 150, 75);
</script>
Applica ons of the <canvas> Element:

Game Development:

The <canvas> element is widely used for 2D game development, allowing developers to create and
animate game characters, backgrounds, and other elements.
Data Visualiza on:

<canvas> is used to create dynamic charts and graphs, providing a way to visually represent data in
real- me or sta c formats.
Image Manipula on:

Developers can use <canvas> to manipulate images, such as applying filters, cropping, or combining
mul ple images into one.
Custom Anima ons:

The <canvas> element allows for the crea on of custom anima ons, such as moving objects,
transi oning effects, or visual simula ons.
Drawing Applica ons:

Web-based drawing tools or paint applica ons o en use the <canvas> element to provide users with
a space to create and manipulate drawings.
Real- me Video Processing:

<canvas> can be used for real- me video processing, such as applying effects or analyzing frames as
they are played.
The <canvas> element is a powerful tool in HTML5, enabling developers to create a wide range of
interac ve and visually appealing web applica ons that go beyond sta c content.

References
“Introduc on to HTML5” by W3C, Coursera.
“HTML5 Fundamentals” by Pluralsight.
Mozilla Developer Network (MDN) Web Docs on HTML.
“Web Design with HTML, CSS, JavaScript, and jQuery Set” by Jon Ducke .