Web Design

3102/1/02


Web Design

3102/1/02

Web Design

HTML
Web Design Course

Engsaad_aly@hotmail.com

HTML
Hyper Text Markup Language
Markup Language Set of markup tags Tags

Keywords surrounded by angle brackets

Normally come in pairs Start Tag Opening Tags End Tag Closing Tags

<>

</>

The <!DOCTYPE> Declaration

Elements

Page Titles

HTML Headings
>6<h1>..<h

HTML Headings

HTML Paragraphs

Don't Forget the End Tag

Lists

<ul> <li> <li> <li> </ul>

</li> </li> </li>

<ol> <li> <li> <li> </ol>

</li> </li> </li>

Lists

Lists
Ordered Lists

Lists

HTML Attributes

HTML Links
An anchor tag <a> is used to define a link, but you also need to add the destination of the link.
The destination of the link is defined in the href attribute of the tag.

The link can be absolute, such as: "http://www.google.com", or it can be relative to the current page.

HTML Links

Mailto link
To create a link on your Web site that opens an email window . <a href="mailto:e-mail">Send </a> Send email to more than one address <a href="mailto:e-mail1, e-mail2">Send </a>

HTML Images
img Tag

HTML Images
Alternate Text

< img src="facebook.jpg" alt= "facebook image" >

Image source Alternate text

The alt attribute provides alternative information for an image if a user for some reason cannot view it .

HTML Images
Width & Height

< img src="facebook.jpg" alt= "facebook image"

width="300" height=500">

If the image cannot be displayed, the value of the alt attribute will be displayed

HTML Lines

HTML Comments

<!--

-->

HTML Text Formatting

<b> </b>

HTML Text Formatting

<em> </em>

HTML Text Formatting

HTML Tables

HTML Tables

Table

Table row

Table Data
100
200

<tr>
<table> </table>

</tr>

<tr>
</tr>

100

HTML Tables

Table

Table row
<tr> </tr>

Table Data
row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2

<table > </table>

<tr> </tr>

HTML Tables

Table

Table row
<tr> </tr>

Table Data
row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2

<table border= > </table>

<tr> </tr>

HTML Tables

Table

Table row
<tr> </tr>

Table Data
row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2

<table border= > </table>

<tr> </tr>

HTML Tables

HTML Tables

HTML Tables

End of HTML Coding Part 1

Forms
used to send data across the web and are often

used as contact forms to convert information

inputted by a user into an email.

known

Visual Illusion

known

Visual Illusion

Web Design

The End
Next Session HTML With Dreamweaver CS5

Engsaad_aly@hotmail.com