Empowerment Tech.Q1 Mod4 v2
Empowerment Tech.Q1 Mod4 v2
Empowerment
Technology
Quarter 1 - Module 4:
Online ICT Platforms as Tools
for
ICT Content Development
1
Department of Education ● Republic of the Philippines Table
of Contents
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
2
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.
3
Lesson
ICT Online Platforms in
1 Creating Web Content
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
4
like on it. The first item listed on the
table is an example to guide you on 5
this activity.
6
7
8
9
10
4
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.
5
Here are the three types of online platforms:
1. Social Media Platforms
This platform allows you to create
your personal account or profile. After
you register on this website, it will
allow you to create pages or even
groups where you can share content
and ideas. Social Media platforms
enables you to connect yourself to
other users and get updates on their
news feed. Facebook, Instagram and
Twitter are
Photo Credits:
examples of Social Media platforms. https://unsplash.com/photos/yyMJNPgQ-X8
2. Blogging Platforms
A platform on where a writer or even a
group of writers can share views on an
individual subject. It is comparable to a
newsletter where you can add menus,
designs or even multimedia of a subject.
Blogger is an example of blogging site. If
you love to write or you want to share
ideas online, blogging platforms is the
perfect tool you can use. Photo Credits:
https://www.freepik.com/freevector/doodlebloggingconcept_3524976.htm#page=1&query=blogging&po
Photo Credits:
6
https://unsplash.com/photos/sSPzmL7fpWc
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.
7
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
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.
8
Photo Credits: https://unsplash.com/photos/Ylk5n_nd9dA
4. Links - links or hyperlinks allows user to jump to another site or page that is
related of to your site.
Photo Credits:
https://www.freepik.com/free-vector/monitorsize_2945488.htm#page=1&query=click
&position=2
5. Color - the colors you use in your design is a very important aspect. There
are times that colors become visually distracting to your viewers. As some web
designers do, they use the company logo of their client as their color reference on
their website.
9
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.
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. platforms or devices especially for
those visitors who uses mobile device
A. Portable Design - website
to access a website.
design must be portable and
B. Design for Low Bandwidth -
accessible. Your need to must
not all user who are online are
compatible with other operating system
connected to a high-speed internet
and web browsers. You should also
connection. In designing a website you
design your website on which it can be
need to avoid large graphics or
access to a different computer
10
animations as the users may leave the more time is required to browse through
site if downloading is slow. them. as what they usually say
"simplicity is beauty".
E. Regular testing – every device
C. Direction - identify the order of
or project needs maintenance, same as
importance of the various elements and
your website. Website should be
place them in a sequence where the
regularly upgraded, updated and tested
eye moves and perceives the things it
so that problems will be quickly
sees. There should be consistent layout
resolved. Visitors who have encounter
and structure.
any errors like problems in loading or
D. Simplicity - the more option you viewing in your website will not hold on.
place in your site, the more difficult it is
for a visitor to make a decision and
Figure 1: Principles of web design
Regular Testing
Direction
1. Wix -. Its interface is one of the most intuitive, slick, and powerful in the
evergrowing group of website-building servicesWix offers standout features,
such as online storage for your site assets, cool video backgrounds,
animations for titles, and mobile.(Retrieved from
https://sea.pcmag.com/wix/8396/wix)
11
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/)
12
Photo Credits: Screenshot from https://www.drupal.org/
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.
13
Photo credits: https://www.wix.com/account/sites
3. Choose Other.
14
Photo credits: https://www.wix.com/new/vertical?
ref=myaccount&additionalreferralinfo=siteless-main-button.
5. Pick any template that you want. Choose categories and click any
templates.
16
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
https://www.youtube.com/watch?v=JTdK9q_iuE0
What I Can Do
What I Can Do
Web Mapping Applications
17
Web mapping applications are Web sites developed from
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 Application
Photo credits:
http://wikimapia.org/#lang=en&lat=14.709800&lon=120.936200&z=12&m=w
19
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.
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.
Wix allows users to create HTML5 websites and mobile sites through the
use of online drag and drop tools.
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.
20
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
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-
mainbutton
Wix.com, “Pick the Community Education Website Template you Love”, , Accessed
January 20, 2019, https://www.wix.com/website/templates/html/ community-education
21
Wp.beginner.com, “Content Management System”, Accessed January 20, 2019,
https://www.wpbeginner.com/glossary /content-management-system-cms/
Freepik.com, "Landing page for restaurant with Christmas special food menu",
Accessed January 30, 2020, https://www.freepik.com/premium-psd/landing-page-
restaurant-withchristmas-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, "Illustration of human avatar using technology", Accessed January 30, 2020,
https://www.freepik.com/free-vector/illustration-human-avatar-
usingtechnology_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-
socialmedia_5210275.htm#page=1&query=website%20background&position=4
22
23