LESSON

Understand the Internet

5
Learning Target

At the end of the lesson, the learners are expected to:

● Define and explain what the Internet is;
● Describe the World Wide Web; and
● Explain how web browsers work.

People all over the world are using their computers for almost one identical reason – the Internet.
Most of them are using the Internet for conducting business or doing research while others do their
shopping online, playing their favorite games, downloading software and files, and in our time today,
for online classes. Have you ever wondered why and how the Internet was made?

Learn About It!

Whenever you use the internet, rather than just reading a book, you can get as much information you want in just a
matter of minutes. You can read and watch the latest news, research on different topics, and buy the things you want
online through the Internet. And now for online class. The Internet really does affect the lives of many people today.
Well, you might be thinking, what exactly is the Internet?

What is the Internet?

The Internet or simply the Net is a network of computers linked together around the world. Since millions of
computers are linked within a huge network, information can travel back and forth to any computers that are
connected to the Internet. That is why the Internet is called the Information Superhighway. For example, you can get
the data or Information you need from another computer located in another place that might be a thousand miles
away. Or, you might want to send and receive electronic mail from your relatives and friends from another country
and be confident that it will reach them in minutes. Over the past few years, the Internet has been the information
resource of most people. The number of Internet users has been continuously increasing since it started more than
two decades ago (See the box "Brief History of the Internet"). The Internet has grown rapidly and nowadays, it is
used not only the government, but it is also used for commercial, educational, and personal purposes.
 Brief History of the Internet

During the 1960s, the US Defense Department made an experiment that led them to the
development of connected computer networks that should work as a coordinated whole. Their purpose was to
help their scientists and researchers from widely dispersed areas work as if they were in one place by sharing
their files and resources.

A "Cold War" existed at that time, and networks were not secure from enemy attack. Whenever a
single server failed, the entire network failed. Their solution was to build a "Bombproof" network, one that would
be operational even when other parts of the network were shut down. From this requirement, the Defense
Department created the ARPANET (Advanced Research Projects Agency Network) in 1969. It was an
experimental network based on packet-switching techniques. The result was that when a part of it failed,
information found a new route with the help of the surviving parts.

ARPANET's success led to its widespread growth as more government agencies, universities, and
research institutions joined the network. The ARPANET became the forerunner of today's Internet. On
October 24, 1995, the Federal Networking Council (FNC) passed a resolution defining the term Internet. This
definition was developed with consultation from the leader ship of the Intellectual Property Rights (IPR)
Communities.

Today, while some early networks were decommissioned, much larger and faster networks came into existence.
Internet Services

You might have already tried some of the Internet's exciting features and services such as: Electronic Mail, Internet
Relay chat, Telnet, Gopher, and the World Wide Web.

 Electronic Mall - or email, is the worldwide system of sending and receiving mail in electronic format.
 Internet Relay Chat (IRC) - enables you to talk to or chat to Individuals or groups of people, usually using
aliases or screen names to send typed messages. Some can even allow audio conversation with one
another in real time across the globe.
 Telnet - is a remote login application that permits your computer to log on to another computer and access it
as if you were actually there.
 Gopher - Is an early text-based method for accessing documents on the internet.
 World Wide Web often abbreviated as the Web or WWW." It is a system of linking documents together even
if they are on different computers and located in different countries. It incorporates all the services listed
above, and includes the ability of viewing videos, or listening to sound recordings.
Originally, the Web was developed as a resource for physicists; but today, the Web has evolved into the main street
of cyberspace. Growing numbers of people even have their own personal Web "pages" where they let the world
know about them and what they're interested in.

In order for the Web to be accessible to everyone, certain agreed-upon standards must be followed in the creation
and delivery of its content. An organization leading the efforts to standardize the Web is the World Wide Web
Consortium (W3C).

Protocol of the Web

The simplicity of the Web comes from the fact that many individual protocols can be contained within a single
website. Internet protocols are sets of rules that allow for inter machine communication on the Internet. These are a
few of the protocols you may encounter on the Web:

 HTTP - This stand for Hyper Text Transfer Protocol, which is the standard means of transmit ting files
written in Hypertext Markup Language or HTML over networks. It is the main protocol of the World Wide
Web.
 SMTP - This stand for Simple Mail Transfer Protocol which is the standard format for sending email
messages and attached files to one or more electronic mailboxes.
 FTP - This stand for File Transfer Protocol, which allows for the transfer of files between an FTP server and
a computer.
 VolP - This stand for Voice over Internet Protocol. VoIP allows delivery of voice communications over IP
networks by converting analog voice signals into data packets, transmitting them over the Internet and
reassembling them at the other end, back into an analog signal.

Web Browser

Before you can surf the Web, you need a browser. A web browser is a software which allows you to access and
display the information or HTML files that are on the World Wide Web. Web browsers allow you to access text,
images, videos and sounds on the Web using your computer. Most people use it more than any other tool in
accessing the Internet. Web browsers allow easy access to websites, social media, and chat programs. Microsoft
Internet Explorer (IE) which is now Microsoft Edge (ME), Mozilla Firefox, and Google Chrome are some of the most
commonly used web browsers today. Each web browser differs from one another even if they share some common
features.

Basic Features of a Web Browser:

 Title bar, Toolbar, Address bar

o Title Bar - It is the text that appears at the top of the browser window. This describes the contents
of the web page.
 o Tool bar - It includes the menu bar and command buttons to help you use your browser. It has
navigational buttons to go back, forward, home page or reload a website.
o Address bar -This input box displays the address, or URL (See the box "What is a URL?") of the
web page you are viewing. You can enter any web address in this box to navigate to new pages.

 Search bar - It includes a selection of some search engines and subject guides endorsed by the browser
manufacturer. It is a standard feature on most modern web browsers. Just enter your search phrase into this
box, and it automatically sends the query to the desired search engine which then displays a search engine
results page.

 Tabs - These give your browser the ability to load multiple web pages without opening a new browser
window.

 Status bar - It appears at the bottom of your web browser. When you are loading a web page, this bar will
usually show the browser's progress. Another useful feature of most browsers is the ability to display the
actual address of links in this status bar, when you hover over links with your pointer. This allows you to
confirm which web page your browser will load before clicking the link.
GarrN Flrins ix‹’Ecitai rn scxooi
Oh LAGL .EA. GGC.
 What is a URL?

URL (Uniform Resource Locator) – It is a formatted text string used by web browsers, email clients and other
software to locate a network resource on the Internet. Network resources are files that can be ordinary web
pages, other text documents, graphics, or even programs. The URL specifies the unique address of every file
on the Internet.

URLs can have roughly four parts: the protocol, the host name, the directory, and the file name. Here is
an example:

us.html

Hands-on Exercise: Surfing the Web

One of the basic features of a web browser is a search bar to input terms into a search engine. This comes in
handy when you want to look for a specific topic or information on the web. You will need an Internet connection for
this exercise.
1. Open your preferred browser (Example: Microsoft Edge, Firefox, Chrome).
2. On the Search bar, type "What is Digital Citizenship" then press Enter.
3. The browser displays all possible results for that specific topic.
4. Choose from one of the results that you think best explains the topic.
 LESSON
Website Planning and Design
6
Learning Target

In this lesson, you will be able to:

 Understand and be able to explain the purpose of creating a website.
 Draw a sketch of a web page; and
 Learn and appreciate some good advice on proper web design.

Planning always plays a vital role if you want to succeed in creating an effective website.
Sometimes, when you need to do something on the computer, the first thing to do is “TURN OFF” the
computer. Why? Because if we first plan our website design by sketching it our on paper, we can
quickly implement the actual website since we have a virtual guide to refer to.

Learn About It!

A high-rise building or even a simple house should be built with a plan. Similarly, creating a website needs
to be planned. This will ensure that it will run smoothly and effectively. This lesson will guide you through the different
stages in web design.

Stages in Website Planning

Before starting to build your own website, it is vital to plan and consider what you are trying to achieve. It
should also be clear in your mind so that you can visualize what your finished website will look like when it is finally
uploaded to the Internet. The following should serve as an effective guide in teaching you how to design an effective
website:

1. Defining your purpose

The first step is determining exactly why you are creating it. What is the website for? Is it for an organization? Is
it to sell something? Is it a personal website for recreational use? Answering these questions will determine all of the
other design considerations. For example, a personal website will obviously be designed differently as compared to
a website intended for business purposes. Professional web designers learned from experience that it's important to
get a clear picture of what you want to do before doing it. Having a good web development strategy will ensure that
you're creating a purposeful website rather than creating a website just for the sake of it.

A survey is a common tool in determining the purpose of creating a website. A survey is the process of collecting
data used to gather information about certain issues or a topic. This can be administered through a structured
interview wherein the researcher asks each participant specific questions related to the site. In the other method,
known as a questionnaire, the participant fills out the survey in his or her own time.
 2. Determining the site structure

Now that you already know what your site's purpose or objectives are, the second step is to make a list of all the
things you want to include and then decide how they will fit together. Site mapping will help you to visualize how your
site will be structured. A site map is a visual or textually organized model of a website's content.

Creating a website map is important because it defines the size and scope of your website as well as visualizing the
routes that users will take when navigating the site. By doing this, we improve the user interface and subsequently,
the overall experience of your users.

HOME
PAGE

ABOUT CONTACT GALLERY LINK

The diagram above shows a website that is composed of three main

layers: The home page, the main sections, and the subsections.

3. Deciding how your site will look like

This is another important stage in planning a website. Draw and prepare several draft sketches of site layouts
until you have the one you like. It doesn't need to be fancy, just enough to give you a good idea of your layout. When
you do your page layout sketches, a key step is determining where your visitors will tend to look. As you develop the
actual web page on the computer, your job is to balance the visual elements on the page, so that visitors will be
drawn to the items or sections that are most important.

Things to consider that make your web page more noticeable:

 Make important things appear bigger.

 Use strong colors evenly (strong color may be used to emphasize important text).
 Apply High Contrast on shapes, lines, or edges with a significantly different tone.
 Apply animation or a dynamic line that gives the impression of movement. or idea).
 Give plenty of space around important things (this will make it easier to identify and stand out on a page).

4. Design Consideration

There are many things that need to be taken into account before you begin to create HTML documents
Some of them are listed below.
  Many visitors to the site may be using an older web browser software and may not be able to great
design work you've done using the latest software technologies.
 Some elements that look great on one web browser might not look so good in other browsers. Some
items may not even work at all.
 Those great-looking graphics you've spent hours designing may take too long to download. If that's
the case, many visitors might not wait long enough for it to finish loading. They'll go somewhere
else.
 Make it easy for people to get from one area of your site to another area.

The Dos in Web Designing

Here are some good pointers in creating a website. It will help you to maximize your site's effectiveness.

A. Make it easier to use

Most Internet surfers have short attention spans just like a two-year-old child. Don't make your
visitors think too hard, wait too long, or read too much. The best way to create a website is to make
everything easier for the user. Introduce yourself with just a line or two that doesn't require a lot of reading
or thought, and then allow the user to get started right away.

B. Capture your user's attention

Web users usually don't take enough time to carefully read and view everything that is on the
page. That's why it is best to capture their attention in a very short time span, direct them to what is most
important or attractive on your page.

C. Use high quality content

Web users will appreciate high quality and credible content. They will keep coming back to your
site for more even if the design is less than spectacular. Don't forget that there will never be a substitute
for good content.

D. Use typography wisely

This is one of the most powerful tools available to a web designer. Picking the right typeface
could make or break your design and can lead to the success or failure of your website. The rule of thumb
is to avoid using more than two or three typefaces in your design. Too many variations in font types or
colors can be distracting, confusing, and borderline annoying.

E. Try it out for a test drive

You can never know if your web page does what it's supposed to do unless you try it out. You
are no longer the best judge for its effectiveness. If somebody can use it and share their thoughts with
you, it will provide insights on improving or at the very least, suggesting some modifications to your site.
What is a Typeface?

A typeface is a set of characters of the same design. These characters include letters,
numbers, punctuation marks, and symbols. Some popular typefaces include Arial, Helvetica, Times, and
Verdana.

The term "typeface" is often confused with "font," which is a specific size and style of a typeface.
For example, Verdana is a type face, while Verdana 10 pt. bold is a font.