1.7 WEB PAGE

Key Points with Detailed Explanation

1. What is a Web Page?

A web page is a digital page which can contain text, hyperlinks, videos, audios, images, tables, and more.
It is written using a computer language called HTML (Hypertext Markup Language).
Web pages are stored on special computers called web servers.
To access a web page, you use a unique address called a Uniform Resource Locator (URL).
Web pages are the basic units that we see when we browse the Internet.

Examples:

The Google homepage (https://www.google.com) is a web page.
A blog post with text, pictures, and embedded videos.
The Wikipedia article you read online.

2. Components of a Web Page

While web pages can look quite different, most share certain basic elements.

Structural Elements

Title bar: Shows the title of the web page at the top of your web browser tab or window.
Menu or Navigational Links: These are clickable links that let you move between different parts of the website.
Header Area: Usually at the top, this includes the website name, logo, and sometimes a search box.
Content Area: The main section where the information of the web page is displayed.
Footer Area: Appears at the bottom and contains things like copyright notices, contact information, and privacy policies.

Examples:

When you open www.amazon.in, the Amazon logo is in the header, the navigation bar has links like "Today's Deals," and the content area shows products.
On your school website, the footer usually has contact information and copyright details.
A news site may have a menu bar to switch between news categories and the main content area filled with articles.

Content Elements

Hypertext: Text (or sometimes images and videos, then called hypermedia) that links to other web pages or documents. It is typically blue and underlined.
Hyperlink: The actual electronic connection made by clicking on hypertext. The mouse pointer changes to a hand when you hover over it.
Source code: The set of instructions (in HTML or other languages) that tells a web browser how to display the web page.

Examples:

On Wikipedia, the blue words in the text connect to other articles via hypertext and hyperlinks.
When you click a "Buy Now" button on Amazon, you use a hyperlink to reach the checkout page.
Viewing the source code (by right-clicking and choosing "View Page Source") on any web page reveals the HTML instructions.

3. How Does a Web Page Work?

Let’s look at what happens, step by step, when you open a web page:

The web page’s source code is created using a development tool, such as a text editor or special software.
You type the web page’s URL into your browser (like Chrome or Firefox) to request the page.
The browser sends a request for the page to the web server where it is stored.
The web server finds the page and sends it back to your browser.
Your browser interprets the code and displays the web page for you to see.

Examples:

Typing www.cbse.gov.in into your browser and pressing Enter.
Clicking a bookmark for your favorite comic site makes your browser contact the web server.
Refreshing a page to see updated news – your browser again asks the server for the newest data.

Activity: Understanding Static vs. Dynamic Web Pages

Objective: Explore the difference between static and dynamic web pages.

Step-by-step Instructions:

Open a simple HTML file saved on your computer (for example, myhello.html).
Open it with your browser to see a message such as "Hello, World!" — this is a static web page.
- Observation: No matter how many times you open it or reload it, the message stays the same.
Visit a news website or your school's online result page.
- Observation: The content changes depending on who logs in, the current date, or recent updates. This is a dynamic web page.

Explanation:

Static content does not change unless the developer edits the source code. It is great for simple, informational pages.
Dynamic content changes automatically and can show user-specific data or live updates. This is useful for interactive sites like e-commerce and result portals.

Examples:

A personal portfolio page that always shows the same information (static).
A shopping cart page that shows each user their selected items (dynamic).
A weather forecast site updating data every hour (dynamic).

4. Difference Between a Web Page and a Website

Web Page	Website
A single digital page on the internet	A collection of connected web pages within a single domain
Contains information on one specific topic	Covers a subject or theme, often with many topics
Like one page in a book	Like the entire book
Identified by a unique URL	All pages share the same domain name
Example: www.school.com/contact.html	Example: www.school.com (the main site with many pages)

Examples:

"aboutus.html" is a single web page, while "www.company.com" (the full site) is a website.
A shopping website has separate web pages for "Home," "Products," and "Contact Us."
Your blog’s main page is the website, each article is a web page.

Scenario-Based Questions and Answers

Scenario: You want to create a webpage for your Science project and display it to your classmates.
- Question: What basic components should you include to make your web page easy to navigate and visually appealing?
- Answer: Include a title bar, header with project name, navigation menu (if your project has multiple sections), content area for description and images, and a footer with your details.
Scenario: You find a website where clicking "Contact Us" opens a form.
- Question: What feature is used here, and how does it work behind the scenes?
- Answer: This uses a hyperlink connecting to a new web page or form. Behind the scenes, clicking sends a request to the web server to display the contact form page.
Scenario: Your friend saved three different online articles but forgot their website addresses.
- Question: How can the Uniform Resource Locator (URL) help your friend in future?
- Answer: Each article web page has a unique URL. By noting or bookmarking URLs, your friend can easily revisit the exact web pages anytime.
Scenario: You refresh your online result page, and your scores suddenly appear.
- Question: What kind of web page are you viewing, and why does the content change?
- Answer: This is a dynamic web page. The content changes based on user input (your login) and updates as new information is available.
Scenario: You open a simple web page about your favorite scientist. No matter how many times you open it, the content stays the same.
- Question: Is this page static or dynamic? What are the advantages of this type?
- Answer: This web page is static. Advantages include simple construction, fast loading, and no server processing is required to display the same information.