Senior High School

Empowerment
Technology
Quarter 2 - Module 1:
Online ICT Platforms as Tools for
ICT Content Development

This instructional material was collaboratively developed and reviewed by

educators from public and private schools, colleges, and or/universities. We
encourage teachers and other education stakeholders to email their feedback,
comments, and recommendations to the Department of Education at action@
deped.gov.ph.
We value your feedback and recommendations.
 What I Know

Multiple Choice:
Direction: Read and answer the questions below. Write the letter of the correct answer.

1. What does CMS stands for?

A. Content Management System C. Content Management Serial B.
Critic Management System D. Critic Manpower System

2. What is a document which is designed for the World Wide Web?

A. Book C. Web Page
B. Newsletter D. Magazine

3. What is the term use for ready-made website

A. New Web Page C. Template
B. Design D. Builder

4. Which does not belong to group?

A. WordPress C. Facebook
B. Instagram D. Twitter

5. Which does not belong to the group?

A. MS-Word C. Google Chrome
B. FireFox D. Safari

6. What is an online platform that allows you to create your personal account or profile.
A. Social Media Platform C. Blogging Platform
B. Video Sharing Platform D. Content Management System

7. What type of software Microsoft Edge belongs?

A. Spreadsheet C. Database
B. Word Processing D. Browser

8. What element of webd designing provides a feeling of a surface underneath?

A. Text C. Video
B. Background D. Color

9. Which principle of web designing when you avoid large graphics or animations?
A. Portable Design C. Design for Low
Bandwidth
B. Simplicity D. Regular Testing
10. What is an element of web desigining allows users to jump to another site or page that
is related of to your site?
A. Link C. Audio
B. Color D. Background

i
 Lesson
ICT Online Platforms in
1 Creating Web Content

What I Need to Know

We are on the Information Age on which information seems so easy to reach. One
of the tools that we usually use if you need to answer a question from your subject is
a website which can we use if we are online. A website or web site is a set of related
resources from the web. These resources were considered as web pages and
multimedia (e.g.: videos, music, images).

What’s New
Table 1: Websites and apps in your computer
Activity 1: Website or Website or Application
application(apps) you are using.
Website Function
Websites or applications are now
accessible through smartphones. It is Example: Shopee Shopping Online
up us users on how we use it. In your
1
smartphone or computer list ten (10)
websites or applications you usually 2
use or visit and identify the best 3
feature that you like on it. The first
item listed on the table is an example 4
to guide you on this activity. 5
6
7
8
9
10

1
 What Is It

On the listed items you presented in our previous activity, it shows that website is
a tool for information and entertainment. However, there are websites that offers you
more than just reading articles or listening to your music, these are what we call online
platform-enabled website.

A platform-enabled website or online platform gives a feature on which allows to

manipulate the content of the website. Most of the online platforms requires you to
register in order to publish, manipulate, organize, or even delete a certain web content.
As a Senior High School student, you are expected to know the different online
platform as this would help you in different task like connect people, stream your daily
activity, shop online, or even creating a website of your own.
Before I introduce the different type of online platforms which you can use. Let's
take a close look on how technologies are use these days. Take a look at the picture
below.

Photo Credits: https://pixabay.com/photos/technology-developer-continents-3435575/

The picture on this page shows that each one of us has skill of being an information
literate since information can be reach just a click away. It is only up to us to how we
create or how we evaluate the information that we garnered from online resources.

2
Here are the three types of online platforms:
1. Social Media Platforms
This platform allows you to create
your personal account or profile. After
you register on this website, it will allow
you to create pages or even groups
where you can share content and
ideas. Social Media platforms enables
you to connect yourself to other users
and get updates on their news feed.
Facebook, Instagram and Twitter are
Photo Credits:
examples of Social Media platforms. https://unsplash.com/photos/yyMJNPgQ-X8

2. Blogging Platforms
A platform on where a writer or even a
group of writers can share views on an
individual subject. It is comparable to a
newsletter where you can add menus,
designs or even multimedia of a subject.
Blogger is an example of blogging site. If
you love to write or you want to share ideas
online, blogging platforms is the perfect
tool you can use. Photo Credits:

https://www.freepik.com/freevector/doodlebloggingconcept_3524976.htm#page=1&query=blogging&po

3. Content Management System or CMS

One of the feature of this platform is
that you can publish your own website and
manage its content through intranet or in a
single computer. This is a software where
you can easily create, update, organize,
and publish the content of your website. A
popular example of CMS is WordPress.

Photo Credits:
https://unsplash.com/photos/sSPzmL7fpWc

3
 What’s More

Activity 2: Identify which online platform to use

Now you have learned the three types of online platform. These online platforms are
tools that you can use to create information, share ideas and connect to other people.
Below there are ten situation, read every item carefully and identify which online
platform is the best to use.
Table 1: Identify which online platform to use.

Situation Online Platform

1. John would like to chat with his uncle abroad. Social Media Platform
2. A Senior High School student would like to create a shopping
site for his small business.
3. Mike wants to write his plans about travelling from other
provinces.
4. A teacher wants her student to send their output online.
5. An ICT student plans to create a website about their school.
6. A group of Senior High student wants to share their ideas about
how to reduce the use of plastic materials.
7. Linda would like to upload her pictures last Christmas vacation.
8. Christian would like to check the profile of his friends online.
9. Mark wants to follow his favorite basketball player online.
10. The members of Supreme Student Government would like to
share their advocacy on having Math tutorial in their school.

What Is It

Web page is designed for World Wide Web on which it is consider as the document
inside it. Mozilla FireFox, Google Chrome, Microsoft Edge or Apple's Safari are web
browsers which you can use in order to access a web page.
Nowadays, web pages serves as an important role in the business world. Web
pages allows businesses to showcase their company and advertise their products.
Even social media sites allows users to boost their popularity, this will help the users
to promote their business or advocacy to other users online.
If you're planning to create a web page of your own, you can use a website builder
like WordPress, Wix or Adobe Dreamweaver. These website builders are very
powerful tool and user-friendly on which you can create website by just dragging and
dropping the elements of your website. However, there are certain elements and
principles in building your own website. Below are the seven possible elements of a
modern web design
4
 1. Text - this is a mandatory element of a web page. However, visitors got
distracted about the font family of the text on website. So while you are designing your
website, make sure that to choose well the font family and type that you need to use
on your design and make the text is clear and in readable size

Photo Credits: https://www.freepik.com/free-vector/collection-motivationallettering-

stickers_4947782.htm#page=1&query=text%20website&position=23

2. Graphics/ Illustrations - make sure your images or illustrations are not

pixelated or must be on good quality. There are time that text give description to an
image, so you make that these two elements are well arranged.

Photo Credits: https://www.freepik.com/premium-psd/landing-page-restaurant-withchristmas-

special-food-menu_6365743.htm#query=image%20website&position=4

3. White space - having a crowded website, it is very hard to direct the attention
of your vistor's eye. These white space gives your website a room to breathe.

5
 Photo Credits: https://unsplash.com/photos/Ylk5n_nd9dA
4. Links - links or hyperlinks allows user to jump to another site or page that is
related of to your site.

Photo Credits: https://www.freepik.com/free-

vector/monitorsize_2945488.htm#page=1&query=click&position=2

5. Color - the colors you use in your design is a very important aspect. There
are times that colors become visually distracting to your viewers. As some web
designers do, they use the company logo of their client as their color reference on
their website.

Photo Credits: https://www.freepik.com/free-psd/colourfulbanner-sale-

template_5263427.htm#pag
6. Video/Audio - there are sites use audio/video to help their visitors to better
understand what they are selling or teaching. These elements of web designing
6
really helps your visitors especially those websites that offers tutorial of certain
subject.

Photo Credits: https://www.freepik.com/free-vector/illustration-human-avatarusing-

technology_2801710.htm#page=1&query=video&position=15

7. Background - texture or background gives a more appealing sight to your website.

This will provide your website a feeling of a surface underneath.

Photo Credits: https://www.freepik.com/premium-vector/modern-sale-banner-web-social

media_5210275.htm#page=1&query=website%20background&position=4

With the use of elements of web design will make your website more appealing
to your users but you need to make sure that your website is functional, responsive
and useful. To create a usable and effective website, follow the basic principles of an
effective web design. B. Design for Low Bandwidth - not
all user who are online are connected to
A. Portable Design - website
a high-speed internet connection. In
design must be portable and accessible.
designing a website you need to avoid
Your need to must compatible with other
large graphics or animations as the
operating system and web browsers.
users may leave the site if downloading
You should also design your website on
is slow.
which it can be access to a different
computer platforms or devices
especially for those visitors who uses C. Direction - identify the order of
mobile device to access a website. importance of the various elements and
place them in a sequence where the eye
7
moves and perceives the things it sees. E. Regular testing – every device
There should be consistent layout and or project needs maintenance, same as
structure. your website. Website should be
regularly upgraded, updated and tested
D. Simplicity - the more option you
so that problems will be quickly resolved.
place in your site, the more difficult it is
Visitors who have encounter any errors
for a visitor to make a decision and more
like problems in loading or viewing in
time is required to browse through them.
your website will not hold on.
as what they usually say "simplicity is
beauty".
Figure 1: Principles of web design

Portable Design Simplicity

Design for Low Web Design

Bandwidth

Regular Testing
Direction

Web Page Design Using Templates and Online WYSIWYG.

WYSIWYG is an acronym for "what you see is what you get". There many tools
on creating or designing a website. However, there are tools offers WYSIWYG
process. These are tools on which the content (text and graphics) can be edited in a
form closely resembling its appearance when printed or displayed as a finished
product, such as a printed document, web page, or slide presentation.

1. Wix -. Its interface is one of the most intuitive, slick, and powerful in the
evergrowing group of website-building servicesWix offers standout features, such as
online storage for your site assets, cool video backgrounds, animations for titles, and
mobile.(Retrieved from https://sea.pcmag.com/wix/8396/wix)

Photo Credits: Screenshot from https://www.wix.com/

2. Weebly - This free website builder allows you to build beautiful websites in a very
short period of time – even if you do not have any programming background.

8
(Retrieved from https://www.websitebuilderexpert.com/website-builders/weebly/free -
website-builder-for-all/)

Photo Credits: Screenshot from https://www.weebly.com/?lang=en

3. WordPress - is the world’s most popular tool for creating websites. WordPress is
capable of creating any style of website, from a simple blog to a full-featured business
website. You can even use WordPress to create an online store. (Retrieved from
https://wpapprentice.com/blog/what-is-wordpress/)

Photo Credits: https://pixabay.com/photos/wordpress-blogging-blogger-editor-265132/ 4. Drupal - It

is a well-known content management system intended to help advanced designers
create a powerful website capable of handling large volumes of visitors and hundreds
of pages of content. (Retrieved from https://www.business.com/reviews/drupal/)

Photo Credits: Screenshot from https://www.drupal.org/

9
 What’s More
Creating your Own Website using Wix.
Wix is a WYSIWYG web hosting service. It offers free, professional, and business
web hosting services. Wix also has an iOS and Android app which you can use to
manage your website whenever you do not have an access to a PC.
Wix is another Web site that offers its users to create their own Website. The
advantage of using Wix is that knowledge of Web site programming is not a
prerequisite. It also offers a wide range of templates. These templates have been
designed for every purpose intended by the user. This is possible because different
Web site developers contribute to the pool of themes available. Wix offers a drag-and
–drop facility. Users can simply grab elements such as textboxes, photos, and shapes
to arrange them in the layout they want.

What I Have Learned

Activity 7: Distinguishing Your Learning.

Answer the following questions based on your learning.
The different types of online platforms for ICT content web development are Social
Media Platforms, Blogging Platforms and Content Management System or CMS. Give
five (5) examples of each type of online platforms.
Social Media Platforms
1. 4.
2. 5.
3.

Content Management System or CMS

1.
2.
3.
4.
5.
Blogging Platforms 3.
1. 4.
2. 5.
3.
10
Summary
Social Media Platforms are website like Facebook, Instagram and Twitter which
allows to you create your personal account. It also comes with a feature which you can
create pages and groups where you can share content and ideas.

Blogging Platforms is similar to a newsletter where you can add designs on your
liking. It is an online journal or informational website displaying information in the
reverse chronological order, with latest posts appearing first. It is a platform where a
writer or even a group of writers share their views on an individual subject. Wix and
WordPress.org are examples of blogging site.

Content Management System or CMS is a software which you can use on your
personal or computer or web browser which you can facilitates in creating, editing,
organizing, publishing content. WordPress is a Content Management System, that
allows you to create and publish your content on the web. Although it is mostly used
for web publishing, it can be used to manage content on an intranet, or in a single
computer.

Web page is document which is designed for the World Wide Web and is accessible
using a web browser such as FireFox, Google Chrome, Microsoft Edge, or Apple's
Safari. It may contain many kinds of data or resources which you can see, hear, and
interact with. A web page may contain text, graphics, sound, video, and animation
WYSIWYG is an editor that allows you to create and design web pages without any
coding knowledge.

HTML is stands for Hypertext Markup Language.

Wix allows users to create HTML5 websites and mobile sites through the use of online
drag and drop tools.

Template is a ready-made design for a website.

Web mapping applications are Web sites developed from geographical information
system (GIS) data. Mapping applications use GIS to create a visualize maps. Today,
a Web map is used not only for directions and locations but also to track consumer
activity and to locate stores and establishments.

Tools like Google Maps and Wix are powerful tools which you can use in order to
create your own profile online. Wix allows user to create their own website hassle free.
While Google Maps allows user to explore places while using the computer.

11
 Assessment: (Post-Test)

I. Directions: Identify every item below if it belongs to the element or the principle
of a web design. Write E if it belongs to the Element of Web Design and write P if it
belongs to the Principles of Web Design.

1. Portable Design 6. Graphics/

Illustrations
2. Background
7. Color
3. Text
8. Regular testing
4. Design for Low Bandwidth
9. Links
5. Simplicity
10. White space

II. Directions: Read the statements below an answer. Write “T” if the
statement is true and write “F” if the statement is false.
1. Weebly is considered as a Pure WYSIWYG platform HTML editor.
2. In designing a website it is better to use large graphics and animations.
3. Website should be regularly upgraded, updated and tested so that problems will be
quickly resolved.
4. Drupal is a free and open-source content management system (CMS) based on
PHP and MySQL
5. Some web designers use the company logo as reference to the color they will use
in their design.

12