Maryhill College

Basic Education Department

Lucena City

SELF-PACED LEARNING MODULE

Learning Area Computer 9

Quarter Second
Week Two
Lesson Title Lesson 7: Adding Images

Learning Resources/Materials
A. Textbook: pages 66-71
B. ICT Integration: Activities in Google Classroom
C. Supplementary Material/s: pre-recorded video lesson; stored learning packets
in OTG flash drive
Objectives:
At the end of the lesson, the students shall have:
1. Identified the tags used for embedding images and its attributes;
2. expressed enthusiasm while doing the task and;
3. applied the tags on the Hands-On activities.

Most Essential Learning Competency (MELC)

 Embed background, highlight, video and audio to an html document

A. Getting Started

Good day! I want to congratulate you first for having successfully

accomplished your previous learning activities in our last week’s module. This
time, we will proceed to the next lesson, which is the continuation of our
previous topic. It will surely equip you with more skills in creating and
enhancing a web page. I know you are already geared up to learn more so,
trust yourself and focus as you go along with this module. Goodluck!

Processing Question:
 Can you help me define the word
GRAPHICS? Do you think it is related to
Web Designing?

Graphics are images or visual representation of an object that we can see in many
places/things. It is related to web designing because there are things such as
computer graphics. Those are simply images displayed on a computer screen.
Graphics are often contrasted with text, which is comprised of characters, such as
numbers and letters, rather than images.

Visual appeal is vital to web design because it promotes

communication of ideas to your viewers by stimulating aesthetic
senses and increasing a feeling of connection.

Effective graphic design also lends an air of professionalism to your

site. Visitors are more likely to consider your content worthy of
reading if the overall website gives an appearance of authority on the
subject.

Finally, good graphic design increases the usability of your site. Web
visitors often have little patience for complex or confusing sites and
will move on fairly quickly. You can encourage viewers to stay on
your site by using graphic design to keep navigation simple, making
sure your graphics are content appropriate, and choosing eye-

B. Exploring the Lesson

To further assist you in your queries and accomplish your task for this week,
please refer to pages 66-71 of your textbook to guide you in exploring this new
lesson. To find out more of this, get your OTG flash drive, access folder
Computer Module 2 and click on the video lesson entitled “Lesson 7 Tutorial”.
Once done watching, get ready to do the following hands-on activities provided for
you.
C. Assessing Learning

As you explore and study the lesson, let’s find out whether your
learnings and discoveries are correct.

Task No. 1
Identification: Identify the acronym given in each statements. Type your
answer on the given space inside the box.

Defintion
1. JPEG Joint Photographic Experts Group-
Supports a million of colors and has
a file name extension of either jpg or
jpeg.
2. BMP Bitmap-Supports a million of colors
and has a file name extension of bmp.
This type of image is not compressed
that’s why it provides the best quality
for image at the cost of file.
3. PNG Portable Network Graphics- supports
a million of colors and has a file name
extension of png.
4. GIF Compuserve Graphics Interchange
Format- supports up to 256 colors
and has a file name extension of gif.
This file format is commonly used
and can be animated.
5. src Indicates the image to be inserted.
This attribute must be present at all
times.
6. img Image- The <img> tag is used to
 embed an image in an HTML page.
7. html Hypertext Markup Language- A
markup language used for creating
web pages.
8. <a> Defines a hyperlink
9. bgcolor Background color attribute. Indicates
the background color of the web
page.
10. href Hypertext Reference-

The HTML code used to create a link

to another page.

D. Enhancing Skills
Congratulations! You are almost nearing
the end part of this module. But before you
get into that, you have to show first how
well you learned the discussed concepts by
applying your acquired skills into actual.

Task No. 2 (Hands-On)

At this point, you are tasked to accomplished the Hands-On activities on page 71
in your textbook. You will create an html file with the application of html tags that
you have learned in this lesson. Read and follow the instructions per item. To do
the activities, you may also refer to your book as your guide and reference. Once
you’re done with this task, save your html file with your surname as file name and
leave a copy of it in your OTG flash drive inside the folder, “HANDS-ON”.

E. Reflection

In your journal, write your personal response by completing the prompt below:

EXPRESS YOURSELF!

I would say that I did well in this lesson because…

Congratulations! You did it! Rest and relax for the time being and get ready
again to move on to the next lesson.
Good luck and have a great day!