← Back to Home Grades 5-6 AI Class | Chapter 1: Internet & Web

What Are Websites? 🌐

Understanding URLs, Domains, and Web Servers

Session 2: How Websites Work

Websites Live on Servers 🖥️

A website isn't magic - it's just files stored on a computer called a server that's always connected to the internet.

What's on a Server?

  • HTML files (structure/content of the page)
  • CSS files (styling/appearance)
  • JavaScript files (interactivity)
  • Images, videos, and other media
  • Databases with information

When you visit google.com, Google's server sends all these files to your browser, which displays them as a webpage!

URLs: Web Addresses 🔗

A URL (Uniform Resource Locator) is the web address you type in your browser.

https://www.google.com/search?q=puppies

Breaking Down the URL:

  • https:// - Protocol (secure version of http)
  • www - Subdomain (often "World Wide Web")
  • google.com - Domain name
  • /search - Path (which page on the server)
  • ?q=puppies - Query (search parameter)

Domains & Extensions 📝

A domain is the unique name of a website. Every domain has an extension called a TLD (Top-Level Domain).

Common Domain Extensions:

  • .com - Commercial (most common)
  • .org - Organizations (non-profit)
  • .edu - Education (schools/universities)
  • .gov - Government
  • .net - Network infrastructure
  • .co.uk, .de, .fr - Country codes

Domain Registration

You can buy a domain from a registrar like GoDaddy or Namecheap. Cost is usually $5-15/year. This reserves the name so no one else can use it!

Web Browsers 🌐

A web browser is the application that displays websites. It takes HTML/CSS/JavaScript and turns them into what you see.

Popular Web Browsers:

  • Google Chrome - Fast, feature-rich (most popular)
  • Mozilla Firefox - Privacy-focused, open-source
  • Safari - Apple's browser (for Mac/iPhone)
  • Microsoft Edge - Windows' default browser

Key feature: All browsers can display the same website, but slightly differently depending on how they interpret HTML/CSS.

The Request-Response Cycle 🔄

When you visit a website, something amazing happens in milliseconds:

  1. You type a URL: "youtube.com"
  2. Browser sends request: "Hey, send me youtube.com"
  3. Request travels: Through routers and ISP to YouTube's server
  4. Server processes: Finds the files for youtube.com
  5. Server responds: Sends back HTML, CSS, JavaScript, images
  6. Response travels back: To your computer across the internet
  7. Browser displays: Renders the files into a webpage
  8. You see the page: In about 1-3 seconds!

HTML: The Building Block 📄

HTML (HyperText Markup Language) is the code that structures a website. Don't worry - you don't need to code, just understand the concept!

What HTML Does:

HTML is like an outline. It defines:

  • Headings and paragraphs
  • Links to other pages
  • Images and videos
  • Forms (like search boxes)
  • Lists and tables

Example: When you see a blue underlined link on a website, that's HTML saying "This is a clickable link to another page!"

Dynamic vs Static Websites 🎬

Static Websites

  • Same content for everyone
  • Just HTML, CSS, and images
  • Example: A business's "About Us" page

Dynamic Websites

  • Content changes based on user input
  • Uses databases and programming languages
  • Examples: Google Search, Facebook, YouTube, Gmail
  • Server creates custom HTML for each user

Almost all interesting websites today are dynamic! They remember who you are, show personalized content, and respond to your actions.

HTTPS: Secure Websites 🔒

Notice websites have "https://" not just "http://" - the "S" means Secure.

What's the Difference?

  • HTTP: Data travels unencrypted (anyone can see it)
  • HTTPS: Data is encrypted (scrambled, only the server can read it)

Security Tip

Never enter passwords or credit cards on HTTP websites! Only use websites with HTTPS, especially when entering sensitive information. Most browsers show a lock icon 🔒 next to HTTPS URLs.

Web Hosting & Data Centers 🏢

If you want to create a website, you need to store it somewhere. Companies like Bluehost, Hostgator, and AWS provide web hosting.

Web Hosting Types:

  • Shared Hosting: Your site shares a server with others (cheap, slow)
  • VPS (Virtual Private Server): More control and speed
  • Dedicated Server: Your own server (expensive but fast)
  • Cloud Hosting: Servers automatically scale (used by big companies)

Complete Website Journey 🚀

When you visit YouTube.com, here's what happens:

  1. Your browser resolves "youtube.com" to Google's server IP address
  2. Browser sends HTTPS request to Google's servers
  3. Google's server checks your login info and preferences
  4. Server generates personalized HTML based on your watch history
  5. Server sends HTML, CSS, JavaScript, thumbnail images
  6. Your browser downloads and displays the page
  7. JavaScript makes the page interactive (hover effects, infinite scroll)
  8. When you search or click, JavaScript sends more requests to the server

All of this happens in 1-3 seconds!

Critical Thinking 🤔

Questions to Consider:

  • How do websites remember you? (Cookies and user accounts)
  • Why are some websites slow? (Server load, poor connection, unoptimized code)
  • Who owns a website? (The person/company who registered the domain and owns the server)
  • Can websites see me? (They see your IP address and what you click, but not your location unless you allow it)

What We Learned 🎓

  • Websites are files stored on servers connected to the internet
  • URLs are web addresses with specific structure
  • Domains are unique website names with extensions (.com, .org, etc.)
  • Web browsers download and display website files
  • HTML structures website content
  • Dynamic websites generate content based on user input
  • HTTPS encrypts data for security
  • Web hosting is where websites are stored

Websites Explained! 🎉

Now you understand what happens when you visit a website!

Next Session: How Search Engines Work