Professional Documents
Culture Documents
Empowerment Technology Module 4
Empowerment Technology Module 4
Empowerment Technology Module 4
Quarter 1 - Module 4:
Online Platforms as Tools
ICT Content of Development
What I Know
Multiple Choice:
Direction: Read and answer the questions below. Write the letter of the correct answer.
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
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
iii
Lesson
ICT Online Platforms in
1 Creating Web Content
We are on the Information Age on which information seems so easy to reach. One
of the tools that we usually use if you need to answer a question from your subject is
a website which can we use if we are online. A website or web site is a set of related
resources from the web. These resources were considered as web pages and
multimedia (e.g.: videos, music, images).
What’s New
Table 1: Websites and apps in your computer
Activity 1: Website or Website or Application
application(apps) you are using.
Website Function
Websites or applications are
now accessible through Example: Shopee Shopping Online
smartphones. It is up us users on
1
how we use it. In your smartphone
or computer list ten (10) websites or 2
applications you usually use or visit
3
and identify the best feature that
you like on it. The first item listed on 4
the table is an example to guide
5
you on this activity.
6
7
8
9
10
1
What Is It
On the listed items you presented in our previous activity, it shows that website is
a tool for information and entertainment. However, there are websites that offers you
more than just reading articles or listening to your music, these are what we call online
platform-enabled website.
A platform-enabled website or online platform gives a feature on which allows to
manipulate the content of the website. Most of the online platforms requires you to
register in order to publish, manipulate, organize, or even delete a certain web content.
As a Senior High School student, you are expected to know the different online
platform as this would help you in different task like connect people, stream your daily
activity, shop online, or even creating a website of your own.
Before I introduce the different type of online platforms which you can use. Let's
take a close look on how technologies are use these days. Take a look at the picture
below.
The picture on this page shows that each one of us has skill of being an information
literate since information can be reach just a click away. It is only up to us to how we
create or how we evaluate the information that we garnered from online resources.
2
Here are the three types of online platforms:
1. Social Media Platforms
This platform allows you to create
your personal account or profile. After
you register on this website, it will allow
you to create pages or even groups
where you can share content and
ideas. Social Media platforms enables
you to connect yourself to other users
and get updates on their news feed.
Facebook, Instagram and Twitter are
Photo Credits:
examples of Social Media platforms. https://unsplash.com/photos/yyMJNPgQ-X8
2. Blogging Platforms
A platform on where a writer or even a
group of writers can share views on an
individual subject. It is comparable to a
newsletter where you can add menus,
designs or even multimedia of a subject.
Blogger is an example of blogging site. If
you love to write or you want to share ideas
online, blogging platforms is the perfect
tool you can use. Photo Credits:
https://www.freepik.com/freevector/doodlebloggingc
oncept_3524976.htm#page=1&query=blogging&po
sition=3=3
Photo Credits:
https://unsplash.com/photos/sSPzmL7fpWc
3
What’s More
What Is It
Web page is designed for World Wide Web on which it is consider as the document
inside it. Mozilla FireFox, Google Chrome, Microsoft Edge or Apple's Safari are web
browsers which you can use in order to access a web page.
Nowadays, web pages serves as an important role in the business world. Web
pages allows businesses to showcase their company and advertise their products.
Even social media sites allows users to boost their popularity, this will help the users
to promote their business or advocacy to other users online.
If you're planning to create a web page of your own, you can use a website builder
like WordPress, Wix or Adobe Dreamweaver. These website builders are very
powerful tool and user-friendly on which you can create website by just dragging and
dropping the elements of your website. However, there are certain elements and
principles in building your own website. Below are the seven possible elements of a
modern web design
4
1. Text - this is a mandatory element of a web page. However, visitors got
distracted about the font family of the text on website. So while you are designing your
website, make sure that to choose well the font family and type that you need to use
on your design and make the text is clear and in readable size
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.
5
Photo Credits: https://unsplash.com/photos/Ylk5n_nd9dA
4. Links - links or hyperlinks allows user to jump to another site or page that is
related of to your site.
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.
6
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.
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 B. Design for Low Bandwidth - not all
must be portable and accessible. Your user who are online are connected to a
need to must compatible with other high-speed internet connection. In
operating system and web browsers. designing a website you need to avoid
You should also design your website on large graphics or animations as the users
which it can be access to a different may leave the site if downloading is slow.
computer platforms or devices especially
for those visitors who uses mobile device
to access a website.
7
C. Direction - identify the order of E. Regular testing – every device or
importance of the various elements and project needs maintenance, same as
place them in a sequence where the your website. Website should be
eye moves and perceives the things it regularly upgraded, updated and tested
sees. There should be consistent layout so that problems will be quickly resolved.
and structure. Visitors who have encounter any errors
like problems in loading or viewing in
D. Simplicity - the more option you
your website will not hold on.
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".
Figure 1: Principles of web design
Regular Testing
Direction
8
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/)
9
What I Have Learned
Recommendations/Suggestions:
2. Shopee
___________________________________________________________________
___________________________________________________________________
___________________________________________________________________
3. Suzanne Collins
___________________________________________________________________
___________________________________________________________________
___________________________________________________________________
10
What’s More
11
2. Click Create Site.
3. Choose Other.
12
5. Pick any template that you want. Choose categories and click any templates.
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.
13
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.
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.
14
What I Can Do
Photo credits:
https://www.googlemaps.com&si=EAIaIQobChMI
15
Google Maps
Photo credits:
https://www.google.com.ph/maps/@8.1426185,123.8355356,15z
Wikimapia Application
Photo credits:
http://wikimapia.org/#lang=en&lat=14.709800&lon=120.936200&z=12&m=w
16
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.
18
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.
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.
19
20
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
Activity 1: Website or application(apps) you are using.
Lesson 1:
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
Pre-Test Answer Key:
Answer Key
21
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 product
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.
Activity 3: Investigate a website
Lesson 1:
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 Content Management
site for his small business. System
3. Mike wants to write his plans about travelling from other Blogging Platform
provinces.
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 Blogging Platform
about how to reduce the use of plastic materials.
7. Linda would like to upload her pictures last Christmas Social Media Platform
vacation.
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 Blogging Platform
to share their advocacy on having Math tutorial in their school.
Activity 2: Identify which online platform to use
Lesson 1:
22
I.
10. E
9. E
8. P
7. E
II. 6. E
5. T 5. P
4. T 4. P
3. T 3. E
2. F 2. E
1. F 1. P
Post-Test Answer Key
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)
Activity 7: Distinguishing Your Learning.