MODULE 4

EMPOWERMENT
TECHNOLOGY
 Online
Platforms
 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).

Websites or applications are now

accessible through smartphones.
It is up us users on how we use it.
 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.
 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.
 Types of
ONLINE
PLATFORMS

These are the three types.

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

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.

SEVEN
POSSIBLE
ELEMENTS
OF A MODERN
WEB DESIGN
 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.
 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.
 WHITE SPACE

Having a crowded website, it is very hard to

direct the attention of your visitor's eye.
These WHITE SPACE gives your website a
room to breathe.
 WHITE SPACE

Don’t fall into the trap of thinking that white

space design means that everything is white.
Far from it, white space design can make use
of any color, albeit sparingly. To put it simply,
white space design is design that is stripped
back and an exercise in economy of
expression.
 LINKS
links or hyperlinks allows user to jump to another
site or page that is related of to your site.
 COLORS
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.
 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.

BASIC
PRINCIPLES OF
AN EFFECTIVE
WEB DESIGN
To create a usable and effective
website, follow the basic principles
of an effective web design.
 Portable 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.
 Design for
LOW BANDWIDTH
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.
 Direction
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.
 Simplicity
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".
 Regular Testing
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.
 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.
W e b P a g e D e s i g n U s i n g Te m p l a t e s a n d
Online WYSIWYG.

Wix

Its interface is one of the most intuitive,

slick, and powerful in the ever-growing group
of website-building services Wix offers
standout features, such as online storage for
your site assets, cool video backgrounds,
animations for titles, and mobile.
W e b P a g e D e s i g n U s i n g Te m p l a t e s a n d
Online WYSIWYG.

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.
W e b P a g e D e s i g n U s i n g Te m p l a t e s a n d
Online WYSIWYG.

WordPress

It 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.
W e b P a g e D e s i g n U s i n g Te m p l a t e s a n d
Online WYSIWYG.

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.
 Here is the
STEP by STEP

I’ll show you video where STEPS are shown. And you could
always refer on your module for written steps or you could
always watch YouTube videos for further understanding.
You can try it now or later after the discussion!
Creating a
Wix
Website
 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.
Please refer to Module: pages 16-20
 Web
Mapping
Application
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.
 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.
Directions: Create a e-
scrapbook (MSWord). Give
five (5) examples of each
type of online platforms.
With LOGO of each sample
platform.

SOCIAL MEDIA PLATFORMS

BLOGGING PLATFORMS
CONTENT MANAGEMENT
SYSTEM or CMS