how do i create a web page

7/29/2019 How Do I Create a Web Page

1/23

How do I create a Web Page?


2/23

Web page: this is a plain text document on theWorld Wide Web. Every Web page is identified by

a unique address, or URL. HTML: is the language of the Web. HTML is a

series of tags that are integrated into a textdocument.

Web browser: interprets the HTML tags withinthe pages so the text can be displayed on thescreen.

Web server: displays Web pages and rendersthem into final form so they can viewed byanyone with an Internet connection and a Webbrowser.


3/23

What is a Web Design?

Web design is the process of selecting,

formatting, and arranging Web content in

order to effectively express an idea.


4/23

HTML Tags

HTML commands are known as tags or

markup. HTML tags define the structure of the

Web elements or content.

Some Content

Opening tag Closing tag


5/23

Types of HTML Tags

There are two basic classification of HTML tags:

1. Empty tag this type of HTML tag does not

have a closing tag.2. Container tag this type of HTML tag is used

to contain within its opening and closing tags

content and other HTML tag.


6/23

Creating Your First Web Page

To create a web page the following software are

needed:

1. Web browser

2. HTML editor


7/23

To create a basic web page, the

following commands will be used:Tag Description

It is used to indicate that the text

enclosed in this tag is in HTML format and

that it can be viewed using a browser.

It is used to define the header area. The

content of the header area is not

displayed within the page of the browser.

It is placed inside the .

The information placed inside this tag will

be displayed on the title bar of the

browser window. It is used to indicate that the text

enclosed inside this tag will be displayed

on the browser page.


8/23

Heading Tags

Is used to create hierarchy within the

document such that some text are assigned as

titles while others are assigned as topic or

subtopic headers.

your text here


9/23

Creating Paragraphs

Is defined as a group of text. Paragraph text

inserts a space before and after the group of

text.


10/23

Inserting Line Breaks

The
command is used to break a line

within a group of text or paragraph. The

tag is an example of an empty tag.


11/23

Required HTML Tags

Insert Page Title

Type page content here


12/23

Lists

Ordered list: This is generally a numbered list andrequires start and end tags. Eachitem in the list begins with

Unordered list: This is generally a bulleted list andrequires start and end tags. Eachitem in the list begins with .

Definition list: this is the list of terms with

indented definitions. This list requires a start tag. Additionally, the tag is required forthe term and is required for the definition.


13/23

Text Formatting

Bold: to bold text requires start and

end tags. Surround the text with these tags

and your text display as bold in your browser.

Italics: to display italicized text, use the start

and end tags.

Underline: to underline text, use the start

and end tags.


14/23

Changing Font Size and Color

Start and end tags.

Example:

Headings:

.


15/23

Aligning a Paragraph

Quoting Passages


16/23

Invisible Comments

Changing the Background Color of a

Page

as an end tag.


17/23

Activity 2

1. Launch your text editing program.2. Create the template:

3. Save your text as HTML template.htm

4. Close your editing program.


18/23

Font Style and Effects

Typography appearance and arrangement of

the characters that make up your text.

Typeface the actual appearance, examples

are Times New Roman, Arial, etc.

Type Style this is the variations given to the

text such as boldface, italic, regular, etc.

Font combination of typeface and type style.


19/23

Specifying Font Style

Tags commonly used for formatting

Displays the text in boldface

Displays the text in italics

Displays the text with an underline

Displays the text with strikethrough

Displays the text in superscript

Displays the text in subscript

Displays the text with strength

Displays the text with an increase in size

Displays the text with emphasis

Displays the text with a decrease in size


20/23

Specifying Font Size

Specifying Font Face

Preformatting Text

Specifying Text Color


21/23

Activity 2-A

1. Launch your text editing program.

2. Open the HTML template document.

3. On the file menu, click Save As. Save the HTML

template document as [your name]s Web page.htm4. Between the start and end TITLE tags, type [Your

name]s Web page.

5. Between the two BODY tags, type Welcome to my

Web Page6. On the file menu, click Save.

7. Launch your browser.


22/23

Activity 2-B

1. Launch your text editing program and open your Webpage document.

2. At the end of the Welcome to my Web page line, add
.

3. Press the [enter] key.

4. Add another
and press the [ENTER] key.

5. Type

My teachers name is .
. Press [Enter].
6. Type

My Favorite subject is
. Press [ENTER]7. On the File menu, click Save,
8. Launch your browser.


23/23

Activity 2-C1. Launch your text editing program and open your Web page.

2. Click under the last sentence you entered (My Favorite subject is) and type I like school because:

3. Type a BREAK
tag and press [ENTER].

4. Type to begin your ordered list. Press [ENTER].

5. Type to begin the first item in the list.

6. Type It is fun. Press [ENTER].7. Type and then type My teachers are good teachers. Press

[ENTER].

8. Type and then type I have an opportunity to learn about.Press [ENTER].

9. Type to end list.10. Save your file.

11. Display the file in your browser.

how do i create a web page

Documents