Al Karma Language School

Computer
Preparatory 2

Name: …………………………………….
Class: ………………………………………

First Term
2021-2022
Unit One
Web Site

2
 Chapter 1

The concept recognizes

1- Web Sites

Any company or any business creates for itself a web site that
Allows its visitors to know about this business and eventually
Communicate with it.

2- Web Page

It is an electronic document content published on the Internet

and displayed through the Internet browser

3- Home page of web site:

When you start visiting a web site, you start by its home page,
then, you can navigate the web site by BROWSING the different
pages. The main page of a web site, through it you can navigate the
web site is called its "Home page"
 Web Page Elements

Picture

Hyperlink
Text

Video

What are web page elements?

1. ....................................................

2. ……………………………………

3. ……………………………………

4. ……………………………………

4
 Web Page
Static / Interactive
Static Web Pages:-
The content preset by the page designer, this remains
constant content and use of fixed Web pages to display the
information that is read only.

Interactive Web Pages:-

Information available on the Internet
page, written in HTML or other
language Like JavaScript or PHP and
allow users to interact with data and page
content.

5
 Activity

Open this web page and answer the following questions:-

http://www.sis.gov.eg

Define :- Home Page

………………………………………………………………………………………………
………………………………………………………………………………………………
………………………………………………………………………………………………
Select Web page Elements
………………………………………………………………………………………………
………………………………………………………………………………………………
………………………………………………………………………………………………
Select Static Web page
………………………………………………………………………………………………
………………………………………………………………………………………………
………………………………………………………………………………………………
Select Interactive Web page
………………………………………………………………………………………………
6
………………………………………………………………………………………………
………………………………………………………………………………………………

Chapter 2

Stages of design and construction

website

- Stages of design and construction website:-

• Planning to create web page
• Design Web Pages
• Preparation and processing of web pages
• Implement web pages
• Publishing web site

• Stage 1:- Planning to create web page

Web site name:- ………………………….
Web Description:- ………………………..

7
 Home Page

Page 1 Page 2 Page 3

.......... .......... ..........

• Stage 2:- Design Web Pages

Write down the content in your web pages and design pages

……………………………………………
……………………………………………
……………………………………………
……………………………………………
……………………………………………
………………………………………………
8
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………

Stage 3:- Preparation and processing of web pages

1- By using any text editor program write text and
subjects of your web.
2- By using any photo editor program collet picture that
you need.
3- Prepare your video and audio files.
……………………………………………………………………
……………………………………………………………………

9
 ……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………………
……………………………………………………………

• Stage 4:- Implement web pages

- Convert Paper design to electronic pages can be displayed

by using any explorer web.

• Stage 5:- Publishing web site

- Book Doman Name to buy storage space on a web server.

10
 Chapter 3

1. Creating and processing audio files

- Data that is recorded audio collection

11
 - Setup software that can create and edit audio files

computer
- Connect Mic and Speaker in your

2. Create Audio Files

Audacity Program
Download program
http://audacity.sourceforge.net/

To record voice press Record button

To Stop Record Press

Stop
12
To Listen the recorded sound press
Play

3. Edit Audio Files

To add effect to Audio files
1- Open Audio file
2- Select sound area
3- From Effect Menu Select :-
a. Repeat"
b. Reverse"

To Cut Audio files

1- Open Audio file
2- Select sound area
3- From Edit Menu Select Cut
4- Go to new place and select paste from edit Menu

13
To Delete Audio files
1- Open Audio file
2- Select sound area

3- Press Delete Button from Keyboard.

4. Export Audio Files

To Export Audio files
1- From File Menu Select Export Audio
2- Choose File extension
3- Save file at folder named Pro1

5. Extensions Audio Files

There are many types (extensions) audio files, including:- WAV , MP3.

Complete:-

Filename.wav Filename.mp3
Storage Capacity ………………. ……………….
Purity of sound quality ………………. ……………….

Chapter 4
Creating and processing Video files
1. Create Video Files Openshot Program

Download program
http://www.openshot.org
14
Program Interface

Main Toolbar
1
Project Files
2
Function Tab
3
Preview Window
4
Edit Toolbar
5
Zoom Slider
6
Play head/Ruler
7
Timeline
8

Time Line
1
Create Video Clips
Ruler
2 Play Head
3 Current Clip a. Import Picture Files

4 Tracks b. Arrange Timeline

c. Import Audio Files
d. Preview Video

15
 Import Picture Files
- Press Import Button From Main ToolBar.
Or
- File  Import Button
- Then select photo

Arrange Timeline

Click and drag picture at. “Project Files” window

Add each pic. In its Track

16
 Import Audio Files
- Press Import Button
From Main ToolBar.
Or
- File  Import Button
- Then select Audio

Click and dragAudio at. “Project Files” window

Add each Audio. In its Track

17
 Preview Video
Press Play Key to Preview Video

Add Track

To add new track

Save Project
Press file from main toolbar
Then select Save Project As
18
WRITE File Name and select Save Place

Edit Video Clip

Control time line

Slice Clip: -
Keep Both slides
Keep left slide
Keep Right slide

Add Effects
To add effect from
effect tap drag and
drop your chosen effect

To Delete effect Press “Remove Effect"

Add Transitions
To add Transition from Transition tap drag and drop

19
 your choose

Add Text
From Title menu choose title

• Select a template

• Change Font

• Text Color

• Background Color
• Save

20
 Export Video
To Export Video files
4- From File Menu Select Export Audio
5- Choose File extension “Target"”
6- Save file at your folder

3. Extensions Video Files

There are many types (extensions) video files, including:- AVI , MP4.

21
 Questions
Q1 Put (√ ) or ( X ) :

1- When you start visiting a web site, you start by its home page. (….)
2- Website: is a document with electronic content on the internet which
can be shown through a web browser. (….)
3- Home Page: is the opening page in the website through which other
pages can be visited. (….)
4- You can navigate the web site by Searching the different pages.(….)
5- Static Webpage is designed by PHP code (….)
6- Static Webpage is a webpage that has a content allowing the visitors
to interact with and manipulate. (….)
7- Planning stage: Set up a simple diagram on paper for the homepage
and the site pages (….)
8- Planning the website on the internet stage Choose a title, select a
web address, decide the storage capacity on a server and publish
on the internet. (….)
9- There are many types (extensions) video files, including:-
WAV , MP3. (….)
10- To add effect Press “Remove Effect" (….)
11- To Preview Video Press Play Key (….)
12- Extensions Video Files, including:- AVI , MP4. (….)

22
Q2- Fill in the blanks using words from the brackets:
( Static Webpage - Home Page – Website- BROWSING-
Interactive Webpage)

1- ……………… is a site on the internet that consists of a webpage

or more, it is visited through a certain web address.
2- ……………… is the opening page in the website through which
other pages can be visited
3- You can navigate the web site by ………… the different pages.

4- ……………… The content of these pages is previously prepared

by the page developer. The content doesn’t change and can’t be
edited by the visitor

5- ……………… designed by HTML , JavaScript , PHP .

(HTML -Web Page- Interactive Webpage- home page)

1- ……………… is a document with electronic content on the

internet which can be shown through a web browser.

2- When you start visiting a web site, you start by its ……………….

3- Static Webpage is designed by……………… code

4- ……………… is a webpage that has a content allowing the visitors

to interact with and manipulate.

23
 Q3- Complete the following:

1- ……………… is a site on the internet that consists of a webpage

or more, it is visited through a certain web address.
2- ……………… is a document with electronic content on the
internet which can be shown through a web browser.
3- ……………… is the opening page in the website through which
other pages can be visited
4- When you start visiting a web site, you start by its ……………….
5- You can navigate the web site by ……………… the different
pages. The main page of a web site, through it you can navigate the
web site is called its ………………
6- ……………… The content of these pages is previously prepared
by the page developer. The content doesn’t change and can’t be
edited by the visitor
7- Static Webpage is designed by ……………… code
8- ……………… is a webpage that has a content allowing the
visitors to interact with and manipulate.
9- ……………… designed by HTML , JavaScript , PHP .
10- Implementation Stage is using a programming language and HTML
codes to ………………. - ……………… - ……………….
11- Design the page stage used to format ………………. ,
……………….

24
12- …………… consists of important steps which are as follows:
- Prepare the text which will be added to the page using a text editor
program and save it in a folder.
-Prepare the image files and save them in a folder.
-Prepare the video and audio files and save them in a folder.
13- ……………… Set up a simple diagram on paper for the
homepage and the site pages
14- ……………… stage Choose a title, select a web address,
decide the storage capacity on a server and publish on the internet.
15- ……………… Choose a title, select a web address, decide the
storage capacity on a server and publish on the internet.
16- There are many types (extensions) audio files, including:-
………, ………
17- To Delete effect Press ………………
18- To Import Picture Files  Press ……………… From

……………….
19- To Preview Video Press ………………
20- To Add Text to your project choose From ……………… choose
………………
21- Extensions Video Files, including:- ……………….

25
Q4 Match:-
…..
1 Record button

….
2 Import Picture Files

…..
3 Play

…..
4 Stop

Q5 Rearrange :-
• To add effect to Audio files
( … ) From Effect Menu
( … ) Select sound area
( … ) Open Audio file
( … ) Select Repeat"

• To Cut Audio files

( … ) Select sound area
( … ) Go to new place and select paste from edit menu
( … ) From Edit Menu Select Cut
( … ) Open Audio file
• To Delete Audio files
( … ) Select sound area
( … ) Open Audio file
( … ) Press Delete Button from Keyboard.

26
 • To Export Audio files
( … ) Save file at folder named …
( … ) From File Menu Select Export Audio
( … ) Choose File extension
• To Save Project at openshot program
( … ) Then select Save Project As
( … ) Press file from main toolbar
( … ) WRITE File Name and select Save Place
• To Export Video files
( … ) From File Menu Select Export Audio
( … ) Save file at your folder
( … ) Choose File extension “Target"”

Q6 What are web page elements?

1- …………………………………………………….

2- …………………………………………………….

3- …………………………………………………….

4- …………………………………………………….

Q7 What are Stages of designing and creating a website:-

• ………. ………………………
• …………………………………
• ……… ………………..…..
• ……… ………………..…...
• ……… ………………………

27
 Q8 Complete

Openshot Interface

1
2
3
4
5
6
7
8

1
Time Line

28
Unit two
Web Design

29
 Chapter 1

(Hyper Text Markup Language)

The Programing Language Is used to Create Static web Pages
And these pages can be saved as HTML files And run through
one of the Internet browsers

To create New Web Page By Using HTML

1- Open any text editor application

2- Write HTML Code

3- Save File with .html Extension

HTML Structure

Head:- INFORMATION
ABOUT Page Title

Body:- Web Page

Contents

30
 Any order Open With <……>

End with <\......>

To add page title <title>.......</title>

<body>.......</body>
Add data in page
Select page direction Dir
“rtl”
Right direction
“ltr”
Left Direction Ex: <body dir= “rtl”>

Format Text

New Line <br>

Center Text <center> ... </center>

Add Space
&nbsp;

<font> ... </font>

Format Font Face
Color
size

Underline <u>…</u>

Bold <b>…</b>

Italic <i>…</i>

31
 Format Page

Change Back color

.<body bgcolor="……" >

Background Image
<body background="image1.jpg" >

Insert Picture <img src ="image1.jpg" >

Control Picture Size

<img src="school.png" height="…"
width="…">
Align picture
<img src="school.png" align=”…”>

Add background sound <bgsound src=” …”>

Add Video
<embed src=” …”>

Add Hyperlink
<a>…</a>

32
 Questions
Question 1 : Put (√ ) or the correct sentence and ( X ) for the wrong
one:
1-HTML is used to create interactive web pages. (……..)

2- JavaScript is used to modify the static page to interactive page. (……..)

3- The tag that is written at the beginning of the code to refer that the
document is written by html is <title>(…..)
4- To control the number of the spaces between words, we use the symbol
&nbsp; . (…….)

5- To add image to the web page, we use the <img > tag (….…)
Q2 Match:-
a document with e-content that is
Web Site ….. published on the internet and is displayed
by the browser
display read-only information without the
Web Page
Homepage
ability to do processing from guests to the
Static Page content a place on the internet that is
consisted of a
the property to move to the site pages.
Dynamic /
page information page that displays an
Interactive
interactive

33
 Question 3 : Choose the suitable correct answer to the following
phrases:

1- HTML refers to the phrase…………

a- Hyper Text Markup Library. b- Help Table Made Layout.
c- Hyper Text Markup Language.
2- The web page which uses HTML in its design, it is only considered
a……page.
a- Interactive b- Active c- Static
3- Using languages like JavaScript and PHP besides HTML in the design
of the web page is to modify the page to…………
a- Interactive b- Homepage c- Subpage
4- To display a text on the web page, we write the text in the…………….

a- Head b -Title c- Body

5- We must save the HTML file with the extension……………..

a- Docx b- Jpg c- Htm

6- To display the text "italic" on the web page, we use the tag………
a- <u> b- <i> c- <b>
7- To select the background color of the web page, we use the
property…….
a- bgcolor b- background c- color
8- The property which is connected to the <img> tag, one of these
properties is……
a- path b- href c- src
7- The <a> tag ,is used to………………………inside the web page.
a- align text b- add a hyperlink c- play video
8- To select the font type in <font>tag , we use the property………..
a- Font name b- Size c- Face
34
 Answers
Unit One
1- Put (√ ) or ( X ) :
1- When you start visiting a web site, you start by its home page.(√)
2- Website: is a document with electronic content on the internet
which can be shown through a web browser.
(X)
3- Home Page: is the opening page in the website through which
other pages can be visited. (√)
4- You can navigate the web site by Searching the different pages.
(X)
5- Static Webpage is designed by PHP code (X)
6- Static Webpage is a webpage that has a content allowing the
visitors to interact with and manipulate. (X)
7- Planning stage: Set up a simple diagram on paper for the
homepage and the site pages (√)

8- Planning the website on the internet stage Choose a title, select a

web address, decide the storage capacity on a server and publish
on the internet. (X)
9- There are many types (extensions) video files, including: - WAV,
MP3. (X)

35
10- To add effect Press “Remove Effect" (X)
11- To Preview Video Press Play Key (√)
12- Extensions Video Files, including: - AVI, MP4. (√)

Q2- Fill in the blanks using words from the brackets:

(Static Webpage - Home Page – Website- BROWSING- Interactive

Webpage)

1- Website: is a site on the internet that consists of a webpage or more, it

is visited through a certain web address.
2- Home Page:is the opening page in the website through which other
pages can be visited
3- You can navigate the web site by BROWSING the different pages.

4- Static Webpage: The content of these pages is previously prepared by

the page developer. The content doesn’t change and can’t be

edited by the visitor

5- Interactive Webpage: designed by HTML , JavaScript , PHP

(HTML -Web Page- Interactive Webpage- home page)

1- Web Page: is a document with electronic content on the internet

which can be shown through a web browser.

2- When you start visiting a web site, you start by its home page.

3- Static Webpage is designed by HTML code

36
 4- Interactive Webpage is a webpage that has a content allowing the

visitors to interact with and manipulate.

Q3- Complete the following:

1- Website: is a site on the internet that consists of a webpage or

more, it is visited through a certain web address.
2- Web Page: is a document with electronic content on the internet
which can be shown through a web browser.
3- Home Page:is the opening page in the website through which
other pages can be visited
4- When you start visiting a web site, you start by its home page.
5- You can navigate the web site by BROWSING the different
pages. The main page of a web site, through it you can
navigate the web site is called its "Home page"
6- Static Webpage: The content of these pages is previously
prepared by the page developer. The content doesn’t change
and can’t be edited by the visitor
7- Static Webpage is designed by HTML code
8- Interactive Webpage is a webpage that has a content allowing
the visitors to interact with and manipulate.
9- Interactive Webpage: designed by HTML , JavaScript , PHP .
10- Implementation Stage is using a programming language and
HTML codes to
- Convert the design into webpage.
- Input the data and files.
- Create the hyperlinks.
37
11- Design the page stage used to format the background color.
,Select the places to add text files, images, videos and sound files.
12- Prepare and develop stage consists of important steps which
are as follows:
- Prepare the text which will be added to the page using a text
editor program and save it in a folder.
-Prepare the image files and save them in a folder.
-Prepare the video and audio files and save them in a folder.
13- Planning stage: Set up a simple diagram on paper for the
homepage and the site pages
14- Publish the website on the internet stage Choose a title,
select a web address, decide the storage capacity on a server
and publish on the internet.
15- Stage Five: Publish the website on the internet Choose a
title, select a web address, decide the storage capacity on a

server and publish on the internet.

16- There are many types (extensions) audio files, including:- WAV

, MP3.

17- To Delete effect Press “Remove Effect"

18- To Import Picture Files 

19- Press Import Button from Main ToolBar.

20- To Preview Video Press, Play Key

21- To Add Text to your project, choose From Title menu choose
title
22- extensions Video Files, including:- AVI , MP4.
38
 Q4 Match
Program Interface

Main Toolbar
1
Project Files
2
Function Tab
3
Preview Window
4
Edit Toolbar
5
Zoom Slider
6
Play head/Ruler
7
Timeline
8

Time Line
1 Ruler
2 Play Head
3 Current Clip
4 Tracks

Create Video Clips

e. Import Picture Files

f. Arrange Timeline

g. Import Audio Files

h. Preview Video
39
 Import Picture Files
- Press Import Button From Main ToolBar.
Or
- File  Import Button
- Then select photo

Arrange Timeline

Click and drag

picture at. “Project
Files” window
Add each pic. In
its Track

Import Audio
- Press Import Button
From ToolBa
O
- FileImport
- Then Audi

Click and Audiat. “Project” windo

Add Audi. In its

40
Preview Video
Press Play Key to Preview Video

Add Track

To add new track

41
• Q5 Rearrange :
• To add effect to Audio files
( 3 )From Effect Menu
( 2 )Select sound area
( 1 )Open Audio file
( 4 )Select Repeat"
• To Cut Audio files
( 2 ) Select sound area
( 4 ) Go to new place and select paste from edit Menu
( 3 ) From Edit Menu Select Cut
( 1 ) Open Audio file
To Delete Audio files
( 2 ) Select sound area
( 1 ) Open Audio file
( 3 ) Press Delete Button from
Keyboard. To Export Audio files
( 3 ) Save file at folder named …
( 1 ) From File Menu Select Export Audio
( 2 ) Choose File extension
• To Save Project at openshot program
( 2 ) Then select Save Project As
( 1 ) Press file from main toolbar
( 3 ) WRITE File Name and select Save

42
 Place To Export Video files
( 1 ) From File Menu Select Export Audio
( 3 ) Save file at your folder
( 2 ) Choose File extension “Target"”
Q6 What are web page elements?

1. ............Picture................
2. ………Text…………..………
3. ………Video…….……………
4. ………Hyperlink………………

Q7 What are Stages of designing and creating a website:-

• ……….Planning………………………
• ………Design…………………………
• ………Prepare and develop………..
• ………Implementation ……………...
• ……… Publish ………………………

Openshot Program

43
Q8 Complete

program Interface

Time Line
Time Line
1 Ruler
2 Play Head
3 Current Clip
4 Tracks

44
 Unit Two
Question 1 : Put (√ ) or the correct sentence and ( X ) for the wrong
one:
1-HTML is used to create interactive web pages. ( X )
2- JavaScript is used to modify the static page to interactive page. (√ )
3- The tag that is written at the beginning of the code to refer that the
document is written by html is <title>( X )
4-To control the number of the spaces between words, we use the
symbol &nbsp; . (√ )
5- To add image to the web page, we use the <img > tag
(√ ) Q2 Match:-
1 Web Site 1 a document with e-content that is published on
the internet and is displayed by the browser.
2 Homepage 4 display read-only information without the
ability to do processing from guests to the
content
3 Web Page 3 a place on the internet that is consisted of a
web page or more and is visited through
specific titles

4 Static Page 2 the first page on the web site and through it we
easily move to the rest pages.

5 Dynamic / the property to move to the site pages.

Interactive
page

45
 5 information page that displays an interactive
content to the guests to interact and process it.

Question 3 : Choose the suitable correct answer to the following

phrases:

2- HTML refers to the

phrase………… a-Hyper Text
Markup Library. b- Help
Table Made Layout.
c- Hyper Text Markup Language.
2- The web page which uses HTML in its design, it is only considered
a……page. a- Interactive b- Active c- Static
3- Using languages like JavaScript and PHP besides HTML in the design
of the web page is to modify the page to………… a- Interactive d-
Homepage e- Subpage
4- To display a text on the web page, we write the text in the…………….
a- Head
b- Title

c- Body
5- We must save the HTML file with the extension……………..
a- Docx
b- Jpg
c- Htm
6- To display the text "italic" on the web page, we use the tag………
a- <u>
b- <i>
c- <b>
46
7- To select the background color of the web page, we use the
property…….
a- bgcolor
b- background
c- color
8- The property which is connected to the <img> tag, one of these
properties is……
d- path e- href f- src

9-The <a> tag ,is used to………………………inside the web

page. d- align text e- add a hyperlink f- play video

10-To select the font type in <font>tag , we use the property………..

d- Font name e- Size f-
Face

47