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:

Authors: Christopherson
Development C.module
team of the Saavedra
Author: Jojolita Alfra-Rivera
Reviewers: Christopherson JayC.Michael
SaavedraA. Calipusan
Myra Rachelle G. Calipusan
Jojolita Alfra-Rivera
Eric John N. Brandino
Editors:
Illustrator: Jay Michael A. Calipusan
Reviewers:
Layout Artist: Christopherson C. Saavedra
Jay Michael A.Jojolita
Calipusan
Alfra-Rivera
Myra Rachelle G. Calipusan
ManagementEric John N. Brandino
Team:

Chairperson:
Layout Artist: Dr. Arturo B. Bayocot, CESO III
Christopherson Regional Director
C. Saavedra
Co-Chairpersons: Dr. Victor G. De Gracia Jr., CESO V
Jojolita Alfra-Rivera
Asst. Regional Director
Mala Epra B. Magnaong
Management Team: Himaya B. Sinatao
CES, CLMD
Members: Dr. Bienvenido U. Tagolimot, Jr.
Regional ADM Coordinator
Elson C. Jamero
Printed in the Philippines by
EPS-Designate-TLE
Department of Education - Alternative Delivery Mode (DepEd-ADM)

Office Printed in the Philippines by: Department of Education – Regional Office 10

Address: Masterson Avenue, Upper Balulang, Zone 1, Cagayan de
Office Address: Zone 1, Upper Balulang Cagayan de Oro City 9000
Oro City,(088)
Telefax: (088) 880-7071, Cagayan de Oro, Lalawigan ng Misamis Oriental
880-7072
Telefax:
E-mail Address:________________________________________________
region10@deped.gov.ph
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

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

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.
 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
 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

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.
Table 1.1 Websites and apps in your computer
Website or Application
Website Function
Example: Shopee Shopping Online
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.

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
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. Photo Credits:
https://unsplash.com/photos/yyMJNPgQ-X8

2. Blogging Platforms
A platform on where a writer or even a 3.
group of writers can share views on an individual
subject. It is comparable to a news letter where
you can add menus, designs or evenmultimedia
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.
 Content Management System or CMS
Photo Credits:
https://unsplash.com/photos/sSPzmL7fpWc
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.

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
 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-motivational-

lettering-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-with-

christmas-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.

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

size_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/colourful-

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

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

avatar- using-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.

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.
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

Portable Design Simplicity

Design for Low Web Design

Bandwidth

Direction Regular Testing

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, animation 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. (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/)

What I Have Learned

Activity 3. Investigating a website

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
_
_
 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

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

Pick any template that you Photo credits:

https://www.wix.com/website/templates
5. want. Choose categories and click any 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
9.You can click Preview in order to see the design before saving the website.

Photocredits: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.

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 The site has a The purpose The site lacks a
well-stated clear clearly stated and theme of purpose or
purpose and purpose and the site is theme.
theme that is theme, but may somewhat Layout.
carried out have one or two muddy or
throughout the elements that vague.
site. do not seem to
be related to it.
Layout The Web site The Web pages The Web pages The wb pages
has an have an have a usable are cluttered
exceptionally attractive and layout, but may looking or
attractive and usable layout. It appear busy or confusing. It is
usable layout. It is easy to locate boring. It is easy often difficult to
is easy to locate all important to locate most of locate important
all important elements. the important elements.
elements. White elements.
space, graphic
elements and/or
alignment are
used effectively
to organize
material.
Navigation Links for Links for Links for Some links do not
navigation are navigation are navigation take take the reader to
clearly labeled, clearly labeled, the reader where the sites
consistently allow the reader s/he expects to described. A user
placed, allow the to easily move go, but some typically gets lost.
readers to easily from a page to needed links
move from a related pages seem to be
page to related (forward and missing. A user
pages (forward back), and sometimes gets
and back), and internal links take lost.
take the reader the reader where
s/he expects to
where s/he go. A user rarely
expects to go. A becomes lost
user does not
become lost.

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

 Google Maps

 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

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 The site has a The purpose and The site lacks
well-stated clear clearly stated theme of the site a purpose or
purpose and purpose and is somewhat theme.
theme that is theme, but may muddy or vague. Layout.
carried out have one or two
throughout the elements that do
site. not seem to be
related to it.

Layout The Web pages The Web pages The Web pages The Web
for online mapping for online for online pages for
application has an mapping mapping online
exceptionally application have application have mapping
attractive and an attractive and a usable layout, application are
usable layout. It is usable layout. It is but may appear cluttered
easy to locate all easy to locate all busy or boring. It looking or
important important is easy to locate confusing. It is
elements. White elements. most of the often difficult
 space, graphic important to locate
elements and/or elements. important
alignment are elements.
used effectively to
organize material.
Links for Links for Links for Some links do
Navigation navigation are navigation are navigation take not take the
clearly labeled, clearly labeled, the reader where reader to the
consistently allow the reader s/he expects to sites
placed, allow the to easily move go, but some described. A
readers to easily from a page to needed links user typically
move from a page related pages seem to be gets lost.
to related pages (forward and missing. A user
(forward and back), and sometimes gets
back), and take internal links take lost.
the reader where the reader where
s/he expects to s/he expects to
go. A user does go. A user rarely
not become lost. becomes lost
Interest The author has The author has The author has The author
made an tried to make the put lots of has provided
exceptional content of this information in the only the
attempt to make Web site Web site but minimum
the content of this interesting to the there is little amount of
Web site people for whom evidence that the information
interesting to the it is intended. person tried to and has not
people for whom it present the transformed
is intended. information in an the
interesting way. information to
make it more
interesting to
the audience
(e.g. has only
provided a list
of links to the
content of
others
t=14.709800&lon=120.936200&z=12&m=w

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 Blogging Platforms Content Management

System or CMS 1

1 1 1

2 2 2

3 3 3
 4 4 4

5 5 5

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.

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 4. Design for Low Bandwidth

2. Background 5. Simplicity
3. Text
 6. Graphics/ Illustrations 9. Links
7. Color 10. White space
8. Regular testing

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.

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
=EAIaIQobChM
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/Googl
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
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/
22
23
24
25
26
27
28
29
30
31
32
33