Internet Applications Development Lecture 2 L. Obead Alhadreti.

Internet Applications Development

Lecture 2

L. Obead Alhadreti

Lecture Outline:

• Basic Format of HTML document• Text Formatting

Internet programming Languages

• There are two types of Internet programming Languages:– Client-side programming languages, such as

HTML , java script. – Server-side programming languages, such as

ASP , JSP, PHP

• HTML stands for HyperText Markup Language• Used to design web pages and format text and information.• Marked up with elements, delineated by tags.• Client-side programming language

HTML

What will you need?1. Text editor: to write the HTML instructions.

for example: Notepad

2. Browser: The browser interprets your instructions and displays the result. For example: Internet Browser.

• HTML files

– .htm or .html extensions– Name your files to describe their functionality– File name of your home page should be

index.html

Advantages of HTML

• Flexible language: all you need is a text editor to write the instructions.

• easy to learn• Free• Bugs fixed easily

Basic HTML document Format

HTML Element

Important Notes

• Some html elements have no closing tag.• Some html elements have no content.• Some html elements have more than one attribute

divided by comma.• The values should be sounded by caution marks

“”. • HTML is not case sensitive.• Good practice to keep all the letters in one case.

HTML element HTML element• Always include the <HTML>…</HTML> tags at the beginning

and end of the HTML instructions. • The <html> tag tells the browser that this is an HTML document. • The <html> tag is the container for all other HTML elements.

• The <html> element supports the following attributes:

Head Element HEAD element

• Includes information about the document.• Information in header not generally rendered in

display window.• Starts with <head> and ends with </head>.

Title Element Title element• The <title> element defines the title of the

document.• The title element:

– defines a title in the browser toolbar – provides a title for the page when it is added to

favorites – displays a title for the page in search-engine results

Body Element– BODY element

• The <body> tag defines the document's body. • The area you place all content you would like browsers to

display.• Includes text, images, links, forms, etc.• The <body> element supports the following attributes:

Description Value Attribute

Specifies the background color of a document

Color name bgcolor

Specifies a background image for a document

URL background

Specifies the color of the text in a document

Color name text

. HEAD section

TITLE element

. BODY section

P element

<HTML><HEAD><TITLE>Internet and WWW - Welcome</TITLE></HEAD>

<BODY>

Welcome to Our Web Sitce!

</BODY></HTML>

Comments

• The comment tag is used to insert comments in the source code.

• Comments are not displayed in the browsers.• You can use comments to explain your code, which can

help you when you edit the source code at a later date. This is especially useful if you have a lot of code.

• The comment form • Example:

Formatting Text

Font element• • Used to specify the type, color, and size for particular

text.• The element supports the following attributes:

Description Value Attribute

Specifies the color of the font Color name color

Specifies the size of the font 1-7 Size

Specifies the type of the font font name face

Example: Hello world

Examples:

Formatting Tags

result aim Tags

Text Bold text >b> text </b<

Text Italic text >i> text </i<

text Underlined text >u> text </u<

sCtCrCiCkCeC Strikethrough text >s> strike </s<

More than one formatting tags

Next lecture

• Text formatting.• Paragraphs formatting

Internet Applications Development Lecture 2 L. Obead Alhadreti.

Documents

Transcript of Internet Applications Development Lecture 2 L. Obead Alhadreti.