EMPOWERMENT TECHNOLOGY for abm students!

RiyanGustonglambing 0 views 36 slides Oct 23, 2025
Slide 1
Slide 1 of 36
Slide 1
1
Slide 2
2
Slide 3
3
Slide 4
4
Slide 5
5
Slide 6
6
Slide 7
7
Slide 8
8
Slide 9
9
Slide 10
10
Slide 11
11
Slide 12
12
Slide 13
13
Slide 14
14
Slide 15
15
Slide 16
16
Slide 17
17
Slide 18
18
Slide 19
19
Slide 20
20
Slide 21
21
Slide 22
22
Slide 23
23
Slide 24
24
Slide 25
25
Slide 26
26
Slide 27
27
Slide 28
28
Slide 29
29
Slide 30
30
Slide 31
31
Slide 32
32
Slide 33
33
Slide 34
34
Slide 35
35
Slide 36
36

About This Presentation

Empowerment technology for abm


Slide Content

Empowerment Technology - Senior High School
Alternative Delivery Mode
Quarter 1 - Module 4: Empowerment Technologies
First Edition, 2020

Republic Act 8293, section 176 states that: No copyright shall subsist in any work
of the Government of the Philippines. However, prior approval of the government
agency or office wherein the work is created shall be necessary for exploitation of
such work for profit. Such agency or office may, among other things, impose as a
condition the payment of royalty.

Borrowed materials (i.e., songs, stories, poems, pictures, photos, brand names,
trademarks, etc.) included in this book are owned by their respective copyright
holders. Every effort has been exerted to locate and seek permission to use these
materials from their respective copyright owners. The publisher and authors do not
represent nor claim ownership over them.

Published by the Department of Education – Region X – Northern Mindanao
Regional Director: Dr. Arturo B. Bayocot, CESO V
Development team of the module
Author:
Christopherson C. Saavedra
Jojolita Alfra-Rivera
Editors:
Reviewers:
Jay Michael A. Calipusan
Myra Rachelle G. Calipusan
Eric John N. Brandino

Layout Artist:
Christopherson C. Saavedra
Jojolita Alfra-Rivera

Management Team: Himaya B. Sinatao


Printed in the Philippines by
Department of Education - Alternative Delivery Mode (DepEd-ADM)

Office Address: Masterson Avenue, Upper Balulang, Zone 1, Cagayan de Oro
City, Cagayan de Oro, Lalawigan ng Misamis Oriental
Telefax: ________________________________________________
E-mail Address: ________________________________________________
Development Team of the Module:
Authors: Christopherson C. Saavedra
Jojolita Alfra-Rivera
Reviewers: Jay Michael A. Calipusan
Myra Rachelle G. Calipusan
Eric John N. Brandino
Illustrator: Jay Michael A. Calipusan
Layout Artist: Christopherson C. Saavedra
Jojolita Alfra-Rivera
Management Team:
Chairperson: Dr. Arturo B. Bayocot, CESO III
Regional Director
Co-Chairpersons: Dr. Victor G. De Gracia Jr., CESO V
Asst. Regional Director
Mala Epra B. Magnaong
CES, CLMD
Members: Dr. Bienvenido U. Tagolimot, Jr.
Regional ADM Coordinator
Elson C. Jamero
EPS-Designate-TLE
Printed in the Philippines by: Department of Education – Regional Office 10
Office Address: Zone 1, Upper Balulang Cagayan de Oro City 9000
Telefax: (088) 880-7071, (088) 880-7072
E-mail Address: [email protected]

Empowerment Technology - Senior High School
Alternative Delivery Mode
Quarter 1 - Module 4: Empowerment Technologies
First Edition, 2020

Republic Act 8293, section 176 states that: No copyright shall subsist in any work
of the Government of the Philippines. However, prior approval of the government
agency or office wherein the work is created shall be necessary for exploitation of
such work for profit. Such agency or office may, among other things, impose as a
condition the payment of royalty.
Borrowed materials (i.e., songs, stories, poems, pictures, photos, brand names,
trademarks, etc.) included in this book are owned by their respective copyright
holders. Every effort has been exerted to locate and seek permission to use these
materials from their respective copyright owners. The publisher and authors do not
represent nor claim ownership over them.

Published by the Department of Education – Region X – Northern Mindanao
Regional Director: Dr. Arturo B. Bayocot, CESO V
Development team of the module
Author:
Christopherson C. Saavedra
Jojolita Alfra-Rivera
Editors:
Reviewers:
Jay Michael A. Calipusan
Myra Rachelle G. Calipusan
Eric John N. Brandino

Layout Artist:
Christopherson C. Saavedra
Jojolita Alfra-Rivera

Management Team: Himaya B. Sinatao


Printed in the Philippines by
Department of Education - Alternative Delivery Mode (DepEd-ADM)
Office Address: Masterson Avenue, Upper Balulang, Zone 1, Cagayan de Oro
City, Cagayan de Oro, Lalawigan ng Misamis Oriental
Telefax: ________________________________________________
E-mail Address: ________________________________________________


Senior High School




Empowerment
Technology
Quarter 1 - Module 4:
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.

Department of Education ● Republic of the Philippines

Table of Contents


What This Module is About …………………………………………………………………….. i
What I Need to Know ………………………………………………………………………… ….i
How to Learn from this Module ………………………………………… .................................ii
Icon of this Module……………………………………………………………………… .............ii
What I Know………………………………………………………………………… ...................iii

Lesson 1:
ICT Online Platforms in Creating Web Content.......................1
What I Need to Know.......................................................................................1
What's New: Website and Applications............................................................1
What Is It: Types of Online Platform.................................................................2
What's More: Best Online Platform to use .......................................................4
What Is It: Elements and Principles of Web Design .........................................4
What I Have Learned: Investigate a Website..................................................10
What More: Creating your Own Website using Wix........................................11
What I Can Do: Website Making...................................................................15
What I Can Do: Web Mapping Applications..................................................17
What I Have Learned: Distinguishing Your Learning......................................20

Summary:...........................................................................................................................21
Assessment: (Post -Test)...................................................................................................22
Key to Answers:.................................................................................................................23
References:........................................................................................................................26

Table of Contents


What This Module is About …………………………………………………………………….. i
What I Need to Know ………………………………………………………………………… ….i
How to Learn from this Module ………………………………………… .................................ii
Icon of this Module……………………………………………………………………… .............ii
What I Know………………………………………………………………………… ...................iii

Lesson 1:
ICT Online Platforms in Creating Web Content.......................1
What I Need to Know.......................................................................................1
What's New: Website and Applications............................................................1
What Is It: Types of Online Platform.................................................................2
What's More: Best Online Platform to use .......................................................4
What Is It: Elements and Principles of Web Design .........................................4
What I Have Learned: Investigate a Website..................................................10
What More: Creating your Own Website using Wix........................................11
What I Can Do: Website Making...................................................................15
What I Can Do: Web Mapping Applications..................................................17
What I Have Learned: Distinguishing Your Learning......................................20

Summary:...........................................................................................................................21
Assessment: (Post -Test)...................................................................................................22
Key to Answers:.................................................................................................................23
References:........................................................................................................................26




i


What This Module is About
This module is about the online creation tools and platforms exist for users to utilize in
order to create content that corresponds to professional tracks such as academics, sports,
arts, and design, technical vocational courses.
An online marketplace that places one party in touch with another, such as buyers and
sellers. Examples are eBay, Craigslist, Amazon Marketplace, Airbnb and Uber.
The online system may be entirely self-contained, or it may allow third-party apps to connect
via the platform's programming interface. In personal computing, a platform is the basic
hardware (computer) and software (operating system) on which software applications can be
run. Online platforms or online website created to aid users in creating their web content and
cater to different kinds of information such as texts, images, and videos.
Online platforms are strong drivers of innovation and play an important role in digital
society and economy. They increase consumer choice, improve efficiency and
competitiveness of industry and can enhance civil participation in society.
The different online platform and web design elements & principle and application use to
create a good online presentation, webpage and content. Learners should know the principle
and techniques of design using online creation tool, platform and application to develop ICT
content.
This module contains varied activities that can help you as a Senior High School student
to not just be a computer literate individual, but a creative and critical thinker as well as
responsible user and competent producer of information and communication technology.
The lesson contained in this module:
1. The Principles and Techniques of Design using Online Creation Tools, Platforms,
and Applications to Develop ICT Content for Specific Professional Tracks.



What I Need to Know

At the end of this module, you should be able to:
1. Evaluate existing online creation tools, platforms and applications in developing
ICT content for specific professional tracks (CS_ICT11/12-ICTPT-Ig-h-9);
2. Apply web design principles and elements using online creation tools,
platforms, and applications to communicate a message for a specific purpose in
specific professional tracks (CS_ICT11/12-ICTPT-Ig-h-10);
3. Create an original or derivative ICT content using creation tools, platforms, and
applications to effectively communicate messages related to specific professional
tracks (CS_ICT11/12-ICTPT-Ig-h-11).

ii

How to Learn from this Module
To achieve the objectives cited above, you are to do the following:
• Take your time reading the lessons carefully.
• Follow the directions and/or instructions in the activities and exercises diligently.
• Answer all the given tests and exercises.
Icons of this Module

What I Need to
Know
This part contains learning objectives that
are set for you to learn as you go along the
module.

What I know This is an assessment as to your level of
knowledge to the subject matter at hand,
meant specifically to gauge prior relatedt
knowledge

What’s In This part connects previous lesson with that
of the current one.

What’s New An introduction of the new lesson through
various activities, before it will be presented
to you

What is It These are discussions of the activities as a
way to deepen your discovery and
understanding of the concept.

What’s More These are follow-up activities that are
intended for you to practice further in order to
master the competencies.

What I Have
Learned
Activities designed to process what you have
learned from the lesson

What I can do These are tasks that are designed to
showcase your skills and knowledge gained,
and applied into real- life concerns and
situations.

ii

How to Learn from this Module
To achieve the objectives cited above, you are to do the following:
• Take your time reading the lessons carefully.
• Follow the directions and/or instructions in the activities and exercises diligently.
• Answer all the given tests and exercises.
Icons of this Module

What I Need to
Know
This part contains learning objectives that
are set for you to learn as you go along the
module.

What I know This is an assessment as to your level of
knowledge to the subject matter at hand,
meant specifically to gauge prior relatedt
knowledge

What’s In This part connects previous lesson with that
of the current one.

What’s New An introduction of the new lesson through
various activities, before it will be presented
to you

What is It These are discussions of the activities as a
way to deepen your discovery and
understanding of the concept.

What’s More These are follow-up activities that are
intended for you to practice further in order to
master the competencies.

What I Have
Learned
Activities designed to process what you have
learned from the lesson

What I can do These are tasks that are designed to
showcase your skills and knowledge gained,
and applied into real-life concerns and
situations.

iii


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

1


Lesson
1
ICT Online Platforms in
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
application(apps) you are using.
Websites or applications are
now accessible through
smartphones. It is up us users on
how we use it. In your smartphone
or computer list ten (10) websites or
applications you usually use or visit
and identify the best feature that
you like on it. The first item listed on
the table is an example to guide
you on this activity.




Website or Application

Website Function
Example: Shopee Shopping Online
1
2
3
4
5
6
7
8
9
10

1


Lesson
1
ICT Online Platforms in
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
application(apps) you are using.
Websites or applications are
now accessible through
smartphones. It is up us users on
how we use it. In your smartphone
or computer list ten (10) websites or
applications you usually use or visit
and identify the best feature that
you like on it. The first item listed on
the table is an example to guide
you on this activity.




Website or Application

Website Function
Example: Shopee Shopping Online
1
2
3
4
5
6
7
8
9
10


2


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.










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.





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

3

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
examples of Social Media platforms.

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.


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/yyMJNPgQ-X8
Photo Credits:
https://www.freepik.com/freevector/doodlebloggingc
oncept_3524976.htm#page=1&query=blogging&po
sition=3=3
Photo Credits:
https://unsplash.com/photos/sSPzmL7fpWc

3

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
examples of Social Media platforms.

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.


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/yyMJNPgQ-X8
Photo Credits:
https://www.freepik.com/freevector/doodlebloggingc
oncept_3524976.htm#page=1&query=blogging&po
sition=3=3
Photo Credits:
https://unsplash.com/photos/sSPzmL7fpWc
4



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

5

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










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.











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.
Photo Credits: https://www.freepik.com/premium-psd/landing-page-restaurant-with-
christmas-special-food-menu_6365743.htm#query=image%20website&position=4
Photo Credits: https://www.freepik.com/free-vector/collection-motivational-
lettering-stickers_4947782.htm#page=1&query=text%20website&position=23

5

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









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.










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.
Photo Credits: https://www.freepik.com/premium-psd/landing-page-restaurant-with-
christmas-special-food-menu_6365743.htm#query=image%20website&position=4
Photo Credits: https://www.freepik.com/free-vector/collection-motivational-
lettering-stickers_4947782.htm#page=1&query=text%20website&position=23
6









4. Links - links or hyperlinks allows user to jump to another site or page that is
related of to your site.








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://unsplash.com/photos/Ylk5n_nd9dA
Photo Credits: https://www.freepik.com/free-vector/monitor-
size_2945488.htm#page=1&query=click&position=2
Photo Credits: https://www.freepik.com/free-psd/colourful-
banner-sale-template_5263427.htm#pag
e=1&query=color%20website&position=1

7

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
really helps your visitors especially those websites that offers tutorial of certain
subject.








7. Background - texture or background gives a more appealing sight to your
website. This will provide your website a feeling of a surface underneath.









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.
A. Portable Design - website design
must be portable and accessible. Your
need to must compatible with other
operating system and web browsers.
You should also design your website on
which it can be access to a different
computer platforms or devices especially
for those visitors who uses mobile device
to access a website.
B. Design for Low Bandwidth - not all
user who are online are connected to a
high-speed internet connection. In
designing a website you need to avoid
large graphics or animations as the users
may leave the site if downloading is slow.

Photo Credits: https://www.freepik.com/premium-vector/modern-sale-banner-web-social-
media_5210275.htm#page=1&query=website%20background&position=4
Photo Credits: https://www.freepik.com/free-vector/illustration-human-avatar-
using-technology_2801710.htm#page=1&query=video&position=15

7

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
really helps your visitors especially those websites that offers tutorial of certain
subject.








7. Background - texture or background gives a more appealing sight to your
website. This will provide your website a feeling of a surface underneath.









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.
A. Portable Design - website design
must be portable and accessible. Your
need to must compatible with other
operating system and web browsers.
You should also design your website on
which it can be access to a different
computer platforms or devices especially
for those visitors who uses mobile device
to access a website.
B. Design for Low Bandwidth - not all
user who are online are connected to a
high-speed internet connection. In
designing a website you need to avoid
large graphics or animations as the users
may leave the site if downloading is slow.

Photo Credits: https://www.freepik.com/premium-vector/modern-sale-banner-web-social-
media_5210275.htm#page=1&query=website%20background&position=4
Photo Credits: https://www.freepik.com/free-vector/illustration-human-avatar-
using-technology_2801710.htm#page=1&query=video&position=15
8

C. Direction - identify the order of
importance of the various elements and
place them in a sequence where the
eye moves and perceives the things it
sees. There should be consistent layout
and structure.
D. Simplicity - the more option you
place in your site, the more difficult it is
for a visitor to make a decision and more
time is required to browse through them.
as what they usually say "simplicity is
beauty".
E. Regular testing – every device or
project needs maintenance, same as
your website. Website should be
regularly upgraded, updated and tested
so that problems will be quickly resolved.
Visitors who have encounter any errors
like problems in loading or viewing in
your website will not hold on.

Figure 1: Principles of web design






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 ever-
growing 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)










Portable Design
Design for Low
Bandwidth
Direction
Simplicity
Regular Testing
Web Design
Photo Credits: Screenshot from https://www.wix.com/

9

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.
(Retrieved from https://www.websitebuilderexpert.com/website-builders/weebly/free
-website-builder-for-all/)








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/)












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.weebly.com/?lang=en
Photo Credits: https://pixabay.com/photos/wordpress-blogging-blogger-editor-265132/
Photo Credits: Screenshot from https://www.drupal.org/

9

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.
(Retrieved from https://www.websitebuilderexpert.com/website-builders/weebly/free
-website-builder-for-all/)








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/)












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.weebly.com/?lang=en
Photo Credits: https://pixabay.com/photos/wordpress-blogging-blogger-editor-265132/
Photo Credits: Screenshot from https://www.drupal.org/
10


What I Have Learned


Activity 3: Investigating a website

Instructions:
In our lesson we have learned the elements and principles needed to create a
website. On this activity, you will investigate three websites and identify if these
websites are using the elements appropriately. Using the table provided, add a

mark
if the website is using the elements correctly and X mark if the website is not using the
element correctly. For every website there is a space provided so that you can write
your recommendation or suggestion on the web designing of the website.
a. Yale School of Art link: https://www.art.yale.edu/
b. Shopee link: https://shopee.ph/
c. Suzanne Collins link: http://www.suzannecollinsbooks.com/

Yale School of Art Shopee Suzanne Collins
Text
Graphics
White Space
Links
Color
Video/Audio
Background

Recommendations/Suggestions:

1. Yale of School of Art:
___________________________________________________________________
___________________________________________________________________
___________________________________________________________________

2. Shopee
___________________________________________ ________________________
___________________________________________________________________
___________________________________________________________________

3. Suzanne Collins
___________________________________________________________________
___________________________________________________________________
___________________________________________________________________

11


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.

Activity 4: Creating a Wix Website
For this activity you will create your personal website that focuses on your passion or
hobby.
1. Create an account on Wix by going to www.wix.com. You have to sign up to
use the website. You may choose to log in using your Facebook account or
Gmail account. Once logged in, you can use the existing templates of wix and
just modify and enhance your website.

Photo credits: https://www.wix.com/account/sites

11


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.

Activity 4: Creating a Wix Website
For this activity you will create your personal website that focuses on your passion or
hobby.
1. Create an account on Wix by going to www.wix.com. You have to sign up to
use the website. You may choose to log in using your Facebook account or
Gmail account. Once logged in, you can use the existing templates of wix and
just modify and enhance your website.

Photo credits: https://www.wix.com/account/sites




12

2. Click Create Site.

Photo credits: https://www.wix.com/account/sites

3. Choose Other.

Photo credits: https://www.wix.com/new/vertical?ref=myaccount&additionalreferralinfo=site-
less-main-button.
4. You will be instructed to choose a template. Click Choose a Template.

Photo credits: https://www.wix.com/new/site?vertical=other

13

5. Pick any template that you want. Choose categories and click any templates.

Photo credits: https://www.wix.com/website/templates

Photo credits: https://www.wix.com/website/templates/html/community-education
6. Your website will be generated and soon you will end up in the site’s Wix editor.
7. The editor is pretty easy to use. The center shows the preview of your website.
The design tools are located on the right. It is now time to edit the website to your
liking.
8. Click Edit and create your own amazing website.

Photo credits : https://editor.wix.com/html/editor/web/renderer/new?siteId=f9729d47-
3200-4fc9-85d7-4962458fe33c&metaSiteId=12f2ed08-f07c-8d31-b14b-
733cf7fe35b1&editorSessionId=42383395-932d-4a22-b619-0e046d5ed470

13

5. Pick any template that you want. Choose categories and click any templates.

Photo credits: https://www.wix.com/website/templates

Photo credits: https://www.wix.com/website/templates/html/community-education
6. Your website will be generated and soon you will end up in the site’s Wix editor.
7. The editor is pretty easy to use. The center shows the preview of your website.
The design tools are located on the right. It is now time to edit the website to your
liking.
8. Click Edit and create your own amazing website.

Photo credits: https://editor.wix.com/html/editor/web/renderer/new?siteId=f9729d47-
3200-4fc9-85d7-4962458fe33c&metaSiteId=12f2ed08-f07c-8d31-b14b-
733cf7fe35b1&editorSessionId=42383395-932d-4a22-b619-0e046d5ed470
14

9. You can click Preview in order to see the design before saving the website.


Photo credits:
https://editor.wix.com/html/editor/web/renderer/new?siteId=f9729d47-3200-
4fc9-85d7-4962458fe33c&metaSiteId=12f2ed08-f07c-8d31-b14b-
733cf7fe35b1&editorSessionId=0858a7ce-448b-4e23-8473-00c610e3f5bd
10. Once you are done editing and click Save and choose Save & Continue.

Photo credits https://editor.wix.com/html/editor/web/renderer/edit/8f21420c-bc8e-
48f3-a613-9cacc9bfc489?editorSessionId=0858a7ce-448b- 4e23-8473-
00c610e3f5bd&metaSiteId=6ad45859-d245- 4f35-9ec7-fd685f139b26

11. You can click Edit and type the filename. Click done to publish the website.
To understand more the Wix Website, you can access the video tutorials below:
1. How to Make a Website with WIX? WIX 2019 Complete Tutorial?
https://www.youtube.com/watch?v=aa6JS_8QtNI
2. Wix Tutorial For Beginners 2019 - Create A Wix Website In Minutes
https://www.youtube.com/watch?v=JTdK9q_iuE0
Let us now test your understanding by doing the activity below.

15



What I Can Do

Activity 5: Website Making
For this activity you will create your profile website.
1. Go to the website using an online WYSIWYG platform and free host, then click sign
up.
Problem: You are the marketing manager of a multinational manufacturing company
that will establish its first retail store in the country. The company will also develop a
Web site for the promotion of the said store. You are asked to create an online
collaborative word processing file that will be shared with different officials of the
company. This will be used to solicit their ideas. Based on the inputs in this word
processing file, you are expected to compile the ideas posted, and then create and
present a presentation file to the company’s executives. The presentation will also be
attended by the executives whom you have solicited the ideas from. You should
include all of their ideas for evaluation in the presentation.
2. Create a profile website. Therefore, you can add more pictures of you on the
website.
3. Be creative.
4. Once done, submit your website address to your teacher.

Rubric for Website Design

Criteria 4 3 2 1
Content The site has a
well-stated clear
purpose and
theme that is
carried out
throughout the
site.
The site has a
clearly stated
purpose and
theme, but may
have one or two
elements that
do not seem to
be related to it.
The purpose
and theme of
the site is
somewhat
muddy or
vague.
The site lacks a
purpose or
theme.
Layout.

15


What I Can Do

Activity 5: Website Making
For this activity you will create your profile website.
1. Go to the website using an online WYSIWYG platform and free host, then click sign
up.
Problem: You are the marketing manager of a multinational manufacturing company
that will establish its first retail store in the country. The company will also develop a
Web site for the promotion of the said store. You are asked to create an online
collaborative word processing file that will be shared with different officials of the
company. This will be used to solicit their ideas. Based on the inputs in this word
processing file, you are expected to compile the ideas posted, and then create and
present a presentation file to the company’s executives. The presentation will also be
attended by the executives whom you have solicited the ideas from. You should
include all of their ideas for evaluation in the presentation.
2. Create a profile website. Therefore, you can add more pictures of you on the
website.
3. Be creative.
4. Once done, submit your website address to your teacher.

Rubric for Website Design

Criteria 4 3 2 1
Content The site has a
well-stated clear
purpose and
theme that is
carried out
throughout the
site.
The site has a
clearly stated
purpose and
theme, but may
have one or two
elements that
do not seem to
be related to it.
The purpose
and theme of
the site is
somewhat
muddy or
vague.
The site lacks a
purpose or
theme.
Layout.
16

Layout The Web site
has an
exceptionally
attractive and
usable layout. It
is easy to locate
all important
elements. White
space, graphic
elements and/or
alignment are
used effectively
to organize
material.
The Web pages
have an
attractive and
usable layout. It
is easy to locate
all important
elements.
The Web pages
have a usable
layout, but may
appear busy or
boring. It is easy
to locate most of
the important
elements.
The wb pages
are cluttered
looking or
confusing. It is
often difficult to
locate important
elements.

Navigation Links for
navigation are
clearly labeled,
consistently
placed, allow
the readers to
easily move
from a page to
related pages
(forward and
back), and take
the reader

where s/he
expects to go. A
user does not
become lost.
Links for
navigation are
clearly labeled,
allow the reader
to easily move
from a page to
related pages
(forward and
back), and
internal links
take the reader
where s/he
expects to go. A
user rarely
becomes lost
Links for
navigation take
the reader
where s/he
expects to go,
but some
needed links
seem to be
missing. A user
sometimes gets
lost.
Some links do
not take the
reader to the
sites described.
A user typically
gets lost.

Interest The author has
made an
exceptional
attempt to make
the content of
this Web site
interesting to
the people for
whom it is
intended.
The author has
tried to make
the content of
this Web site
interesting to
the people for
whom it is
intended.
The author has
put lots of
information in
the Web site but
there is little
evidence that
the person tried
to present the
information in
an interesting
way.
The author has
provided only the
minimum amount
of information
and has not
transformed the
information to
make it more
interesting to the
audience (e.g.
has only
provided a list of
links to the
content of others

17

What I Can Do

Web Mapping Applications

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.



The examples of mapping application are:
 Google Maps – This is a Web mapping application developed by Google. It
shows both graphic and satellite maps. The maps include street names,
building names, establishment names, and bus and train stations, to name a
few. Some extension applications include three-dimensional views of the
satellite images and traffic conditions. To access Google Maps,
http://www.google.com.ph/maps/


Photo credits:
https://www.googlemaps.com&si=EAIaIQobChMI

17

What I Can Do

Web Mapping Applications
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.



The examples of mapping application are:
 Google Maps – This is a Web mapping application developed by Google. It
shows both graphic and satellite maps. The maps include street names,
building names, establishment names, and bus and train stations, to name a
few. Some extension applications include three-dimensional views of the
satellite images and traffic conditions. To access Google Maps,
http://www.google.com.ph/maps/


Photo credits:
https://www.googlemaps.com&si=EAIaIQobChMI

18



Google Maps
Photo credits:
https://www.google.com.ph/maps/@8.1426185,123.8355356,15z

 Wikimapia - This is a collaborative open content mapping application.
Wikimapia offers satellite view of streets, buildings, and establishments. This
Web site uses Google Maps APIs for mapping. To access Wikimapia,
http://wikimapia.org/


Wikimapia Application
Photo credits:
http://wikimapia.org/#lang=en&lat=14.709800&lon=120.936200&z=12&m=w

19

Activity 6: Invitation Making with Online Mapping Application
In your task, go to the website using an online mapping application.
Problem: You established a business focused on organizing events such as parties
and weddings. You have a customer who wants you to organize a birthday party at a
hotel. You are expected to present the invitation you designed to your client. You are
supposed to share the invitation with your customer using a cloud storage application.
The invitation should include a map from an online mapping application that shows the
directions going to the venue.
Rubrics for Online Mapping Application
Criteria 4 3 2 1
Content The site has a
well-stated clear
purpose and
theme that is
carried out
throughout the
site.
The site has a
clearly stated
purpose and
theme, but may
have one or two
elements that do
not seem to be
related to it.
The purpose and
theme of the site
is somewhat
muddy or vague.
The site lacks
a purpose or
theme.
Layout.
Layout The Web pages
for online mapping
application has an
exceptionally
attractive and
usable layout. It is
easy to locate all
important
elements. White
space, graphic
elements and/or
alignment are
used effectively to
organize material.
The Web pages
for online
mapping
application have
an attractive and
usable layout. It is
easy to locate all
important
elements.
The Web pages
for online
mapping
application have
a usable layout,
but may appear
busy or boring. It
is easy to locate
most of the
important
elements.
The Web
pages for
online
mapping
application are
cluttered
looking or
confusing. It is
often difficult
to locate
important
elements.

Navigation
Links for
navigation are
clearly labeled,
consistently
placed, allow the
readers to easily
move from a page
to related pages
(forward and
back), and take
the reader where
s/he expects to
go. A user does
not become lost.
Links for
navigation are
clearly labeled,
allow the reader
to easily move
from a page to
related pages
(forward and
back), and
internal links take
the reader where
s/he expects to
go. A user rarely
becomes lost
Links for
navigation take
the reader where
s/he expects to
go, but some
needed links
seem to be
missing. A user
sometimes gets
lost.
Some links do
not take the
reader to the
sites
described. A
user typically
gets lost.

Interest The author has
made an
The author has
tried to make the
The author has
put lots of
The author
has provided

19

Activity 6: Invitation Making with Online Mapping Application
In your task, go to the website using an online mapping application.
Problem: You established a business focused on organizing events such as parties
and weddings. You have a customer who wants you to organize a birthday party at a
hotel. You are expected to present the invitation you designed to your client. You are
supposed to share the invitation with your customer using a cloud storage application.
The invitation should include a map from an online mapping application that shows the
directions going to the venue.
Rubrics for Online Mapping Application
Criteria 4 3 2 1
Content The site has a
well-stated clear
purpose and
theme that is
carried out
throughout the
site.
The site has a
clearly stated
purpose and
theme, but may
have one or two
elements that do
not seem to be
related to it.
The purpose and
theme of the site
is somewhat
muddy or vague.
The site lacks
a purpose or
theme.
Layout.
Layout The Web pages
for online mapping
application has an
exceptionally
attractive and
usable layout. It is
easy to locate all
important
elements. White
space, graphic
elements and/or
alignment are
used effectively to
organize material.
The Web pages
for online
mapping
application have
an attractive and
usable layout. It is
easy to locate all
important
elements.
The Web pages
for online
mapping
application have
a usable layout,
but may appear
busy or boring. It
is easy to locate
most of the
important
elements.
The Web
pages for
online
mapping
application are
cluttered
looking or
confusing. It is
often difficult
to locate
important
elements.

Navigation
Links for
navigation are
clearly labeled,
consistently
placed, allow the
readers to easily
move from a page
to related pages
(forward and
back), and take
the reader where
s/he expects to
go. A user does
not become lost.
Links for
navigation are
clearly labeled,
allow the reader
to easily move
from a page to
related pages
(forward and
back), and
internal links take
the reader where
s/he expects to
go. A user rarely
becomes lost
Links for
navigation take
the reader where
s/he expects to
go, but some
needed links
seem to be
missing. A user
sometimes gets
lost.
Some links do
not take the
reader to the
sites
described. A
user typically
gets lost.

Interest The author has
made an
The author has
tried to make the
The author has
put lots of
The author
has provided
20

exceptional
attempt to make
the content of this
Web site
interesting to the
people for whom it
is intended.
content of this
Web site
interesting to the
people for whom
it is intended.
information in the
Web site but
there is little
evidence that the
person tried to
present the
information in an
interesting way.
only the
minimum
amount of
information
and has not
transformed
the
information to
make it more
interesting to
the audience
(e.g. has only
provided a list
of links to the
content of
others


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.
2.
3.
4.
5.

Blogging Platforms
1.
2.
3.

4.
5.

Content Management System or CMS
1.
2.
3.
4.
5.

21

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.

21

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.

22



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
2. Background
3. Text
4. Design for Low Bandwidth
5. Simplicity
6. Graphics/ Illustrations
7. Color
8. Regular testing
9. Links
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.

23


Answer Key


Pre-Test Answer Key:















Lesson 1:
Activity 1: Website or application(apps) you are using.









15. d
14. b
13. d
12. c
11. a
10. a
9. c
8. b
7. d
6. a
5. a
4. a

3. c
2. c
1. c
Website Function/Uses
1. Facebook Upload Pictures
2. YouTube Watch Videos
3. Lazada Shopping Online
4. Mobile Legends Online Gaming
5. W3Schools Online Tutorial
6. Clash of Clans Online Gaming
7. Google Search Information
8. Merriam Dictionary Spelling Correction
9. Subway Surf Offline Gaming
10. Messenger Chat with Friends

24

Lesson 1:
Activity 2: Identify which online platform to use
Lesson 1:
Activity 3: Investigate a website
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.
Content Management
System
3. Mike wants to write his plans about travelling from other
provinces.
Blogging Platform
4. A teacher wants her student to send their output online. Social Media Platform
5. An ICT student plans to create a website about their school. Content Management
Platform
6. A group of Senior High student wants to share their ideas
about how to reduce the use of plastic materials.
Blogging Platform
7. Linda would like to upload her pictures last Christmas
vacation.
Social Media Platform
8. Christian would like to check the profile of his friends online. Social Media Platform
9. Mark wants to follow his favorite basketball player online. Social Media Platform
10. The members of Supreme Student Government would like
to share their advocacy on having Math tutorial in their school.
Blogging Platform

Yale School of Art Shopee Suzanne Collins
Text X  
Graphics X  
White Space X  X
Links X  
Color X  
Video/Audio X  X
Background X  X
1. Yale of School of Art:
The background image of the website should not be set on tiles. Arrange properly the
text or articles in the website. It is much better to insert an image on every article or
announcement to add more information of the subject.
2. Shopee
The web design for this website is much better than the previous website. Only one
recommendation for this website, the owner might add a video on how to setup the
product so that the consumer will not be having a hard time on setting up the p roduct
they bought.
3. Suzzanne Collins
The content of the page is well arranged, what I mean is the page is not very crowded
since it is a personal website. I would recommend if there will be a page for the gallery of
images on this website. And also, I would recommend if there will be link for every post of
the owner of the website since this is a personal website. Links must be chronologically
arranged.

25


Activity 7: Distinguishing Your Learning.














Post-Test Answer Key












I.
10. E
9. E
8. P
7. E
6. E
5. P
4. P
3. E
2. E
1. P
II.
5. T
4. T
3. T
2. F
1. F
Social Media Platforms:
1.Facebook
2.Twitter
3.Instagram
4.WhatsApp
5.WeChat
Blogging Platforms:
1.WordPress.org
2.Constant Contact Website Builder
3.Blogger
4.Medium
5.Squarespace
Content Management System or CMS.
1. Wix
2. Drupal
3. TYPO3.
4. Joomla
5. Magento (for eCommerce stores)

26


References:
Bandala, Argel A., Diwa Senior High School Series Empowerment Technologies, Diwa
Learning System INC. 4/F SEDCCO 1 Bldg., 120 Thailand corner Legaspi Streets, Legaspi
Village, 1229 Makati City, Philippines, Website: http://www.diwa.ph., Philippine Copyright
2016, 54 - 70
Department of Education, Empowerment Technologies for the Academic Track Teacher’s
Guide First Edition 2016, Published by the Department of Education-Bureau of Learning
Resources (DepEd-BLR) Office Address: Ground Floor Bonifacio Building, DepEd Complex
Meralco Avenue, Pasig City, Philippines 1600, 14 - 18
Department of Education, Empowerment Technologies Student Reader First Edition 2016,
Published by the Department of Education-Bureau of Learning Resources (DepEd-BLR)
Office Address: Ground Floor Bonifacio Building, DepEd Complex Meralco Avenue, Pasig
City, Philippines 1600, 33 - 36.
Innovative Training Works, Inc., Empowerment Technologies, Published by Rex Bookstore,
Philippine Copyright 2016, 55 - 63
Bluleadz.com, “Elements of a Modern Website Design”, Accessed January 20,
2019, ,https://www.bluleadz.com/blog/bid/68850/5-elements -of-a-modern-website-design,
Google.com, “Google Maps”, Accessed January 20, 2019, https://www.goog
le.com.ph/maps/
Google.com, “Google Maps”, Accessed January 20, 2019,
https://www.google.com.ph/maps/ @8.1426185,123.8355356,15z

Google.com, “Google Maps”, Accessed January 20, 2019,
https://www.googlemaps.com&si =EAIaIQobChMI

Wikimapia.com, “Wikimapia Application Maps”, Accessed January 20, 2019,
http://wikimapia.org/ #lang=en&lat= 14.709800&lon=120.936200&z=12&m=w

Wikipedia.com, “Google Maps”, Accessed January 20, 2019, https://en.wikipedia.org/
wiki/Google

Wix.com, “Wix Website”, Accessed January 20, 2019, https://www.wix.com/account/sites
Wix.com, Accessed January 20, 2019, Choose how you want to create your
website,https://www. wix.com/new/site?vertical=other

Wix.com, “Pick the Website Template you Love”, Accessed January 20, 2019,
https://www.wix.com /new/vertical?ref=myaccount&additional_ referralinfo=site-less-main-
button

Wix.com, “Pick the Community Education Website Template you Love”, , Accessed January
20, 2019, https://www.wix.com/website/templates/html/ community-education

Wix.com, “Different Templates”, Accessed January 20, 2019,
https://www.wix.com/website/templates

27

Wix.com, Accessed January 20, 2019, https://editor.wix.com/html/editor/web/renderer/
new?siteId=f9729d47-3200-4fc9-85d7-4962458fe33c&metaSiteId=12f2ed08-f07c-8d31-
b14b-733cf7fe35b1&editorSessionId=0858a7ce-448b-4e23-8473-00c610e3f5bd
Wix.com, “Wix Editor Website”, Accessed January 20, 2019,
https://editor.wix.com/html/editor/web/ renderer/edit/8f21420c-bc8e-48f3-a613-

Wp.beginner.com, “Content Management System”, Accessed January 20, 2019,
https://www.wpbeginner.com/glossary /content-management-system-cms/
Youtube.com, “WIX 2019 Complete Tutorial”, Accessed January 20, 2019,
https://www.youtube.com/watch?v=aa6JS_8QtNI ,
Youtube.com, “Create A Wix Website In Minutes”, Accessed January 20, 2019,
https://www.youtube.com/watch?v=JTdK9q_iuE0
Bluleadz.com, “Elements of a Modern Website Design”, Accessed January 20, 2020,
https://www.bluleadz.com/blog/bid/68850/5-elements -of-a-modern-website-design
Pixabay.com, "Technology Developer Continues", Accessed January 30, 2020,
https://pixabay.com/photos/technology-developer-continents-3435575/
Freepik.com, "Doodle blogging concept", Accessed January 30, 2020,
https://www.freepik.com/freevector/doodlebloggingconcept_3524976.htm#page=1&query=bl
ogging&position
Unsplash.com, "flat screen monitor photo", Accessed January 30, 2020,
https://unsplash.com/photos/sSPzmL7fpWc
Freepik.com, "Collection of motivational lettering", Accessed January 30, 2020,
https://www.freepik.com/free-vector/collection-motivational-lettering-
stickers_4947782.htm#page=1&query=text%20website&position=23
Freepik.com, "Landing page for restaurant with Christmas special food menu", Accessed
January 30, 2020, https://www.freepik.com/premium-psd/landing-page-restaurant-with-
christmas-special-food-menu_6365743.htm#query=image%20website&position=4
Unsplash.com, "computer screen displaying website home page photo", Accessed January
30, 2020, https://unsplash.com/photos/Ylk5n_nd9dA
Freepik.com, "Colourful banner sale template", Accessed January 30, 2020, https://www.
freepik.com/free-psd/colourful-banner-sale-template_5263427.
htm#page=1&query=color%20website&position=1
Freepik.com, "Monitor size vector", Accessed January 30, 2020, https://www.freepik.com
/free-vector/monitor-size_2945488.htm#page=1&query=click&position=2
Freepik.com, "Illustration of human avatar using technology", Accessed January 30, 2020,
https://www.freepik.com/free-vector/illustration-human-avatar-using-
technology_2801710.htm#page=1&query=video&position=15
Freepik.com, "Modern sale banner for web social media", Accessed January 30, 2020,
https://www.freepik.com/premium-vector/modern-sale-banner-web-social-
media_5210275.htm#page=1&query=website%20background&position=4
Wix.com, "Wix", Accessed January 30, 2020, https://www.wix.com/

28

WebsiteBuilderExpert.com, "Weebly Review", Accessed January 30, 2020,
https://www.websitebuilderexpert.com/website-builders/weebly/free-website-builder-for-all\
Weebly.com, "Weebly", Accessed January 30, 2020, https://www.weebly.com/?lang=en
Business.com, "Drupal Review", Accessed January 30, 2020,
https://www.business.com/reviews/drupal/
Pixabay.com, ""Wordpress Bloggin Blogger - Free", Accessed January 30, 2020,
https://pixabay.com/photos/Acordpress-blogging-blogger-editor-265132/
Wpapprentice.com, "What is WordPress", Accessed January 30, 2020,
https://wpapprentice.com/blog/what-is-wordpress/
Tags