Imaging and Design for

Online Environment
At the end of this lesson, you should be able to:

1. Understand the basic principles of graphics and layout;

2. Create a simple infographic using web tools;
3. Understand and use several file formats used on the web;
4. Easily manipulate image using a image-editor; and
5. Upload and share images using Photobucket.
What is the most visited website in
the world? Think about it for a
second.
No, it is not Facebook nor Twitter.
Here is a clue, the site’s mission
statement is to organize the world’s
information and make it universally
accessible and useful.” You have
probably guessed it by now,
On March 23, 2016, Alexa.com, a renowned
website for ranking web page popularity,
ranks this website number one in the entire
world. Why do you think Google ranks
number one despite the countless search
engines and websites in the internet?
Creating a web page is like creating a
work of art. There are certain things that
you need to consider in order to get your
message across.
In the previous lesson, you learned how
to create an effective PowerPoint
Presentation. Some of those tips can
help you in graphics and layout design.
 Basic Principles of
Graphics and Layout
The nuts and bolts in graphic and layout
Balance
A distribution of visual weight on either
side of the vertical axis. Symmetrical
balance uses the same characteristics.
Asymmetrical uses different but equally
weighted features.
Contrast
The arrangement of opposite elements
(light vs. dark, rough vs. smooth, small
vs. large, etc…) in a composition so as to
create visual interest.
Emphasis
Used to make certain parts of an Artwork
stand out. It creates the center of interest
or focal point. It is the place in which an
Artist draws your eyes first.
Movement
How the eye moves through the
composition; leading the attention of the
viewer from one aspect of the work to
another. Can create the illusion of action.
Pattern
The repetition of specific visual elements
such as a unit of shape or form. A method
to organize surfaces in a consistent
regular manner.
Rhythm
Regular repetition of, or alternation in
elements to create cohesiveness and
interest.
Proportion
Visual elements create a sense of unity
where they relate well with one another.
Variety
This uses several design elements to
draw a viewer’s attention.
Formative Activity for
Graphics and Layout
Enriching Experience
Using any material, create individual images that
would project each of the following principles of
graphic and layout.

1. Balance
2. Emphasis
3. Movement
4. Pattern, Repetition, and Rhythm
5. Proportion
6. Variety