Intro to the World-Wide-Web and HTML

ARPANET. Mentioned in the Intro to the Cyberspace Domain class, the Advanced Research Projects Agency Network (ARPANET) was the first network that interconnected computers between the University of California, Los Angeles (UCLA), the University of California, Santa Barbara (UCSB), Stanford University, and the University of Utah. The precursor to the Internet began in September of 1969 with two connections, a single node, that was connected to UCLA and quickly expanded to a handful of universities. The first transmission was so unreliable that the connection crashed when the two letters LO were transmitted. Thus, history was made with "LO" but the actual attempt was to access the node by sending LOGIN (ICANN, 2019).

Web 1.0: Information-based. The WWW (W3) was conceptualized in a proposal by Tim Berners-Lee at CERN in 1989- yep the nuclear research organization that's running the experimental Large Hadron Collider (LHC). This proposal attempted to address the scalable problem by developing "a distributed hypertext system." The hypertext system became Hyper Text Markup Language (HTML), the foundational basis for sharing information through websites, as well as the Uniform Resource Identifier (URI) and standards for communications through the HyperText Transfer Protocol (HTTP).
The concept of early web pages are similar to books, where sites were intended only to provide one-way, read-only communications. There was no way to engage or interact with the author through websites. This Massachusetts Institute of Technology (MIT) website published in 1996 on Internet growth at the time is a good example of Web 1.0 - https://www.mit.edu/people/mkgray/net/internet-growth-summary.html.

Search engines helped organize all of this information through the use of metadata. Popular Internet Service Providers (ISPs) in the early 1990's, like America Online (AOL), had their own application-based search programs that used keywords to access websites instead of having to memorize a website's address. Other popular search engines in the late 1990's include AltaVista, Ask Jeeves, Lycos, Netscape, and WebCrawler. Take a look at millions of 1.0-based websites through the Internet Archive - WayBack Machine.

What Happens on the Internet Stays on the Internet
With more than 800 billion websites archived, the WaybackMachine is maintained by the Internet Archive. Back in the early 2000's, it was unimaginable that the entire Internet could be recorded due to the amount of data that would be necessary to store all of that information. Moore's Law may have applied to transistors in chips but when it comes to storage capacity, this article states that storage exceeded Moore's Law by eight times! Even with the technologies to "hide" activities on the Internet, it's likely going to be revealed by future capabilities.

Why are mobile apps dangerous?

Malicious software, also referred to as malware, have been found in 'fast fashion' e-commerce apps like Temu, TikTok, and Pinduoduo - all Chinese based companies. Security analysis has found these apps to bypass user security permissions with the ability to modify settings, access private messages and biometrics, view data from other apps, collect Bluetooth and WiFi network information, and prevent uninstallation. Take a look at this news article from 2023, a US Report on economic and security impacts, and analysis from the Center for Internet Security (CIS).

Web Terms and Concepts

• The "World Wide Web". The World Wide Web is the vast global collection of servers and clients (aka browsers) communicating over the Internet using the HTTP or HTTPS protocols. The Web is an example of a client-server system.
• A Server is a computer (and associated programs) that provides a service.
• A Client is a computer (or program) that uses a service provided by a server.
• A single physical computer CAN play the role of both a server and a client at the same time.
• Protocols. Computers and networked (interconnected computers) systems are very complex. Only by employing very careful, highly structured designs can we humans deal with that complexity. Protocols are at the heart of that design. A protocol is an agreement about communication between two communicating parties -- a complete specification of what things can be said, what responses can and must be made, and what these things mean.
• A website is a collection of one or more files that contain the content you see displayed when you visit a website with your browser. These files include not only the main webpage, but also image files, script files (that make the webpage do things), and other files.
• Web Server. Web servers are computers (and the software running on them) that exist to supply website content, using the HTTP or HTTPS protocol, on demand. What this means is that files for the website are stored on one or more web servers. Some popular web server software includes IIS (from Microsoft), Apache (from the Apache Software Foundation), and NGINX (pronounced "engine-X"). If you're curious, the course website is hosted on an Apache web-server
• "Web Client" = Browser. For a user, and for this course, a web client is just a browser, such as Chrome, Firefox, Edge, or Safari. Note that these are applications running on top of a computer's operating system.
• "Web" vs. "Internet". The "Web" and the "Internet" are not the same thing. The Internet includes all the infrastructure (clients, servers, routers, switches, cables, radio links, etc) and protocols through which browsers and web servers communicate, but encompasses much more. Many other kinds of communication run over the Internet: e-mail, voice-over-IP telephone calls, remote logins to computers (recall, ssh), file sharing, etc.
  • Web — web servers, web clients. HTTP and HTTPS protocols.
  • Internet — includes web, but also includes e-mail, streaming media, VOIP, chat, internet gaming, etc., plus all the communications hardware and protocols to connect them.
  • "The Internet" >> "The Web"

Browsers are applications (apps) that are used to read and process web information on users systems. Web information may include HTML, Cascading Style Sheets (CSS), JavaScript, and more. We'll explore these more in the next few lessons. Chrome, FireFox, Edge, and Safari are some of the more common browsers used in computers and mobile devices but they all serve the same purpose: to process information provided by a web server and display it for users to see on their own devices. The anatomy of a browser consists of basic functionality that allows users to use the app to navigate to any website that's online. Here are some main points about browsers:

• A browser's primary control (input) is the address bar. You enter into the address bar a URI, or Uniform Resource Identifier (URI), which tells the browser where to find a website resource.
• URI. A URI specifies three required components and two optional components:
  1. The scheme - what protocol is used to communicate.
  2. The authority - the name of the web server to contact.
  3. The path - the file path on a web server containing data to be processed.
  4. An optional query -used as a delimiter (?) that processes attribute-value pairs.
  5. An optional fragment - used as an identifier (#) that processes a secondary resource.

  |------Uniform-Resource-Identifier------|
  https://www.usna.edu/CyberDept/index.php
  \(1)/   \----(2)----|-------(3)--------/
      

  foo://example.com:8042/over/there?name=ferret#nose
  \_/   \______________/\_________/ \_________/ \__/
   |           |            |            |        |
scheme     authority       path        query   fragment
      

Scheme. Computer network communications are never "official" standards. Instead they are evaluated through the Internet Engineering Task Force (IETF) through Requests for Comments (RFCs). Individuals and companies refer to these RFCs and choose to implement these protocols so that their software will be compatible with the critical mass of other users on the Internet. RFC2616 specifies HTTP communications while the improved and secure HTTPS is under RFC2818. These "comments" lay out requirements for standard communications but are not always adopted, potentially resulting in obsolete protocols due to lack of use or lack of security. Additional schemes supported by web browsers include the file URI [RFC8089] that doesn't necessarily have an established communications protocol, similar to the mailto scheme [RFC6068], as well as other well established protocols like File Transfer Protocol (FTP) [RFC959].

Only 13 DNS Root Servers!
The IANA oversees operations of the 13 DNS Root Servers, labeled A-M, worldwide and is intended to operate independent of any single government, country, corporation, and organization. Pointers to any single root server, such as a.root-servers.net, operate highly resilient architectures consisting of 1,729 instances (as of Aug 2023), ensuring redundancy across hundreds of physically networked servers for the 13 named authorities across 12 organizations. Take a look at the heart of DNS operations by visiting the website at https://root-servers.org/.

Activity: URI File Scheme

Take a look at how browsers process URIs within the address bar by opening local files.

1. Check to see if you have both Google Chrome and Mozilla FireFox installed on your computer
• Click on Windows Start and type chrome
• Check to see if the app appears as the icon and Google Chrome will show. If it appears, then the browser is installed.
• Repeat the process to see if FireFox is installed.
• If you are missing any of the apps, click on Windows Start and type software center followed by the ↩ Enter key.
• Software Center window should appear and search for the missing application.
• Click on the Install button to install the app on the computer.
2. Open File Explorer by clicking on Windows Start and type file explorer followed by the ↩ Enter key.
3. Navigate to your home directory and look for photos you may have on your computer.
4. Right-click on a photo and select Open with. If Chrome or Firefox is not available, go down to Choose another app followed by clicking on Choose an app on your PC.
5. Below are the default absolute file paths in which Chrome and FireFox should be installed:
     Chrome: C:\Program Files\Google\Chrome\Application\chrome.exe
     FireFox: C:\Program Files\Mozillla Firefox\firefox.exe
   
6. View the address bar and note the URI format in which the file scheme is displayed.

When typing a website URL in a browser, a request is sent to the server followed by code that is returned and processed. The server code is very different from what is displayed and was designed to identify the structure of the webpage using a markup language, not requiring the use of compilers or other tools typically needed for programming languages. These web pages are plaintext files written in HTML. Hyper Text refers to the linking between documents (i.e. the links on a web page) and the markups (i.e. the "<thing> stuff </thing>") in HTML specify how the content should be interpreted and rendered by a web browser, such as this web page (and all the web pages on the website). The browser doesn't show you the HTML it receives, rather interprets the HTML code and displays the web page. When the browser follows the HTML, it organizes the text, pictures, and content that is viewed by users in what is referred to as rendering HTML. To understand how websites work, and certainly to create your own, you need to know the basics of HTML.

The latest version of HTML5 includes improvements over graphics, to include video and audio, accessibility for mobile devices, additional elements, and Application Programming Interface (API). The websites you'll be building for this course only requires basic elements of HTML but the option to use more advanced Cascading Style Sheets (CSS) and JavaScript will be an option for those brave enough to hone in on your web ninja skills. Below is a base construct of HTML shell code and more can be added to build out a website:

<!DOCTYPE HTML>
<HTML>
  <HEAD>
    <TITLE>My Website</TITLE>
  </HEAD>

  <BODY>
  </BODY>
</HTML>
        

Here are the key points pertaining HTML syntax:

• As a markup language, HTML is simply a text file. Editing the code can be done with text editing applications.
  • Notepad++, Pulsar, and VS Code are all examples that are approved for use in this course.
• Tags are used to identify elements that organize content on a webpage and can be identified within angle brackets (< >). Some elements can be used to change font characteristics, such as the italicize tag <I>..</I> and bold tag <B>..</B>, create headers with <H1>..</H1> tags, or link to other websites by specifying an attribute with an anchor tag <A href="https://www.usna.edu">..</A>. Each of those tags require start and end tags, with a / identifying an end tag.
• Not all tags require end tags because the empty elements are self-contained, like line breaks <BR>, horizontal line breaks <HR>, and displaying photos with <IMG src="photo.jpg">.
• Nested tags used in paragraphs <P>..</P> or divisions <DIV>..</DIV> and structural tags <HTML>..</HTML> will be wrapped around other code.
• There will be ample opportunity to build your own webpage and explore the different tags and attributes throughout HTML!

<HTML>
  <HEAD>
  </HEAD>
  <BODY>

    <H1>A Simple Web Page</H1>

    <p>This page has <b>two</b> paragraphs.
      The first has an image
      <img src="SleepyFace.JPG"> and
      <a href="https://www.usna.edu">a link</a>.
    </p>

    <p>The second has
      <span style="color:#ff0000;">
        different colors
      </span>, which is cool.<br>
      It also has some funky characters:
      &#0931; &#8680; &#9650;
     </p>

  </BODY>
</HTML>
              

HTML is designed to organize and present information and content within a browser. Use this next example to locate tags, attributes, and elements within HTML. Then expand knowledge by learning additional tags and attributes that can be utilized throughout HTML code.

HTML Format: <start_tag attribute="value"> Element <end_tag> HTML Example: <a href="https://www.usna.edu"> USNA Website </a> <br> The <b>quick</b> brown fox jumps over the lazy dog.<br> <img src="img/fox_dog.jpg" height="250"> Highlight:   tag    attribute    element    none Move your mouse over the terms to highlight those specific parts of HTML

HTML Output: USNA Website The quick brown fox jumps over the lazy dog.

Annual Top 10 Web Security Risks.
There's an entire industry focused on web security, from dedicated computer hardware to distributed software security. The Internet has a plethora of web applications and services that continue to be exposed to poor security configuration and practices that lead to vulnerabilities and compromises, resulting in the loss of significant amounts of proprietary information and customer data. Take a look at Open Worldwide Application Security Project (OWASP) Top 10 Web Application Security Risks that are published each year to keep companies and IT organizations up to speed on the latest trends.
Image courtesy of OWASP.

As a client-based application, your browser has the ability to view the code that is provided by a server once a connection has been established. In the browser used to view this webpage (Chrome), click on the menu, select More Tools, followed by Developer Tools to see the code under the Elements tab. Now change tabs to Network and refresh the browser to look at all of the local and remote connections made. Take a look at other websites, such as mail.google.com or www.amazon.com to see the hundreds of requests and connections made by your computer in seconds!

Supplemental Media:

The Internet's First Message

W3Schools

HTML in 100 Seconds

Review Questions:

1. What is the main difference between the web and the Internet?
2. What are the three required components of a URI?
3. What are some of the common schemes used to view a website?
4. Who oversees standards and protocols for network communications, such as web-based HTTPS?
5. What are the different levels of the DNS hierarchy and associated terms?
6. Given a basic set of HTML code, how is the format structured and also rendered on a browser?

References

1. Q. Norton, "Anonymous Tricks Bystanders Into Attacking the Justice Department," Wired, Jun. 3, 2017. [Online]. Available: https://www.wired.com/2012/01/anons-rickroll-botnet/
2. P. H. Salus, "Casting the Net: From ARPANET to Internet and Beyond," Addison-Wesley Publishing Company, 1995, pp. 63-64.
3. Statista. (2025). "Number of internet and social media users worldwide as of February 2025." [Online]. Available: https://www.statista.com/statistics/617136/digital-population-worldwide/
4. ICANN. (2019). "The First Message Transmission." [Online]. Available: https://www.icann.org/en/blogs/details/the-first-message-transmission-29-10-2019-en
5. Tangem. (2025). "How Many Cryptocurrencies Are There in July 2025?" [Online]. Available: https://tangem.com/en/blog/post/how-many-cryptocurrencies-exist/
6. CNBC. (2023). "The $8 billion Sam Bankman-Fried criminal trial starts today — here’s what’s at stake and how we got here." [Online]. Available: https://www.cnbc.com/2023/10/03/sam-bankman-fried-criminal-trial-starts-today-heres-whats-at-stake.html
7. Department of Justice (DOJ). (2024). "Samuel Bankman-Fried Sentenced to 25 Years for His Orchestration of Multiple Fraudulent Schemes." [Online]. Available: https://www.justice.gov/archives/opa/pr/samuel-bankman-fried-sentenced-25-years-his-orchestration-multiple-fraudulent-schemes