Networked World Assesment Powerpoint for Exam

Topics for today:
 Final Website Project Recap
 Computers & Networks – Part 2
 Inclass Assignment

Website Creation
Final Project Requirements
• 2-3 webpage website linking.
• Changes in Font, color, size, and
background should be included.
• At least three images along with
a link to an external URL should
be included.

Topics
• Network Types – LAN, MAN, and WAN
• Packet Switching
• Additional Network Terms
• Mobile Network

Network Types
Ring Star Bus
 Closed loop or ring Forming a continuous
circle.
 All devices are connected to a
central hub
 All devices are connected to a
single central cable
 Data travels in a unidirectional or
bidirectional manner around the ring
 Data travels directly between the
device and the central hub
 Data is sent along the central
cable
 Relatively fault-tolerant.  Less fault-tolerant if central hub or
switch fails, it can disrupt the entire
network.
 Less fault-tolerant if cable fails,
it can disrupt the entire
network.
 Simpler in terms of cabling and hardware  More scalable add/remove easy  Relatively simple, less cabling
Three common LAN (Local Area Network) topologies: Ring, Star, and Bus.
Local coffee shop's Wi-Fi network is a simple example of a LAN.

For these companies, do you think they are
ring, star, or bus? Why?
• Financial Trading firms that are involved in
high-frequency trading where low latency and
quick data transmissions are crucial for
success.
• Small businesses that are simpler, cost-
efficient with limited resources like mall
offices, retail stores, or local businesses.
• Company with centralized IT allowing for easier
management, troubleshooting, and security
enforcement. Each department or branch can
have its own dedicated connection to the
central server.

Other Network Types
Metropolitan Area Network (MAN)
Covers a larger geographical area than a Local Area
Network (LAN) but is smaller than a Wide Area
Network (WAN)
• Interconnected Campus Networks like UNH
• City-Wide Wi-Fi Networks
Wide Area Network (WAN)
• Large geographic area like Liberty Mutual
• Allows internetworking

Packet Switching
An efficient and reliable transmission of data between devices over a network. It involves breaking data into
smaller units called packets and then routing these packets independently through the network to their
destination.
What is it?
At the destination, these packets are
collected, and then reassembled to the
original message
Discussion:
Why do you think packet
switching is necessary?

 TCP and IP are separate protocols that work together to ensure data is delivered to its intended destination
within a network.
 IP obtains and defines the address—the IP address—of the application or device the data must be sent to.
 TCP is then responsible for transporting and routing data through the network architecture and ensuring it
gets delivered to the destination application or device that IP has defined.
More Network Terms
Transmission Control Protocol (TCP) and Internet Protocol (IP) often referred to as TCP/IP:
A set rules for sending packets over the network
How does packet switching know “how data should be transmitted”?
Breakdown of steps:
1
A connection is
established before
data can be
transferred
2
Breaks data (e.g.,
file, image, etc.) into
packets
3
Puts the address
and a sequence
number on each
packet
4
Check incoming
packets’ sequence
numbers
5
Sort the packets in
the proper order
6
Reassemble data

 1G, 2G, …, 5G are generations of wireless
cellular network technology. These
generational terms refer to the different
stages of advancement and
improvements in mobile
telecommunications standards.
 Main differences between the
technologies are the bandwidth and the
frequency range that data is transferred
between devices
Mobile’s Golden Age

Next HTML Assignment with link to another webpage
1. Open your last HTML file (the one we did on Tuesday including an image and a background.)
2. Save that file on desktop (for some students) or in the inclass activity folder on your desktop with a new name with
page 1 within the name.
3. Save that file on desktop (for some students) or in the inclass activity folder on your desktop with a new name with
page 2 within the name.
4. You should now have 2 identical files but with two different names one with page 1 and one with page 2.
5. Open in your editor the page 1 file.
6. We are going to replace this line:
<p>Thank you for visiting my webpage.</p>
with a link to your page 2 file.
7. Update the text to be this:
<p>If you would like to see other photos</p><a href=“filenamepage2.html">Click Here</a>
8. Save the file (this is page 1)

<!DOCTYPE html>
<html>
<head>
<title>My Dog Bean</title>
</head>
<body style="background-image: url('dog paws.jpg'); text-align: center;">
<h1><b><font face="arial" color="blue" size="15">Welcome to My Web Page showcasing my favorite four-legged Pal
Bean!</font></b></h1>
<p><font face="arial" color="black" size="10">This is a recent photo of Bean.</font></p>
<img src="Bean.jpg">
<h2 style="text-align: left;"><font face="arial" color="red" size="20">Her favorite things include:</font></h2>
<ol style="font-size: 20px; list-style-type: decimal;">
<li style="text-align: left; font-size: 20px;"><font face="arial" color="black" size="20">Belly Rubbing</font></li>
<li style="text-align: left; font-size: 20px;"><font face="arial" color="black" size="20">Walks in the Park</font></li>
<li style="text-align: left; font-size: 20px;"><font face="arial" color="black" size="20">Treats</font></li>
</ol>
<p><font face="arial" color="black" size="20">If you would like to see other photos <a href="HTML Inclass Activity Page 2.html">Click
Here</a></font></p>
</body>
</html>

Next HTML Assignment with link to another webpage (continued)
1. You have now updated page 1 with a link going to page 2.
2. Open page 2 and make some changes including a link to an external site.
3. We are going to replace this line:
with a link to an external site
4. Update the text to be this:
<p>To learn more about Stratham Hill Park</p><a href="https://www.strathamnh.gov/stratham-
hill-park-shp">Click Here</a>
5. Save and close the file.
6. We now want to use a browser to look at page 1 html.
7. Click the link to go to page 2.
8. Click the external link.

<!DOCTYPE html>
<html>
<head>
</head>
<h1><b><font face="arial" color="blue" size="15">Additional Pictures of Bean!</font></b></h1>
<p><font face="arial" color="black" size="10">Here is one at Stratham Hill Park.</font></p>
<img src="Bean Park.jpg">
<p><font face="arial" color="black" size="10">Near the tower at Stratham Hill Park.</font></p>
<img src="Bean Hill.jpg">
<p>To learn more about Stratham Hill Park</p><a href="https://www.strathamnh.gov/stratham-hill-park-shp">Click Here</a>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
</head>
<h1><b><font face="arial" color="blue" size="15">Welcome to My Web Page showcasing my favorite four-legged Pal
Bean!</font></b></h1>
<p><font face="arial" color="black" size="10">This is a recent photo of Bean.</font></p>
<img src="Bean.jpg">
<h2 style="text-align: left;"><font face="arial" color="red" size="20">Her favorite things include:</font></h2>
<ol style="font-size: 20px; list-style-type: decimal;">
<li style="text-align: left; font-size: 20px;"><font face="arial" color="black" size="20">Belly Rubbing</font></li>
<li style="text-align: left; font-size: 20px;"><font face="arial" color="black" size="20">Walks in the Park</font></li>
<li style="text-align: left; font-size: 20px;"><font face="arial" color="black" size="20">Treats</font></li>
</ol>
<p>If you would like to see other photos</p><a href="C:UsersLisaDesktopPracticePractice2.html">Click Here</a>
</body>
</html>

Formal definition
A programmable machine which
can accept input, process it,
produce (display) output, and
stores results or communicate.
There are 2 components: Hardware (HW) and Software (SW)
1. Hardware
• Input: keyboard, mouse, microphone, scanner, touch-screen,
etc.
• Output: printer, speaker, monitor, touch-screen
• Processing: CPU (central processing unit), ALU (arithmetic-logic
unit), CU (control unit), etc.
• Storage: memory (Random-Access Memory, Read-Only
Memory), secondary storage (hard disk, floppy disk, external
disk, etc.)
• Communication: modem (modulator/demodulator)
2. Software
• Operating System (OS): Windows, MacOS, Unix, Linux, etc.
• Applications: web browsers, work processing, antivirus,
database management systems, games, programming, etc.
Computer

Modem (modulator/demodulator):
A device that transforms the signal from
digital to analog, and vice versa
Router:
Connects more than one devices into the network; sends data
from a device to its destination (IP for Internet Protocol

Network and
Terminologies
Computer network:
• A collection of computing devices that are
connected in various ways to communicate and
share resources
• Connections between computers in a
network are made possible by:
• Physical wires, cables, optical fiber
• Wireless connection usually by
radio waves or infrared signals
• Note that computer networks may contain
devices that are not just physical computers
(e.g., printers, scanners, cameras, node/host)

Network and Terminologies
• Data Transfer Rate (bandwidth):
• Speed with which data is transferred from
one place (on the network) to another
• Computers communicate between each other
using specific protocols
• In networking, a protocol is a set of rules
describing how transferred data should be
formatted and processed between devices
• Client/Server model (centralized)
• File server
• Web server

Next 2 weeks (Week 6 and 7)
Today (2/27)
• Tracking Cookies
• Internet Memes
Thursday (2/29)
• Hacktivism, Cyber Warfare, and Identity Theft
• UNH Security Awareness
Week 7
Tuesday (3/5)
• Assessment #1 what to expect and topic review
• Final Presentation and Final Project assistance,
review, and guidance
Thursday, 3/7
• Assessment #1 please bring your laptops
(Reminder you must take the assessment in the
classroom. Please let me know of any concerns.)

Data Brokers end-to-end View
Let’s now discuss how they are getting the data…

How Do They
Collect It Online?
Various methods of data collection
that we reviewed:
 Browser fingerprinting
 Web and email beacons
 IP address tracking (mention
the limitations of VPNs)
 Ecommerce sites
Let’s look at Tracking Cookies…

Tracking Cookies……
Common Way to Collect Data
Online

The Dual Nature of Cookies:
Cookies are digital entities with a dual nature. On one hand, they enhance your
web experience, making it more convenient and personalized. On the other
hand, if misused, they can become tools for surveillance and potential threats to
your online privacy.
Understanding Cookies and Their Dual Nature
 Cookies let websites remember you, your website login
information, shopping carts, and more.
 With that said, they are also a treasure trove of private
information for cybercriminals to spy on you.
 A basic understanding of cookies can help keep unwanted
eyes off your internet activities.

• At their core, cookies are small text files containing pieces of data.
• They serve as identifiers for your computer when you're connected to a network, such as the internet.
• These identifiers help websites and web applications remember you and your preferences, making your online
interactions smoother and more tailored to your needs.
What are Cookies?
Cookies are employed for several purposes:
1. Session Management: Session cookies are used to manage your
interactions with websites during a single browsing session. They
enable functionalities like keeping you logged in, retaining items in
your shopping cart, and remembering your preferences on a site.
2. Personalization: Cookies personalize your web experience. They
remember your language preferences, themes, and user settings,
ensuring that when you return to a website, it feels familiar and
comfortable.
3. Tracking: Tracking cookies monitor your online behavior and
interactions. They record the pages you visit, the links you click, and
the time you spend on each site. This data can be used to create user
profiles and deliver targeted content and advertisements.
Purposes of Cookies:

Cookies come in various flavors, each with its own characteristics:
1. Session Cookies: These temporary cookies are crucial for session management. They are stored in your device's memory
and are deleted once you close your web browser. They are harmless and used for maintaining your active session.
Example: Shopping Cart Feature of a Website.
2. Persistent Cookies: Persistent cookies have a longer lifespan and are stored on your device's hard drive. They can
remember your login details and preferences across multiple sessions, making them convenient but potentially risky if
misused.
Example: Login Credentials
3. Zombie Cookies: Also known as "evercookies," these persistent cookies are difficult to remove and can be regenerated
even after deletion. They are often used for tracking and can be invasive if not controlled.
Example: web analytics companies to track unique individuals' browsing histories.
4. Super Cookies: Super cookies are a more advanced form of tracking cookies. They use various techniques, such as
browser fingerprinting, to persistently track your online activities. These cookies are particularly concerning for privacy.
Example: Type of cookie that is used to track users’ online activities and preferences.
Different Types of Cookies

Cookie Storage
Where Are Cookies Stored
Cookies are stored in two primary locations:
• Local Storage: Cookies are saved locally on your device,
typically organized by each web browser you use. You can
view and manage cookies through your browser settings.
• Web Server Database: Websites also store data related
to cookies in their databases. This information helps them
recognize returning users and deliver personalized
content.

Cookies In Conclusion…
• Cookies are both your companions and potential spies on the web.
• Understanding their roles, types, and potential risks empowers you
to make informed decisions about your online privacy.
• As you navigate the digital landscape, remember that while cookies
can enhance your web experience, it's crucial to be vigilant and
protect your online identity and data from misuse.
After learning about cookies and their implications, do
you think you will change the way you manage cookies
on your own web browser? Why or why not?
Discussion

Topics
• What is a Meme?
• History of Memes
• Meme Effectiveness and Usage
• Memes as a Form of Language and Communication
• Memes in Advertising and Marketing

What is a Meme?
 A meme is an idea, behavior, or style that spreads by
means of imitation from person to person within a culture
and often carries symbolic meaning representing a
particular phenomenon or theme.
 Memes are a worldwide social phenomenon. The more a
meme resonates with people, the more they'll share it and
the farther it will spread.

The history of memes is a fascinating journey that predates the internet and extends into the digital age.
Here's a brief overview of the history of memes:
History of Memes
Pre-Internet Era (Pre-1970s):
 The concept of a "meme" was coined by British evolutionary biologist Richard
Dawkins in his 1976 book, "The Selfish Gene." He used the term to describe an idea,
behavior, style, or cultural practice that spreads within a culture, much like genes
spread within a biological population.
The Early Internet (1970s-1990s):
 The concept of memes began to evolve on early internet forums, where users shared
inside jokes and humorous images. These early examples are often referred to as
"internet memes."
 The first meme to gain widespread internet recognition was the "smiley face"
emoticon, created by Scott Fahlman in 1982.
 In the 1990s, internet users began to create and share viral content, such as chain
emails and animated GIFs. These were the precursors to modern internet memes.

• In the early 2000s, internet culture saw the
emergence of image macros.
An image macro is a piece of digital media
featuring a picture or artwork with some
form of text superimposed.
• One of the most famous early image macros
was "I Can Has Cheezburger?" featuring a cat
with a caption in broken English. It was created
in 2007 by Eric Nakagawa and his friend Kari
Unebasami. The website was one of the most
popular Internet sites of its kind receiving as
many as 1,500,000 hits per day at its peak in
May 2007.
• The website 4chan played a significant role in
the early development of internet memes. It
introduced concepts like "Rickrolling" and
"Advice Animals.“
Advice Animals are a photograph of an
animal captioned with advice.
The Rise of Image Macros 1990’s and 2000s:

YouTube and Viral Videos (2000s-Present):
• With the rise of YouTube and other video-sharing
platforms in the mid-2000s, viral videos became a
major part of meme culture. Videos like "Charlie
Bit My Finger" and "Gangnam Style" became
global sensations.
• YouTube also gave rise to "reaction videos,"
where individuals record their reactions to
watching popular videos, creating a new form of
meme content.

Discussion Questions
 How do you think the early internet meme culture,
characterized by image macros like 'I Can Has
Cheezburger?' and concepts from 4chan like
'Rickrolling' and 'Advice Animals,' laid the foundation
for the development of contemporary meme culture
on platforms like YouTube and social media?
 In what ways have memes evolved in terms of format,
content, and their role in internet culture since the
early 2000s?"

Effectiveness of memes depend on their context and audience.
They should aim to engage and provoke thought of the audience and can convey different messages.
Bridging the gap between the serious and the whimsical. When politicians communicate through memes
Serious vs. Whimsical Political Values

Other Ways Memes are Conveying Different Messages
The values that memes hold dear. Building communities one laugh at a time.
Meme Values Online Community Building

One More Way Memes are Used in Conveying Different Messages…
When memes go viral: The superhero of the digital
world. Memes have the power to spread rapidly.
Meme Values

Memes as a Form of Language and
Communication
 Memes have become a dynamic and
influential form of language and
communication, especially among younger
generations.
 They rely on shared cultural references and
inside jokes to create a sense of community
and connection among those who engage
with them.
 Memes are not just a form of
entertainment; they are a reflection of the
way we communicate, share ideas, and
express ourselves in the digital age.

Key Components of Memes
1. Visual Language: Memes are predominantly visual, often
consisting of images or short videos accompanied by text. This
visual component makes them highly accessible and instantly
recognizable, allowing for quick and efficient communication.
2. Universal Appeal: Memes often tap into universal emotions,
experiences, and situations that people from diverse backgrounds
can relate to. This universal appeal transcends linguistic and
cultural boundaries, making memes a global phenomenon.
3. Shared Cultural References: Memes frequently draw upon
shared cultural references. They reference popular movies, TV
shows, music, historical events, and even internet phenomena.
This reliance on shared cultural knowledge allows meme creators
to create a sense of camaraderie and understanding among their
audience.

Key Components of Memes
Continued…
4. Inside Jokes: Memes are essentially inside jokes on a massive
scale. They create a sense of belonging among those who
understand them while simultaneously excluding those who do
not. This exclusivity can foster a sense of community among
meme enthusiasts.
5. Social Commentary: Memes are not limited to humor; they
often serve as a vehicle for social and political commentary. They
allow individuals to express their views, critique societal norms,
and engage in discussions about various issues in a format that is
easily shareable and digestible.
6. Memes as a Language Evolution: In many ways, memes are
reshaping the way we communicate. They are concise, often
conveying complex ideas or emotions in just a few words and an
image. This brevity mirrors the way language has evolved in the
digital age, with a focus on conciseness and speed.

Key Components of Memes Continued…
7. Adaptability and Remix Culture: Memes are highly adaptable. They
can evolve rapidly as they are remixed, parodied, and modified by
various users. This adaptability allows for the continuous reinvention
of ideas and the creation of new meme dialects.
8. Memes as Cultural Timestamps: Memes serve as cultural
timestamps, reflecting the prevailing attitudes, trends, and sentiments
of a particular moment in time. They capture the trends and provide
insight into the collective consciousness of a generation.
9. Emojis and Reaction Memes: Emojis and reaction memes are a
subset of memes that have become a shorthand for expressing
emotions and reactions in online conversations. They help convey
tone and mood in text-based communication.

In Class Activity – Your Meme Example
 Take a few minutes to think about a Meme that comes to
mind.
 Find one online if you don't have a favorite in mind.
 Once you've chosen a meme, what it is about that meme that
resonates with you.
• What message or emotion do you think it's trying to convey?
• How does it capture a shared cultural reference or inside
joke?
• Additionally, consider how this meme reflects the evolution
of meme culture and its role in contemporary digital
communication.

Memes in Advertising and Marketing
Memes have infiltrated the world of advertising and marketing
as brands seek innovative ways to connect with younger
audiences in the digital age.
Distracted Boyfriend Meme by IKEA
IKEA used the popular "Distracted Boyfriend" meme
in one of its print advertisements. The meme was
reimagined to depict a person choosing IKEA
furniture over their old furniture, cleverly conveying
the idea of attraction to IKEA's products.
Leveraging memes in advertising campaigns can be a powerful
strategy, but it also comes with certain advantages and
potential drawbacks
Burger King's "Whopper Detour" Campaign
Burger King ran a campaign offering Whoppers for one cent, but
the catch was that customers had to order through the Burger
King app while at a McDonald's location. This cheeky campaign
played on rivalry and location-based targeting, generating buzz
and downloads of the Burger King app.

Benefits of Using Memes in
Advertising and Marketing
1. Youthful and Relatable: Memes are often created and
shared by younger audiences, so incorporating them into
marketing efforts can make a brand appear more
youthful and relatable.
2. Increased Engagement: Memes tend to receive higher
engagement on social media platforms due to their
humor and shareability, potentially increasing brand
visibility.
3. Viral Potential: A well-executed meme-based
campaign has the potential to go viral, significantly
amplifying brand exposure without the need for a
substantial advertising budget.
4. Cost-Effective: Creating memes is typically more cost-
effective than producing traditional advertisements,
making it an attractive option for smaller businesses.

Potential Pitfalls of Using Memes in
Advertising and Marketing
• Relevance and Appropriateness: Memes have a short
lifespan, and using outdated or irrelevant memes can make a
brand seem out of touch or insincere.
• Risk of Backlash: Memes can be edgy and sarcastic, which
may not align with a brand's image. Attempting to use memes
that don't match the brand's tone can lead to backlash.
• Cultural Insensitivity: Memes often rely on cultural
references and humor, and brands must be cautious not to
inadvertently offend or appropriate cultures.
• Overuse: Overusing memes in marketing can dilute their
effectiveness and make a brand appear gimmicky. It's crucial
to strike a balance between meme-based content and other
forms of marketing.

Conclusion:
Memes in Advertising and Marketing
 Memes can be a valuable tool in advertising and
marketing, especially when targeting younger
audiences.
 They offer a way to connect, engage, and entertain,
but it's essential for brands to use them thoughtfully,
staying attuned to cultural shifts and potential pitfalls to
ensure their campaigns are both effective and well-
received.

The Good, Bad, and the Ugly of the Internet

1.Assets of Information: Platforms like YouTube have democratized content creation and allowed
individuals to share valuable information and knowledge.
2.Marketing Strategies: Effectiveness of online marketing strategies and how businesses use
social media for self-promotion.
3.Dispersal of Information: News and information can spread rapidly through social media
platforms and there are implications of this phenomenon.
4.Globalization: The internet has connected people across borders and facilitated international
collaborations.
5.Stay Up-to-Date: Keeps individuals informed about current events and trends.
6.Social Media: Has been used as a tool for social movements and activism.
7.Personal Finance: Online banking, budgeting tools, and personal finance management apps.
8.Crowdfunding: Successful crowdfunding campaigns have enabled creative projects to come to
life.
9.Streaming Content: Convenience of streaming services for entertainment and education
The Good
Highlight how social media is used to mobilize people and/or provide other significant social
movement visibility.
Discussion Activity for The Good

1.Desensitization: Excessive exposure to certain content can desensitize individuals
to real-world issues.
2.Misinformation: Misinformation spreads rapidly online and its impact on public
perception.
3.Lazy Habits: The internet might contribute to procrastination and laziness.
4.Online Gambling: The rise of online gambling platforms and the potential risks
associated with them.
5.Negative Social Skills: Excessive online interactions can affect face-to-face
communication skills.
6.Attention Span: Studies have indicated a decrease in attention span due to
frequent internet use.
7.Vulnerability of Personal Information: Personal information can be compromised
online
The Bad
Think of an example of misinformation that has spread online. Discuss why it might be misleading,
and brainstorm ways to verify information before sharing it.
Discussion Activity for The Bad

1.Censorship: Internet censorship and its implications for freedom of speech.
2.Toxic Online Behavior: Cyberbullying, online stalking, and other forms of toxic behavior.
3.Dark Web: Dark web and its association with illegal activities.
4.Fraud: Online scams and fraud, leading to the importance of online security.
5.Sex Trafficking: How the internet can facilitate illegal activities.
6.Personal Identity Loss: Risk of sharing too much personal information online.
7.Surveillance: Online surveillance by governments and corporations.
8.Parental Control: Challenges and benefits of parental control tools for internet usage
The Ugly
.Before we jump to discussion let’s take a look at a real-world current example of Fraud and Personal
Identity Loss – Next slide

Real Example of Fraud and Personal Identity
Think of an example where the internet significantly impacted individuals through online usage. Discuss why it is
damaging and any ways it could be avoided

Warm-up Discussion: The Good, the Bad,
and the Ugly of the Internet
• What are your
perceptions of the internet
- positive, negative, and
any concerning aspects?
• Share personal
experiences and
observations.

HTML
Introduction
Who has experience with HTML?

Topics
• History of HTML
• Parts of an HTML Document
• Basic Structure
• Hands-on In-class Activity

History of HTML
Websites are the building blocks of the internet, and they consist of web pages.
HTML is the backbone of web pages.
What is HTML (HyperText Markup Language)?
 A Web page is a text file written in a language called HTML.
 HTML is not a programming language or a formatting language. It is a markup language.
 A markup language is a language that describes a documents:
 Content (what data to display including text, images, links)
 Structure (how to display it including layout, input forms)
 Styles are format descriptions written in a separate language from HTML that tell browsers how to render
each element for particular devices
History of HTML
 A group of web developers, programmers, and authors of the W3C (http://www.w3.org/)
created a set of standards or specifications that all browser manufacturers were to follow.
 The W3C has no enforcement power
 The recommendations of the W3C are usually followed since a uniform approach to Web page
creation is beneficial to everyone

MARKUP LANGUAGE
VERSUS
PROGRAMMING LANGUAGE

DOCTYPE
• To define a Document Type
Head
• Meta information
• Only <title> is required
• The content of the head element is not
displayed within the Web page
Body
• Text/Content of the webpage to render
<!DOCTYPE html>
<html>
<head> … </head>
<body> … </body>
</html>
Three Parts to an HTML Document
Anything between these two tags (<html> and </html>) makes up the document content
The opening <html> tag marks the start of
an HTML document
Closing </html> tag tells a browser when
it has reached the end of that HTML
document

Basic Structure
The <HEAD> element contains information about the
document, for example the document title or the
keywords The content of the head element is not
displayed within the Web page
The </TITLE> element contains the page’s title: A
document’s title is usually displayed in the browser’s title
bar.
The </BODY> element contains all of the content to
appear on the Web page. The body element can contain
code that tells the browser how to render the content.

 A two-sided tag is a tag that contains some document content. General syntax for a two-sided tag:
<element> content </element>
For example: <P> content </P>
 HTML elements are made up of the start tag, end tag, and the content between these tags
 The core building block of HTML is the tag, which marks the presence of an element
Tags and Elements
For MAC users, you can use TextMate, TextEdit, SubLime, Webstorm, or Atom.
For Windows users, you can use Notepad, Notepad++, Sublime Text, or Atom.
What Software to Use?
Microsoft Word is not the ideal tool for creating HTML documents because it is primarily designed for
creating and editing word processing documents (like .docx files) rather than web pages. Microsoft
Word may introduce unnecessary formatting and code that is not suitable for web development.
Using a code editor will give you more control over your
HTML code and ensure that it is structured properly for
web browsers. Microsoft Word may introduce
unnecessary formatting and code that is not suitable for
web development.

CAUTION!!!
• Always save your html file
with filename.html
extension.
• If you save your file as
filename.txt, your
webpage will not render
in the browser

For MAC Users
using TextEdit
• If you are using TextEdit, click on Text
Edit (top left corner) -> Preferences ->
Open and Save -> check the option
“Display HTML files as html code
instead of formatting text.
• Uncheck the option Add “.txt”
extension o plain text files

For MAC Users
using TextEdit
• Go to Format, change the
option Make Rich text to
make plain text

Let’s try it!
• Open Canvas and open the presentation called HTML Introduction. This will enable you to copy and paste the
text from the last slide.
• Create a folder on your desktop called Inclass Activity.
• Windows Users – Right click on the desktop and select New and Folder.
• Mac Users – Either right click on the desktop (like Windows) or use Finder and add a new folder.
• For Windows users, you can use Notepad, Notepad++, Sublime Text, or Atom. Create a new file.
• For MAC users, you can use TextMate, TextEdit, SubLime, Webstorm, or Atom.
• TextEdit, click on Text Edit (top left corner) -> Preferences -> Open and Save -> check the option “Display
HTML files as html code instead of formatting text.
• Uncheck the option Add “.txt” extension to plain text files
• Go to Format, change the option Make Rich text to make plain text
***See next slide for image references. ***
• Copy and paste all of the text from slide 13
• Always save your html file with filename.html extension. Save it in the new desktop folder you created.
• If you save your file as filename.txt, your webpage will not render in the browser
• Right click on the filename and open with a browser.

Let’s try it!
<!DOCTYPE html>
<html>
<head>
<title>Sample Webpage</title>
</head>
<body>
<header>
<h1>Welcome to My Webpage</h1>
</header>
<p> This is my first webpage creation using HTML. I am
learning about HTML in our “Living in a Connected World
Class”.
<footer>
<p>© 2023 Sample Webpage</p>
</footer>
</body>
</html>

This week
Tuesday, 1/30
• Internet Review
• Search
Thursday, 2/1
• Search (continued)
• HTML Introduction

The Evolution of the Internet:
From Tim Berners-Lee to Web 2.0

Topics
• The World Wide Web (WWW) and its significance in today’s digital age
• Tim Berners-Lee and his role in the Creation of the WWW
• Technologies/Tools Used by Tim Berners-Lee
• The Why?
• Marc Andreessen and Mosaic
• Two-Way Links and Revenue Models
• Blogs and Personal Publishing
• Wikis and Wikipedia
• Conclusion

The World Wide Web (WWW) and its significance in today’s digital age
WWW is a system of interconnected documents and resources, accessed via the internet, that has
transformed the way we communicate, share information, and conduct business.
Key Concepts of the World Wide Web *
• Hypertext: Where resources are linked through clickable links.
This allows users to navigate between different resources easily.
• HTTP and HTML: Hypertext Transfer Protocol (HTTP) is the set of
rules for how web browsers and web servers communicate.
Hypertext Markup Language (HTML) is the language used to
structure and format web content.
• Web Browsers and Web Servers: Web Browsers are software
that displays web content) and Web Servers are software that
hosts web content and serves it to users.
*More detail on slide 6

• Global Information Access: Anyone with internet access can access a vast amount
of information on virtually any topic, which has transformed education, research,
and personal knowledge.
• Communication and Collaboration: WWW has revolutionized communication.
People can easily connect and collaborate through various online platforms, such
as social media, email, and messaging apps.
• Economic Impact: It has created new business models, such as e-commerce and
online services, and has transformed traditional industries like publishing,
entertainment, and advertising.
Significance in Today's Digital Age
• Cultural and Social Changes: There are cultural and social changes brought about by the WWW. It has facilitated the
spread of cultures, ideas, and movements, and has shaped new forms of expression, like memes and online
communities.
• Data and Privacy: Significant challenges related to data privacy and security in the digital age. The WWW has raised
concerns about personal data collection, online surveillance, and cybersecurity.
How often do you use the internet in your daily lives and how has it impacted your education, work, and personal life?
Discussion Activity

Tim Berners-Lee and his role in the Creation of the WWW
Innovative vision and technological contributions revolutionized information
accessibility, leading to the birth of the World Wide Web
Background:
• Tim Berners-Lee, a British computer scientist, developed foundational
technologies for global information sharing.
Inspiration:
• Berners-Lee's vision for the web was inspired by "Enquire Within Upon
Everything," a publication with diverse topics and connections.
Early Prototype:
• Created a prototype called "Enquire" at CERN, consisting of
interconnected documents, foreshadowing the hypertext structure of the
Web.
Vision Realization:
• Proposed the concept of the WWW in 1989.
• Developed foundational technologies like HTTP, HTML, web browser, and
web server.
• The first website went live in 1991, bringing his ideas into practical
implementation.

Technologies/Tools Used by Tim Berners-Lee
Web browser software (like the one Berners-Lee used to develop) retrieves and
displays web content to users.
Web server software responds to requests from web browsers, delivering the
requested web pages and resources.
HTTP is the protocol that governs how information is exchanged between web
browsers and servers. It enables the retrieval of web pages and resources. (think
of it as an address)
HTML is the language used to structure and format web content. It uses tags to
define headings, paragraphs, links, images, and more.
Hypertext Transfer Protocol (HTTP):
Hypertext Markup Language (HTML):
Web Browser Software:
Web Server Software:

Limitations of Computers and Linking Information
•Computers excel at performing tasks step by step but struggle with
making random associations or connections.
•Human brains can make creative leaps and associations that
computers cannot easily replicate.
•For example, a human can associate a word with multiple
meanings or connect seemingly unrelated ideas.
Have you ever thought about how information on the internet is connected? Share examples of how
you navigate information online using hyperlinks.
Discussion Activity

Marc Andreessen and the Mosaic Web Browser
Marc Andreessen is a prominent figure in the history of the internet and web browsing. He co-authored the Mosaic
web browser while he was a student at the University of Illinois. Mosaic is often credited as one of the earliest
graphical web browsers that played a crucial role in popularizing the World Wide Web.
Tim Berners-Lee's role was in creating
the foundational technologies and
concepts of the WWW, while Mosaic
was a web browser developed by Marc
Andreessen that improved upon those
concepts by introducing graphical
capabilities so these creations
complimented each others.

Tim Berners-Lee's Early Text-Based
Web Browser
• Designed to access and display
text-based information from
WWW.
• Early web pages were primarily
composed of text and
hyperlinks, allowing users to
navigate between different
documents.
• Limited in its ability to display
images, videos, and other
multimedia content.
Marc Andreessen’s Mosaic
• Marked a significant advancement by
introducing graphical capabilities to web
browsing.
• This allowed web pages to incorporate
images, making the content more
visually appealing and engaging for
users.
• The addition of images transformed the
way information was presented,
enabling websites to convey information
more effectively enhancing the overall
user experience of browsing the web.
• Images allowed websites to provide
visual context and illustrate concepts,
making the content more
comprehensible and memorable.
Browser Evolution…

But…it’s not all rosy…there were compatibility issues associated with the release of
Mosaic, especially in its early versions
When Mosaic was first released in the early 1990s, web technology was still in its infancy, and there was a lack of
standardization. This lack of standardization led to compatibility challenges with various computer systems and
web servers. Mosaic's initial version was designed to work primarily on NeXT computers. This limited its
accessibility to users as NeXT was a niche platform.
To significantly expand the user base, Mosaic was made available on popular computing platforms like
Windows and Macintosh.
As Mosaic evolved, it became more user-friendly and accessible on different platforms, helping to lay the
groundwork for the widespread adoption of graphical web browsers.
Have you have ever encountered compatibility issues while using modern web browsers or applications.
Have you had a different experience when using different browsers?
Discussion Activity

Mosaic's Introduction of Graphical Capabilities and Enhanced User Experience
Inline Images and Visual Integration
 Mosaic's innovation of inline images, where images could be
displayed directly within the text of a web page.
 inline images allowed for seamless integration of visual
content alongside textual information, enhancing the
cohesiveness of web pages.
 This concept revolutionized content presentation, enabling
designers to create more dynamic and engaging layouts.

A confrontation between Tim Berners-Lee and Marc Andreessen regarding web ideals and ownership
Tim Berners-Lee, had a vision of the web as an open, collaborative, and freely
accessible platform. He believed in the importance of sharing information openly
and promoting universal access to knowledge. He did not intend for the web to
be a commercialized platform.
Marc Andreessen had different ideas about the web's future. He saw the
potential for commercializing the web and believed in the concept of
ownership and potential profits from web technologies.
Ultimately, the conflict was resolved in favor of openness and collaboration. Tim Berners-
Lee's vision of a free and open web prevailed, and the World Wide Web Consortium
(W3C) was established to develop web standards in an open and collaborative manner.
Confrontation Arises

A two-way link, also known as a reciprocal link, is a hyperlink between
two web pages that points to each other. This type of link is bidirectional,
creating a connection between the two pages.
Two-way links involve a system where links require approval from both parties.
For example, if website A wants to link to website B, website B must approve
the link for it to become active. This is different from one-way links, which don't
require approval.
Two-Way Links and Revenue Models
Traditionally, web links are one-way connections, meaning one page links to another.
Micropayments to Content Producers
 Micropayments to content producers involve making very small financial transactions, often in fractions of a cent,
to access or support digital content.
 Imagine a digital platform for news articles where users typically encounter a paywall when trying to access
premium content. Instead of requiring users to commit to a monthly subscription, the platform adopts a
micropayments model.
Impacts on Media Industry
 Micropayments have allowed content producers to receive small payments from users directly, potentially creating
a new revenue model.
 This system has the potential to shift the focus away from traditional advertising-driven revenue models, which
often rely on large user bases and extensive data collection.

Implementing a micropayment system for content had its challenges. Handling very small payments efficiently, dealing
with transaction costs, and ensuring security are some of the technical challenges.
Challenges and Drawbacks
With the challenges of micropayments, the predominant revenue model on the web is ad-driven, with platforms
relying heavily on advertising for income.
Have you ever encountered websites or platforms that charge micro-fees for access to specific content or
features?
Would you be willing to pay small amounts for premium content or services on the web.
Discussion Activity

Regarded as one of the pioneering figures in the world of
blogging played a pivotal role in shaping the concept of personal
blogging.
Justin Hall
Early Days of Blogging
Justin Hall began his online presence in 1994 with a personal website, which he continued to update regularly. At that
time, the term "blogging" had not yet been coined, and what he was doing was essentially the precursor to blogging.
Justin's Links from the Underground
One of Justin Hall's notable features on his website, "Justin's Links from the Underground,“ was where he curated and
shared interesting links and resources from the early web. This feature was essentially a form of early content curation,
which is a common aspect of modern blogs. The website wasn't limited to just links; he also shared personal
experiences, thoughts, and stories, which is another defining characteristic of blogging.
His website was also considered a virtual support group. His willingness to openly share personal experiences and
challenges, such as his father's suicide led to people sharing their stories and experiences, creating a sense of virtual
support and community.

 Justin’s website was called a weblog to start but then shortened to "blog”. His early online activities played a role in
popularizing the blog term. His early blogging laid the foundation for what has become a massive and diverse
blogosphere.
 His willingness to share personal stories and experiences set a precedent for the personal and authentic nature of
blogging.
Blogs
Discussion Activity
Do you have personal blogs or follow any bloggers? What is the role of personal storytelling and
authenticity in modern blogs?
Some of the most popular blogs in the world include:
• Huffington Post
• TechCrunch
• BuzzFeed
• LifeHacker
• TheVerge

Ward Cunningham and Wiki Software
A computer programmer and software developer who significantly contributed to the
development of wiki software, which is a significant innovation in collaborative content
creation on the internet.
Wikis and the Read-Write Web
Wikis are content management applications that enable a "read-write web.“ A “read-write web” goes beyond simple
consumption of content (the "read" aspect) to enable users to actively contribute, create, and edit content (the "write"
aspect). It signifies a shift from passive web browsing to active participation and collaboration.
Wikis use a simplified markup language to make it easy for users to edit and link pages within the wiki. This markup
language is designed to be user-friendly, even for those with limited technical expertise. By using this simplified markup
language, wikis enable collaborative editing and linking of pages with minimal technical hurdles. This approach makes it
easy for users to contribute, edit, and organize content within the wiki, fostering a culture of collaboration and
knowledge sharing.

Creation of Nupedia and Rigorous Editing Process
 Nupedia is a free online encyclopedia with the goal of providing high-quality, expert-reviewed content.
There is a rigorous editing process for the content of Nupedia which involved seven steps, expert reviews,
and assigning topics to proven experts with vetted credentials.
 This approach aimed to ensure the accuracy and reliability of the content but was time-consuming and
slow. There were challenges in terms of scalability and the ability to keep up with the rapidly changing
landscape of online knowledge sharing. This led to the development of Wikipedia, a more open and
collaborative platform, which allowed for faster content creation and a wider range of contributors.

Wikipedia
 Wikipedia was created as a complementary
project to Nupedia, with the goal of
accelerating the content creation process.
 It was envisioned as a "feeder product" for
Nupedia, allowing for more rapid and
collaborative content generation.
 It encourages both volunteers and experts
to contribute their knowledge and
expertise collaboratively. The idea is to tap
into the vast pool of knowledge available
within a community or society and use it to
benefit a broader audience or address
specific challenges.

Challenges of Elitism and Clash of Wisdom
 Nupedia exemplified a traditional, expert-driven model of knowledge creation creating a culture of Elitism. This clashed
with the open and inclusive model that Wikipedia represented.
 Nupedia, had a desire for deference to authority, which conflicted with the Wikipedia community's ethos of inclusivity.
 This highlights a key ideological difference between two prominent platforms in the early history of online encyclopedias:
Nupedia and the Wikipedia community.
 It underscores the pivotal moment in the history of online encyclopedias when the open and collaborative model of
Wikipedia gained prominence and redefined how knowledge is created and shared on the internet.
 Wikipedia's approach, which embraced the wisdom of the crowd, allowed for more rapid content creation but raised
concerns about accuracy and reliability
Nupedia v. Wikipedia
Elitism v. Open and Collaborative
Discussion Activity
Have you used Wikipedia or contributed to it?
What is your perspectives on the balance between expert-driven content and collaborative, crowd-sourced content on
platforms like Wikipedia?

Deep Dive Into Wikipedia
Wikipedia, the world's largest online encyclopedia, is a prime example of commons-based peer production in action
What is Commons-Based Peer Production?
Commons-based peer production is a collaborative model of content creation and resource sharing that relies on the
collective contributions of a distributed network of individuals.
It is characterized by the following key principles:
1.Commons: In commons-based peer production, there is a shared resource or "commons" that is collectively owned
and managed by a community of participants. This commons can be digital content, software, knowledge, or any other
resource that can be collaboratively produced and shared.
2.Peer Production: The production process is decentralized and involves a large number of participants, often referred
to as "peers." These peers are individuals who contribute to the creation and maintenance of the commons voluntarily
and without a traditional hierarchical structure.
3.Open Participation: Participation in commons-based peer production is typically open to anyone who wishes to
contribute. There are no gatekeepers or central authorities controlling access or contributions. This open participation
encourages diversity and inclusivity.
4.Modularity: Projects are often broken down into modular components or tasks that can be worked on independently.
This modularity allows contributors to focus on specific areas of interest or expertise.
5.Meritocracy: Contributions are evaluated based on their quality, usefulness, and relevance rather than on the
contributor's status or credentials. This meritocratic aspect encourages a culture of excellence.

Here's how it applies to Wikipedia
1.Commons: Wikipedia's commons is the vast repository of articles and knowledge covering a wide range of topics. It is
collectively owned by the global community of Wikipedia editors and readers.
2.Peer Production: Wikipedia is written, edited, and maintained by a decentralized network of volunteers, known as
Wikipedians or editors. These volunteers come from diverse backgrounds and locations around the world.
3.Open Participation: Wikipedia is open for anyone with internet access to edit and contribute to its articles. There are
minimal barriers to entry, and new contributors are welcomed.
4.Modularity: Wikipedia articles are broken down into discrete topics, making it easy for contributors to focus on specific
subjects of interest. Each article is a modular unit that can be improved independently.
5.Meritocracy: Wikipedia's content is continually reviewed and improved by the community. Edits and contributions are
assessed based on their accuracy, verifiability, neutrality, and adherence to Wikipedia's guidelines. High-quality
contributions are recognized and retained.
Commons-based peer production has been instrumental in Wikipedia's success. It has allowed Wikipedia to harness the
collective knowledge, skills, and efforts of a global community to create a vast and freely accessible knowledge resource.
Wikipedia's success demonstrates the power of open collaboration and the ability of a decentralized network of
volunteers to create and maintain valuable content on the internet.
Wikipedia Application of Commons-based Peer Production

Wikipedia
Contributors
Contributing to Wikipedia is driven
by a wide range of motivations,
reflecting the diversity of its
volunteer community. These
motivations can be grouped into
several drivers:
• Interaction with others
• Personal gratification
• Recognition and Prestige
• Altruism
• Intellectual Curiosity
• Advocacy and Activism
• Sense of Ownership

WikiPedia Success Story
Shared Knowledge and Distributed Power
With the collective goal of building and
maintaining a shared knowledge resource,
Wikipedia embodies the concept of
shared knowledge, where information is
collaboratively created and made freely
available to the public.
Distributed power is a key feature of
Wikipedia's governance model. While
there are guidelines and policies, decisions
are made collectively through consensus-
building among contributors. No single
authority dictates content, and the
community has the power to shape
Wikipedia's content and rules.
This distributed power ensures that no
single individual or group controls the
platform, aligning with Wikipedia's
commitment to openness and neutrality.
In summary, Wikipedia's success as a
collaborative platform is driven by the
diverse motivations of its contributors, the
addictive nature of editing ("wiki-crack"),
the principles of shared knowledge, and
the distribution of power within the
community. It represents a unique and
powerful model for harnessing collective
expertise and providing free access to a
vast repository of knowledge.

Today…
• How to sign up for a 15-minute final
presentation time slot
• Search
• HTML Introduction
Recap from Tuesday:
• The World Wide Web (WWW)
• Tim Berners-Lee (TBL)
• Technologies/Tools Used by TBL
• Marc Andreessen and Mosaic
• Two-Way Links and Revenue
Models
• Blogs and Personal Publishing
• Wikis and Wikipedia

Signing up for a Final Presentation 15-minute slot
 Make sure you aren’t using Safari – Canvas doesn’t always work. Use Chrome or Edge.
 Click on the Calendar icon on the left hand navigation.
 Starting March 26, you will see 15-minute slots. If a slot is taken, it will be grayed out and you will not be
able to sign up for that slot.
 On the right hand side, click find appointment. This will show all of the slots.
 Click on the slot you would like and click edit.
 Type your name in the box and hit update.

Search
Internet Part 2
How often do you use Google or other search engines in
your daily life, and for what purposes?

Topics
• Web directories and crawlers
• Search Engines
• Yahoo! Combines Search with Web Directories
• Google
• The Inception and Early Development of Google
• Google Roots
• Google’s User-Centered Design
• Key Milestones in Google’s History
• Human-Machine Symbiosis

Web Directories and Crawlers
Introduction to the Early Challenges of Web Content Explosion:
 During the early 1990s, the World Wide Web experienced an explosive growth of
web pages and websites.
 As more individuals, organizations, and businesses began creating web content, it
became increasingly difficult for users to locate relevant information.
 Navigating the web was akin to exploring a vast, uncharted territory with no maps
or signposts.
Explanation of Web Directories as Hand-Compiled Indices of Websites:
 Web directories were among the earliest attempts to organize the chaotic web
landscape.
 They functioned as structured lists or indices of websites, categorized by topics
or themes.
 Unlike search engines, web directories were typically created and maintained by
human editors who manually reviewed and organized website submissions.
 Users could browse these directories to discover websites related to their
interest

 In 1994, two Stanford University graduate students, Jerry Yang and David Filo,
launched "Jerry and David's Guide to the World Wide Web.“ This guide later evolved
into Yahoo!, one of the most prominent and influential web directories of its time.
 Yahoo! initially started as a hand-compiled directory, featuring a hierarchical structure
with categories and subcategories, making it easier for users to navigate the web.
Introduction to Web Crawlers (Bots) Automating the Indexing Process:
 As the web continued to expand rapidly, the need for automated methods to index web
content became evident.
 Web crawlers, also known as bots or spiders, were developed to automate the process of
exploring websites and collecting information about them.
 These crawlers would follow hyperlinks from one page to another, indexing the content they
encountered.
 This automation significantly sped up the process of indexing the web and allowed for more
comprehensive search results.
Web Directories and Crawlers
How do you think web
crawlers (bots) have
revolutionized the process
of indexing websites,
compared to manual
methods?
Let’s Discuss

Search Engines
In addition to web
directories, search engines
emerged as another solution
to the challenge of finding
information on the web.
Early search engines used
algorithms to index and rank
web pages
Users could enter keywords
or phrases, and these search
engines would return a list of
relevant web pages based on
their algorithms.
These search engines played
a pivotal role in transitioning
from manual web exploration
to more focused and intent-
based searches.

Yahoo! Combines Search with Web Directories
Yahoo! recognized the importance of both web directories and search
engines in helping users navigate the web. In 1995, Yahoo! integrated a
search engine into its directory, offering users the convenience of
searching for specific information while still benefiting from the
directory's structured organization.
This integration marked a significant step in the evolution of web search,
as it combined the strengths of both approaches.
Consideration of User Behavior, including Exploration and Discovery
• During the early web era, user behavior was shaped by the novelty of
the internet.
• Users often approached web browsing as a form of exploration and
discovery, similar to flipping through a physical directory or
encyclopedia.
• Intent-based searching, where users entered specific queries to find
answers, was less common than today.

Google
Larry Page and Sergey Brin:
Larry Page and Sergey Brin are renowned computer scientists and entrepreneurs who
co-founded Google, one of the world's most influential technology companies.
Their innovative search engine transformed how people access information on the
internet.
Profit Motive: Larry
Page recognized the
importance of not only
inventing technology
but also making it
accessible and
profitable. He
emphasized that
innovation should be
brought to the world in
a way that generates
revenue and sustains
further development.
Interests: Page's
interests spanned
computer science and
business, making him a
unique visionary in the
tech industry. He
believed in creating
products that not only
solved technical
problems but also had
a practical impact on
people's lives.
Human-Computer
Interaction: Page had a
strong interest in
human-computer
interaction, aiming to
make technology more
user-friendly and
intuitive.
Larry Page’s Profit Motive and Interest

Google
Sergey Brin, like Page, had a strong background in computer science. He also had a
strong foundation in mathematics, which contributed to the development of Google's
innovative algorithms. Brin's expertise in data mining played a pivotal role in shaping
Google's search engine.
Larry Page and Sergey Brin met as graduate students at Stanford University, where they
pursued their Ph.D. studies.
Stanford University is renowned for fostering academic excellence and innovation. It has a
rich history of producing successful entrepreneurs and tech leaders.
The university's environment encouraged and supported tech entrepreneurship, making it an
ideal place for Page and Brin to develop their groundbreaking ideas.
Together, Larry Page and Sergey Brin leveraged their academic backgrounds and
entrepreneurial drive to create Google, a company that not only revolutionized web
search but also became a global technology powerhouse.
Why do you think Larry Page and Sergey Brin were motivated to develop a
better search engine, considering their academic backgrounds and interests?
Discussion

Larry Page and Sergey Brin initiated the Backrub project, a
precursor to Google, while still at Stanford.
The project aimed to compile a comprehensive collection
of backlinks (inbound links) pointing to various web pages.
However, the explosive growth of the web posed
significant computational challenges in managing and
analyzing this vast dataset.
Sergey Brin joined forces with Larry Page, and together, they
developed a more sophisticated ranking system known as
PageRank.
PageRank assigned numerical values to web pages based on
the quantity and quality of backlinks they received.
It introduced the idea that a web page's importance could be
determined by considering the importance of pages linking to
it.
PageRank's recursive process incorporated multiple feedback
loops to refine the ranking of web pages.
The Backrub Project
Development of PageRank
Google Roots
The Anatomy of a Large-Scale Hypertextual Web
Search Engine
In 1998, Larry Page and Sergey Brin authored this
groundbreaking paper. This paper laid out the
fundamental principles of Google's search engine
and introduced the PageRank algorithm. It also
emphasized the importance of assessing web
page importance based on the quantity and
quality of backlinks. The paper also highlighted
the scalability of Google's search engine
architecture.

How Google Search Works (in 5 minutes)

Google’s User-Centered Design
Google's approach to search differed significantly from its predecessors. While other
search engines at the time relied on various factors to rank pages, Google tapped into the
wisdom of the crowds by assessing what the world thought of a page.
This approach aimed to provide users with more relevant and valuable search results
User-Centered Design and Algorithm Improvement
• Google placed a strong emphasis on user-centered design, guided by the principle that
the user is never wrong.
• Instead of blaming users for poor search results, Google continually studied user
behavior to enhance its algorithms.
• This iterative process involved automated adjustments based on user interactions,
leading to more accurate and relevant search results.
How has the widespread
availability of search engines
like Google changed the way
we access and use information
compared to the pre-internet
era?
Discussion

Key Milestones in Google’s History
Commercialization Attempts and the Shift to an Ad-Based Revenue Model:
 Google initially attempted to license its search technology to established search companies for a $1 million fee.
However, many companies failed to see the significance of search technology at that time.
 As a result, Larry Page, Sergey Brin, and their team decided to start Google as an independent company in 1998.
 Google adopted an ad-based revenue model, which would later become one of its primary sources of income.
 This shift marked the beginning of Google's transition from a research project to a commercial enterprise.
Google's Business Values:
Google's core business values have been central to its success:
 Product Improvement: Google has consistently invested resources in improving its products and services. It
emphasizes innovation and strives to provide users with the best possible experience.
 Customer-Centricity: Google is known for its commitment to the user experience. It focuses on understanding
user needs, addressing their concerns, and delivering valuable solutions.
 User-Centered Design: Google's products are designed with the principle that the user is never wrong. It
actively studies user behavior and continuously refines its algorithms to better serve users.
 Iterative Development: Google's approach involves iterative development, meaning it makes automated
adjustments based on user interactions to enhance its services.
These milestones, including the influential paper and the adoption of an ad-based revenue model, played pivotal roles
in Google's transformation from a research project into a global technology giant. Google's commitment to product
improvement and a customer-centric approach has been key to its continued success and innovation.

Human-Machine Symbiosis
 Google's search algorithm relies on billions of human judgments, even though
the algorithm itself is automated. Google's search engine is designed as an
automated way to tap into the collective wisdom and knowledge of humanity.
 This reliance stems from the fact that Google's search results are determined by
the collective wisdom and preferences of billions of internet users worldwide.
 When users interact with Google's search results by clicking, staying on pages,
and engaging with content, they provide implicit feedback that informs the
algorithm. As users search for information, their actions and preferences are
recorded and analyzed by the algorithm.
Reliance on human judgments to automate the tapping into human wisdom
This automated process considers what users find valuable, trustworthy, and relevant, effectively harnessing the
wisdom and insights of a global audience. In essence, Google's search engine serves as a remarkable example of
human-machine symbiosis, where automation and algorithms work in harmony with human behaviors, preferences,
and wisdom to provide valuable information to users on a global scale.
What do you envision as the future of web search, and how might emerging technologies like artificial
intelligence and voice search impact it?
Discussion

Week 5 – 2/20 and 2/22
Today
• Final Presentation
Overview/Reminder
• Network Individualism cont.
• In Class Activity - Reflection
• Data and Browser Fingerprinting
• In Class Activity – Browser
Fingerprinting
Thursday
• Cookies
• Internet Memes
Due Sunday, 2/25
• Week 5 Homework
• Week 5 In Class Activities:
• Network Individualism Reflection
• Browser Fingerprinting

Final Presentation
• Topic 10
• Introduction 5
• Organization 10
• Subject Knowledge 30
• Conclusion 5
• Presentation Length 5
• Vocal Delivery 10
• Language Skills 5
• Use of Visual Displays/Content 10
• Physical Presence 10
1. Final Presentation Rubric
2. Final Project Rubric
2 New Documents on Canvas
Under Important Information

Topics to Cover
• What is Networked Individualism?
• Five Key Points of Networked Individualism
• The Impact of Digital Technologies
• Crafting Online Personas
• Authenticity vs. Presentation
• The Role of Social Media in Identity Formation
• The Data Dilemma:
• Surveillance vs. Personalization
• Online Privacy and its Challenges
• Ethical Implications of Data Collection
• Social Media Algorithms
• Confirmation Bias and Echo Chambers
• Diverse Perspectives in the Digital Age

Topics to Cover
• The Power of Online Communities
• Crowdsourcing and Social Movements
• The Role of Hashtags and Viral Campaigns
• Emerging Technologies: AI, VR, AR, and Beyond
• Predictions and Speculations about the Future of Technology
• Ethical Considerations and Responsible Digital Citizenship

Social Media Algorithms
• Social media algorithms are complex mathematical
formulas used by platforms like Facebook, Instagram,
Twitter, and YouTube to determine what content users
see in their feeds.
• These algorithms analyze user behavior and
preferences to personalize content delivery, but they also
have significant implications for the type of information
users encounter.

Five Key Points
Content Personalization
Social media algorithms aim to create a tailored user experience. They analyze user data, such as past interactions,
interests, and demographics, to prioritize content that is most likely to engage users.
Engagement Metrics
Algorithms often prioritize content with high engagement metrics, such as likes, comments, and shares. This can result in
a feedback loop, where popular content becomes more prominent, and less popular content is marginalized.
Filtering and Ranking
Algorithms filter through vast amounts of content and rank it based on relevance. Content that the algorithm deems less
relevant to a user's interests may not appear in their feed at all.

Five Key Points continued
Algorithmic Bias
Algorithms can inadvertently perpetuate biases present in the data they're trained on. This can result in
discriminatory or polarizing content being recommended to users.
User Experience vs. Engagement
There is a tension between optimizing user experience and maximizing user engagement. Algorithms often
prioritize the latter, which can lead to content that evokes strong emotions or reinforces preexisting beliefs.
Discussion
How do social media algorithms influence the content you see on your feeds? Have you noticed a
particular type of content being promoted more often?

Confirmation Bias and Echo Chambers
• Confirmation bias is the tendency for
individuals to seek, interpret, and remember
information in a way that confirms their
preexisting beliefs.
• This cognitive bias can lead to the formation
of echo chambers, where people are exposed
to and reinforce their existing viewpoints while
dismissing opposing perspectives.

Five Key Points
Confirmation Bias
Confirmation bias occurs when individuals actively seek out information that confirms their existing beliefs and values
while avoiding or dismissing information that challenges them.
Echo Chambers
Echo chambers are environments, often digital, where individuals are exposed primarily to information and opinions that
align with their existing beliefs. These chambers reinforce confirmation bias and limit exposure to diverse perspectives.
Information Silos
Social media algorithms and self-selection of online communities can contribute to information silos, where individuals
only engage with like-minded individuals and ideas

Polarization
Confirmation bias and echo chambers can lead to political and ideological polarization. When individuals are
consistently exposed to one perspective, they may become more extreme in their beliefs and less willing to
consider alternative viewpoints.
Mitigating Echo Chambers
Encouraging exposure to diverse perspectives, critical thinking, and media literacy are strategies to mitigate the
effects of echo chambers and confirmation bias.
Discussion
Have you observed echo chambers in online communities or social media platforms you engage with?
How might these echo chambers impact individuals and society as a whole?

Diverse Perspectives in the Digital Age
• The digital age has created unprecedented
opportunities for individuals to access and engage with
diverse perspectives from around the world.
• This diversity can enrich our understanding and
challenge our preconceptions.

Five Key Points
Global Connectivity
The internet has connected people from different cultures, backgrounds, and experiences. This global connectivity allows
for the sharing of diverse perspectives and ideas.
Exposure to Different Cultures
Online platforms, such as social media and video-sharing sites, enable users to learn about and engage with cultures and
viewpoints they may not encounter in their offline lives.
Enhanced Empathy
Exposure to diverse perspectives can lead to greater empathy and understanding. Hearing from individuals with different
life experiences can challenge stereotypes and biases.

Challenges of Information Overload
With the abundance of information available online, individuals must learn to critically evaluate sources and
differentiate between credible information and misinformation.
Filtering and Curation
While algorithms can contribute to echo chambers, they can also be used to curate diverse content. Platforms can
introduce users to content from various sources and viewpoints.
Discussion
How has the internet and digital platforms enriched your exposure to diverse perspectives, cultures,
and ideas? Can you share an example of a particularly impactful experience?

The Power of Online Communities
• Online communities are groups of individuals who
come together on digital platforms to connect, share
information, discuss common interests, and provide
support.
• These communities have gained significant influence
and impact in the digital age.

Five Key Points
Community Formation
Online communities can form around virtually any interest, from hobbies and fandoms to professional networking and
social causes. They provide a sense of belonging and shared identity.
Support Networks
Many online communities serve as valuable support networks for their members. People can find emotional support,
advice, and camaraderie within these groups, often across geographical boundaries.
Amplification of Voices
Online communities can amplify the voices of individuals and causes. When a community rallies around a particular issue
or idea, it can generate significant attention and influence public discourse.

Information Sharing
Communities are hubs for information sharing and learning. Members often share news, resources, and expertise
related to their shared interests.
Challenges
Online communities can face challenges, including issues related to moderation, toxicity, and the spread of
misinformation. Maintaining a healthy and inclusive community environment is important.
What are some examples of online communities that have made a significant impact on society, either
in a positive or negative way?
Discussion

Crowdsourcing and
Social Movements
• Crowdsourcing is a collaborative approach that
involves obtaining input, ideas, services, or content
by soliciting contributions from a large group of
people, often through online platforms.
• An example is Kickstarter. This is a crowdfunding
platform that allows individuals or small businesses
to raise funds for creative projects such as films,
music albums, gadgets, and more. People who are
interested in supporting a project can contribute
money to help bring it to fruition, and in return, they
may receive rewards or incentives based on their
level of contribution. The platform relies on the
collective support of a large number of individuals, or
the "crowd," to fund a diverse range of creative
endeavor

Five Key Points
Crowdsourced Activism
Crowdsourcing allows activists and social movements to leverage the collective power of participants. It can involve
gathering signatures for petitions, raising funds for causes, or sharing information and resources.
Global Reach
Online crowdsourcing platforms enable social movements to reach a global audience, allowing individuals from diverse
backgrounds to join in and contribute.
Resource Mobilization
Crowdsourcing can quickly mobilize resources, such as funds, volunteers, and expertise, to support social causes and
humanitarian efforts.

Challenges and Ethical Considerations
Crowdsourcing may raise ethical questions related to transparency, accountability, and the exploitation of labor.
Additionally, not all crowdsourced initiatives are successful.
Examples
Examples of crowdsourced social movements include crowdfunding for disaster relief, citizen journalism, and
collective data collection for human rights monitoring.
How can individuals effectively engage with crowdsourced initiatives, and what role does technology
and online platforms play in facilitating such engagement?
Discussion

The Role of Hashtags and Viral Campaigns
• Hashtags and viral campaigns are popular tools used on
social media platforms to raise awareness, promote
causes, and mobilize support for various issues.
• They have become essential components of online
activism and digital marketing.

Five Key Points
Hashtags for Awareness
Hashtags serve as labels that group together content related to a specific topic or theme. They are often used to raise
awareness about social issues, movements, or events.
Viral Campaigns
Viral campaigns are marketing or activism efforts that quickly gain widespread attention and engagement. They often rely
on compelling storytelling, shareable content, and social media trends.
Amplification and Engagement
Hashtags and viral campaigns can amplify the voices of individuals and organizations by encouraging users to share, like,
and comment on related content.

Trends and Memes
Viral campaigns often create trends and memes that capture the public's attention. Memes, in particular, are easily
shareable and can convey complex messages in a humorous or relatable way.
Challenges
While hashtags and viral campaigns can be powerful, they can also face backlash or criticism. It's important for
creators to consider potential negative consequences and unintended interpretations.
Can you recall any recent viral campaigns or hashtags that caught your attention or had a
significant impact? What made them effective?
Discussion

Emerging Technologies: AI, VR, AR, and Beyond
• Emerging technologies, such as Artificial Intelligence
(AI), Virtual Reality (VR), and Augmented Reality (AR), are
transforming the way we interact with the digital world
and each other.
• These technologies offer new opportunities and
challenges for individuals and society as a whole.

Five Key Points
Artificial Intelligence (AI)
AI encompasses machine learning, natural language processing, and computer vision. It enables machines to perform tasks that
typically require human intelligence, such as decision-making, problem-solving, and language understanding.
Example: Autonomous vehicles, such as self-driving cars. These vehicles use AI systems to perceive their
surroundings, make decisions, and navigate without human intervention.
Virtual Reality (VR)
VR immerses users in a computer-generated, interactive environment. It is often used for gaming, education, training, and
simulations.
Example: VR in action is its use in the field of healthcare, particularly in medical training and therapy
Augmented Reality (AR)
AR overlays digital information onto the real-world environment. It is used in applications like mobile games, navigation, and
education.
Example: Use in mobile applications and games, like the popular mobile game "Pokémon GO.“players use their smartphones'
GPS and camera functions to explore the real world while encountering virtual Pokémon characters in an augmented
reality overlay.

Impact on Daily Life
Emerging technologies are influencing daily life, from virtual meetings and AI-powered virtual assistants to
immersive gaming experiences and medical applications.
Ethical and Privacy Concerns
As these technologies become more integrated into daily life, concerns about data privacy, security, bias in AI, and
the potential for addiction in VR/AR have gained prominence.
How have you personally interacted with AI, VR, or AR technologies in your daily life, and what have
your experiences been like?
Discussion

Predictions and Speculations about the Future of Technology
• Predicting the future of technology is both an exciting
and challenging endeavor.
• Speculations about upcoming innovations and their
potential societal impacts shape our understanding of
what's to come.

Five Key Points
Technological Evolution
Predictions often revolve around the evolution of existing technologies and the emergence of entirely new ones.
Concepts like quantum computing, brain-computer interfaces, and sustainable energy sources are subjects of speculation.
Societal Transformations
Speculations extend to how technology will transform society. Questions about automation's impact on jobs, the potential
for extended human lifespans, and the future of transportation are common topics.
Ethical Considerations
Discussions about the future of technology also involve ethical considerations, including the responsible use of AI, privacy
in an increasingly digital world, and the distribution of benefits and risks.

Innovation Drivers
Predictions often consider factors driving innovation, such as government policies, industry trends, global
challenges, and societal demands.
The Role of Imagination
Speculating about the future requires imagination and creativity. It involves thinking beyond current limitations
and imagining possibilities that may seem far-fetched today.
What are some technological advancements you anticipate in the next decade or beyond? How might
these innovations impact various aspects of society?
Discussion

Ethical Considerations and Responsible Digital Citizenship
• In an increasingly digital world, responsible digital
citizenship involves understanding and addressing the
ethical implications of our online actions and
interactions.

Five Key Points
Digital Footprint
Every online action contributes to a digital footprint. This includes the data we share, the content we create, and our
interactions on social media platforms.
Data Privacy
Protecting personal data and respecting the privacy of others are key aspects of responsible digital citizenship. Individuals
and organizations should be mindful of data collection and sharing practices.
Cybersecurity
Being aware of cybersecurity risks and practicing good online security habits is essential. This includes using strong
passwords, updating software, and recognizing phishing attempts.

Media Literacy
Critical thinking and media literacy skills are crucial for navigating the digital landscape. Responsible digital citizens
should be able to discern credible sources from misinformation and fake news.
Online Behavior
Treating others with respect and empathy online is vital for fostering positive digital communities. Cyberbullying,
harassment, and hate speech have real-world consequences.
How aware are you of your digital footprint and the data you generate online? What steps can
individuals take to protect their privacy and personal information?
Discussion

Counts towards In-Class Activity Grade
• Crowdsourcing and Social Movements
• The Role of Hashtags and Viral Campaigns
• Emerging Technologies: AI, VR, AR, and Beyond
• Predictions and Speculations about the Future of
Technology
• Ethical Considerations and Responsible Digital
Citizenship
• What is Networked Individualism?
• Five Key Points of Networked Individualism
• The Impact of Digital Technologies
• Crafting Online Personas
• Authenticity vs. Presentation
• The Role of Social Media in Identity Formation
• The Data Dilemma:
• Surveillance vs. Personalization
• Online Privacy and its Challenges
• Ethical Implications of Data Collection
• Social Media Algorithms
• Confirmation Bias and Echo Chambers
• Diverse Perspectives in the Digital Age
Based on our discussions this week, select and provide a reflection on one of the
topics (150 – 200 words).

• The Impact of Social Media Algorithms: Reflect on your own experiences with social media algorithms. How do you think
these algorithms influence the content you see? Have you ever encountered a situation where an algorithm reinforced
your existing beliefs or exposed you to diverse viewpoints?
• Online Privacy and Personal Data: Consider your online behaviors and the data you share. What steps do you take to
protect your online privacy? Have you ever felt uncomfortable with the amount of data collected about you online
• Diverse Perspectives in the Digital Age: Describe an instance where you engaged with diverse perspectives online. How
did this experience impact your understanding of a particular topic or issue? How can individuals actively seek out diverse
viewpoints in the digital age?
• The Power of Online Communities: Reflect on any online communities or forums you've been a part of. How have these
communities influenced your interests, beliefs, or actions? Can you think of a situation where an online community had a
positive or negative impact on your life?
• Ethical Considerations in Technology Use: Consider the ethical dilemmas discussed in class, such as data ethics, online
behavior, and digital responsibility. Have you ever faced an ethical dilemma related to technology use? How did you
navigate it, and what did you learn from the experience?
• Predictions and Speculations about Technology: Imagine the future of technology and how it might impact society. What
are your predictions or speculations about emerging technologies like AI or VR? How do you envision these technologies
shaping our lives in the years to come?
Some Ideas...

A concept that explores the balance between individualism and
collectivism. Collectivism is the practice or principle of giving a group
priority over each individual in it.
Especially in the context of social networks and online communities
Touches on social, cultural, and ethical aspects of our digital lives
Network Individualism
What is it?

Network Individualism Deep Dive
• It encompasses the idea of personal autonomy and
self-expression within the context of digital networks,
social media, and online communities.
• It reflects the way individuals construct and present
their identities, interact with others, and participate in
digital spaces while maintaining a sense of
individuality.
• In essence, it's the fusion of individualism and
connectivity in the digital age.

Five Key Points
Online Self-Presentation
Network Individualism involves how individuals curate and present their digital selves on social media profiles, blogs, and
other online platforms. It encompasses the choices people make about what to share, how to share it, and how they
portray themselves.
Expression and Authenticity
It's about expressing one's unique perspectives, interests, and values online while navigating the tension between
authenticity and self-presentation. Individuals often make conscious choices about what to reveal and what to keep
private.
Online Relationships
Network Individualism acknowledges the diverse and personalized nature of online relationships. People can form
connections with others based on shared interests, beliefs, or experiences, even if they are geographically distant.

Digital Communities
It extends to the participation in various digital communities, such as forums, social networks, and interest-based
groups, where individuals can find like-minded individuals or engage in debates with diverse viewpoints.
Data and Personalization
It's closely tied to data collection and personalization. Online platforms use data to tailor content and
advertisements to individuals, creating a unique online experience for each user.
Discussion
In what ways has technology influenced the way individuals express themselves in online spaces?

The Impact of Digital Technologies
• The advent of digital technologies has had profound
effects on society, transforming how we communicate,
interact, and express ourselves.
• These changes have both positive and negative
implications for Network Individualism.

Five Key Points
Communication Revolution
Digital technologies have revolutionized communication. Social media, instant messaging, and video conferencing enable
real-time interactions with people worldwide, breaking down geographic barriers.
Information Access
The internet provides unprecedented access to information and diverse perspectives. Individuals can explore a wide range
of ideas and viewpoints, contributing to the development of their personal beliefs and identities.
Self-Expression
Digital platforms offer various ways for individuals to express themselves, from posting photos and videos to sharing
personal stories and creative works. These outlets allow for unique and creative forms of self-expression

Data and Privacy
The use of digital technologies also raises concerns about data privacy and surveillance. Online activities generate
vast amounts of data that can be used for targeted advertising or even surveillance by governments and
corporations.
Algorithmic Influence
Algorithms on social media platforms curate content based on user preferences and behaviors. This can create
echo chambers where individuals are exposed primarily to information that aligns with their existing beliefs.
Discussion
Do you think the accessibility of information online has led to a more informed and open society, or
has it contributed to the spread of misinformation and polarization?

Crafting Online Personas
• This involves the intentional construction and
management of one's digital identity on various online
platforms.
• It's about how individuals choose to represent
themselves, their interests, and their values in the digital
world.
• Online personas are not necessarily false, but they are
curated to some extent to present a specific image or
narrative.

Five Key Points
Self-Presentation
Crafting an online persona begins with the choices individuals make about what to share and how to share it. This
includes selecting profile pictures, writing bios, and posting content that aligns with the image they want to project.
Narrative Building
Online personas often involve storytelling. Individuals may create a coherent narrative about their lives, experiences, and
interests, emphasizing certain aspects while downplaying others.
Contextual Adaptation
People may adapt their online personas depending on the platform and audience. For example, the persona presented on
a professional networking site like LinkedIn may differ from the one on a personal blog or Instagram.

Identity Play
Some individuals use online personas as a form of identity play, exploring different facets of their personalities or
experimenting with creative alter egos.
Managing Authenticity
Balancing authenticity and presentation is crucial when crafting online personas. While some degree of curation is
natural, straying too far from one's true self can lead to feelings of inauthenticity.
Discussion
How do you craft your online persona on social media or other online platforms? Are there aspects of
your identity that you intentionally emphasize or downplay?
Have you ever encountered situations where the online persona of someone you know differs
significantly from their offline self? How did this affect your perception of them?

Authenticity vs. Presentation
• The tension between authenticity and presentation is a
central theme in the realm of online identity.
• It reflects the struggle individuals face when deciding
how much of their true selves to reveal in their online
presence versus how much they want to craft a particular
image or narrative.

Five Key Points
Authenticity
Authenticity refers to being genuine and true to oneself in both online and offline interactions. It involves being honest
about one's feelings, beliefs, and experiences.
Presentation
Presentation involves the deliberate effort to shape how others perceive you. This can include carefully curating what you
share online, using filters or editing tools, and even portraying a lifestyle that may not fully align with reality.
The Authenticity Paradox
The authenticity paradox arises when individuals are torn between being true to themselves and conforming to societal or
online norms. They may fear judgment or rejection if they reveal their unfiltered selves.

Vulnerability and Connection
Authenticity can lead to more meaningful connections with others, as it fosters vulnerability and empathy. When
people are authentic, they often find others who relate to their struggles and experiences.
Social Pressure
Social media and online communities can exert pressure on individuals to present an idealized version of
themselves. This pressure can lead to mental health issues and a sense of disconnection from one's true self.
Discussion
Do you think society's expectations of online personas are changing over time? Are we becoming more
accepting of authenticity, imperfections, and vulnerability online?

The Role of Social Media in Identity Formation
• Social media platforms have become integral to how
individuals shape their identities and interact with others.
• They offer unique opportunities for self-expression, but
they also come with challenges related to identity
construction and self-esteem

Five Key Points
Identity Exploration
Social media platforms provide a space for individuals to explore and experiment with different aspects of
their identity. They can join communities that align with their interests and values.
Comparative Identity
Social media often leads to comparative identity, where individuals compare their lives, achievements, and
appearances to others. This can sometimes result in negative self-perception and low self-esteem.
Self-Presentation
Users of social media engage in self-presentation by selecting what to share and how to share it. This can
include carefully curated posts, selfies, and status updates that reflect a particular image or lifestyle.

Networked World Assesment Powerpoint for Exam

Networked World Assesment Powerpoint for Exam

Recommended

Recommended

More Related Content

Similar to Networked World Assesment Powerpoint for Exam

Similar to Networked World Assesment Powerpoint for Exam (20)

Recently uploaded

Recently uploaded (20)

Networked World Assesment Powerpoint for Exam

Editor's Notes