Exploring IT: Theory Grade 11 - Internet Evolution and Web Technologies

The Evolution of the World Wide Web

  • Web 1.0 (The Earliest Stage)     * Definition: Web 1.0 was the initial stage in the evolution of the World Wide Web, described as "The Age of Authority."     * User Roles: Users were primarily "consumers of content." They were only able to view web pages but could not contribute to or change the content unless they were web developers.     * Analogy: It can be thought of as a library where you can view books on shelves but cannot modify or remove any pages.     * Management: Content was controlled entirely by the webmaster. The webmaster's role was to keep the site updated. Pages typically included the webmaster's email and the last update date at the bottom for user queries.     * Technical Characteristics:         * Fewer users.         * Slow Internet connections.         * Static HTML pages with hyperlinks.         * Primary activities: Reading, Receiving, and Responding.         * Company-focused rather than community-focused.

  • Web 2.0 (The Dynamic Web)     * Definition: Web 2.0 describes websites that moved beyond static pages to allow dynamic interaction and communication.     * User Engagement: Characterized by many content sharers and community focus. It is described as "Wildly Read-Write."     * Key Characteristics:         * User-Generated Content: Users can make changes and contributions. Example: Product reviews on Amazon.         * Social Connectivity: Enables users to find and link with each other. Examples: Facebook and Instagram.         * Content Sharing: Fast and efficient sharing of media. Example: Users uploading videos to YouTube for others to watch.         * Real-Time Updates: Users receive notifications of updates as they happen.         * Multi-Device Connectivity: Support for connecting via a variety of devices.     * Technical Shift: Characterized by more users, faster Internet connections, and applications such as wikis, blogs, and forums. Better facilities for user interfaces, software, and data storage are provided through the browser.

  • Web 3.0 (The Personalised Web)     * Definition: Known as the next step in evolution, providing a more personalized experience.     * Unique Profiles: Each user has a unique Internet profile based on their specific browsing history.     * Search Customization: Two different users using the same keywords on the same search engine may receive entirely different results because their profiles differ.     * e-Commerce & Advertising: Customised to user preferences, delivering advertising tailored to individual tastes and requirements.     * Technical Context: Known as "The Semantic Web," focusing on smart applications and individual-focused behavioral advertising.

  • Web 4.0 (The Mobile Web)     * Definition: A web that adapts to mobile surroundings, connecting all devices in the real and virtual worlds in real-time.     * Human-Machine Relationship: Re-defines the relationship between humans and machines through proactive interaction.     * Hypothetical Scenario: An automated system notifying a user: "Good morning. You're flying to Boston today. Take a raincoat, it's raining. By the way, that flight you were taking, it has been cancelled… I've already booked you on a new one… a mail has been sent to reschedule your appointment from 9am to 10am, Boston time."

Web Scripting and Interactivity

  • Overview of Scripting     * Script Definition: A set of instructions for either the web browser (client-side) or the server (server-side).     * Usage: Used in login systems, menus, slideshows, and search features. Examples include Google filling in search terms and Amazon recording purchases.

  • Client-Side Scripting     * Definition: The script runs on the "client" (the system running the web browser).     * Language: JavaScript is the primary language.     * Process:         1. User requests a page.         2. Server finds and sends the page.         3. Browser interprets the script and displays the page with running scripts.     * Purpose: Used to make pages interactive (clocks, calculators) and visually interesting after they arrive at the browser.     * Limitations: Performance relies on the user's computer speed. It may not run if the browser is incompatible. The code is visible within the HTML for the user to view or copy.

  • Server-Side Scripting     * Definition: The script is interpreted by the server where the web page lives before it is sent to the user.     * Process:         1. User requests a page.         2. Server interprets the script, creates/changes content to suit the user or passes data.         3. The final HTML page is sent to the user (it cannot be changed via server-side script once it arrives).     * Purpose: Used for individual accounts (social networking), e-Commerce, and data privacy.     * Benefits: Code is hidden from the user (cannot be copied). It always works consistently because it runs on the server. However, it increases the server's processing load.

  • Combination Scripting     * Sites like Google, Amazon, and Facebook use both.     * Server-side role: Manages logins, personal info, and specific data requests.     * Client-side role: Handles page interactivity, sorting, and displaying data based on user preference.

Cookies and Web Privacy

  • Definition of Cookies: A small piece of data sent from a website and stored in the user's browser.

  • Function: They allow websites to remember state or activity, such as buttons clicked, login status, or pages visited previously (even years prior).

  • Malicious Software Status: Cookies cannot carry viruses or install malware.

  • Privacy Concerns: Tracking cookies (especially third-party) are used to build long-term records of browsing history, which is a significant privacy issue.

Web-Based Applications

  • Definition: Software that runs on a web browser without requiring local installation. It requires an Internet connection and is usually hosted on a remote server via HTTP.

  • Advantages:     * No need to purchase and install software locally (saves storage space).     * Ubiquitous access (anytime, anywhere, on any system with a browser).     * Operating system independence.     * Automatic updates: Users don't need to install patches or bug fixes manually.

  • Major Examples:     * Google Suite: Docs (word processor), Sheets (spreadsheet), Gmail, Drive, and Classroom (integrates with tools like Edpuzzle).     * Microsoft Office Online/365: Subscription service allowing users to work online or on desktop with real-time synchronization.

Mobile Web and Application Technology

  • Mobile Websites     * Organizations often create separate mobile-specific sites (e.g., m.yourwebsite.comm.yourwebsite.com).     * Design: Typically condensed versions of desktop sites. Large files (images/videos) are removed for bandwidth efficiency.     * Mobile-Specific Features: Click-to-call and location-based mapping.     * Responsive Web Design: A design philosophy where a website appears as if it were designed specifically for the device and browser it is displayed on, regardless of screen size.

  • Native Mobile Apps     * Coding: Platform-specific (e.g., iOS uses Swift/Objective-C/Xcode; Android uses Kotlin/Java/Android Studio).     * Pros: Full access to device hardware (sensors, address book), better performance, and access to native UI controls (voice activation, touch features).     * Cons: Expensive and time-consuming. Apps must be developed and updated separately for each store (iOS vs. Android).

  • Hybrid Mobile Apps     * Definition: A blend of native and web solutions.     * Structure: Core is built with web tech (HTML, CSS, JavaScript) encapsulated in a native application shell.     * Access: Uses plugins to access device features through an invisible embedded browser.

  • Design Factors for Mobile Technology     * Screens: Must consider touchscreen sensitivity (varies by technology) and resolution quality (higher resolution may consume more power).     * Processing Demands: Developers must account for the limited specifications of smartphone processors.     * Storage Demands: Apps must be efficient due to limited space on mobile devices.     * Bandwidth Requirements: Critical for location-based or intensive features.

Browser Customization: Plug-ins and Extensions

  • Plug-ins: Software modules that add features. They are executables (object code). Most are now deprecated (Adobe Flash Player, Java Virtual Machine).

  • Extensions: Small software modules for browser customization. They are usually source code. Focused on productivity, ad blocking, and password management.

  • Usage in Chrome: Google Chrome has thousands of extensions but only one plug-in (Adobe Flash Player, disabled by default).

Search Engines and Search Technology

  • Search Engine Function: Program that trawls sites, builds database references, and returns a ranked list based on keywords.

  • Searching for Sound: Apps like Shazam use a microphone to capture sound, create an "audio fingerprint," and compare it against a database of millions of songs to return artist and album details.

  • Reverse Image Lookup: Users upload an image or URL. Advanced algorithms create a mathematical model/fingerprint. Useful for:     * Finding the image source.     * Obtaining higher resolution.     * Locating the content creator.     * Identifying where the image appears online.

Online Multimedia and Connectivity

  • Download vs. Streaming     * Download: Receiving data from a server and saving a copy to local storage. Can be viewed offline.     * Streaming: Real-time delivery. Files are played as they are opened and not saved locally. High bandwidth required. Buffering may occur on slow connections.     * Bandwidth Measurement: Measures data transfer rate. Example: 1,000Mbps1,000\,Mbps (Gigabit Ethernet) equals 125megabytespersecond125\,megabytes\,per\,second (1000÷81000 \div 8).

  • Video On-Demand (VOD)     * Allows users to select content whenever they desire.     * Services: Netflix, Amazon, Hulu, Disney+, and DSTV (Box Office/Catch Up).

  • VOIP (Voice over Internet Protocol)     * Delivery of voice and multimedia over IP networks, bypassing traditional public switched telephone networks (PSTN).     * Apps: Skype, Discord, Zoom.

  • Podcasts and Vodcasts     * Podcast: Series of on-demand digital audio files. Usually free and theme-based.     * Vodcast: A podcast containing video content.     * Benefits: On-demand listening, automatic downloads via subscription, and multi-tasking capabilities.

Data Compression

  • Lossy Compression     * Eliminates statistical redundancy by "rounding off" information.     * Trade-off between file size and quality.     * Examples: .jpeg.jpeg (images), MP3MP3 (audio), MPEG2MPEG-2 (video).

  • Lossless Compression     * No information is lost. The original and restored files are identical in size.

  • Audio Sampling     * Digital sound is created by breaking waves into samples stored as binary numbers.     * Sample Rate: Number of measurements per second. High quality is around 96kHz96\,kHz (96,000samplespersecond96,000\,samples\,per\,second).     * Bit Depth: Bits available for each clip.     * Bit Rate: Bits used per second of audio.

Questions & Discussion

  • Q1: Describe the evolution of Web 1.0, Web 2.0 and Web 3.0.     * Web 1.0 was a read-only "Age of Authority" where users were consumers. Web 2.0 introduced interactivity, user content, and social media ("Read-Write"). Web 3.0 focuses on personalization, smart applications, and a user-specific Semantic Web experience.

  • Q2: Why is Facebook an excellent example of Web 2.0?     * It embodies user-generated content, social networking, and real-time interaction, allowing users to connect and share media dynamically.

  • Q3: How will privacy and security be an issue in Web 3.0?     * Because Web 3.0 relies on deep tracking of browsing history to create unique profiles, the accumulation of personal data creates significant privacy risks.

  • Q4: How does Web 2.0 advantage e-Commerce and online ads?     * It allows for user reviews, social sharing of products, and interactive advertising, which broadens market reach and consumer engagement.

  • Q5: What is a script?     * A set of instructions for the web browser or server to perform specific tasks on a web page.

  • Q6: Compare client-side scripting and server-side scripting?     * Client-side runs on the user's machine (interactive features, visible code), while server-side runs on the server (handles databases/logins, hidden code).

  • Q6.1: Which is more secure for a user?     * Server-side is generally considered more secure as the code is not accessible to the user and can handle sensitive data and logic on a controlled server environment.

  • Q7: Why are cookies, in themselves, not considered as malicious software?     * They are simple data files; they cannot replicate like viruses, execute code, or install malware on a system.

  • Q8: List three advantages for schools of using web-based apps.     * No local installation/maintenance needed, ability to access work from any device (school or home), and automatic updates for tools like Google Classroom.

  • Q9: Using examples discuss the differences between a native mobile app and a hybrid mobile app.     * A native app like a specialized iOS navigator is built specifically for the hardware using Swift and has full speed/sensor access. A hybrid app (blending web and native) uses HTML/JS inside a shell, which is more cost-effective for cross-platform availability but may have performance trade-offs.

  • Q10: List 5 factors to consider when designing mobile apps.     * Screen size/sensitivity, processing power, storage limitations, bandwidth requirements, and user interface (UI) accessibility.

  • Q11: What is the purpose of a browser extension?     * To provide customization and add specific productivity or security features (like ad blockers or password managers) to the web browser.